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.
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.
Taggar: CSS, HTML, JavaScript, Progressive Enhancement, Recension, tillgänglighet