Special: Die perfekte mobile Website: 17 Tipps

Der Smartphonemarkt boomt. 2011 konnten ca. 9,6 Millionen Geräte abgesetzt werden. 1,9 Millionen mehr als noch 2010. (Quelle: GfK, gfu, BVT © Statista 2011) Mit dem Einzug des Smartphones ins alltägliche Leben, nimmt auch die mobile Nutzung des Internets immens zu. Webseiten werden zunehmend unterwegs aufgerufen. Doch lange nicht alle Websites sind dafür optimiert. Deshalb geben wir ihnen 17 Tipps für Ihre mobile Website (mk).
1. Mobile Website, App oder Web-App?
Mobile Seite oder App? Das ist eine der zentralen Fragen beim Mobile Development. Beides hat Vor- und Nachteile. Eine App ruft ein besonderes Nutzererlebnis hervor, kann oft auch ohne Internetverbindung genutzt werden und ermöglicht eine höhere Kundenbindung. Mobile Websites sind in der Regel für alle Mobilgeräte mit Internetverbindung erreichbar, während Apps nur für spezielle Geräte verfügbar sind (z.B. Apples App-Store nur für iPhone und iPad). Außerdem sind mobile Websites im Gegensatz zu nativen Apps wesentlich leichter zu entwickeln. So braucht man z.B. für iPhone-Apps gute Objective-C Kentnisse oder für Android Apps Erfahrungen mit Java.Mittlerweile gibt es außerdem zahlreiche mobile Frameworks, mit denen man so genannte Web-Apps entwickeln kann. Das sind im Prinzip mobile Websites, die wie Apps aussehen. Mit dem Framework iUI beispielsweise erstellen Sie Web-Apps im Apple Look&Feel. Äußerst beliebt ist auch jQuery Mobile, das auf HTML5-Technologien aufbaut.
2. Webdesign muss auf kleinere Bildschirme ausgerichtet sein
Smartphones haben wesentlich kleinere Displays als die Monitore von stationären PC‘s. So hat etwa das iPhone 4 eine Auflösung von 640 x 960 Pixel, das Samsung Galaxy S2 nur 480x800 Pixel oder das iPad 1024 x 768 Pixel. Manch andere Smartphones haben aber auch wesentlich geringere Auflösungen. So z.B. das Blackberry Curve 8520 oder das HTC Wildfire mit jeweils nur 320x240 Pixel. Diese unterschiedlichen kleinen Auflösungen sollte man beim Designen für mobile Websites immer im Auge behalten.Ein Zauberwort hierbei ist „Responsive Webdesign“. Dabei handelt es sich um eine Form des Webdesigns, bei der man mit Hilfe von „Media Queries“ (eine Technik, die mit CSS3 eingeführt wurde) eine Website kreiert, die sich automatisch an die entsprechenden Bildschirmgrößen anpasst. Man braucht also nicht mehr verschiedene Sites für verschiedene Displays, sondern nur noch eine einzige zu entwickeln.
