Newsletter

  • Immer informiert über die neusten Trends, Webseiten und Tutorials! Einfach hier für den monatlichen Newsletter anmelden.
  •  Eintragen
  •  Austragen

Login

Umfrage

  • Haben Sie Interesse an Softwaretipps für Webmaster?
  •  
  • ja
  • nein
  •  


Linktipps

Anzeige

 

www.finanzcheck.de
» Startseite » Design und Grafik - Tutorials

Webdesign: Grundregeln

Diese Regeln solltet ihr auf jedem Fall einhalten, dann kommen die Besucher auch wieder.

Haltet die Startseite Eurer Homepage übersichtlich und so klein wie möglich, denn die Ladezeiten sind bei großen Dateien ziemlich hoch. Und nicht jeder Eurer Besucher surft mit ISDN. Die Startseite sollte idealer Weise lediglich einen Begrüßungstext und eine Menüleiste oder Weiterleitung zur nächsten Seite enthalten.

Die wichtigsten Themen Eurer Website gehören an den Anfang bzw. an eine zentrale Stelle und nicht unten auf die Seite oder "unter ferner Liefen" im Menü versteckt.

HTML-Seiten sind grenzenlos, dass ist korrekt. Doch dies bedeutet nicht, dass Ihr 20 und mehr DIN A4-Seiten auf einer Internet-Seite unterbringen sollt. Denn je länger ein Dokument ist, desto größer ist die Datei und umso höher sind die Ladezeiten. Und das mögen die wenigsten Besucher. Also erstellt besser mehrere kleinere Seiten, die Ihr miteinander verknüpft.

Gekachelte Hintergründe werden so häufig im Browser aufgebaut, bis die Homepage damit vollständig gefüllt ist. Achtet darauf, dass das von Euch ausgewählte Bild keinen oder nur einen sehr feinen Rand besitzt, denn sonst schaut der gesamte Hintergrund sehr unschön aus.

Auf jeden Fall solltet Ihr die Hintergrundfarbe Eurer Website dem Hintergrundbild anpassen. Habt Ihr bspw. einen Hintergrund in Dunkelgrün gewählt, dann stellt als Hintergrundfarbe ebenfalls dunkelgrün ein. Wenn Ihr nämlich die standardmäßig eingestellte Hintergrundfarbe (bei den meisten HTML-Editoren) "weiß" bestehen lasst, zum dunklen Hintergrund jedoch eine helle Textfarbe gewählt habt, ist diese beim Laden der Seite auf dem Weiß nicht oder kaum lesbar. Häufig dauert es nämlich ein Weilchen, bis das Hintergrundbild ebenfalls geladen ist. Diese Zeit ist somit für Eure Besucher verlorene Zeit.

Verwendet Standardschriftarten wie zum Beispeil "Arial", "Verdana", "Courier" oder "Times New Roman", da diese - unabhängig vom jeweiligen Betriebssystem - auf jedem PC installiert sind. Denn es können nur die Schriftarten im Browser angezeigt werden, die auch auf dem PC des jeweiligen Besuchers vorhanden sind. Verwendet Ihr bspw. irgendwelche ausgefallen Schriften, nimmt der Browser des Surfers eine der Standardschriftarten, wodurch die Homepage dann evtl. nicht mehr so schön aussieht.

Sehr wichtig beim Erstellen einer HP ist auch ein guter Farbkontrast zwischen Hintergrundfarbe und/oder -bild und dem Text. Denn schließlich wollen Eure Besucher, dass was Ihr geschrieben habt, ja auch gut und problemlos lesen können.

Benutzt nach Möglichkeit keine weiße Schrift. Denn die Besucher, die Netscape als Browser verwenden, und die Seite ausdrucken möchten, sehen nur ein leeres Blatt, da Netscape Hintergrundfarbe und -bild nicht mit ausdruckt.

Die bekanntesten und am meisten genutzten Browser (Internet Explorer, Firefox, Opera) stellen die Seiten teilweise sehr unterschiedlich dar, da sie sich anscheinend nicht auf einen gemeinsamen Standard einigen können. Erstellt Eure Seiten daher so, dass sie mit allen Browsern fehlerfrei laufen und annähernd identisch aussehen.

Testet Eure Website mit den verschiedenen Bildschirmauflösungen, denn dadurch stellt Ihr sicher, dass die Besucher auch die gleichen Seiten zu sehen bekommen.

Seit variabel in der Absatzgestaltung Eurer HP. Experimentiert mit Blocksatz, links- und rechtsbündig sowie zentrierten Texten, Einrückungen, Listen etc. Mit dem "Zentrieren" sollte man sparsam umgehen und nicht bspw. eine ganze Seite zentriert setzen. Das wirkt optisch nicht gut und Ihr verzichtet dabei auf die vielen anderen Gestaltungsmöglichkeiten.
Okay, ich gebe es zu. Ich bin ein Blocksatzfan. ;-) Aber auch hierbei kann man variieren, wie Ihr an meinen Seiten seht.

