| 
Webdesign Grundlagen III
Webdesign Grundlagen Layout zeigt Möglichkeiten auf,
um Websites richtig zu gestalten, ohne Suchmaschinien auszuschliessen
Website Layout - Einführung Gestaltungselemente
Diese Webdesign Grundlagen sollen aufzeigen,
was man bei der Gestaltung einer Webseite beachten sollte. Immer
noch wichtig ist die Ladezeit, respektive subjektive Performance.
Eine Webseite kann durchaus ladeintensiv sein, wenn der User dadurch
nicht gestört wird.
Man kann theoretisch alle Inhalte auf einer oder
mehreren Grafiken darstellen. Aber nicht nur aus Gründen
der Ladezeit ist davon abzuraten. Grafiken können von den
Robots der Suchmaschinen nicht gespidert werden und dadurch hat
die betreffende Seite für die Suchrobots keinen Inhalt, ist
also nicht relevant und wird auch nie ein gutes Ranking bekommen.
Bei der Umsetzung des Layouts
hat man in der HTML-Seite 3 verschiedene Ebenen, auf denen man
mit Grafiken arbeiten kann.
Das ist zuerst einmal der Background. Per CSS
kann man ihn ohne Wiederholung an verschieden Stellen der Seite
erscheinen lassen.
Die zweite Ebene ist der Tabellenhintergrund.
Er lässt sich für einzelne Zellen oder für ganze
Tabellen definieren.
Schliesslich die dritte Ebene: die in die Tabelle
eingefügte Grafik. Mit kleinen Ecken oder Linien kann man
bestehende Muster in Tabellenhintergründen ergänzen
oder abrunden.
Wichtig: Ladezeit-technisch ist es besser z.B.
eine Grafik mit 3 kb zu nutzen, als drei
mit 0,6 kb. Jedes Objekt einer Seite wird einzeln geladen, d.h.
bei vielen kleinen Grafiken lädt man sich 'nen Wolf.
Tabellen
HTML-Tabellen liefern Seitengliederung durch
die Definition von festen Bereichen auf der Seite, in denen Text
und Grafik platziert werden können. Die Grösse der Tabelle
kann festgelegt werden, sie ist deshalb von Änderungen der
Fenstergrösse nur betroffen, wenn die Grösse prozentual
(relativ) und nicht in Pixeln (absolut) angegeben wird. Tabellen
sind das Hauptelement zur Steuerung von Abständen.
Frames
'HTML-Frames
gestatten die Unterteilung eines Browserfensters in unabhängige
Bereiche. Ein Frame kann beispielsweise scrollbar sein, während
ein anderer fest bleibt. Frames erlauben auch, dass die Hyperlinks
nur einen Teil der Seite ändern. Sie sind ein beliebtes Hilfsmittel
zur Trennung von Navigationsebene und Seiteninhalt. Die meisten
Suchmaschinen haben mit Framesets aber leider Schwierigkeiten,
also sollte man aus SEO-Sicht
darauf verzichten.
Iframes
Wie ein Fenster im Fenster verhalten sich Iframes.
Sie eigenen sich um einzelne Elemente in die Seite einzubinden,
z.b. Formulare können einfach platziert werden, für
nicht-suchmaschinen-relevanten Inhalt also bestens geeignet.
Layer
Das Layer-Tag erlaubt es, Seitenelemente in eigenen
Ebenen zu platzieren. Diese Ebenen können in Reaktion auf
bestimmte Aktionen des Anwenders verändert werden und ermöglichen
die Einbindung von Pull-Down und Pop-Up-Menüs.
Ein-Pixel-GIF's
Neben der Tabelle ist das unentbehrlichste Element,
das Webdesigner zur Beeinflussung von Abständen einsetzen,
das Ein-Pixel-GIF. Es nutzt den Vorteil der Transparenz, den die
GIF-Datei bietet, und die Fähigkeit der Browser, Bilder nach
der Übertragung über das Netz zu skalieren.
Das Ein-Pixel-GIF ist eine 1x1 Pixel grosse Grafik,
welche transparent ist oder die gleiche Farbe wie der Seitenhintergrund
hat. Sie kann überall auf der Seite platziert und so ausgedehnt
werden, dass sie jede vertikale oder horizontale Grösse annehmen
kann. Ein-Pixel-GIF's werden für viele Zwecke eingesetzt.
Zusammenfassung
Auch, wenn Sie Ihre Seite mit Photoshop o.ä.
entwerfen, machen Sie sich die Mühe und bauen Sie sie in
HTML nach. So läd die Seite schneller, das Schriftbild ist
klarer, die Suchmaschinen können die Inhalte erfassen und
Text kann in jedem Browser auf jedem Endgerät dargestellt
werden.
Nun kommen wir nun zur Navigation
|
