Das Layout
Das Design
Viele unterschiedliche Fotos auf den einzelnen Seiten möglich durch eine Bild-Leiste oben und unten.Das Haupt-Menü
Die Icons im Menü sind übringes Font-Icons, welche hier mit dem Pseudoelement ":before" angelegt wurden. Vorteil: Mit nur einer Änderung in der CSS-Datei wechseln Sie bei Bedarf die Menü-Icons in allen HTML-Seiten auf einmal. Das Hauptmenü (Home bis Sextus) haben wir bereits beispielhaft verlinkt.New
Fotostrecke. His omittam insolens interpretaris ei, cu est persius iuvaret. Qui facilis eligendi at. Mea ne autem aeque inermis, dicant partem deleniti quo an. Mel nominati euripidis vulputate eu, omittam propriae definitiones pro ex, munere nominavi deleniti cu vis.
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. Außerdem wird beim Layout verstärkt mit Prozent-Angaben gearbeitet.Responsive testen.
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.Top
Fotostrecke. His omittam insolens interpretaris ei, cu est persius iuvaret. Qui facilis eligendi at. Mea ne autem aeque inermis, dicant partem deleniti quo an. Mel nominati euripidis vulputate eu, omittam propriae definitiones pro ex, munere nominavi deleniti cu vis.
Gallery Lightbox
Auf der Seite Quartus (index4.html) haben wir für Sie eine Bilder-Gallerie eingebaut. So funktioniert diese Foto-Schau: Nach Klick auf ein Foto öffnet sich ein neues Fenster mit dem Foto sowie einer Bildunterschrift und einer Anzeige (Bild X von Anzahl X), gleichzeitig dunkelt sich die komplette Webseite im Hintergrund ab. Es ist ein Jquery-Script, welches ein Durchklicken aller Fotos der Gallerie innerhalb des Fensters ermöglicht. Sie könnten das Lightbox-Script auch auf alle Fotos anwenden, wenn Sie möchten. Wir beschreiben es bei vorstehend genannten Link.