Rechtschreibfehler passieren Jedem. Dagegen ist wohl Niemand gefeit. Nach Fertigstellung der Website solltet Ihr jedoch alles noch mindestens drei Mal durchlesen und evtl. Fehler korrigieren. Noch besser ist es, die Texte von einer anderen Person kontrollieren zu lassen, den häufig überliest man die eigenen Fehler. Legt Euch - falls Ihr ihn noch nicht besitzt - auf jeden Fall einen Duden zu, er ist oftmals sehr hilfreich.

Der Inhalt ist zwar wesentlich, aber achtet auch auf die Optik der Homepage. Schlecht eingescannte Bilder, ausgefranste Grafiken, sowie verwaschene Überschriften (als Grafikdateien) und/oder Logos mindern Eure Website gewaltig.

Blinkt auf etlichen Seiten Eurer HP ein Schriftzug oder Bild mit dem Text "under Construction" auf, werden Eure Besucher sicher kein zweites Mal kommen. Jede gute Homepage wird ständig erweitert, ergänzt und/oder geändert. Habt Ihr einzelne Seiten noch nicht fertiggestellt, lasst die Verweise besser weg und fügt sie erst dann ein, wenn die Page steht.

Mit Grafiken und/oder Bildern kann man eine Website wunderbar auflockern und die Texte ergänzen. Wenn die Besucher jedoch eine halbe Ewigkeit darauf müssen, bis sie geladen sind, ist dies nicht gut und die meisten nehmen dann sehr schnell "Reißaus". Nach Möglichkeit sollten Grafiken nicht größer als 30 kb (Dateigröße) sein. Bei größeren Bildern kann man leicht eine kleinere Vorschaugrafik einfügen. Klickt der Besucher darauf, sieht er es in der Originalgröße. Wie im Punkt "Umsetzung" angesprochen, sollten sämtliche Bilder vor dem Hochladen größenoptimiert werden.

Damit Eure Seiten schneller geladen werden, solltet Ihr immer die Größe der Grafik mit angeben. Ebenso wichtig sind "Alt-Tags, denn manche Besucher haben die Bildanzeige ausgeschaltet und auf diese Weise sehen sie wenigstens einen Text.
Beispiel: <img src="bild.gif" width="200" height="80" border="0" alt="ich als Baby">

Beim Verwenden von Tabellen gebt besser feste Tabellen- und Spaltenbreiten an (Angaben in Pixel). Bei prozentualen Werten sehen die Surfer aufgrund der verschiedenen Monitore und Auflösungen jeweils eine andere Tabelle.

Etliche Hobby-HP-Bastler nutzen die Statusleiste mittels Java-Script für einen Begrüßungs- oder Infotext. Dafür ist diese Leiste jedoch nicht konzipiert worden, denn sie zeigt den Ladefortschritt der Seite an. Verzichtet also besser auf solche "Spielereien".

Manche Eurer Besucher möchte vielleicht mit Euch in Kontakt treten. Zu Anfang habt Ihr sicher noch kein Gästebuch und/oder Feedback-Formular. Unabdingbar ist jedoch ein E-Mail-Link zu Eurer Adresse, damit sie sich mit Euch in Verbindung setzen können. Auch Euer Name sollte auf der Website nicht fehlen.
Beispiel für einen E-Mail-Verweis:
<a href="mailto:webmaster@webmaster-eye.de"></a>

Haltet Eure HP immer so aktuell wie möglich und fügt auch das Aktualisierungsdatum ein. "Veraltete" Websites vertreiben Eure Besucher sehr schnell.

Verkneift Euch Verweise auf Microsoft, diverse Suchmaschinen, Commerzbank, RTL etc. Was den Browser anbelangt, surft sowieso Jede/r mit ihrem/seinem bevorzugten. Die Bildlinks erhöhen ferner die Ladezeit. Weiterhin bietet Ihr Euren Besuchern damit eine gute Möglichkeit, Eurer Site gleich wieder den Rücken zu kehren. Besser ist eine separate Linkseite mit themenverwandten Homepages.

Fragen? Probleme? Keine Antworten? Hilfe finden Sie im Webmaster Forum!

Diese Artikel könnten Sie auch interessieren:
Videotutorial: Runder Rahmen (für Orbs usw. geeignet) mit Photoshop
Webdesign: Weniger ist mehr
Webdesign: häufige Fehler
Videotutorial: Objekte mit Photoshop umfärben
Webdesign: Userfreundliches Design


 
Anzeige