Wenn Web-Seiten entwerfen, müssen Sie visuell zu denken. Eine Website mit einer guten Balance von Grafiken und Text entworfen ist angenehm für die Augen, zieht Betrachter Aufmerksamkeit und hält sie. Gute Web-Design beruht auf der Künstler - in diesem Fall, Sie - nach bestimmten Design-Prinzipien:
Entwerfen Sie die Web-Seite Schnittstelle innerhalb der ersten 800 x 600 Pixel zu passen, so dass der wichtige Inhalt sichtbar ist, wenn die Seite geladen wird. Obwohl die meisten modernen Monitore als diese viel größer sind, sehen viele Menschen das Internet über Laptops und Geräte.
Erreichen Sie ein ausgewogenes Layout von nicht mehr als drei Schwerpunkte beachten: Verwenden Sie die "große, mittlere, kleine" -Strategie.
Vermeiden Sie Schriftarten, die kleiner als 10 Punkt mit (je nach Schriftart).
Verwenden Sie Standard-Computer-System-Fonts für alle HTML-Text oder sicher sein, eine Spezialität Schriftart mit CSS oder andere Technologie zu integrieren.
Die folgende Abbildung stellt diese Grundsätze in die Praxis:
Web Design Tipps für Grafik
Die Grafik ist ein enorm Teil des Web-Design. Das Wissen und die Verwendung der Standards und Formate für verschiedene Arten von Web-Grafiken kann den Unterschied zwischen einer Web-Seite bedeutet, die Aufmerksamkeit und ein abfängt, die Blick Vergangenheit Browser. Verwenden Sie diese Tipps, um sicherzustellen, dass Ihre visuelle Elemente optisch verhaften:
Bauen Sie alle Web-Grafiken in 72 dpi, die Standard-Display-Auflösung des Webs.
Für eine optimale Download-Performance, speichern Grafiken, die eine Mischung aus Text, Flach farbige Grafiken und Fotos, wie die haben hier gezeigt, wie adaptive Palette GIF-Dateien, die so wenige Farben wie möglich nutzen.
Speichern Sie alle rein fotografischen Bilder als JPEG-Dateien. (PNG-Dateien arbeiten als gut, aber sind in der Regel größer in der Dateigröße.)
Immer anzeigen Anti-Aliasing-Grafiken, die einzelne Farbe Transparenz (wie GIFs) auf dem richtigen Hintergrund verwenden farb- sonst finden Sie eine unansehnliche Halo um sie herum.
Um einen weichen Übergang von einem Bild zu einem transparenten Hintergrund zu erzielen, verwenden Sie das PNG-Format. Das PNG-Format unterstützt Alpha-Kanal Transparenz.
Web Design Tipps zur Wiedergabe von Informationen
Wie Sie Web-Seiten entwerfen, zu denken, grafisch, auch wenn alle sind präsentieren Ihnen reine Information ist. Gute Web-Design bedeutet, dass Sie präsentieren Informationen, indem sie es logisch zu organisieren und es optisch attraktiver zu machen. Verwenden Sie die folgenden Tipps Browser Augen auf Informationsseiten zu halten:
Für große Websites, zu priorisieren und Gruppennavigation in eine primäre, sekundäre und tertiäre Satz, die jeweils keine Wahl mehr als fünf bis sieben Top-Level enthält.
Idealerweise bauen Sie Ihre Website Umriss mit nicht mehr als drei Ebenen: Haupt Idee, Thema und Unterthema.
Wählen Sie einen Standardsatz von Symbolen für das Site-Map. Verwenden Sie Boxen Seiten darzustellen, Zylinder Datenbanken zu repräsentieren, und dann alles miteinander verbinden mit Linien und Pfeilen.
Erstellen Wireframes für jede einzelne Seitenlayout auf Ihrer Website zum Detail das Interaktionsdesign und Inhaltsdarstellung. Es ist wichtig, dass sie nicht alles vermitteln, die als visuelle Design Look and Feel falsch verstanden werden kann. Sie sollten schön und langweilig bleiben. Wireframes wirken lediglich als Diagrammansicht des Seitenlayouts und Interaktion, wie hier gezeigt:
Web Design Tipps für Navigationswerkzeuge
In Web-Design, sollten Sie die Grafik, wenn Sie die Navigations-Tools enthalten, die Besucher von Seite zu Seite nehmen. Wenn Web-Seite Navigations-Tools entwerfen, müssen Sie sie attraktiv als auch funktional zu machen. Diese Tipps können Ihnen dabei helfen zu tun:
Differenzieren Sie die visuelle Gestaltung von nicht anklickbar und klickbare Elemente. Verwenden Sie zum Beispiel nicht die gleiche Grafik wie einer Schaltfläche auf einer Seite und eine Schlagzeile auf einem anderen. Oder unterstreichen nicht Schlagzeilen und färben sie wie Links, wenn sie gerade Schlagzeilen sind.
Verwenden Sie visuelle Design und die Feedback-Interaktion und Benutzerfreundlichkeit zu verbessern. Zum Beispiel können Sie ein Element der Farbe, Größe ändern, oder auf Rollover-Form. (Die folgende Abbildung zeigt, wie eine Farbänderung aussehen würde.)
Legen Sie immer die Navigation in der gleichen Position auf der Seite und nicht sein Aussehen verändern.
Immer beschriften Symbole. Illustrationen von ihnen selbst sind nicht immer klar in ihrer Funktion.
