Manuel Bieh. Mobiles Webdesign. Konzeption, Gestaltung, Entwicklung

Transkript

1 Manuel Bieh Mobiles Webdesign Konzeption, Gestaltung, Entwicklung

2 Auf einen Blick 1 Einleitung Konzeption und Vorüberlegung Informationsarchitektur Mobiles Website-Design Webseitenentwicklung Mobile Web Best Practices Adaption: UAProf, WURFL und Gerätefähigkeiten Mobiles Allerlei Anhang: HTML-Referenz

3 Inhalt 1 Einleitung Über dieses Buch Über den Autor Danksagung Begriffe, die man kennen sollte Generelle Netztechniken und Organisationen Geräteklassen Marktentwicklung Technische Übertragungsstandards Technische Einschränkungen bei mobilen Endgeräten Der ewige Teufelskreis der Kosten und des Angebots Entwicklung der Technologie in der Zukunft Möglichkeiten durch mobil-gerechtes Marketing Ständige Verfügbarkeit und»always-on«-prinzip Standortbezogene Dienste, Orts- und Zeitgebundenheit Interaktive Kundengewinnung Interaktivität durch mobiles Tagging Anzeigenschaltung auf Webseiten für mobile Geräte Mobile Commerce weitere Möglichkeiten in anderen Bereichen Mobile Banking Mobile Ticketing Mobile Payment Mobile Entertainment Fazit Alles klar? Zusammenfassung Konzeption und Vorüberlegung Gründe für die eigene mobile Website Lernen aus der Geschichte Die Geschichte des Mobilfunks Zwei gigantische Technologien, eine ähnliche Entwicklung

4 Inhalt 2.2 Eigene Vorteile und Chancen am Markt Methode 1: Nichts tun und hoffen Methode 2: Weglassen von Bildern und Style-Elementen Methode 3: Handheld-Stylesheets benutzen Methode 4: Erstellung von mobil-gerechtem Inhalt Inhalte des eigenen Webauftritts analysieren Welche Inhalte sind für mobile Benutzer interessant? Inhalte in welchem Umfang? Der Sinn und der Zweck und die Zielgruppe Alles klar? Zusammenfassung Informationsarchitektur Generelle Seitenstruktur und Nutzerführung Seiteninformationen wo bin ich? URL/URI-Design nicht nur das Display ist klein! Das Navigationsmuster wo finde ich was? Seitenaufbau Informationsbereitstellung auf einzelnen Seiten Inhaltliche Struktur Priorisierung und Aufbereitung Kopfzeilen, Fußzeilen und Fußnoten Weiterführende Informationen und Kennzeichnung von Links Bilder Alles klar? Zusammenfassung Mobiles Website-Design Horizontal umdenken hin zur Linearisierung Der Handybildschirm und seine Tücken Weg vom Denken in die Breite »Farbenpracht blendet das Auge« Know your enemy: Einschränkungen im Layout Probleme, die bei der Bedienung auftreten können Vorhandenen Platz ausnutzen Formulare Typografie Wiedererkennungswerte schaffen Alles klar?

5 Inhalt 5 Webseitenentwicklung Was war was wird? Alte und neue Standards WAP, WML, noch mehr WAP und XHTML C-HTML, XHTML-MP, XHTML Basic welcher Standard zu welchem Zweck? Einen WAP-Server aufsetzen Was also ist ein WAP-Server? Konfiguration von Dateierweiterungen und MIME-Typen Eine Reise in die Vergangenheit: die Wireless Markup Language (WML) HTML und WML Der Aufbau eines WML-Dokuments Das WAP 2.0 heute: XHTML-MP und XHTML Basic Der Unterschied zwischen WML und XHTML-MP Die Unterschiede zwischen (X)HTML und XHTML-MP Basis-Elemente: Die generelle XHTML-MP-Struktur Benutzereingaben in <form> bringen WAP 2.0 heute: WAP-CSS und CSS Mobile Profile Die Vorteile von WCSS im mobilen Internet Die Nachteile von WCSS im mobilen Internet Die CSS-Syntax Style-Informationen in Dokumente einbinden Unterschiedliche Selektor-Typen WAP-spezifische Erweiterungen Alles klar? Zusammenfassung Mobile Web Best Practices Einleitung mobileok? Ok! Zielgruppe für die»mobile Web Best Practices« Anwendungsbereich Anforderungen im WAP Probleme bei der Darstellung Benutzereingaben Bandbreite und Übertragungskosten Absichten des Benutzers Werbung und Werbemittel

