Mobile Web Application Best Practices Cards - Die besten Praktiken für mobile Webanwendungen als Karten

Die Mobile Web Application Best Practices (MWABP) wurden von Marie-Claire Forgue <w3t-comm@w3.org> zusammengetragen. Diese Richtlinien sollen dabei helfen, dynamische und benutzerfreundliche Mobile Web Applications zu entwickeln. Zum Nachlesen/Ausdrucken kannst Du Dir die PDF-Version herunterladen. Wir haben die Karten nicht auf Deutsch übersetzt, da die relevanten Wörter im Kontext der Programmierung bereits vom Englischen ins Deutsche übernommen wurden. Darüber hinaus sind die MWABP-Karten zusätzlich auf folgenden Sprachen erhältlich: Französisch, Hebräisch, Ungarisch, Koreanisch, Spanisch, Schwedisch und Englisch.

Für weitere Informationen kontaktiere bitte Marie-Claire Forgue <w3t-comm@w3.org>, auf Englisch.

Viel Spaß beim Lesen!

W3C Mobile Web Application Best Practices

Spare the network
Set users free
Remember Web principles
Design for flexibility
Exploit mobile-specific features
Optimize response time

Spare the network

Use appropriate Web protocol features to reduce network bottlenecks and latency.

Use transfer compression.
Cache resources by fingerprinting resource references.
Cache AJAX data.
Minimize external resources.
Minimize application and data size.
Use cookies sparingly.
Do not send cookie information unnecessarily.
Optimize network requests.
Avoid redirects.

top ↑

Set users free

Mobile devices are used in various contexts, from killing time at home to urgent requests on the go. Let users know and control what happens to earn their trust.

Ensure the user is informed about use of personal and device information.
Enable automatic sign-in.
Offer users a choice of interfaces.
Don’t change focus when dynamically updating page sections.

top ↑

Remember Web principles

Mobile devices are just one way to access the Web. Generic Web principles also apply to the development of robust mobile Web applications.

Replicate local data.
Ensure consistency of state between devices.
Do not execute unescaped or untrusted JSON data.
Use fragment IDs to drive application view.

top ↑

Design for flexibility

Web applications are run in evolving and heterogeneous environments. Flexibility allows you to address more devices and users at reduced cost.

Design for multiple interaction methods.
Ensure text flows.
Prefer server-side detection where possible.
Use client-side detection when necessary.
Use device classification to simplify content adaptation.
Support a non-JavaScript variant if appropriate.

top ↑

Exploit mobile-specific features

Some Web technologies are particularly relevant to mobile devices. Learn to use them.

Make telephone numbers "click-to-call".
Consider mobile-specific technologies for initiating Web applications.
Use the meta viewport element to identify the desired screen size.
Use appropriate client-side storage technologies for local data.

top ↑

Optimize response time

Every detail matters in mobile Web applications and some technical points may significantly boost the overall user experience.

Aggregate static images into a single composite resource (sprites).
Include background images inline in CSS style sheets.
Keep DOM size reasonable.
Minimize perceived latency.
Optimize for application start-up time.

top ↑

Mobilize your apps!

These guidelines aid the development of rich and dynamic mobile Web applications. For more information:

www.w3.org/TR/mwabp/

Supported by the MobiWebApp FP7 EU project

mobiwebapp.eu

top ↑