Jag förstår webbdesigners frustration över de olika webbläsarna och hur de renderar text och bild olika. Internet Explorer har aldrig riktigt varit favoriten hos designers och det finns mycket att läsa om det på olika diskussionssidor. Trots det så har de flesta användare just Internet Explorer, är det mest för att “det kommer med i paketet” eller ingen har lust—ork eller vet om andra webbläsare… svaren ligger nog i båda.
Personlig touch
Eftersom jag själv sitter just med design av webbsida med försök att få en sida som är både lättläst, trevlig, och praktisk med en “personlig touch” går det timmar och åter timmar. Typsnitt är en av de viktigaste pusselbitarna och man blir ganska frustrerad när det inte fungerar över alla webbläsare. Jag spenderade nyligen massor av tid att hitta en efterträdare till de bild–anfanger vi använt tidigare. När jag väl fick till en “trevlig” uppsättning i Apples Safari läsare (som jag använder förutom Firefox) så blev det heltokigt i Internet Explorer och FireFox, hur mycket jag än försökte lyckades det inte bli bra i alla läsare… till slut var man tvungen att ge upp.
Typsnitt i olika webbläsare
Det finns ett antal typsnitt som är “standard — rekommenderade” för alla webbläsare men man vill försöka komma utanför den ramen med andra typsnitt och ny teknik för att få just en liten mer personlig prägel. Tekniken är inte fullt framme än men det brukar fungerar i det flesta webbläsare. Brödtexten jag använder idag (Myriad Pro) ser riktigt bra ut (hos mig) och fungerar även i små storlekar där den är lättläst. Men här spökar det med Internet Explorer, texten blir “fet” och tappar lite den känslan man vill få jämfört med övriga läsare. Ett annat problem är även alla olika upplösningar som finns idag på användarnas bildskärmar. Vissa upplösningar renderar text sämre än andra och det finns de personer som bara köper en bildskärm där upplösningen kontra skärmstorlek renderar text på bästa sätt. Nu kan man inte göra något åt användarnas skärmupplösning, det finns visserligen teknik som kan läsa av skärmupplösning men det blir väldigt avancerat om man ska ta hänsyn till det när webbsidan ska visas och framförallt prestanda kan bli lidande. Det jag kan förespråka är att testa gärna Safari eller Firefox som rekommenderas av många och är den näst största efter Internet Explorer. Du kan få mer information om webbläsare på denna sidan från Wikipedia jämförelse mellan webbläsare
Webbläsare och färghantering
Om man för muspekaren över bilden byts bildens inbäddade profil. Båda filer har en profil inbäddad ProPhotoRGB i den ena och sRGB i den andra, det innebär att om du har en webbläsare som har färghantering aktiverad så ska båda bilder vara i stort sett identiska. Det kan variera något om du har en har en bildskärm med större färgrymd än sRGB, man ser det bäst i de färgmättade röd–grön–blå. Skiftar färgerna i toner och ljushet då finns ingen färghantering aktiverad. Använder du en webbläsare som Safari eller Firefox senaste version så är färghantering aktiverad. Det webbläsaren gör är att hämta informationen från bildfilen och “mappar” den till bildskärmen och dess profil. Som sagt här har vi det igen… den viktiga biten när du arbetar med bild… kalibrera din bildskärm. Orsaken till att många webbläsare inte har färghantering är att det försämrar prestanda. Alla vill ha den “snabbaste webbläsaren” och då åker färghanteringen på stryk, förutom det så har många användare en felaktig profil kopplat till sin bildskärm och det kan göra det än värre. Men vi som arbetar med bild vill ha den möjligheten där det nu är än viktigare eftersom fler och fler bildskärmar börjar närma sig den större färgrymden Adobe RGB98. Angående färghantering finns det ett fåtal webbläsare som fixar det… exempelvis Safari och Firefox, Internet Explorer version 9 när den kommer ut kanske gör dem sällskap.
Bilder utan inbäddad profil och färger skapade via Html och CSS
Hur tacklar din webbläsare det problemet?
Standard
Alla grafiska objekt som inte har inbäddad profil ska antas vara sRGB i webbläsaren enligt “The World Wide Web Konsortium” (W3C). Respekterar din webbläsare det ska du inte kunna se en avgränsande kant mellan den övre och den undre bilden, med andra ord färgerna kommer att vara lika.
Färghantering en standard på internet inom snar framtid?
En webbläsare som inte har färghantering ignorerar den inbäddade profilen och felaktigt applicerar sRGB till alla bilderna oavsett om bilden innehåller profil A eller B etc som i exemplet med första bilden. Nu är det så att webbsidor innehåller inte bara bilder utan det finns text, bakgrunder som också borde ha en mer förutsägande färghantering. Nu kanske man inte ska inbädda 3kb profiler i bakgrunder eller filer som kanske inte är mer än 1kb stora, därför har W3C konsortium som reglerar Webb standards bestämt att alla grafiska objekt som inte har en inbäddad profil ska antas som sRGB. Med andra ord ska webbläsare rendera — mappa alla grafiska objekt till sRGB om de inte har en inbäddad profil. Tyvärr gör inte alla webbläsare det, exempelvis Safari mappar alla grafiska objekt som inte har inbäddad profil till skärmens profil istället. Har man då en bildskärm med stor färgrymd kan man få sig en stor överraskning när man är ute på internetsidor där färger kan få en väldigt hög färgmättnad än vad man varit van med tidigare. Safari tar hänsyn till inbäddade profiler men det kan ”skita” sig när det gäller bilder som är “untagged”. Därför är det viktigt att bilden först är i sRGB om man nu ska ”skala bort” profilen innan publicering, det för att minska eventuella överraskningar för internetbesökaren.
Finns det någon lösning på problemen idag?… Det gör det och den heter Firefox, men inte som standard utan man måste gå in och ändra i konfigurationsfilen för att aktivera full färghantering. Det kommer vi berätta om mer i kommande inlägg :)
Hur stor är din bildskärms färgrymd?
Ju större skillnad man kan se mellan den övre och undre i båda exemplen, desto större färgrymd klarar bildskärmen av att visa mot sRGB färgrymd. Ser man ingen skillnad då klarar inte bildskärmen av att visa en större färgrymd än sRGB. Det här gäller de webbläsare som har färghantering och med fördel har en kalibrerad skärm. Prova med att använda Firefox och jämför med Internet Explorer eller annan webbläsare som inte stödjer färghantering så kommer ni se en stor skillnad på de testbilder som finns på denna sida.