6 Inhalt Geräteeinschränkungen Weitere Aspekte Vorteile Delivery Context One Web das»ein-web«-prinzip Der Hintergrund zur Adaption Ansätze für die Content Adaption Die Art und Umfang der Adaption Die Auswahl des Benutzer-Erlebnisses Default Delivery Context Die Struktur der Best-Practices-Empfehlungen Die Best-Practices-Aussagen Generelles Verhalten Navigation und Links Seitenlayout und Inhalt Seitendefinition Ergänzungen in Luca Passanis»Global Authoring Practices for the Mobile Web« Entwicklung Usability Die Messlatte anheben Allgemeine Checkliste zur Erstellung mobiler Websites Adaption: UAProf, WURFL und Gerätefähigkeiten UAProf User Agent Profile HardwarePlatform SoftwarePlatform NetworkCharacteristics WURFL Wireless Universal Resource File Die Installation Diagnose Die Entwicklung Mobiles Allerlei Expertenmeinungen Vier Fragen an Roman Hänsler, Head of Public Relations bei aka-aki.com Vier Fragen an Terry von Bibra, Geschäftsführer von Yahoo! Deutschland

7 Inhalt Vier Fragen an Udo Jung von Connvision, der Firma hinter BeeTagg.com Fünf Fragen an Jens Grochtdreis, Senior Frontend- Entwickler bei Sinner Schrader Was machen andere? QR-Codes zum Ausprobieren Telefonbücher/Branchenbücher Suchmaschinen Zum Nachschlagen Sportnews und Ergebnisticker Allgemeine News Finanznews und aktuelle Börsenkurse Tools Software-Tipp: Opera Mini Emulator Software-Tipp: Mozilla Firefox Software-Tipp: Openwave Phone Simulator TeaShark Tipps und Tricks und weiterführende Informationen Mobile Webdesign Mailingliste dotmobi Mobile Web Developer Certification WURFL und Co SlideShare-Präsentationen Mister Wong Linksammlung zu diesem Buch Kaywa Feed2Mobile Service Weblogs zum Thema Anhang: HTML-Referenz Index

8 Der Markt des mobilen Internets ist einer der am schnellsten wachsenden Märkte in unserer Weltwirtschaft. Dieses Buch zeigt Ihnen, wie Sie an diesem Markt teilhaben können. 1 Einleitung Es freut mich, dass Sie zu diesem Buch mit dem vielversprechenden Titel»Mobiles Webdesign«gegriffen haben. Dieses Buch gibt Ihnen einen genauen Überblick darüber, was mit mobilen Endgeräten im Internet heutzutage möglich ist, was in absehbarer Zeit möglich sein wird, wie die bisherige Entwicklung mobiler Geräte im Internet verlaufen ist und wie Ihr Unternehmen an dieser Entwicklung teilhaben kann, um den größtmöglichen Nutzen aus ihr zu ziehen. Der Titel hat dabei jedoch eher symbolischen Charakter und bildet nur einen kleinen Teil dessen ab, was in diesem Buch behandelt wird: wie Sie vorgehen, um Websites zu konzipieren, gestalten und zu erstellen, die unabhängig von einem PL und damit theoretisch von jedem Punkt auf dieser Welt aus genutzt werden können. 1.1 Über dieses Buch Behandelt werden alle Themenbereiche, die unmittelbar mit der Entwicklung von Websites für das WAP/WAP 2.0 zusammenhängen und somit das mobile Äquivalent zu HTTP-Websites auf dem Desktop darstellen, inklusive einiger Möglichkeiten, wie Sie sich dies für Ihre Marketingstrategie zunutze machen können. Nicht behandelt wird die konkrete Entwicklung von integrierten Handset-Applikationen beispielsweise auf Symbian-, Android- oder J2ME-Basis. Dieses Buch richtet sich in erster Linie an Entwickler, die mit der Erstellung von Webseiten auf XHTML- und CSS-Basis und optimalerweise mit einer serverseitigen Skriptsprache vertraut sind und sich in den Bereich des Internets zum Mitnehmen vorwagen möchten. Doch auch Projektleiter oder Marketingberater in Firmen, die mit dem Internet arbeiten, sollen in dem ein oder anderen weniger technischen Kapitel ihre Schlüsse daraus ziehen können, 11

