Website voor mobiele apparaten
Inhoud |
Inleiding
Steeds meer apparaten hebben de mogelijkheid om op het internet te surfen. Deze apparaten, zoals mobiele telefoons en PDA's (Personal Digital Assistant) hebben echter meestal beperkter capaciteiten ten opzichte van een desktopcomputer.
CSS mediatype
Met behulp van het media-attribuut kunnen er verschillende stylesheets worden gebruikt voor verschillende apparaten. Deze manier klinkt heel mooi, maar helaas pakken niet alle mobiele apparaten het media-attribuut op een correcte manier op en wordt de stylesheet voor gewone browsers geselecteerd.
<!-- computers --> <link type="text/css" media="screen" rel="stylesheet" src="screen.css" /> <!-- printers --> <link type="text/css" media="print" rel="stylesheet" src="print.css" /> <!-- mobiele apparaten --> <link type="text/css" media="handheld" rel="stylesheet" src="handheld.css" />
Zie: http://www.w3.org/TR/CSS21/media.html
Lichtere versie
Naast het aanpassen van de weergave, speelt ook het dataverkeer een grotere rol bij mobiele apparaten. Laad bijvoorbeeld geen grote plaatjes die bij de desktopversie wel te zien zijn, want deze zijn meestal toch veel te groot voor het scherm van een mobiel apparaat.
Let erop dat de content van de website het belangrijkste is. Het is daarom verstandig om een lichtere (aangepaste) versie van de website aan te bieden voor deze mobiele apparaten.
Handige links
Algemene informatie
- W3C Mobile Web Best Practices 1.0
- Allerhande info, o.a. specificaties per telefoon: schermformaat, image-ondersteuning, standaard lettergrootte, enz.
- Mobiel internet & mobile marketing
- PHP-script om mobiele apparaten detecteren
- Usability mobiele applicaties en sites: teleurstellingen, tips & tricks
Artikelen
- 3 manieren om een website voor mobiele apparaten te maken
- Snelle fix om een website geschikt te maken voor mobiele apparaten
- Linkliste Mobile Web Development
- Comparison of CSS 2.1, CSS MP, WCSS and CSS Level 1
- Webdesign voor mobiel
iPhone
- Showcase of Designs Optimized for iPhone
- iphonedebug - iPhone JavaScript debug console
- iPhone Apps Design Mistakes: Disregard Of Context
- iPhone App Design Trends
- iPhone Apps Design Mistakes: Over-Blown Visuals
- jQTouch Makes Web Development on the iPhone and iPod Touch a Snap
- Best Practices To Develop Perfect Websites for iPhone and Mobile Devices
- 10+ useful code snippets to develop iPhone friendly websites
SEO
- Google en de desktopversie en de versie voor mobiele apparaten van een website
- Help Google bij het indexeren van een website voor mobiele apparaten
