Sprung zum Inhalt

Webdesign nach Maß von webdesign weisshart

Mein Blog

RSS Feed AbonnementRSS 2.0 Feed

zum Archiv und den Kategorien

Mobiles Design aufgehübscht

Mittwoch, 9. September 2015

Mobile Seiten müssen schlank sein. Aber sie dürfen natürlich gerne auch hübsch sein.
Ich hab' mir vorgenommen, beides gleichzeitig zu realisieren; und zu diesem Zweck eine Slideshow mit Schmuckbildern auf der (mobilen) Startseite eingefügt. Zu sehen, wenn meine Site mit einem Smartphone aufgerufen wird, oder im folgenden Video.

(Bitte jetzt keine Kommentare zur "Schönheit" der Site. Schönheit liegt bekanntlich im Auge des Betrachters.)

Realisiert ist diese Slideshow mit CSS3, also ohne JavaScript. Der CSS-Code ist leider nicht ganz trivial. Hier ein Tutorial.
Aber der Verzicht auf JavaScript, in Verbindung mit optimierten Bildern, macht die Angelegenheit natürlich schlank. Die Startseite kommt immer noch mit ca. 80 kB aus.

PS:
Falls es interessiert, wie das Video, der Screencast vom iPhone, entstanden ist:
Auf dem Mac geht das ohne spezielle Apps, einfach mit dem ohnehin installierten Quick Time Player.

PPS:
Einige der Fotos kommen von unsplash.com. Free (do whatever you want) high-resolution photos.



1 Kommentar

  1. Also ICH find's hübsch. ;-)

    Kommentar von Fritz — Dienstag, 15. September 2015 - 11:43 Uhr

Einen Kommentar abgeben

Damit Code-Beispiele richtig angezeigt werden, müssen Sonderzeichen maskiert werden (z.B. < zu &lt;).


(notwendig)

(notwendig)

Spamschutz:
Je nach Inhalt wird Ihr Kommentar eventuell nicht sofort angezeigt, sondern muss manuell freigeschaltet werden.

Archiv:

Kategorien:

Creative Commons Lizenzvertrag
Alle Texte (nicht Bilder!) Creative Commons CC BY-NC-SA 3.0 DE