Hilfreiche 404 Fehlerseiten dank Google Widget von Nocturne zum Thema Code To Joy - So, 04.01.2009

Heute stöbere ich mal wieder in den Webmaster Tools von Google rum um zu schauen, ob irgendwelche Auffälligkeiten bei meinen Webseiten auszumachen sind oder ob es es seitens Google mal wieder was Neues gibt. Dabei stieß ich auf das mir bis dahin noch nicht bekannte 404-Widget:

Klickt ein Nutzer auf den Link zu einer Seite, die nicht mehr Teil Ihrer Website ist, gibt Ihr Server einen 404-Fehler (Seite nicht gefunden) zurück. Da generische Meldungen für den Nutzer frustrierend sein können, empfiehlt sich die Erstellung einer benutzerdefinierten 404-Fehlerseite, um nützlichere Informationen zu Ihrer Website bereitzustellen.

Die Erstellung benutzerdefinierter Fehlerseiten macht mir mein Hosting-Provider sehr einfach, da alle Fehlerseiten bereits in einem Unterverzeichnis auf meinem Webspace vorhanden sind. Diese brauchte ich mir folglich nur noch herunter laden, bearbeiten und wieder hoch laden.

Google's 404-Widget

Was die Bearbeitung der benutzerdefinierten Fehlerseiten angeht, so kommt nun das Widget "404 Seiten verbessern" der Google Webmaster Tools ins Spiel. Das nimmt einem nämlich faktisch die ganze Arbeit ab, indem man einfach ein Javascript im Body der HTML-Fehlerseite einbindet. Das Script sucht dann automatisch im Google-Index nach einer besten Übereinstimmung für die nicht gefundene Seite und schlägt diese vor.
Doch damit nicht genug: je nach Webseite werden auch weitere alternative URLs (die eigene Webseite betreffend) oder der Link zur Sitemap-Datei angeboten. Da das Tool laut Google's Aussage noch in der Testphase ist, sind nicht für jede Seite alle Features verfügbar.

Auf jeden Fall verfügbar ist aber noch die Möglichkeit über ein Suchfeld und einem Button Google's Sitesearch zu verwenden. Dazu füllt das Script die Textbox automatisch mit den treffendsten Stichworten die der URL zu entnehmen sind aus. Der Benutzer braucht dann nur noch auf "Google Suche" zu drücken und schon landet er bei den Suchergebnissen zu den genannten Stichworten für diese Webseite: Meiner Meinung nach absolut phänomenal, zumal man es einfach nur einzubinden braucht.

Zu guter letzt kann man das Widget auch noch mittels CSS an seine Bedürfnisse anpassen. Auf den Seiten der Google Webmaster Tools findet man dazu die von Google verwendeten CSS-Klassen und kann somit die Ausgabe per Style-Angaben im Head der Seite steuern. Dabei verschweigt Google jedoch die beiden Klassen zur Formatierung der Textbox und des Submit-Buttons für das SiteSearch-Feature. Hier daher die vollständige Liste, gleich erweitert um die Pseudoklasse hover für Links:

CSS
1 <style type="text/css"> 2 /* Widget Inhaltscontainer */ 3 #goog-wm 4 { 5 6 } 7 8 /* Überschrift für "beste Übereinstimmung" */ 9 #goog-wm h3.closest-match 10 { 11 12 } 13 14 /* "beste Übereinstimmung"-Link */ 15 #goog-wm h3.closest-match a 16 { 17 18 } 19 20 #goog-wm h3.closest-match a:hover 21 { 22 23 } 24 25 /* Überschrift für "Weitere Möglichkeiten" */ 26 #goog-wm h3.other-things 27 { 28 29 } 30 31 /* "Weitere Möglichkeiten" list items */ 32 #goog-wm ul li 33 { 34 35 } 36 37 /* "Weitere Möglichkeiten" list item Link */ 38 #goog-wm ul li a 39 { 40 41 } 42 43 /* "Weitere Möglichkeiten" list item */ 44 #goog-wm ul li a:hover 45 { 46 47 } 48 49 /* Site Search list item */ 50 #goog-wm li.search-goog 51 { 52 display:block; 53 } 54 55 /* Site Search Textbox */ 56 #goog-wm-qt 57 { 58 59 } 60 61 /* Site Search Submit-Button */ 62 #goog-wm-sb 63 { 64 65 } 66 </style>

Nicht zuletzt hat man natürlich die Möglichkeit das Design der Fehlerseite an das seiner Webseite anzupassen und das Widget somit elegant im Stil seiner Seite zu präsentieren, sodass Besucher die Möglichkeit haben zusätzlich die Navigation der Webseite zu benutzen. Ein Beispiel dafür finden Sie z.B. hier:

Fehlerhafter Link zu einem meiner Artikel

Weiterführende Links:

Code aus XML generieren lassenJavascript-Fehler in einer ASP .NET Anwendung bei ...