iPhone-venligt webdesign


11/6-2008

D. 10. juni blev det annonceret, at iPhone kommer til Danmark. Der er i skrivende stund - juni 2008 - langt over 8000 iPhones i Danmark, så inden længe bliver vi oversvømmet med dem. Undersøgelser har vist, at iPhone-ejere surfer meget mere på nettet end andre mobil-ejere (med deres mobil vel at mærke). Derfor er det vigtigt, at din hjemmeside ser ordentlig ud i en iPhone (og iPod Touch - som har samme browser som iPhone indbygget).
Her vil jeg diske op med en håndfuld tips til, hvordan du laver webdesign til iPhone.

iPhone og iPod touch har en mobil udgave af Apples browser Safari, men der er forskelle. Dog er den mobile Safari den mest avancerede mobil-browser på markedet. Her er et par facts om den:

Nå - men her er et par guldkorn til at starte med:

Bookmark ikon på iPhone

Har du lavet en god side, så vil dine brugere muligvis bookmarke den, så de har et ikon på deres "Home screen". I stedet for at få et standard anonymt ikon, så lav dit eget, som du ser det her. Det ser mere prof ud. Euro 2008 V4D5 iphone ikonAlt du skal gøre er at lave et png-billede i formatet 57x57 pixels. Hvis du laver det i et andet format, vil iPhone sørge for at re-size det. Når din side bliver bookmarket, så vil iPhone lægge et lag over, så det får det klassiske lidt glossy look for iPhone-ikoner. Her til venstre kan du se dét, jeg lavede til min EM 2008-side til iPhone (www.v4d5.net/em).

Når du har lavet ikonet, skal du indsætte dette link-tag i din header på hjemmesiden.
<link rel="apple-touch-icon" href="http://www.v4d5.net/em/euro2008.png"/>
That's it... Din side har nu sit eget ikon på "skrivebordet" og det kommer til at se sådan ud:
iPhone screendump

Gør telefonnumre "opkalds-bare"

Skal du lave link til et telefonnummer, så gør det nemt for brugeren at ringe op. Laver du linket således:
<a href="tel:11114444">Ring 11112222</a>
så kan brugeren blot klikke på det og telefonen vil ringe op med det samme.

Vis det på Google Maps

Skal du vise noget på et kort, så brug Google Maps ved at skrive det således:
<a href="http://maps.google.com/maps?q=willemoesgade+54%2Ccopenhagen">Willemoesgade 54, København</a>
Når brugeren klikker på linket, åbner Google Maps automatisk på brugerens iPhone.
For at finde det link, du skal bruge, går du ind på Google Maps, laver din søgning, sakser URL'en og sætter ind. Du kan evt. fjerne alle parametre undtagen dem med din adresse i. Det vigtigste er dét, der står efter q=, men det kan du nok godt regne ud ;-).
På samme måde kan du også lave "directions" - altså fra-til.


Der ska' nok komme flere tips til, hvordan du designer hjemmesider til iPhone. Dette var bare første omgang. I mellemtiden kan jeg kun opfordre til et besøg på:
kondomer på kondomaten


Kommentarer


18 Aug 2009 23:46

Dávur
Hehe...jeg ser at du har gået i en god skole ;) - fine små tuts, du laver her.

19 Aug 2009 16:27

V4D5
Dávur - hvor herligt. Jeg tænkte på dig i denne uge. Tænkte "gad vide, hvor Dávur blev af". Ja - jeg lærte rigtigt meget på WebCafeen. Er stadig ærgerlig over, at den lukkede.

Hvor har du din online gang? Din offline gang er vel stadig på Færøerne

20 Aug 2009 11:13

Dávur
Ja * snøft * caféen...suk. Bagmandspatruljen er spredt for alle vinde - der går måneder imellem at jeg har kontakt til nogen af dem.

Faktisk har jeg på det seneste ledt efter forskellige af de gamle brugere for at se hvad de har gang i, bare for sjov. Jeg grabbede jo de bedste himmerigsmundfulde blandt materialet på Caféen og skulle launche et statisk arkiv...men du ved: nyt job og nye fokusfelter. Her i ferien har jeg så checket det sørgelige skrog, jeg formåede at skrue sammen dengang, og stødte på bl.a. dit nick - og så ville jeg lige snuse rundt at se om jeg kunne lokalisere dig ;)

Jeg er stadig sysadmin på Færøernes Universitet, roder for det meste med servere (VMware, Debian Linux og Win2003) og med indførelse af Web 2.0 teknologi ifm uni's web, intra -og extranet. Vi kører med Novell OES2 servere og der er der en masse legetøj at rode med.

Online, tjah jeg koder ikke så voldsomt meget mere selv mere men bruger og tweaker mest OpenSource komponenter til forskellige formål, til små begrænsede konsulent-opgaver. Jeg fabrikerede engang et ganske udmærket CMS, som nu driver et par sites men jeg har knap nok en hjemmeside selv, der er værd at vise frem (profocms.com); den er stendød, selvom jeg har prøvet at tage mig sammen til at få fuldført en længe planlagt makeover og køre på mit eget CMS (tsk tsk).

20 Aug 2009 23:16

Dávur
Heh - jeg besvarede vist ikke dit rigtige spørgsmål: Jeg er p.t. ikke aktiv på nogle fora, der har med IT at gøre overhovedet (udover Launchpad, hvor jeg af og til smider bugrapporter ind til Ubuntu-udviklerne).

25 Aug 2009 10:21

V4D5
Nå - så du tog lige et lille online walk down memory lane. Jeg har færdes på flere fora gennem tiden og få er de steder, hvor stemningen var ligeså god som på WebCafe. En skam at den skulle lide off-line døden.

Savner du ikke at kode? Du var da ellers noget af en kode-haj og der er vel god brug for nogle stabile kodere. Du kunne jo lave noget Ubuntu-support? Er selv stor Ubuntu-fan.

25 Aug 2009 12:21

Dávur
Jo, jeg savner i den grad at være lidt kreativ og kode fuldtid og lege Photoshop, lige som jeg gjorde årene 2000 - 2005, mens jeg var hos Sifira. Men der er jo den forskel, at i den periode var det min primære opgave at lave hammersolidt industrikvalitets web og det brugte jeg jo selv Caféen til og kunne give tilbage - gevinst begge veje.

Som sysadmin har jeg nogle manualer, jeg skal kunne på fingerspidserne til den daglige drift. Min kreative drift får så lidt afløb ved at jeg tester alskens systemer på job, som vi kunne implementere i vores netværk og hvor mange af disse er webserver-baserede tjenester, så der kommer mit gode kendskab til LAMP ganske tit meget handy ;)
Jeg har på job lavet et par småting kodestumper til Linux-systemer, bl.a. til overvågning af DHCP-leases, men ikke noget jeg har overvejet at commite ind.
Ubuntu er nok stadig min foretrukne Linux desktop og jeg har efterhånden prøvet stort set alle, der er noget ved musikken og mere til. Til servere foretrækker jeg at bruge Debian.
Når du taler om Ubuntu-support, hvad ville du da efterlyse fra sådan en, som du ikke får svar på hos Google eller Ubuntuforums :) ? Jo, jeg har skam overvejet det men så skal jeg jo til at finde en 'kundeskare' ;)
Hvad med dig - er du stadig regnfrakke-grossist eller hvad giver brød på bordet?

Har du lyst til at kommentere, er du mere end velkommen

Navn: *
Email: * (bliver ikke vist)
Hjemmeside:
Kommentar:

Anti-spam-check (beklager, men det er åbenbart nødvendigt):
Hvad er fem + to? (skriv tal - ikke bogstaver)