Etter gode tilbakemeldinger på mobilsiden jeg lagde for Slottsfjellfestivalen, og en forespørsel fra Kenneth på Twitter, har jeg laget en mobilside for Øyafestivalens program. Og, om jeg tør si det selv, denne gangen ble den 1000 ganger bedre!

Denne gangen har jeg konsentrert meg om smartphones (spesielt iPhone og iPad), slik at jeg kan leke litt mer med UI. Én av endringene er at jeg denne gangen benytter meg av Ajax gjennom jQuery UIs tabs-funksjon:

Ved å bruke Ajax kan brukerne også bruke siden som en web-app på Hjem-skjermene sine i iOS. (Bruker man vanlige linker sendes brukerne til Safari-appen.) Og, siden ser «smoothere» ut uten Safari-UI-et.

Jeg har i tillegg benyttet meg av enhetsspesifisert CSS. Med andre ord; forskjellige CSS til forskjellige skjermstørrelser. Det vil si at iPhone-brukere får servert en mindre versjon enn det iPad- og desktop-brukere får. Denne funksjonen er implementert slik:

Takk til Oddne for skjermbilde fra iPad!

Så, hva syns dere?

Oppdatert 22. juli 2010 18:04:
Etter tilbakemeldinger fra «Aaaaaa» (et akronym?) har jeg justert opp maksvidden (max-device-width) for å tilpasse mobiler med større oppløsning enn 320px, noe som vel i grunnen også gjelder iPhone 4. Siden jeg selv ikke har tilgang til all verdens mobiltelefoner, tar jeg gjerne imot tilbakemeldinger på hvordan siden oppfører seg på andre modeller!

En annen ting som også er lagt til er offline-funksjon for nettlesere som støtter HTML 5 Manifest. Det vil i praksis si alle iPhone-er, iPod Touch-er og iPad-er (og sikkert Android-er da dette er Google[?]). Enjoy!