9 1 Einleitung wie das mobile Web neue Absatzkanäle und Instrumente zur Kundenbindung schaffen kann. Abbildung 1.1 Lineare Yahoo-Startseite aus dem Jahr 1996 Als Entwickler werden Sie vermutlich einige Parallelen zum Internet in seinen frühen Jahren entdecken können. Je nachdem, wie lange Sie dabei sind, werden Sie sich aufgrund der Probleme und Hürden, die Sie zu überwinden haben, vielleicht sogar in eine Zeit zurückversetzt fühlen, in der man für Browser entwickelte, bei denen man von CSS-Unterstützung nur träumen konnte als die meisten Webseiten noch keine der inzwischen schon wieder technisch überholten Layout-Tabellen einsetzten und nur eine Handvoll Ele- 12

10 Über dieses Buch 1.1 mente zur Strukturierung von Inhalten zur Verfügung standen. Damals waren Websites linear aufgebaut, und man hatte oft nur eine lose Aneinanderreihung semantischer oder wohl in den meisten Fällen weniger semantischer HTML-Elemente. Diese Linearität hält erneut Einzug in die Website-Entwicklung, nämlich genau dann, wenn Sie anfangen, für ein breites Spektrum von mobilen Geräten zu entwickeln. Diesmal geschieht das allerdings unter der notwendigen Berücksichtigung aller semantischen Aspekte, die HTML Ihnen anbietet. Gerade in einer Zeit, in der die Monitore von PCs immer größer werden und Zielauflösungen von Pixel eigentlich allmählich der Vergangenheit angehören, werden Sie wieder in kleinen Dimensionen denken müssen. Wie und wo Sie Navigationselemente darstellen, wie Sie Tabellen abbilden oder Bilder auf einer Internetseite einbinden bei all diesen Aspekten werden Sie umdenken müssen. Denn seit das mobile Web immer weiter Einzug in unsere Gesellschaft hält, gibt es wieder Bildschirme, die kleiner sind, als es der kleinste Bildschirm bei Desktop-PCs vermutlich jemals war. Und Sie werden einen guten, alten Bekannten wiedertreffen: die Browserweiche, wenn auch in einer leicht geänderten Form im Vergleich zu den Zeiten des Netscape 4.7 und des Internet Explorer 4.0. Als Marketingverantwortlicher oder Projektplaner werden Sie das mobile Internet als neuen Kanal zum Vertrieb und zur Kundenbindung kennenlernen, und mit Sicherheit werden Sie überrascht sein, was diese Technologie Ihnen für Möglichkeiten bietet, auch wenn sie sich bei uns wegen der noch immer recht hohen Kosten nicht in der breiten Masse so durchgesetzt hat, wie es in anderen Ländern schon lange der Fall ist. Dieses Buch ist das richtige für Sie, wenn Sie sich zu mindestens einer der oben genannten Gruppen zugehörig fühlen. Sollten Sie zur Gruppe der Entwickler gehören, sollten Sie gefestigte Grundkenntnisse im Bereich der HTML- und CSS-Entwicklung besitzen und im Optimalfall bereits wissen, was die W3C-Standards sind und wie man diese anwendet. Wenn Sie dies nicht für sich bejahen können, würde ich Ihnen empfehlen, zuerst das Buch»Professionelles Webdesign mit XHTML und CSS«von Björn Seibert und Manuela Hoffmann zu lesen, das ebenfalls bei Galileo Computing erschienen ist, bevor Sie sich im Detail mit diesem Buch befassen Über den Autor Manuel Bieh aus Dortmund ist bereits seit geraumer Zeit von den Möglichkeiten des mobilen Internets fasziniert und fest vom Potential dieses Marktes 13

