Ida Franceen

Programming the Mobile Web

Detta är bok-recension av en bok om att göra mobila webbsidor. Bara mobiler. Inga laptops eller stora skärmar. Nu håller jag egentligen med de människor som säger att ”det finns ingen mobil webb det finns bara webb”. Så… ja, vi diskuterar mer om det sen. Boken är skriver av en man med det fantastiska namnet Maximiliano Firtman. För mig var han faktiskt helt okänd men efter lite efterforskningar så visade det sig att han faktiskt skrivit två andra böcker: ”jQuery Mobile: Up and Running” och ”Mobile HTML5″. Den här boken är utgiven 2010 av O’Reilly som skrivet en rad böcker om programmering. Bland annat ”Head First”-böckerna och ”JavaScript: The Definitive Guide” som jag faktiskt läser just nu och kanske kommer recensera senare om andan faller på.

Jag läste den här boken av två anledningar. Jag kände att jag behövde lite bättre koll på hur webb fungerar på andra mobiler än dagens Android och iPhone. Den andra anledningen var helt enkelt att boken fanns tillgänglig på kontoret. Ka-tsching. Jag hade faktiskt fått en liten snabbrecension av två medarbetare innan jag började läsa så mina förväntningar var på lagom nivå. Jag förväntade mig en bok om ett helt hav mobiler och alla deras egenheter och det var precis vad jag fick. Det var även det jag tyckte var intressant. En bok full av tabeller med information om vilka features som är kompatibla med vilka telefoner.

Att summera den här boken känns lite halvsvårt. Lite som att summera en telefonbok. Inte för att den är tjock utanför att den är så fakta-späckad. Men jag ska göra ett försök. Boken består av 14 kapitel. Det första kapitlet heter ”The Mobile Jungle” och behandlar myter om mobil webb, vad som räknas som mobil egentligen och de vanligaste mobilmodellerna, märkena och plattformarna. De följande kapitlena går sedan igenom browsing, vilka webbläsare som finns och deras kapacitet, hur man bör lägga upp arkitekturen och sin egen utvecklingsmiljö. Sedan följer ett par kapitel om markup, CSS, JavaScript och något halvluddigt om ”nya” tekniker såsom HTML5, Ajax och RIA. Det skrivs en hel del om hur man ska sniffa runt och känna av vilka mobiler man har att göra med så kallad ”server side detection” och WURFL rekommenderas för ändamålet. Ett kort kapitel om debuggning och testning som i stort sett kan sammanfattas som att det är svårt och superklurigt. Här skulle jag vilja komplettera med ett tips om utmärkta weinre som boken inte tar upp. (kanske för att den skrev innnan weinre uppfanns…?)

En sak jag skulle vilja ta gå in lite djupare på är författarens syn på ”One Web”. Det jag nämnde i inledningen här. ”One Web” konceptet handlar om att vi ska kunna skapa en gång och att det vi skapat sedan ska fungera och vara tillgängligt på alla enheter överallt. Maximiliano menar att detta inte kommer att vara möjligt på flera år. Jag håller inte med. Jag tycker att det alltid har varit möjligt i en viss utsträckning. Ja, man behöver testa och anpassa och tweaka. Men man ska inte alltid behöva göra flera versioner av samma innehåll. Jag gillar inte heller författarens syn på ”device-detection” utan jag tror på ”feature-detection”, det vills säga att istället för att kolla vilken enhet det är så kollar vi vad enheten är kapabel till. Jag vet att vissa tycker att detta är en utopi och något orealistiskt men det är något som vi måste sträva efter. Speciellt om vi vill bygga framtidssäkra webb-sidor som går att underhålla och inte växer till monster på enbart något år. Jag tycker att ”progressive enhancement” som jag tagit upp tidigare är vägen att gå.

Det jag verkligen gillade med boken (eller kanske snarare med författaren) var att det verkligen är nernördat. En hel mängd egenheter och klurigheter hos olika enheter tas upp. Det finns fina små rutor med fällor att undvika. Det hela känns lite som en bok-version av quirksmode om mobil webb. Det jag starkt ogillade och som jag redan tagit upp är författarens benägenhet att hela tiden bygga efter specifika modeller och märken. UA-sniffning är inte något fint men argument för och emot diskuteras tyvärr inte.

Boken är trots brister väldigt läsvärd och viktig. Framförallt tycker jag att det är viktigt för oss som jobbar med utveckling att inte glömma bort resten av mobil-världen. Det är viktigt att förstå att världen inte består av iPhones med snabba internetuppkopplingar och moderna webbläsare. Jag tycker att man ska läsa denna bok som trots sina tabeller och uppslagsbok-känsla faktiskt påminner oss om detta.

Bokrecension: Designing with Progressive Enhancement

Omslag till designing with progressive enhancement
Hej alla människor som läser detta. Hoppas ni är många. Jag låtsas att ni är det. (Det känns liksom inte lika roligt att skriva ett blogginlägg om man låtsas att bara en eller kanske två kommer att läsa det.) Hur som helst, detta är mitt första blogginlägg på Creuna-bloggen och jag tänker börja med att recensera en bok jag läst under sommaren.

Boken heter “Designing with Progressive Enhancement Building the Web that Works for Everyone”. Den är skriven av Todd Parker, Patty Toland, Scott Jehl och Maggie Costello Wachs. Vilka är de då? Jo, de kommer alla från ett designföretag i Boston som heter Filament Group. Om du undrar hur de låter så kan du lyssna på dem på jQuerys Podcast. Om du vill veta hur de ser ut, ja då får du googla. (Det gjorde jag). Scott Jehl har även en egen webbsida. De verkar alla vara engagerade människor som pysslar med kända saker som jQuery UI och A List Apart.

Nog om dem. Tillbaka till deras bok. Titeln översatt till svenska blir “Designa med progressiv förbättring. Bygg en webb som fungerar för alla”. Det hela handlar kort sammanfattat om att försöka leverera funktionalitet som är så bra som möjligt men som även passar så många som möjligt. Motsatsen till progressiv enhancement tycker jag själv bäst sammanfattas av bilden nedan.

You need more pixels to view this page

Boken börjar med att förklara vad den progressiva förbättringen innebär och den använder drygt 140 sidor för att göra detta. Det är med andra ord ganska genomgående och man får även lära sig (om det nu skulle vara så att man inte visste det) att man till exempel ska undvika inline JavaScript och att det finns andra element än divar och spans som man kan använda sig av när man skriver sin HTML. Tyvärr verkar boken (eller författarna) lida av det jag kallar för USA-boks-syndromet vilket innebär onödigt långa beskrivningar på grund av att folk där blir betalda per sida de skrivit istället för betalning baserat på kvaliteten på innehållet. (Detta behöver inte vara sant just här. Det kan ju också ha något att göra med att det är fyra personer som skriver och alla tyckte att mer text är roligare. )

Förutom de goda och allmänna tipsen angående frontend så blir man invigd i något som översatt kallas för röntgen-metodiken. Den går ut på att när det ramlar ner en tok-avancerad design uppbyggd av enhörningar som dansar bugg i 3D så ska man ta detta och syna det med röntgen-blick. Genom detta kommer man fram till de grundläggande HTML–element som bör användas för att man även om man sitter på en gammal burk med Nutscrape ska kunna uppleva något slags innehåll. I fallet med de buggande enhörningarna så antar jag att vi pratar om någon slags bild med tillhörande målande text. Man ska sedan med hjälpt av JavaScript utföra lite tester för att se om stöd finns hos användaren för mer avancerade prylar. Om svaret är ja så slår man på stora trumman och de galna enhörningarna hjular in. Ungefär.
Efter den genomgående inledningen kommer man in på del två som är riktiga exempel. Här dyker välkända saker som utfällningar och tabb-navigering upp och man har även ett genomgående exempel på hur man gör om en tabell till ett linjediagram med hjälp av canvas. Man är noga med tillgängligheten och lägger in aria-attribut. Man ser också till att de går att styra de olika elementen med hjälp av piltangenterna. Alla exempel finns att ladda ner och beskåda på Filaments webbplats.

Det jag saknar lite i boken är det inte finns några slags prestanda-tester. Hur mycket kräver dessa skript? Att man dessutom ska testa för varje ny besökare om stöd finns för avancerad CSS och JS kan ibland kännas som något som kanske kan vara svårt att tillämpa på ett webbprojekt med liten budget och snåla tidsramar. Jag undrar också lite angående statistik för vilka webbläsare som inte stödjer till exempel button-elementet. Ett element som jag själv använt i hela mitt liv men som boken rekommenderar att man ska ersätta med ett input-element tills man testat av stöd. Jag upptäckte även att det fanns lite buggar i deras egna exempel. Bland annat ett exempel för att generera och ta bort etiketter som fungerade lite sådär.

Sammanfattningsvis så tycker jag att detta är en väldigt välskriven bok som på grund av den genomgående inledningen säkert även kan passa någon som känner sig lite vilse i frontend-djungeln. Man bör även notera att ordet design ingår i titeln vilket jag av erfarenhet har förstått betyder att författaren utgår från att du inte kan så mycket mer än Photoshop (Vilket naturligtvis är bättre än ingenting alls). Boken har absolut fått mig att tänka till lite extra när jag bygger in funktionalitet på webbsidor. Jag har blivit mer kritisk, på ett bra sätt tror jag, och börjat fundera lite mer runt tillgänglighet och vad som går att göra på webben.

Tack (hint!) för att ni läst min recension.