Dynamische Layouts

Dynamische Layouts/Webseiten sind dadurch gekennzeichnet, dass sich die Website dynamisch der Auflösung/Größe des Monitors anpasst.Elemente wie Grafiken oder Boxen werden proportional vergrößert/verkleinert. Im Vergleich zum statischen Layout werden beim dynamischen Layout alle Größenangaben die sich auf die Breite von Elementen beziehen in Prozent angegeben.Es empfiehlt sich dennoch, eine Mindestbreite des Hauptcontainers zu setzen, da dieser sonst bei einer horizontalen Auflösung von zum Beispiel 800 Pixeln viel zu klein wäre. Weiterhin interessant ist die Kombination aus einem dynamischen Layout und Vektorgrafiken, welche sich verlustfrei beliebig skalieren lassen. Es ist abzusehen, dass in Zukunft viele Browser einen nativen Support für Vektorgrafiken haben werden. Die Browser Google Chrome, Apple Safari, Mozilla Firefox sowie Opera in Ihren aktuellen Versionen unterstützen diesen Grafiktypen bereits.

Vorteile eines dynamischen Layouts

  • Bei kleineren Auflösungen wie zum Beispiel 1024px gibt es im Browser Fenster keine horizontale Scrollbar.
  • Die Seite füllt das Browserfenster des Nutzers immer in der vollen Breite.
  • Es gibt links und rechts keine „Streifen“ ohne Inhalte.
  • Grafiken und andere Elemente werden auf großen Monitoren größer dargestellt.

Nachteile eines dynamischen Layouts

  • Die Erstellung eines dynamischen Layouts ist etwas aufwendiger im Vergleich zum statischen Layout.
Dynamisches LayoutBeispiel für ein dynamisches Layout

Statische Layouts

Im Vergleich zu einer Website mit dynamischen Layout hat eine Seite mit statischem Layout immer eine feste Breite, unabhängig von der horizontalen Auflösung des Monitors des Betrachters.Elemente wie Grafiken und Boxen „wachsen“ nicht mit, da ihnen eine feste Breite zugewiesen wurde.

Vorteile eines statischen Layouts

  • Der Aufwand bei der Erstellung eines statischen Layouts ist im Vergleich zum dynamischen Layout geringer.
 

Nachteile eines statischen Layouts

  • Die Seite hat immer eine feste Breite, diese liegt meist bei ca. 1000 Pixeln.
  • Da die meisten Nutzer eine höhere Auflösung als 1024px in der Breite haben ist ein Teil des Monitors/Browserfensters ungenutzt.
  • Grafiken und Elemente werden nicht vergrößert/verkleinert.
  • Der „Betrachter“ sieht links oder rechts oder auch links und rechts (abhängig von der Ausrichtung der Seite) leere Streifen ohne Inhalt.
Statisches LayoutBeispiel für ein statisches Layout