Aus dem Kurs: Grundlagen der Gestaltung: Layout für Web und Print

Erhalten Sie Zugriff auf diesen Kurs – mit einer kostenlosen Probeversion

Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 25.300 Kurse von Branchenfachleuten.

Responsives Layout

Responsives Layout

Eine Website ist gestaltet, z.B. als One-Pager. Was muss geschehen, damit aus einer Website für den Desktop eine Website für Smartphones wird? Die Versorgung aller digitalen Geräte mit einer einzigen Website nennt sich Responsive Layout. Wie ist diese Technik vorstellbar und was muss ich tun, um eine responsive Website zu gestalten? Das Grundprinzip sieht so aus, dass ausgehend von der Fensterbreite des Web-Browsers, unterschiedliche Layouts bereitgehalten werden. Ist ein Browserfenster z.B. über 1300 Pixel breit, so wird die Desktop-Fassung des Layouts ausgeliefert. Die Kopfzeile mit Logo und Header erscheint, mehrere Bild- und Textspalten liegen nebeneinander. Links und rechts halten Textspalten einen Abstand zum Fensterrand ein. Schriftgrößen werden passend für den Desktop angezeigt. Dagegen sieht das mobile Design für Smartphones komplett anders aus. Die Kopfzeile ist mit einem verkleinerten Logo ausgestattet. Das Menü ist zu einem Piktogramm aus drei Linien zusammengeschmolzen…

Inhalt