Dass Seitenlayouts nicht mit Tabellen und unsichtbaren GIF’s aufgebaut werden sollen, ist ja nix Neues, auch wenn dies von führenden Firmen und deren Webagenturen auch noch im Jahre 2009 praktiziert wird. 8 der 20 an der SMI kotierten Grosskonzerne schwören immer noch auf die veraltete Technik -> hier, hier, hier, hier, hier, hier, hier, hier. Die Nachteile liegen auf der Hand: Mehr Code, der zu längeren Ladezeiten führt und der nur schwer zu unterhalten oder umzugestalten ist, Plattformunabhängigkeit die nicht gegeben ist, Probleme beim Drucken, schlechte Indexierung bei Suchmaschinen, usw.

Die INM setzt Layouts für ihre Kunden schon seit langem nur noch mittels CSS um und verwendet nur den neusten Dokumenttyp-Standard XHTML 1.0.

Nachfolgend eine Auflistung mit kurzen Tutorials zu immer wiederkehrenden Problemen und best Practices im Zusammenhang mit CSS und HTML:

• Sticky Footer: Ein Seitenfooter, der immer zuunterst auf der Seite stehen soll. Wenn der Inhalt kürzer als das Browserfenster ist, dann soll der Footer am Rande des Fensters sein.
• Vertikale Zentrierung: 5 Möglichkeiten, eine vertikale Zentrierung hinzubringen. Eine Thematik, die seit eh und je bei Webdesigner für Kopfzerbrechen sorgt.
  
• Layout mit immer gleich hohen Spalten: Auch diese Problematik taucht immer wieder auf und kann nicht einfach so gelöst werden.
  
• Effiziente Print Stylesheets: Ein paar Tips, die beim Erstellen eines Stylesheets für die Druckausgabe berücksichtigt werden sollten.
• iPhone CSS: Mit der CSS-Klasse @media only screen and (max-device-width: 480px) { } können Elemente gezielt für den iPhone angesprochen werden.
• 10 weitere herausfordernde CSS-Techniken wie z.B. interessante Menüeffekte, erweiterte typographische Möglichkeiten mit CSS, CSS Charts oder dynamische CSS Variablen.
  

\\ tags: css, webdesign