Hijax

Forleden faldt jeg over en artikel af Jeremy Keith , et medlem af The Web Standard Project . Artiklen handler, sjovt nok, om hvordan man bør og kan, designe sin webapplikation, sådan at flest muligt får mulighed for at bruge den - en teknik Jeremey har valgt at  kalde “Hijax”.

Problematikken med at visse applikationer udelukker visse brugere, har længe fundet sted, og specielt opstår dette problem ved brugen af Javascripts, Flash eller andet scripting, som stille specielle krav til browseren. AJAX is all about Javascript, og med den store fremgang denne “teknik” har fået, er problemet, selvsagt, ikke blevet mindre.

Vi hopper på Javascript-vognen uden at tænke over at der stadig kan komme brugere til, som ikke har mulighed for at afvikle de smarte features man kan opnå med AJAX, og i værste fald ødelægger dette mere, end den vundne feature ville have givet.

Dette er lige nøjagtig hvad man med Hijax vil forsøge at komme til livs! I denne post vil jeg forklare lidt mere grundlæggende, hvad der ligger i Hijax, for snarest at komme med en mere praktisk gennemgang.

Hvorfor er det så vigtigt?

Den aller vigtigste grund er, som beskrevet ovenfor, at der faktisk stadig er brugere der ikke kan afvikle Javascript! Jeps, den er god nok, og selvom det er brugergrupper som vi måske ikke tænker så meget på i det daglige, er de faktisk pænt store og med voksende indflydelse.

Den største gruppe af disse er vel stadig søgemaskinernes søgerobotter! Søgerobotter “taler” ganske simpelt ikke Javascript sproget. Robotterne læser bedst ren (X)HTML, og det er som om de bare springer over, hvor der står noget med <script…>.

En anden stor, og voksende, gruppe er brugere på mobiltelefoner! At designe en webapplikation til mobiltelefoner er et større kapitel, og Javascript er langt fra den eneste ting man skal tage højde for her - Men mobile browsere der understøtter Javascripts er pt., efter min bedste overbevisning, stadig i undertal! iPhonen er (officielt) ikke kommet til Danmark endnu, men når det sker vil jeg tro, at man vil kunne måle et stigning i søgninger/besøg med mobiltelefonerne på de danske sider. Der findes selvfølgelig mobile løsninger derude, men det skal ikke være nødvendigt at installere en 3. parts browser, for at kunne surfe (ordentligt) på nettet vel?

Specielt er du i farvezonen, hvis du bruger Javascript til navigation på din hjemmeside! Tags som onclick, window.localtion.href, bør ikke være nødvendige at kunne afvikle, for at navigere din side. I henhold til mobiltelefonen, bør man huske på, at langt de fleste ikke har den samme måde at navigere på - musen mangler! Jo, nogle har touchscreen, og nogle kan til dels bruge en pen - men mouseover, og ligeledes CSS tagget :hover, bør du ikke regne med virker specielt godt på en mobiltelefon!

Test hvad der virker uden Javascript

Den letteste måde at teste din sides funktionalitet, som den vil være på en mobiltelefon er ganske simpelt, at slå Javascript fra i din browser - noget langt de fleste browser har mulighed for. Den funktionalitet der efterfølgende kan afvikles, vil højst sandsynligt være den samme som du vil kunne bruge på en mobiltelefon.

For at se hvad søgemaskinernes søgerobotter møder og kan, på din side, findes den tekstbaserede browser Lynx. Lynx findes både til Windows, Mac og Linux, og afvikles i en kommandoprompt som vist på billedet herunder.

Man skal lige vende sig til at navigere i “browseren”, men når det er på plads, kan du få et ret godt billede af, hvordan en søgerobot kan “benytte” din side. Besøger du min side, vil du sikkert ligge mærke til at det ikke er muligt at søge via min [Live Search](https://www.simon-jensen.io/live-search-med-prototype-js-og-php.html “Læs posten “Live Search med Prototype JS og PHP””), da denne udelukkende aktiveres via Javascript.

Kernen i Hijax: Graceful degradation

Kernen til at undgå at udelukke en håndfuld besøgende i at kunne bruge dit site ordenligt, skal findes i teknikken Graceful degradation - som også er kernen i Hijax.

Graceful degradation er en meget logisk en simpel tanke - kort fortalt, levere du et alternativ, til de brugere som ikke har mulighed for at afvikle Javascript. Den letteste måde at forklare graceful degradataion på, er gennem et lille eksempel. Du bruger faktisk browserens mulighed for at checke understøttelsen af Javascript. Hvis browseren ikke understøtter Javascript “falder den tilbage” til en standard funktionalitet.

Kodestumpen nedenfor vil udføre Javascript-funktionen popUp(url), som tænkt vil åbne www.simon-jensen.net i et popup-vindue - hvis ellers Javascript er understøttet. Hvis Javascript ikke er understøttet, vil brugeren på normal vis blive videresendt til adressen.

<a href="https://www.simon-jensen.io/" onclick="popUp(https://www.simon-jensen.io); return false;">Simon Jensen</a>

Hijax i en nødeskald

Tankegangen i Hijax er, på samme måde som Gracefull degradation, meget logisk og simpel.

Som Jeremy beskriver Hijax, går dette i praksis ud på, at ud først udvikler en “normal/klassisk” version af din webapplikation. Med normal menes der, en version som ikke udelukker søgemaskinerobotter og andet godtfolk, som ikke kan afvikle Javascript. Herefter kan du “pakke” dine formulare, og evt. andet, ind i Javascript-funktionalitet - Med andre ord " hijacke dine formulare med AJAX".

Denne “overtagelse” skal selvfølgelig gøres efter Gracelfull degradation, således at vi ikke bare ender med en Javascript baseret løsning, men biholder den klassiske version, så alle kan være med.

Hijax i praksis

Jeg har endnu ikke haft leget med Hijax i praksis, men forventer at komme igang med det snarrest … herefter vil der, som skrevet i starten, komme en lille opfølger på teknikken. Nu skulle de vigtigste pointer være slået fast, og jeg er pændt sikker på at jég, for eftertiden, vil tænke mere over, at levere alternativer til Javascript-baseret funktionaliter.