iPhone-vennlige nettsider

Å lage nettsider som automatisk tilpasses dersom man går inn med iphone, er enklere enn du tror.

Stadig flere bruker iPhone eller en annen mobil enhet til å surfe med. Utfordringen når man bruker en håndholdt enhet til internettsurfing, er skjermstørrelsen. Svært få nettsider er tilpasset mobiltelefoner og man blir sittende å zoome og flytte innhold rundt på skjermen. Dette blir fort brukeren lei av og man velger å navigere seg til andre nettsider. Mange nettaviser har i dag tilpasset sine nettsider slik at man får se en annen versjon av nettsiden dersom man bruker en mobiltelefon. Dette gjelder langt fra alle. Aftenposten, VG, Dagbladet, DN, Bergens Tidene og NRK har i dag slike løsninger, mens f.eks. Nettavisen, Hegnar og Bergens Avisen har det i skrivende stund ikke. Mange bruker nok oftere mobilen når de er på farten og ønsker f.eks. å sjekke rutetabeller. Verken NSB eller Trafikanten sender deg automatisk videre inn til en mobiltelefon-vennlig nettside, men på NSB sine nettsider kan du velge å gå til slike sider, dersom du får øye på linken når du er inne på NSB.no. Trafikanten har ikke slike sider, men derimot har de laget en egen applikasjon som er nedlastbar dersom du bruker iPhone. Finn.no jobber for øyeblikket med å utvikle mobil-vennlige nettsider.

Per i dag er 6 % av lesere av denne bloggen, besøkende som bruker iPhone eller iPod. På en vanlig nettavis, ligger det på rundt 1 %. Antageligvis vil nok dette bare øke. Ulempen er at dersom du ikke har iPhone-vennlige nettsider per i dag, kan du miste interessen til den besøkende og det kan ta lang tid før han eller hun kommer tilbake. Du mister rett og slett den besøkende til noen andre.

Legg inn denne koden øverst mellom <head> og </head>, og du er i gang:

<script type="text/javascript">

if ((navigator.userAgent.indexOf('iPhone') != -1) ||

(navigator.userAgent.indexOf('iPod') != -1)) {

document.location = "iphone/";

} </script>

Brukere som bruker iPhone eller iPod vil nå automatisk bli videresendt til innhold du har liggende i mappen "iphone/". Dine iPhone-vennlige nettsider bør være enklere og ha mindre informasjon enn dine vanlige nettsider. Teksten bør være omkring tre ganger så stor. Menystruktur bør legges vertikalt med kun en link for hvert linjeskift. Dersom du skal definere bredde på bilder eller tekst, bør dette settes i prosent og ikke i piksler slik at det ser likt ut uavhengig av om man bruker iPhone horisontalt eller vertikalt. Du bør nok ha en egen css-fil for dine iPhone-vennlige nettsider.

Dersom du har samme innhold på dine vanlige nettsider og iPhone-vennlige nettsider og lar scriptet som er vist her velge formateringen, bør du ikke definere størrelser på bilder. Lagre bilder heller i den størrelsen du ønsker før du laster det opp på nettstedet og definer bredden på bilder som er vist på iPhone til 80 %. Bildene vil i noen tilfeller få en litt merkelig størrelse, men de vil holde seg innenfor skjermen og beholde riktig propesjon. Bilder som blir brukt som ikoner og i design, definerer du selvsagt manuelt.

Selv har jeg for øyeblikket kun laget mobilvennlige nettsider som er tilpasset iPhone. Det er stort sett iPhone mine lesere med mobiltelefon bruker. Straks statistikken viser at det også blir brukt andre mobile enheter, vil jeg selvsagt tilpasse nettsiden min for dette.

iPhonevennlig nettside

Del