I mange år har eksperter sagt at trafikken til nettsteder fra besøkende på mobile enheter har økt dramatisk. Av denne grunn har mange selskaper smart begynt å omfavne en mobilstrategi for deres online tilstedeværelse, og skapt opplevelser som passer til telefon og andre mobile enheter.
Når du har brukt tiden på å lære hvordan utforme websider for mobiltelefoner, og implementere strategien din, vil du også sørge for at nettstedets besøkende kan se disse designene. Det er mange måter du kan gjøre dette på, og noen fungerer bedre enn andre. Her er en titt på metoden du kan bruke til å implementere mobilstøtte på nettsteder - sammen med en anbefaling mot slutten om hva som er den beste metoden for å oppnå dette på dagens nett.
Gi en lenke til en annen sideversjon
Dette er uten tvil den enkleste metoden for å håndtere mobiltelefonbrukere. I stedet for å bekymre deg for om de kan eller ikke kan se sidene dine, kan du bare sette en lenke et sted nær toppen av siden som peker på en egen mobilversjon av nettstedet ditt. Da kan leserne selv velge om de vil se mobilversjonen eller fortsette med den "normale" versjonen.
Fordelen med denne løsningen er at den er enkel å implementere. Det krever at du oppretter en optimalisert versjon for mobil og deretter legger til en lenke et sted nær toppen av de vanlige sidene.
Ulempene er:
- Du må ha en egen versjon av nettstedet for mobilbrukere. Etter hvert som nettstedet ditt blir større, kan du glemme å vedlikeholde den andre versjonen, og nettstedene dine kan falle ut av synkronisering.
- Oppretter du også en tredje versjon for nettbrett? Hva med en fjerde versjon for bærbare? Dette konseptet med enhetsspesifikke versjoner kan gå ut av kontroll veldig raskt.
- Du må sette en stygg lenke øverst på siden som ikke-mobile lesere kan se (og eventuelt klikke på).
Til syvende og sist er denne tilnærmingen utdatert som neppe vil være en del av en moderne mobilstrategi. Det brukes noen ganger som en stop-gap fix mens en bedre løsning blir utviklet, men det er virkelig et kortsiktig plaster på dette punktet.
Bruk JavaScript
I en variant av den ovennevnte tilnærmingen bruker noen utviklere en slags nettleseroppdagelse skript for å oppdage om kunden er på en mobil enhet, og deretter omdirigere dem til den separate mobilen nettstedet. Problemet med nettleser deteksjon og mobile enheter er at det er tusenvis av mobile enheter der ute. Å prøve å oppdage dem alle med ett JavaScript kan gjøre alle sidene dine til et mareritt som lastes ned - og du er fortsatt utsatt for mange av de samme ulempene som den ovennevnte tilnærmingen.
Bruk CSS @media håndholdt
CSS-kommandoen @media håndholdt virker som om det ville være en ideell måte å vise på CSS stiler bare for håndholdte enheter - som mobiltelefoner. Dette virker som en ideell løsning for visning av sider for mobile enheter. Du skriver en webside og lager deretter to stilark. Den første for "skjerm" medietypestiler siden din for skjermer og dataskjermer. Den andre for "håndholdte" stiler siden din for små enheter som disse mobiltelefonene. Høres enkelt ut, men det fungerer egentlig ikke i praksis.
Den største fordelen med denne metoden er at du ikke trenger å vedlikeholde to versjoner av nettstedet ditt. Du vedlikeholder bare den ene, og den stilark definerer hvordan det skal se ut - som faktisk kommer nærmere den sluttløsningen vi ønsker.
Et problem med denne metoden er at mange telefoner ikke støtter medietypen - de viser sidene sine med skjermmedietypen i stedet. Og mange eldre mobiltelefoner og håndholdte enheter støtter ikke CSS i det hele tatt. Til slutt er denne metoden upålitelig og brukes derfor sjelden til å levere mobile versjoner av et nettsted.
Bruk PHP, JSP, ASP til å oppdage brukeragenten
Dette er en mye bedre måte å omdirigere mobilbrukere til en mobilversjon av nettstedet fordi det ikke er avhengig av et skriptspråk eller CSS som mobilenheten ikke bruker. I stedet bruker den et serversidespråk (PHP, ASP, JSP, ColdFusion, etc.) for å se på brukeragenten og deretter endre HTTP-forespørsel å peke på en mobil side hvis det er en mobilenhet.
En enkel PHP-kode for å gjøre dette vil se slik ut:
Problemet her er at det er mange andre potensielle brukeragenter som brukes av mobile enheter. Dette skriptet vil fange og omdirigere mange av dem, men ikke alle på noen måte. Og flere blir lagt til hele tiden.
I tillegg, som med de andre løsningene ovenfor, må du fortsatt ha et eget mobilnettsted for disse leserne! Denne ulempen med å måtte administrere to (eller flere!) Nettsteder er grunn nok til å finne en bedre løsning.
Bruk WURFL
Hvis du fremdeles er fast bestemt på å omdirigere mobilbrukerne dine til et eget nettsted, så WURFL (Wireless Universal Resource File) er en god løsning. Dette er en XML-fil (og nå en DB-fil) og forskjellige DBI-biblioteker som ikke bare inneholder oppdaterte data om trådløs brukeragent, men også hvilke funksjoner og funksjoner disse brukeragentene støtter.
For å bruke WURFL laster du ned XML-konfigurasjonsfilen og velger deretter språket ditt og implementerer API på nettstedet ditt. Det er verktøy for bruk av WURFL med Java, PHP, Perl, Ruby, Python, Net, XSLTog C ++.
Fordelen med å bruke WURFL er at det er mange som oppdaterer og legger til konfigurasjonsfilen hele tiden. Så mens filen du bruker er utdatert nesten før du er ferdig med å laste den ned, er sjansen stor for at hvis du last ned den en gang i måneden eller så, har du alle mobilnettleserne leserne dine vanligvis bruker uten noen problemer. Ulempen er selvfølgelig at du må laste ned og oppdatere dette kontinuerlig - alt slik at du kan lede brukerne til et annet nettsted og ulempene som skaper.
Den beste løsningen er responsiv design
Så hvis det ikke er svaret på å vedlikeholde forskjellige nettsteder for forskjellige enheter, hva er det? Responsivt webdesign.
Responsiv design er der du bruker CSS-mediespørsmål for å definere stiler for enheter med forskjellige bredder. Responsiv design lar deg lage en webside for både mobile og ikke-mobile brukere. Da trenger du ikke å bekymre deg for hvilket innhold du skal vise på mobilnettstedet eller huske å overføre de siste endringene til mobilnettstedet ditt. I tillegg, når du har skrevet CSS, trenger du ikke laste ned noe nytt.
Responsiv design fungerer kanskje ikke perfekt på ekstremt gamle enheter og nettlesere (hvorav de fleste er i svært liten bruk i dag og burde ikke være veldig bekymret for deg), men fordi det er additiv (legge til stiler på innholdet i stedet for å ta bort innholdet) vil disse leserne fortsatt kunne lese nettstedet ditt, det vil bare ikke se ideelt ut på den gamle enheten eller nettleser.