Browsertestning: Ett släktträd
En uppgift driver webproffs att distrahera mer än nästan alla andra: testa om deras design fungerar lika bra i en mängd olika webbläsare och på olika enheter.
Listan över webbläsare och plattformar för att verifiera mot håller på att bli längre, och som designare blir våra tempor proportionellt kortare. IE6 kommer troligtvis att vara i mardrömmar i många år framöver!
Ändå blir vårt arbete i ett allt större antal situationer allt viktigare.
Denna artikel lyfter fram de vanligaste problemen som uppkommer vid testning med "de vanliga misstänkta" och förklarar varför en taktikbyte snart kan behövas. Hela ditt perspektiv på kompatibilitetstestning kan ändras.
The Fantastic Five
Tillbaka under webbläsarkrigarna, var designare tvungna att lida genom konstant bickering mellan Internet Explorer och dess konkurrent (vissa saker förändras aldrig). Vändpunkten kom när nyare webbläsare åtagit sig att stödja webbstandarder, vilket gradvis eroderade Internet Explorer dominans på webbläsarmarknaden.
Tiderna förändras. Den ökande relevansen av mobila surfningsenheter och nya renodlingsmotorer har lett till att en önskan bland designers att minska behovet av att testa på alla enheter som är tänkbara.
Designers tillgriper nu att spela ett nummer spel, vanligtvis genom att testa sitt arbete i de fem eller sex vanligaste webbläsarna, och hävdar sedan täckningen av resten. Medan detta verkar som en enkel åtgärd, presenterar den några problem, för i motsats till i tryck passar en storlek verkligen inte alls.
Även om marknaden domineras av fem webbläsare, bör designers inte bortse från den orange "Other" -skivan. Besökare på andra webbläsare behöver fortfarande vara inrymda.
Nyckeln till att presentera webbplatsens fina design på ett korrekt sätt för slutanvändaren är återgivningsmotorn. Man kan anta att om du testade en webbplats i den populäraste webbläsaren för varje Trident, Gecko, Commit och Presto-rendering, kan du säkert ignorera andra enheter som delar samma motorer eftersom du skulle ha täckt de allra flesta användare .
Jag håller med om att testning i dessa webbläsare ensamt skulle få några problem som är synliga för användaren, men testning i ett bredare utbud av webbläsare, enheter och system har sina fördelar. Det är värt att undersöka potentiella problem och besluta om ytterligare testning krävs för att ge besökarna den bästa möjliga upplevelsen.
Trident (Internet Explorer), Gecko (Firefox), Webkit (Chrome och Safari) och Presto (Opera).
Utöver brytpunkten
En uppenbar fråga för närvarande är enhets (eller plugin-in) beroende, vilket påverkar webbläsare inte bara på webbläsernivå men på reningsnivå. Apple trogen är säkert medveten om iPhone- och iPad-problemen med Flash-och eftersom Adobe och Apple började boo'ing varandra, hör vi fortfarande om det.
Medan Flash verkligen hanterar den generella avbildningen av innehåll allt i sig, skulle testning endast i de mest populära webbläsarna inte nödvändigtvis visa problem med det. Medan vanliga teknologier (både öppna och stängda) riskerar att uteslutas, kan det vara kritiskt att expandera din testbas.
Flash görs utanför webbläsaren, men inte alla webbläsare kan utnyttja tekniken.
Ett annat problem är versionerna av reningsmotorer. Medan den senaste och största webbläsaren är nyckeln till att dra nytta av ny teknik, kräver den fortsatta användningen av äldre versioner (särskilt de olika djävulen-inkarnata versionerna av Internet Explorer) att vi begränsar oss inte bara till de senaste byggnaderna av en renderer utan även till de som fortfarande kan fungera i miljöer där uppgradering av programvara skulle vara antingen olämpligt eller omöjligt.
Även i kompatibilitetsläget tar inte testning i nuvarande webbläsare hänsyn till gamla versioner av webbläsare som använder tidigare versioner av återgivningsmotorerna.
Internet Explorer 6.0 använder en äldre och buggier-version av Trident-skrivbordsbläsarens återgivningsmotor.
Reningsproblem kan också inträffa om det finns skillnader mellan enheten och plattformen som används. Det är självklart att testa din webbplats på en rad mobila telefoner och pocket surfare kan köra dig till randen av galenskap, speciellt med tanke på hur olika saker kan visas.
Att utforma för en sådan liten skärm kan vara en ganska uppgift, särskilt för att konventioner för mobila enheter fortfarande är i sin barndom. Men det här problemet gäller även skrivbordsplattformar. Det är inte ovanligt att se mindre reningsproblem uppväxlas mellan Windows och Mac-versioner av Firefox, till exempel - en oroande tanke faktiskt.
En lista Apart bryr sig så mycket om att göra skillnader som den har en separat design för mobila enheter.
En annan viktig komponent som kan skilja sig från webbläsare till webbläsare är JavaScript-motorn. I de tidiga dagarna var den enda frågan om JavaScript om man skulle använda den.
Idag har webbläsare med samma visuella återgivningsmotor ofta olika JavaScript-motorer (Chrome och Safari är ett perfekt exempel). Använda flera webbläsare för att jämföra din webbplats förmåga att göra de här vackra jQuery-skripten är lika viktigt, speciellt om din design har mycket funktionell interaktivitet.
Chrome Experiments visar prestanda för Googles webbläsare.
Och äntligen, ett ämne som får några människor att heja och andra stöta: tillgänglighet! I många människors ögon är tillgänglighet och hur en webbläsare gör en webbplats inte relaterad. Men det är värt att notera att när folk besöker din webbplats kan deras tillgänglighetsprogramvara tvinga dem att använda en viss webbläsare, en som stöder datorns skärmläsare eller deras tillgänglighetsenhet.
I sådana fall kan minoritetswebbläsare förbises helt. Kom ihåg att din design också ska fungera för dessa människor vars behov ofta glömmas bort.
Opera kan ha en liten marknadsandel, men dess röstalternativ kan vara en livräddare för dem med speciella behov.
Långtidsburen
Med tanke på alla tillgänglighetsbehov, olika JavaScript-motorer, problem med plattformen, visningsskillnader, teknikberoende som Flash och mobilrevolutionen, kan man ursäkta sig för att motstå hur mycket testning som behövs. Titta fortfarande på din målgrupps behov för att se huruvida utvidgningen av ditt nuvarande testningsflöde skulle ge långsiktiga resultat.
Ta dig tid att kommunicera med dina besökare. Kanske kan du köra en undersökning som frågar vilka webbläsare och enheter de är på och undersök sedan din statistik för att se om de har nämnt sätt du kan förbättra eller utöka interaktionen på din webbplats.
Det kan hända att du behöver en mobil design, eller kanske det är entusiasm för en iPhone-app, eller du kan helt enkelt få fler felrapporter för minoritetsbläsare. Uppmuntra återkoppling är avgörande i den evolutionära processen med design.
Statistikpaket kan ge en klar uppfattning om vilka enheter som har använts för att besöka din webbplats.
Att nå kunder i allt större omfattning är något som varje webbplatsägare bör överväga i samband med användbarhet. God kommunikation skapar en känslomässig koppling med besökare; De känner att deras intresse är validerad och deras tid spenderas, och det kan göra klick till kunder.
Att stanna på toppen av sakerna i teststeget går då bortom att fixa visuella brister. Ett större testfält kan leda till nya funktioner och unika sätt att navigera på webbplatsen. En belöning kan vara ett djupare band med din webbplats regelbundna besökare och fans.
Starta dina motorer
Hur du skulle utöka testprocessen ligger utanför ramen för den här artikeln, men det enklaste sättet att förbättra din webbplatss utseende och användarupplevelsen är att se till att allt ser ut som presenterat på skärmen.
Nedan finns en lista över ett brett utbud av webbläsare, både mobila och stationära, vilket kan hjälpa dig att bredda din horisont när du testar. Medan vissa kommer att göra din design densamma, bör dessa webbläsare hjälpa dig att fastställa omfattningen av de tester du behöver utföra.
Fler webbläsare kommer säkert att skapas (och vissa kan redan existera), så överväga framtiden också.
Både stationära och mobila plattformar har ett brett utbud av återgivningsmotorer.
Medan webbläsare byggda med Trident, Gecko, Webkit och Presto ingår (tillsammans med deras äldre varianter Tasman, Mozilla och KHTML) har andra återgivningsmotorer med en användarbas inte inkluderats här på grund av det mycket begränsade utbudet av enheter som stöder dem.
Enheter och webbläsare med unika återgivningsmotorer (text, bild och mobil) som inte nämns här kan testas individuellt och kan potentiellt öka kompatibiliteten hos din design.
Jag rekommenderar de webbläsare som anges nedan för varje plattform. Med undantag för Mac, som använder Tasman, använder alla dessa Trident-återgivningsmotorn:
Alla dessa användningsområden för Gecko (tidigare Mozilla) desktop rendering engine:
Alla dessa använder Webkit-återgivningsmotorn (eller KHTML-gaffeln i Konquerors fall):
Eftersom Presto är en proprietär plattform är det ingen överraskning att det är begränsat till operaprojekt:
Över regnbågen
Kanske är din webbplats helt fri från fel. Kanske ser det bra ut i alla situationer. Men om du överväger den omfattande omfattningen av kraven på kompatibilitet över plattformar, gör inte längre de stora fem en noggrann bild av webbanvändarna som helhet.
Om du bara tar bort en sak från den här artikeln förstår du värdet av att spendera mer tid på att analysera dina besökares behov, eftersom det hjälper dig att omvärdera testfasen för att omfatta ett större antal scenarier.
Tillbringa extra tid på att gå över webbläsare för varje återgivningsmotor, och glöm inte om följande: Andra operativsystem, som kan ha skillnader; andra typer av enheter (t.ex. mobiler), vilket kan göra mycket annorlunda unika JavaScript renderers, som har konsekvenser för hastighet; äldre versioner av webbläsare; och i allmänhet det bredare räckvidd som behövs som kod utvecklas och ändrar själva webben.
Sammanfattning
I en värld där människor är villiga att investera tid, ansträngningar och pengar för att göra sina webbplatser så vänliga som möjligt genom att catering till sökmotorer och sociala medier, vilket gör att din design fungerar (i stället för att fokusera på pixel perfektion - kom ihåg, är webben inte skriva ut) kan vara mer värdefullt för de hundratals eller tusentals människor som får tillgång till din webbplats på olika sätt.
Det kan verkligen betyda skillnaden mellan att locka kunder och ha frustrerade "Hej och farväl" besökare.
Skriven uteslutande för WDD av Alexander Dawson
Hur går du på att testa dina noggrant utformade mönster så att de fungerar flexibelt? Planerar du att optimera ditt testflöde så att det är mindre restriktivt? Kan din webbplats uppmuntra till mer besökarnas feedback på dess design?