Webtechnik

Tipp: CSS-Datei für mobile Webseiten einbinden

CSS-Dateien steuern das Aussehen einer Internetseite. Wir zeigen Ihnen, wie Sie diese Anweisungen speziell für mobile Endgeräte anpassen.

CSS für mobile Webseite

© Herseller/Archiv

CSS für mobile Webseite

Geben Sie in der Referenz des Stylesheet-Dokuments media="handheld" an.

<link rel="stylesheet" href="handheld.css" type="text/ css" media="handheld" />

Das ist die einfachste Möglichkeit, die Darstellung der Webseiten auf Handhelds, Smartphones und Tablet-PCs zu berücksichtigen. Angaben wie Seitenbreite, Textfluss und die Größe und Darstellung von Inhalts- und Bildcontainern passen Sie hier an die geringere Auflösung und die Display-Größe an.

Insbesondere feste Spaltenbreiten sollten Sie hier durch Auto- oder Prozent-Angaben ersetzen, da die Größe der Displays und deren Auflösung stark variiert.

Schwierig wird es bei den Bilddateien, die direkt als Grafik im Content- Bereich der Seite integriert sind. Die Darstellungsgröße können Sie hier zwar auch über die CSS-Datei verringern, allerdings wird das Bild trotzdem in der Originalgröße geladen. Gerade das wirkt sich negativ auf die Ladezeiten aus, die beim Einsatz der Mobilgeräte unterwegs und ohne Netzwerkverbindung eine große Rolle spielen.

Mehr zum Thema

Wordpress 3.4.1 erschienen
Sicherheitsupdate

Rund 2 Wochen nach Veröffentlichung der Version 3.4 hat Worpress ein Update auf 3.4.1 nachgeschoben. Es behebt kleinere Fehler und ein mögliches…
Wikipedia - Mobiles Internet
Webtechnik

Eine eigene in der Darstellung angepasste Version der Webseite ist sehr aufwändig - aber effektiv. Wir zeigen Ihnen, wie Sie eine spezielle mobile…
Mobile Webseite Skalierung
Webtechnik

Für die mobile Version einer Webseite gibt es spezielle META-Angaben. Wir sagen Ihnen, mit welchen Tags Sie Auflösung und Skalierung Ihrer Webseite…
Magix Xara Designer Pro X
Software

Magix kombiniert unter dem Namen Xara Designer Pro X die beiden Programme Foto & Grafik Designer und Web Designer Premium. Damit liefert das Paket die…
Whatsapp Alternativen
Für Android, iPhone, iPad & Co.

Es gibt keine Whatsapp-Alternative? Quatsch! Diese 10 Messenger-Apps für Android, iOS und Windows Phone sind der perfekte Ersatz.