11 1 Einleitung überzeugt. Seit dem Jahr 2000 ist er beruflich im Internet tätig und seit 2008 Geschäftsführer der Mobilistics GmbH, einer Agentur die spezialisiert ist auf die Entwicklung und Optimierung von Anwendungen für das mobile Internet. Zudem ist er Betreiber eines Weblogs mit den Schwerpunkten»Mobile Web«und Web-Entwicklung allgemein ( Danksagung Bevor es losgeht möchte ich mich kurz bei einigen Leuten bedanken ohne deren Unterstützung dieses Buch wohl niemals möglich gewesen wäre. Bedanken möchte ich mich vor allem bei meiner Familie und bei Freunden, die mich allesamt während der Zeit des Schreibens selten zu Gesicht bekamen. Herzlich bedanken möchte ich mich auch bei Björn Seibert und meinem Lektor Jan Watermann, ohne die es sicherlich niemals zu einem Buch in dieser Form, wie es vor Ihnen liegt, gekommen wäre. Ein herzliches Dankeschön geht auch an Vitaly Friedman, Jens Grochtdreis und Heiko Stiegert, an all die anderen bekannten und nichtbekannten Blogger, die mich bei der Arbeit an diesem Buch unterstützt, inspiriert und motiviert haben und ganz besonders an Sonja und Hans-Jörg Raphael. 1.2 Begriffe, die man kennen sollte Im Verlauf dieses Buches wird eine Vielzahl von Abkürzungen und Ausdrücken auftauchen, die Ihnen bekannt sein sollten, damit Sie den Inhalt nicht nur lesen, sondern auch verstehen können. Die wichtigsten Begriffe und Konzepte werden auf den folgenden Seiten kurz erklärt, damit Sie zumindest einmal davon gehört haben und wissen, wovon die Rede ist Generelle Netztechniken und Organisationen In der noch recht kurzen Zeit, in der es das mobile Internet gibt, hat sich bereits eine beachtliche Menge an Standards, Netztechniken, Übertragungsprotokollen und Beschreibungssprachen entwickelt. Viele von ihnen haben sich niemals wirklich durchsetzen können, manche existieren seit der ersten Stunde und werden noch immer weiterentwickelt, und einige von ihnen sind neu, modern und daher umso relevanter. 14

12 »Man gebe mir sechs Zeilen, geschrieben von dem redlichsten Menschen, und ich werde darin etwas finden, um ihn aufhängen zu lassen.«zugeschrieben Kardinal Richelieu ( ) 5 Webseitenentwicklung In diesem Kapitel geht es um die bisherigen und die aktuellen Standards in der Entwicklung für das mobile Web. 5.1 Was war was wird? Alte und neue Standards HTML, WAP, HDML, WML, C-HTML, i-mode, XML, XHTML-Basic, XHTML Mobile Profile, UAProf. Hört sich ganz schön technisch und umständlich an? Ist es auch! All diese Abkürzungen haben im Laufe der noch recht kurzen Zeit des mobilen Internets ihre Daseinsberechtigung gehabt, doch kennen müssen Sie nur wenige davon bis in s Detail sogar noch weniger WAP, WML, noch mehr WAP und XHTML Pläne für ein konsumentenfreundliches mobiles Internet gab es bereits kurze Zeit, nachdem die Handytelefonie Einzug in mehr und mehr Unternehmen und Haushalte hielt. Das WAP-Forum, das heute nach dem Zusammenschluss mit der Open Mobile Architecture Initiative als Open Mobile Alliance (OMA) die Standards im Bereich des WAP vorantreibt, entwickelte bereits 1997 gemeinsam mit dem Unternehmen Openwave eine erste Version des WAP, die unter dem Namen WAP 1.0 bekannt wurde. Diese Version arbeitete mit der Handheld Device Markup Language (HDML), die heute nur noch in den Geschichtsbüchern existiert. Aufgrund ausbleibender Unterstützung der Industrie wurde bereits zwei Jahre später, Anfang 1999, eine neue Version des Standards veröffentlicht. Diese neue Version 1.1 setzte statt auf HDML auf die neu entwickelte Wireless Markup Language (WML). Diese war nicht abwärtskompatibel zur Vorgängerversion, konnte sich jedoch am Markt behaupten, sodass fortan die 75

13 5 Webseitenentwicklung meisten neuen mobilen Endgeräte mit einem WAP 1.1/WML-fähigen Browser ausgestattet wurden. Bereits kurze Zeit später kam mit der Version 1.2 ein Nachfolger heraus, der einige Verbesserungen mit sich brachte, wie beispielsweise die Erweiterung um User-Agent Profile (UAProf). Die UAProf-Spezifikation sollte es aufgrund des stetig wachsenden Accept-Headers auf einfache Art und Weise ermöglichen, die Gerätefähigkeiten eines Benutzers zu ermitteln, um entsprechend auf die Fähigkeiten des Endgeräts reagieren zu können. Diese Methode wird in Kapitel 7,»Adaption«, noch ausführlich beschrieben und anhand von Beispielen erläutert werden. Im Laufe der Zeit wurde der WAP 1.x-Standard durch das WAP 2.0 ersetzt, das nicht wie seine Vorgänger auf eigene Protokolle und Auszeichnungssprachen setzt, sondern Verbindungen über das gewöhnliche HTTP/SSL ermöglicht und als Auszeichnungssprache auf eine modifizierte XHTML-Version setzt. Der für den Benutzer wohl signifikanteste Unterschied ist, dass bei HTTP-Verbindungen nach dem genutzten Datenvolumen abgerechnet wird, während bei WML-Seiten über WAP 1.x-APNs (Access Point Names, dt.: Zugangspunkte) jeweils ein komplettes sogenanntes Deck, also gegebenenfalls die komplette mobile Webpräsenz, abgerechnet wird. Diese Methode wird heutzutage immer noch in einigen Fällen aufgrund der Abwärtskompatibilität zu älteren Handymodellen benutzt, gerät aber mehr und mehr aus der Mode, weswegen sich dieses Buch ausschließlich auf die modernere XHTML-Technik und das WAP 2.0 beschränkt C-HTML, XHTML-MP, XHTML Basic welcher Standard zu welchem Zweck? Vermutlich in keinem anderen Bereich des Internets gibt es eine solche Fülle an Standards für Auszeichnungssprachen wie im mobilen Web. Von jeder Auszeichnungssprache gibt es mehrere Versionen; viele Versionen wurden eingestellt, viele neue ins Leben gerufen, doch wenn man es genau nimmt, dann gibt es eine verschwindend geringe Anzahl, die für uns an dieser Stelle wirklich von Interesse sind: nämlich genau eine! Als das Web um 1999 langsam begann, sich seinen Weg in die Mobilfunkgeräte der Endverbraucher zu bahnen, begannen auch viele Unternehmen damit, einen eigenen Standard für die Verwendung im mobilen Internet zu etablieren. Der größte Anbieter für mobile Telekommunikation und Datenübertragung weltweit, die japanische NTT DoCoMo, entwickelte beispielsweise bereits 1998 den Compact HTML-Standard (C-HTML), der in ihrem 76

14 Was war was wird? Alte und neue Standards 5.1 Datendienst i-mode zum Einsatz kommt. Zwar gehört i-mode mit über 50 Millionen Nutzern zum weltweit meistgenutzten Datendienst, der überwiegende Teil dieser Nutzer ist jedoch im asiatischen Gebiet zu finden, weswegen er für uns in Mitteleuropa nur von äußert geringer Relevanz ist. Evolution of Mobile Web Related Markup Languages Developer ihtml 1.0 (i-mode) Flash Lite 1.0 Flash Lite 2.1 Flash Lite (binary) Macromedia (now Adobe) i-mode HTML NTT DoCoMo simplified subset simplified subset simplified subset unstandardised HTML compact subset HTML 2.0 Standard Generalized Markup Language (SGML, since 1986) chtml HDML 1.0 HDML 3.0 WML 1.0 WML 2.0 structure web related features structure XML 1.0 XML 1.1 addition of mobile specific features subset HTML 4.01 XHTML Mobile Profile 1.0 XHTML Mobile Profile 1.1 XHTML Basic 1.0 XHTML Basic 1.0 XHTML 1.0 XHTML 1.1 Compact HTML ACCESS Wireless Markup Language WAP Forum (now Open Mobile Alliance) Handheld Device Markup Language Unwired Planet (now Openwave) Extensible Markup Language W3C XHTML Mobile Profile Open Mobile Alliance Extensible HTML Basic W3C Extensible HTML (full) W3C HyperText Markup Language W3C unstandardised HTML Tim Berners-Lee (CERN Genf) Abbildung 5.1 Zeitlicher Verlauf der Standards früherer und heutiger Zeit (Quelle: Wikipedia) 77

15 5 Webseitenentwicklung Eine weitere Markup-Sprache aus früheren Zeiten ist die Handheld Markup Language (HDML) von Openwave, deren Wurzeln (Version 1.0) bis in das Jahr 1996 zurückreichen. HDML wurde in den darauffolgenden 3 Jahren noch bis zur Version 3.0 weiterentwickelt, musste aber nach der Veröffentlichung von WAP 1.1 durch das damalige WAP-Forum der am Markt lancierten Wireless Markup Language (WML) weichen. XHTML wurde nur bedingt für das mobile Internet entwickelt, spielt aber dort mittlerweile in seinen verschiedenen Abwandlungen die wichtigste Rolle. Die Extensible Hypertext Markup Language (XHTML) ist eine auf XML basierende, erweiterbare Neuformulierung des bis dato im Web gängigen Standards HTML 4.0. XHTML setzt gegenüber HTML ein strukturierteres Dokument voraus und verhält sich in Sachen Fehlertoleranz strenger als besagter Vorgänger: So müssen Elemente zum Beispiel korrekt verschachtelt werden (korrekt: <p><b>fetter Text</b></p>, falsch hingegen: <p><b>fetter Text</p></b>), stets geschlossen werden (<br /> nicht: <br>), und Attribute müssen in Anführungszeichen stehen (<input type="text" /> nicht: <input type=text>). Dieser XHTML-Standard wurde 2000 vom W3C veröffentlicht und besitzt mittlerweile eigene Abwandlungen für mobile Geräte jeglicher Art. Die erste zu nennende Abwandlung entwickelt zurzeit das W3C mit XHTML Basic 1.0. Dieser Standard soll durch seinen sehr eingeschränkten und bewusst klein gehaltenen Umfang für jegliche Art von kompakten Geräten geeignet sein. Diese kompakten Geräte müssen nicht zwangsweise Handys sein, sondern können auch Settop-Boxen, Navigationsgeräte oder Spielkonsolen mit Internetanbindung sein. XHTML-Basic bietet die kleinste Menge an zur Verfügung stehenden Elementen, um eine hohe Kompatibilität auf allen unterstützenden Geräten sicherzustellen. Darüber hinaus entwickelt die Open Mobile Alliance ein XHTML-Basic-Derivat mit dem verheißungsvollen Namen XHTML Mobile Profile (XHTML-MP), das neben einer höchstmöglichen Kompatibilität, die durch XHTML-Basic gewährleistet ist, auch die Vorzüge heutiger Mobiltelefone und PDAs optimal bedienen soll. So bietet es erweiterte Möglichkeiten, um Elemente per Cascading Stylesheets (CSS) zu gestalten, die Unterstützung von ECMA- Script/JavaScript und umfangreichere Optionen bei der Formularerstellung. Der Letzteren dieser beschriebenen Markup-Sprachen, also XHTML-MP, möchten wir uns in diesem Buch widmen, da nahezu jedes halbwegs aktuelle 78

16 Einen WAP-Server aufsetzen 5.2 Handy diesen Standard unterstützt und die zukünftigen Geräte diesen Standard unterstützen sollen. Zudem dürfte XHTML-MP jedem, der beruflich oder privat mit der Erstellung von Websites auf HTML-Grundlage betraut ist, größtenteils bereits bekannt sein. 5.2 Einen WAP-Server aufsetzen Protokolle, Markup-Sprachen und viele Fachtermini... doch kommen wir zum Wesentlichen: Was wird wirklich benötigt, um einen Server ans Netz zu bringen, der meine WAP-Seite beherbergt, und welche Kosten entstehen durch den Betrieb eines eigenen WAP-Servers? Gleich die gute Nachricht vorab: Es sind keinerlei eigene WAP-Server für den Betrieb einer mobilen Version der eigenen Internetpräsenz nötig. Es muss also keine Software auf dem Server installiert werden, die für den Betrieb einer gewöhnlichen Website nicht ohnehin vonnöten ist, und auch das Protokoll, über das Websites im mobilen Internet kommunizieren, ist dasselbe! Was also ist ein WAP-Server? Ein WAP-Server ist im Prinzip nichts anderes als ein gewöhnlicher Webserver wie beispielsweise Apache, Lighttp, IIS oder Tomcat, auf dem für mobile Endgeräte aufbereitete Dokumente liegen. In der Regel liegen solche Dokumente in einem eigenen Verzeichnis und/oder sind unter einer eigenen Domain oder zumindest Subdomain zu erreichen. Doch auch dies ist kein absolutes Muss: So kann eine Applikation theoretisch auch selbstständig erkennen, ob es sich bei einem Besucher um einen Besucher von unterwegs handelt, also um einen»handynutzer«, oder ob das benutzte Gerät ein gewöhnlicher Desktop-Rechner mit einem üblichen Webbrowser (Firefox, Opera, Internet Explorer, Safari o.ä.) ist. Der Übersichtlichkeit halber sollte eine Website für das WAP auch entsprechend separat zugänglich gemacht werden, und dies geschieht nun mal für gewöhnlich durch eine der gerade genannten Methoden. Zum Betreiben einer Seite für das WAP reicht also theoretisch schon ein gewöhnliches Webspace-Paket bei einem beliebigen Webhoster. Bietet dieses zudem noch die Unterstützung für eine Scriptsprache wie zum Beispiel PHP, ist das umso besser: Schon kann es losgehen! 79

17 5 Webseitenentwicklung Konfiguration von Dateierweiterungen und MIME-Typen Ein WAP-Browser benötigt beim Empfang von Dokumenten stets Informationen darüber, um welchen Dateityp es sich handelt und wie er diesen behandeln soll. Zu diesem Zweck wurde die Multipurpose Internet Mail Extension (MIME) entwickelt. Einer Dateiendung (wie beispielsweise.html) kann in der Serverkonfiguration ein MIME-Typ zugeordnet werden, durch den ein Webbrowser später weiß, wie er ein Dokument dieses Typs verarbeiten soll. Einer Dateiendung kann dabei immer nur ein MIME-Typ zugeordnet werden, wohingegen beliebig vielen Dateiendungen der gleiche MIME-Typ zugeordnet werden kann. Halt, halt, immer langsam und noch mal zum Mitschreiben! Um den vorangegangenen Absatz mit seinem Überfluss an Informationen einmal anhand eines einfachen Beispiels zu beleuchten: Es ist problemlos möglich, mehreren Dateiendungen wie.html,.htm,.xhtml und.xhtm den MIME-Typ text/html zuzuweisen. Dadurch weiß der Webbrowser, dass er Dateien von diesem Typ als HTML-Dokument behandeln soll. Nicht möglich ist es dagegen, für alle Dateien mit der Dateiendung.html sowohl den MIME-Typ text/html als auch gleichzeitig application/xhtml +xml zuzuweisen. Ein Browser kann ein Gerät schlichtweg nicht gleichzeitig auf zwei verschiedene Arten darstellen. Alles klar, verstanden. Doch wann wird welcher MIME-Typ verwendet? Grundsätzlich sind in allen aktuellen Webservern die MIME-Typen für gängige Dateiformate nach der Installation bereits standardmäßig korrekt konfiguriert. Ist dies einmal nicht der Fall, können Sie im Handbuch des jeweiligen Webservers nachschlagen, wie in diesem Fall für Abhilfe gesorgt werden kann und MIME-Typen für beliebige Dateiformate angelegt werden können. Eine Übersicht über die WAP-relevanten Dateierweiterungen mit ihren entsprechenden MIME-Typen liefert die folgende Tabelle: Erweiterung MIME-Typ WAP Erläuterung.wml text/vnd.wap.wml 1.x WML-Quelltext in Textform.wmlc application/vnd.wap.wmlc 1.x Kompilierter WML-Quelltext Tabelle 5.1 WAP-relevante Dateierweiterungen und ihre MIME-Typen 80

18 Einen WAP-Server aufsetzen 5.2 Erweiterung MIME-Typ WAP Erläuterung.wmls text/vnd.wap.wmlscript 1.x WML-Script in Textform.wmlsc application/vnd.wap.wmlscriptc 1.x Kompiliertes WML-Script.wbmp image/vnd.wap.wbmp 1.x WBMP-Bild mit 1 Bit Farbtiefe.html,.html,.xhtml application/vnd.wap.xhtml+xml oder application/xhtml+xml oder text/html 2.0 XHTML-Quelltext in Textform Tabelle 5.1 WAP-relevante Dateierweiterungen und ihre MIME-Typen Für die mittlerweile im WAP üblichen XHTML-MP-Dokumente gibt es die Möglichkeit, aus drei unterschiedlichen MIME-Typen zu wählen. application/vnd.wap.xhtml+xml Dies ist der von der Open Mobile Alliance empfohlene MIME-Typ für Seiten im mobilen Internet. Er sollte auch von mittlerweile recht alten mobilen Geräten korrekt unterstützt werden. Seiten, die mit diesem MIME-Typ ausgeliefert werden, sollten so also auf jedem gewöhnlichen Handy oder PDA problemlos angezeigt werden. Der Nachteil bei diesem Content-Typ ist jedoch, dass gewöhnliche Webbrowser ihn in der Regel nicht erkennen und eine Seite somit, anstatt sie anzuzeigen, herunterladen wollen, also ein Download-Fenster öffnen. Wenn Sie Wert darauf legen, dass Ihre mobile Website auch mit dem Webbrowser aufrufbar bleibt, sollten Sie auf diesen Typ verzichten. application/xhtml+xml Das W3C empfiehlt, dass XHTML-Dokumente nach Möglichkeit mit dem korrekten Content-Typ application/xhtml+xml ausgeliefert werden sollten ( Auf diesen Typ kann zurückgegriffen werden, wenn eine WAP-Seite später ohne großen Aufwand sowohl am Handy als auch am Desktop aufrufbar sein soll. So weit die Theorie. Leider macht uns hier der Internet Explorer einen Strich durch die Rechnung, der wie andere Desktop-Browser dies bei application/vnd.wap.xhtml+xml-dokumenten tun statt der gerenderten Seite 81

19 5 Webseitenentwicklung einen Download-Dialog anzeigt. Glücklicherweise gibt es den sogenannten Accept-Header, den ein Browser beim Seitenaufruf mitsendet und der uns als Seitenbetreiber über die von ihm akzeptierten Content-Typen aufklärt. Durch diesen Accept-Header kann festgestellt werden, ob ein Browser die Fähigkeit besitzt, ein Dokument korrekt als application/xhtml+xml darzustellen. In PHP befindet sich dieser Accept-Header in der vordefinierten Variable $_ SERVER['HTTP_ACCEPT'] und hat in etwa diese Form: [HTTP_ACCEPT] =>, text/html, application/xml;q=0.9, application/xhtml+xml, multipart/mixed, image/png, image/jpeg, image/gif, image/x-xbitmap, */*;q=0.1 Wozu also»application/(vnd.wap.)xhtml/xml«verwenden? Man mag sich nun zu Recht fragen, warum man seine Dokumente bei derartigen Problemen nicht einfach generell immer mit der dritten Möglichkeit ausgibt, nämlich als text/html. Diese Frage ist vielleicht mit einer vergleichenden Gegenfrage am einfachsten zu beantworten: Wieso sollte ich mein Auto schieben, weil einer der Insassen keinen Führerschein hat, nur weil das theoretisch möglich ist? Die Auslieferung von XHTML-Dokumenten mit dem korrekten MIME-Typ bietet drei entscheidende Vorteile: Wir halten uns an geltende und anerkannte Standards und bieten somit die größtmöglich zu gewährleistende Kompatibilität plus eine gewisse Zukunftssicherheit, denn in der Regel sind neue Standards abwärtskompatibel und funktionieren somit auch nach dem Erscheinen einer neueren Version meist noch uneingeschränkt. Wir erhalten eine korrekte Fehlerbehandlung. Nicht-wohlgeformte Dokumente werden nicht falsch und für den Benutzer möglicherweise unverständlich dargestellt, sondern der Browser gibt stattdessen eine Fehlermeldung aus (siehe Abbildung 5.2). Die Kompatibilität mit anderen XML-Standards ist gewährleistet, und somit ist der ursprüngliche Gedanke der Extensible Markup Language sichergestellt: die Erweiterbarkeit. 82

20 Einen WAP-Server aufsetzen 5.2 Abbildung 5.2 Opera Mini meldet ein ungültiges application/xhtml+xml-dokument. text/html Bleibt abschließend noch die Frage zu klären: Wann nutze ich text/html? Kurz und bündig: Im WAP am besten nie! Zwar ist es natürlich schön, wenn die Möglichkeit besteht, eine WAP-Präsenz sowohl spontan von unterwegs als auch in aller Ruhe am heimischen PC zu durchstöbern, doch wer möchte schon in eine neue Technologie investieren, um dann die Kompatibilität zu seiner Zielgruppe, den mobilen Benutzern, aufs Spiel zu setzen, nur um die WAP-Seite auch auf einer veralteten Browser-Krücke wie dem Internet Explorer 6 lauffähig zu machen? Hier sollte die Kompatibilität zu mobilen Endgeräten selbstverständlich eine sehr viel höhere Priorität haben als die Möglichkeit zur Benutzung der Webpräsenz an einem Gerät, das nicht zur Kern-Zielgruppe gehört. Möchten Sie dennoch nicht auf die User mit Internet Explorer an einem Desktop-PC verzichten, gibt es wie eben erwähnt die Chance, den MIME- Typ dynamisch anzupassen. Bewerkstelligen lässt sich dies recht schnell mit dem folgenden PHP-Script, das jedoch am Anfang eines jeden Dokuments eingebunden werden muss: <?php function getmime() { $xhtml = FALSE; 83