Home

Die Technik

Responsive Webdesign

Responsive Webdesign (RWD) ermöglicht eine Anpassung bzw. Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC innerhalb einer einzigen Webseite.

Dazu werden per CSS-Media Queries die verschiedenen Bildschirmgrössen abgefragt. Somit kann man auch auf das Hoch- oder Querformat eines mobilen Gerätes reagieren. Außerdem wird beim Layout verstärkt mit Prozent-Angaben gearbeitet.

So testen Sie

Diese Responsive-Vorlage verwendet keinerlei Javascript. Hier auf der Seite index1.html (Primus) nennen wir Ihnen gute Möglichkeiten ein Responsive-Layout in verschiedenen Auflösungen zu testen, denn nicht jeder hat ja diverse Smartphones und Tablets zu Hause.

 

 

Informationen

Bereits verlinkt

Klicken Sie auf die Links im Menü (Primus bis Sextus) und Sie sehen wie die Seiten verlinkt sind und erfahren noch einige Informationen.

Layout

Dieses Template heißt 'Design Technology'. Im Logobereich (Menü) und Fussbereich (Social Media) sehen Sie jeweils ein Foto. Sie können auch unterschiedliche Fotos für den Logo- und Fussbereich wählen. Außerdem haben wir - um es spannender zu machen - auf jeder Seite ein anderes Foto angelegt.

Animation

Die Icons im Fussbereich (Follow Us) sind ja animiert, d.h. sie drehen sich. Und zwar sind es vier Umdrehungen (1440grad= 4 x 360grad/Ein Kreis) ablaufend innerhalb von 2 Sekunden (2s) - diese beiden Werte (Grad und Sekunden) sind natürlich leicht zu verändern, anzupassen in der Datei 'animation.css'.