homepage » website promotion blog » layout mit tabellen ...

»Blog Homepage

Layout mit Tabellen - Irrfahrten eines Webmaster (II)

Dieser Post ist Teil der Serie ‘Irrfahrten eines Webmasters‘; in Teil I ‘Weblog als Website Promotion‘ bereute ich, nicht schon früh auf ein Weblog zur Promotion des Showrooms gesetzt zu haben.

Während mich diese Unterlassungssünde ‘nur’ Zeit in der Promotion gekostet hat, bescherte mir eine weitere Sackgasse einen Haufen Arbeit (was auch Zeit kostet): nicht von Anfang an das Layout mit CSS zu steuern. Die Formatierung der Website ist glücklicherweise seit Geburt in einem CSS-Stylesheet untergebracht - Gott oder W3C sei Dank. Das Layout leider nicht…

Gerade für Einsteiger ist das CSS-Layouten halt nicht ganz ohne, zumindest wenn die Website auf den gängigen Browsern korrekt dargestellt sein will. Dem Internet Explorer sei gedankt für die Notwendigkeit des Box-Model-Hack. Die Versuchung wird dann gross, Tabellen-basierte Layouts zu erstellen - ich bin ihr erlegen. Resultat: selbst nachdem alle Contentseiten (mir heute unverständlich: ich hatte an die 40 Beiträge als statische Webseiten - gelayoutet mit Tabellen!) ins Weblog migriert waren, sitze ich - was den Showroom und all dessen Formulare angeht - bis heute noch auf Webseiten, die Tabellen für das Layout verwenden. Wehe mir, wenn ich dort am Layout was drehen will…

Es läuft alles auf das Eine hinaus: Mehr um sich selbst als um Gottes oder W3C Willen mittels CSS konsequent Darstellung vom Inhalt trennen. Auf diese Weise erspart man sich eher früher als später viel Arbeit und schont seine Nerven, denn Änderungen an der Darstellung - also bei Layout oder Formatierung - können schnell an einer Stelle vorgenommen werden und werden auf allen Seiten wirksam. Ähnliches gilt, wenn an der Struktur (Header, Navigation, Content-Container, Footer, …) einer Website geschraubt werden soll.

Mit dem Gespann XHTML & CSS Präsentation und Content zu trennen, wird im Web ja schon lange gepredigt. Glauben tue ich dieser Predigt aber erst, seit ich mir die Finger ein wenig ‘angebrannt’ habe.

Ähnliche Posts, die von Interesse sein könnten:

  1. No Related Posts

Kommentar schreiben

XHTML: <a href=""></a>   <em></em>   <b></b>