Hansmann-Design.de - deine Homepage kennt uns!
Homepageoptimierung
http://www.hansmann-design.de/homepageoptimierung.html

© 2019 Hansmann-Design.de - deine Homepage kennt uns! Besucherzähler
 

Homepageoptimierung

Technische" Optimierung
Die Optimierung einer Website sollte das A und O deiner Planung sein!

Browser-Kompatibilität
Nichts ist schlimmer als eine Website, die nicht mit allen Browsern funktioniert.
Natürlich kann man es nie jedem 100%ig Recht machen, aber wenn du deine Seite schon mal auf die aktuellsten Versionen vom Internet Explorer, Netscape Navigator und Opera aufbauen, ist dies schon ein Fortschritt.
Es gibt immer noch einige User, die mit älteren Browserversionen durch das Netz streifen. Meist ist dies in Firmen oder an Schulen oder Unis zu finden, die Softwaremäßig noch nicht auf dem neuesten Stand sind. Diese Surfer stellen insgesamt gesehen zwar die Minderheit dar, aber wenn du auch diese Nutzer nicht ausschließen möchtest, muss deine Website entsprechend angepasst werden.

HTML-Konformität
Bleibe bei den allgemeinen Regeln für HTML und verwende möglichst keine "Eigenschöpfungen", wie es sie z.B. für den Internet Explorer zu Hauf gibt. Natürlich spricht nichts gegen den Einsatz solcher HTML-Tags (z.B. Bookmarks mittels JavaScript, etc.), biete dann jedoch Alternativen für Surfer ohne Internet Explorer an.
Außerdem solltest du dich an den HTML-Sprachstandards des W3-Konsortiums (deutsches Büro des W3-Konsortiums) halten.
Inzwischen wäre es auch veraltet zu sagen, dass beispielsweise wenig CSS eingesetzt werden sollte. Heutzutage gehört es zum guten HTML-Stil, die einzelnen HTML-Dateien möglichst klein zu halten. Außerdem unterstützen eigentlich alle modernen Browser zumindest die CSS-Attribute vollständig.

Auflösung
Hast du deine Website schon einmal in einer Auflösung von 640x480 betrachtet? Dir würde wahrscheinlich das Grausen kommen!
Aufgrund älterer Hardware oder Sehschwächen kann es sein, dass deine Website mit niedrigen Auflösungen betrachtet werden. Du solltest daher versuchen, deine Website so anzupassen, dass auch bei niedrigen Auflösungen noch ohne Probleme durch deine Seiten "gesurft" werden kann.
Dies ist zwar nicht immer möglich, aber sollte zumindest nicht unversucht bleiben.
Prozentuale Angaben für Höhe und Breite der Framesets oder Tabellen helfen dabei. Auch relative Angaben zur Schriftgröße, und nicht fest definierte, sind von Vorteil.
Wenn du Frames einsetzen möchtest, lasse deinen Nutzern die Scroll-Leisten. Ein nützlicher HTML-Tag, der die Scrollbalken nur dann anzeigt, wenn sie gebraucht werden, ist folgender:

Beispiel: <frameset rows="20%,80%" border="0" frameborder="0" framespacing="0">

Schrift
Manchmal wird das Problem übersehen, dass der Browser nur die Schriftarten anzeigen kann, die auch auf dem Computer installiert sind. Hier sind allerdings auch oftmals einige HTML-Editoren schuld, die eine komplette Liste der auf dem Rechner zur Verfügung stehenden Schriftarten anzeigt.
Achte also darauf, die Schriftwahl auf die Standardschriftarten zu beschränken (für Windows-Rechner: Times New Roman, Arial, Helvetica, Verdana), wenn du keine bösen Überraschungen erleben möchtest.
Möchtest du dennoch exotische Schriftarten verwenden, z.B. für Überschriften, erstelle doch einfach kleine Grafiken.


Grafiken
Bei Grafiken solltest du darauf achten, die Parameter für Größe und Breite der Grafik mit anzugeben. So zeigt der Browser einen leeren Rahmen in der Größe der Grafik an, bis sie geladen ist und der Text auf dem Rest der Seite wird nicht verschoben.
Beispiel:

<img src="http://www.name.de/grafik.jpg" width="120" height="110">

Die Angabe von Größe und Breite müssen in Pixeln erfolgen.

Bei dem Hintergrundbild solltest du beachten, dass der Browser eine Grafik kachelt. Das heißt, sobald die Grafik "zu Ende" ist, wird sie direkt daneben erneut angesetzt. Bei manchen Hintergrundbildern bewirkt dies einen sehr unschönen Effekt. Achte also darauf, deine Grafik groß genug zu machen, damit sie nicht gekachelt wird, oder eine Grafik zu verwenden, bei der die Kachelung nicht auffällt.

Überladene Startseite
Auf manchen Websites finden sich direkt auf der Startseite hunderte von Banner, Buttons und Grafiken, die da eigentlich nicht hingehören sollten. Die Startseite sollte inklusive aller Grafiken maximal 80 KB groß sein, besser wenn sie unter 50 KB gehalten wird.

Links
Für Surfer besonders ärgerlich sind Links, die auf nicht (mehr) existierende Seiten verweisen.
Auch Scheinlinks (unterstrichene Wörter) können ärgerlich sein, wenn der unerfahrene Surfer auf so einen vermeindlichen Link klickt, um frustiert feststellen zu müssen, dass das so nicht funktioniert.
Stelle wichtige Satzteile oder Wörter lieber in Fettschrift oder Kursiv oder benutze für Links eine andere Farbe als die normale Textfarbe.
Links, die auf andere Homepages verweisen, solltest du in einem neuen Browserfenster öffnen lassen
(--> "target"-Tag).

Beispiel: <a href="http://www.hansmann-design.de/" target="_blank">Hansmann-Design.de</a>

Schlechter Kontrast
Achte darauf, dass die gewählte Schriftfarbe im Kontrast zum Hintergrund steht, damit der Text leserlich bleibt.
Beispiel für guten Kontrast: Schwarzer Text auf weißem Hintergrund
Beispiel für schlechten Kontrast: Gelber Text auf grünem Hintergrund

Auch sollte die gewählte Hintergrundgrafik oder -Farbe im Hintergrund bleiben und nicht zu sehr die Aufmerksamkeit auf sich lenken