Um Webseiten für den mobilen Screen zu optimieren gibts einige Tipps 6 Tricks.
Zuerst sollte der viewport auf mobile Geräten richtig eingestellt werden:
| Code Block | ||
|---|---|---|
| ||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0"> |
Weiter kann für Apple-Geräten die Homescreen App aktiviert werden und die Status Bar angepasst werden.
| Code Block | ||
|---|---|---|
| ||
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> |
Beim Entwickeln für Mobile Geräte ist sehr hilfreich solche im Browser direkt zu emulieren.
Der Browser Chrome von Google hat eine solche Funktionalität schon eingebaut:
