12.10.2007 - 11:56 - IT, New Media & Software
Internet für die Westentasche - Webdesign für mobile Endgeräte
Pressemitteilung von: SEYFCOM
Mobile Webseite auf einem Iphone
Vorüberlegung
Ob es überhaupt sinnvoll ist, neben der Screenvariante eine mobile Version seiner Website zur Verfügung zu stellen, hängt von den Inhalten und der Zielgruppe ab. Was für Webseiten im Allgemeinen gilt, gilt für das mobile Web im Besonderen: Beschränkung auf das Wesentliche verbunden mit der Frage, welche ausgewählten Inhalte und angebotenen Funktionen in der mobilen Version tatsächlich informativ und nutzbar sind. Ein Museum oder ein Hotel mit Gallerie, 360°-Rundgang, text- und bildlastigem Webauftritt wird sich auf Öffnungszeiten, Buch- oder Suchfunktionen beschränken müssen. Eine Anwaltskanzlei kann Rechtsgebiete und Ansprechpartner mit Kontaktdaten anbieten, BGH-Entscheidungen werden mobile Surfer auf dem Minidisplay kaum lesen wollen. Schwer vorstellbar sind außerdem Shopangebote, in denen das visuelle, eine interaktive Präsentation der Produktes im Vordergrund steht (Konfektion, Möbel etc.). Schnelle Recherche, geschürzte Darstellung von Dienstleistungen und Produkten, Preisabfragen oder Buchungssysteme, das sind Inhalte, die sich vorrangig für den mobilen Einsatz eignen.
Technische Voraussetzungen
Eine strikte Trennung zwischen Inhalt und Form mittels externer CSS-Datei, in der die Formatierung und Position verschiedener Elemente festgelegt werden, ist heutzutage Standard jeder professionellen Webseite. Seit CSS 2.0 gibt es die Möglichkeit, mit Hilfe der Anweisung "media=" nach Ausgabemedien zu unterscheiden. So referiert die Angabe media=“screen“ href=“screen.css“ auf eine CSS-Datei für die normale Monitoransicht, die Angabe media=“print“ verweist auf CSS-Anweisungen für die Druckansicht. Für mobile Endgeräte gilt das Attribut media=“handheld“. Je nach Ausgabegerät und Browser wird auf diese Weise das entsprechende Ausgabeformat ein und desselben Inhalts geladen werden.
Mobiles CSS oder mobile (X)HTML Version?
Eine Miniaturisierung der Webseite über CSS (verkleinerte Schrift, kleinere Container und reduzierte Grafiken) ist mit wenig Aufwand verbunden und hat den Vorteil, dass keine zusätzliche Version der Webseite aufgebaut werden muss. Sowohl Content Management als auch Blog-Systeme bieten inzwischen eine Reihe mobiler Plugins an. Die CSS-Variante birgt jedoch zwei schwerwiegende Nachteile:
1. Auch wenn man die Anzeige bestimmter Sektionen oder Grafiken mit dem Befehl „display:none“ unterbindet, das Datenvolumen des heruntergeladenen Quellcodes bleibt bei vielen mobilen Endgeräten gleich und bremst den Datentranfer aus.
2. Immernoch viele mobile Endgeräte bringen ihren eigenen Browser mit, ignorieren CSS-Angaben ganz oder interpretieren diese nicht einheitlich.
Eine mobile (X)HTML-Version der Seite mit bereinigtem Quellcode würde hingegen schnellere Ladezeiten und ein konsistentes Erscheinungsbild liefern. Seiteninhalte müssten jedoch seperat eingepflegt und aktualisiert werden.
Umsetzung
Welche Formatvorgaben sind für mobile Endgeräte geeignet?
Trotz bequemer Zoom- und Scrollfunktionen, die bereits Opera-Mini und auch das Iphone an Bord haben: Einspaltige Layouts mit einer Breite zwischen 150px bis 230px ersparen das horizontale Scrollen und sind benutzerfreundlich. Navigation, RSS und Suchfunktion gehören ganz nach oben, wenn möglich über oder direkt unter die schmale Kopfzeile. Flash und Javascriptfunktionen haben vorerst noch keine Chance und werden nicht geladen. Wer längere Seiten hat, sollte Sprungmarken („top“, „bottom“) einsetzen oder die Seiten aufspalten. Schwarze, serifenlose Schrift auf weißem bzw. kontrastreichem Hintergrund sind zumindest für den Content empfehlenswert.
Checkliste für mobilfreundliches Webdesign
1. Denken Sie an die Größe der Displays
2. Vermeiden Sie unnötige Effekte, wie z.B. das Entfernen der Standardunterstreichung von Hyperlinks. Bei monochromen Bildschirmen kann das sehr behindernd sein.
3. Verzichten Sie auf Spielereien wie animierte Gifs, Java-Applets oder PlugIn-basierte Animationen.
4. Achten Sie auf hohen Kontrast, geringe Dateigrösse und minimale Ausdehnung Ihrer Pixelgrafiken.
5. Verzichten Sie nach Möglichkeit auf feste Breiten- und Längen-Attribute.
6. Auchten Sie darauf, dass JavaScript mobil nur selten (und dann nicht im vollen Umfang) oder gar nicht zur Verfügung steht. Bieten Sie immer Alternativen an.
7. Richten Sie Ihr Augenmerk auf geringe Dateigrößen und eine möglichst logische Seitenstruktur und Navigation.
8. Denken Sie daran, daß die meisten Pocketbrowser nur HTML-Standardsatz interpretieren können und versuchen Sie möglichst nur gebräuchliche Tags einzusetzen.
9. Testen Sie Ihre mobile Webseiten nicht nur mit Emulatoren wie mtld.mobi/emulator.php oder www.operamini.com/beta/simulator/
am PC, sondern direkt mit verschiedenen mobilen Endgeräten.
Diese Pressemitteilung wurde auf openPR veröffentlicht.
SEYFCOM
Sasan Seyfi
Geschäftsführer
Wedekindstr. 5
30161 Hannover
Tel. 0511 / 23 54 742
E-Mail:
www.seyfcom.de
SEYFOM ist eine inhabergeführte Fullservice-Agentur für Webdevelopement und Webdesign. Das Unternehmen mit Sitz in Hannover besteht seit 2004 und ist spezialisiert auf Webentwicklung für Industrie, Handel und Beratungsfirmen. Abgestimmt auf die Corporate Identity der Unternehmenskunden erstellt SEYFCOM individuelle Screen-Designs mit klarer Benutzerführung und Navigationstruktur. Alle Webseiten basieren auf einem modifizierten CMS und sind XHTML standartkonform. Je nach Branche und den Ergebnissen der Konkurrenzanalyse optimiert SEYFCOM darüberhinaus bestehende und neue Webpräsenzen für Suchmaschinen und entwickelt effektive SEO-Strategien.
News-ID: 163901 • Views: 1793
Twitter
XING
Google+Schlagwörter
Permanenter Link zu dieser Pressemeldung:
Wir freuen uns, wenn Sie z.B. auf Ihrer Presse- oder Referenzen-Seite auf openPR.de linken.
Für die Inhalte dieser Meldung ist nicht openPR.de sondern nur der jeweilige Autor verantwortlich.
Haftungsausschluss - openPR distanziert sich von dem Inhalt der Pressemitteilungen. Lesen sie hier mehr
© 2004-2012 openPR | Grußkarten | Impressum