Webbtypografi 4

Regeringen

Riksdagen

Torget

Passagen

CNN-Passagen

Aftonbladet

Expressen

Allt om Stockholm

Amfora vinhus

IDG

Uppsala kommun

Nacka kommun

Slutkommentar

Bra & dåligt

Passagen

Uppsala kommun

IDG

Expressen

Aftonbladet

Torget

Riksdagen

•Regeringen

•Allt om Stockholm

•CNN-Passagen

•Nacka kommun

•Amfora Vinhus


 

Artiklar

Baskerville

Caslon

Cloister Old Style

Formatmallar CSS

Frakturen

Garamond

Jenson MM

Minion MM

MultipleMaster

Myriad MM

Pekpinnar 1

Pekpinnar 2

Poynter

RailwayType & Agenda

Tidningstypsnitt

Webbfonter

Webbtypografi

1 2 3 4

Storleksproblem

Typtrivsel

God typografi i Word (pdf)

Bildskärms-
typografi 1995




 

Ett dussin webbar i praktiken

I denna praktiska tillämpning av det som diskuterats i tidigare artiklar om webbtypografi ska vi se hur man mer eller mindre framgångsrikt försökt lösa problemen med läsbarhet och anpassning mellan Mac och PC (Bedömningarna avser webbplatsernas utformning våren 1999).

Om några kan man säga att man både tänkt och gjort rätt, om några att man inte tänkt alls, men för flertalet webbtjänster på nätet kan man nog tillämpa Tegnér-parafrasen "allt vad rätt du tänkt, och ändå blev det så fel".

Detta är inte någon allmän typografisk utvärdering av Sveriges webbtjänster och den syftar absolut inte till att utnämna bästa webbplats i detta avseende. Tvärtom har jag bara valt ett dussin webbplatser som är mycket bra ur innehållssynpunkt och intressanta att diskutera ur typografisk synpunkt.

I undersökningen bortser jag från grafisk formgivning och struktur. I fokus står brödtexten med avseende på läsbarhet och tillgänglighet, rubriker och knappar avseende variation och överblick, samt hur man lyckas med anpassningen av typografin till Mac och PC.

Regeringen (www.regeringen.se)

Regeringen Verdana

Regeringens webbplats är primärt utvecklad för PC och ganska dåligt anpassad till Mac. I PC-miljö är det en mycket lyckad webbplats, med enkel, snygg och överskådlig typografi i Verdana 10 i texterna. Man arbetar med en lagom bred, gultonad satsyta som ger bra avgränsning och bra läsbarhet.

Avdelningsknappar använder gif-texter med en helt annan typ av linjär än Verdana. Att göra sådan stilblandning hör till något av det mest förbjudna inom traditonell typografi. Ska man ha en annan linjär så ska den antingen ansluta nära så att man inte noterar skillnaden, eller kontrastera rejält så att man ser just skillnaden. På regeringens webbplats ser stilblandningen bara orolig och konstig ut.

Men å andra sidan kanske en sådan stilblandning ändå fungerar, för att skapa profil och särskillnad på webbplatserna. I annat fall riskerar det att bli Verdana, Geneva och Arial i allting överallt. Så även fast det är fel så tycker jag nog att det fungerar med profilerande gif-knappar på regeringens sida.

Med Verdana installerad blir typografin nästan lika bra i Mac. Den mindre teckenstorleken gör typografin mer sluten och satsytan blir lite för bred, vilket gör den mindre lättläst. I Mac-miljö tenderar värdet av den avgränsande gultoningen att försvinna.

Regeringen Helvetica

Utan Verdana tas den undermåliga Helvetica i tjänst och regeringens webbplats blir mycket rörig och svårläst med alltför liten teckenstorlek. Istället för font-taggen "Verdana, Arial, Helvetica", borde man ha "Verdana, Geneva, Arial, Helvetica" för att få bättre utseende och läsbarhet i Mac-miljö.

Riksdagen (www.riksdagen.se)

Riksdagen pc

Riksdagen har en mycket informationstät webbtjänst, som innehållsligt tangerar en dagstidning eller annan nyhetstjänst. Typografiskt finns också vissa likheter, med en trespaltig förstasida med varierad typografi för att skapa orientering och variation. I ytterspalterna används Verdana 7 pt i texter med Arial i röda rubriker, och nyhetsspalten i mitten används uteslutande Arial 10 pt. Det hela fungerar utmärkt i PC-miljö, men en överskådlig och lättorienterad typografi.

Avdelningsrubrikerna är gif-texter i fet Gill Sans i en klarblå färg som i övrigt inte förekommer någonstans på förstasidan. Typsnittet hör till riksdagens grafiska profil och kan väl för all del fylla en funktion som profilering även här, men det ser konstigt ut och bryter den funktionella typografin på förstasidan. Gif-knapparna borde nog ses över för att skapa enhetlighet, åtminstone göras mindre och färgas harmoniskt med andra element.

På insidorna används Verdana 10 i uppställningar och kortare texter, medan Times i 12 pt tjänar som brödtext. Detta är ett mycket bra grepp, som gör sidorna överskådliga och lättlästa.

Med Verdana installerad på Mac fungerar riksdagens webbplats ganska bra. Nyhetsspalten och andra delar där man har Arial som förstaval blir kompakta och svårlästa, eftersom man har font-taggen "Arial, Helvetica" här. Taggen borde vara "Arial, Geneva" om man vill ha läsbarhet och utseende på Mac som liknar typografin på PC. Verdana-sidor fungerar dock bra, även om texten blir mindre på Mac.

Riksdagen Verdana

Utan Verdana blir det Helvetica som tar över och förstasidans ytterspalter blir ordentlig gnetiga och svårlästa. Andra Verdana-sidor blir kompakta och röriga. Med font-taggen "Verdana, Geneva, Arial, Sans-serif" skulle mycket av den ursprungliga typografin kunna räddas.

Riksdagen Helvetica

Textsidor med Times 12 pt fungerar dock bättre, men egentligen är även detta för liten grad på Mac. Den öppenhet och läsbarhet som finns på PC försvinner och de långa texterna blir rätt svårforcerade. Men själva greppet med Times i långa texter är utmärkt tänkt.

Torget (www.torget.se)

Torget Verdana

Torget har en enkel och öppen typografi, baserad på Verdana i grader motsvarande 8 pt på PC och 11 pt på Mac. Genom att stilmallar används blir utseendet detsamma i Mac och PC, och faktiskt är texten lite större på Mac i Aktuellt-spalten.

Det enformiga bruket av liten Verdana i alla sammanhang ger dock för lite variation och underlättar inte orientering.

Utan Verdana installerad på Mac anlitas Helvetica, och det drar ned typografin. Texten blir rörig och svårläst och öppenheten försvinner. Eftersom man har stilmallar fungerar det ändå hyfsat.

Torget Helvetica

Med Helvetica fungerar Aktuellt-spalten fortfarande bra på grund av den större grad som används. Även avdelningsknapparna fungerar bra.

På avdelningssidorna gör bruket av Helvetica 11 texten lite mörkare, mer kompakt och svårläst, men sidorna behåller sin typografiska karaktär. Mycket bra och föredömligt bruk av stilmallar.

Torget Helvetica

Man borde dock ha satt Geneva som alternativ till Verdana för att få läsbar text på Mac.

Passagen (www.passagen.se)

Passagen pc

Passagen är utvecklad för både mac och PC med hjälp av stilmallar. Typografin är helt baserad på Verdana i liten grad, motsvarande 7 pt på PC och 9 pt på Mac. Detta är egentligen för liten teckenstorlek men fungerar i de korta texter som portalen har.

Passagen är i båda miljöerna överskådlig och lättorienterad, med bra variation mellan olika stilar, som skapar tydlig åtskillnad i spalterna.

På ett utmärkt sätt har förstasidan variation och meningsfulla typografiska markering med rubriker i olika grader, lättläst brödtext i korta stycken och plattor och färger som avskiljare mellan olika funktioner.

Med Verdana installerad är webbplatsen helt identisk i Mac och PC. Typografiskt sett är den föredömlig.

Passagen Verdana

På Passagen har man tänkt rätt: Utan Verdana installerad blir det Geneva som tas i bruk. Sidan är disponerad exakt lika i båda miljöerna, och med Geneva känns den väldigt hemtam och mac-mässig. Om man nu bortser från att all text på webben är för liten i Mac-miljö, är Passagen imponerande ur typografisk synpunkt. Men - texten är i detta fall lika liten i PC-miljö.

Passagen Geneva

CNN-Passagen (cnn.passagen.se)

CNN pc

CNN-passagen har en enkel och funktionell typografi som fungerar utmärkt för denna typ av nyhetstjänst. Men den är dessvärre inte Mac-anpassad så som man skulle önska.

CNN-Passagen använder Verdana i rubriker och brödtext, utom i löpsedeln där Arial får råda och i avdelningsrubriker och länkar längre ned på sidan. I PC-miljö är den typografiskt sett bra och fungerande. Förstasidan är öppen och överskådlig och Verdana 10 garanterar läsbarheten i brödtexten. Sidan är varierad typografiskt så att man tyldigt ser vad som är huvudnyhet, länkar till andra nyheter och länkar till andra avdelningar. De utspärrade avdelningsrubrikerna längre ned på sidan verkar vara ett misstag i arbetet.

CNN Verdana

I artiklarna används också Verdana 10 med en lagom bred satsyta, uppdelad i underrubriker i lagom långa textstycken. Här hittar vi förstås mellanslag i stället för indrag och svävande rubriker, men det stör inte läsningen. Av någon outgrundlig anledning har man Arial 18 pt i huvudrubriker och Helvetica 13 pt i mellanrubriker. Sådant missriktat finlir verkar löjligt när man ser hur typografin rasar i Mac-miljö.

I Mac-miljö byter CNN-passagen skepnad, eftersom man arbetar med font-taggarna "Helvetica, Arial" och "Verdana, Helvetica, Arial". Med Verdana installerad fungerar den bra, den är praktiskt taget identisk i båda miljöerna, men blir mer kompakt. I notis-spalten och avdelsninglänkar ersätts Arial med Helvetica vilket gör den mindre tillgänglig och mindre läsbar.

CNN Helvetica

Utan Verdana kopplas Helvetica in överallt och därmed ändras hela kompositionen. Texten på förstasidan och artikelsidorna blir kompakt, rörig och svårläst. Här borde man ha angivit Geneva som alternativ till Verdana och Arial för att återskapa den funktionella typografin på Mac.

Aftonbladet (www.aftonbladet.se)

Aftonbladet

Aftonbladet är uppenbarligen utvecklad för Mac och mycket bra anpassad till PC. Här används en mycket enkel typografi, som effektivt återskapar kvällstidningens atmosfär i webbmiljö. För rubriker används fet Helvetica i olika grader, medan Times används för telegramrubriker och texter, liksom för artiklarnas ingresser och brödtext.

Aftonbladet Nyheter

Detta ger en tät och rätt mörk typografi, som vore omöjlig någon annanstans än just här. Det är inte vackert men det är tidningsmässigt och det fungerar i alla avseenden. För detta svarar till stor del att Times 12 pt används i artiklarna. Där är font-taggen ospecificerad, vilket ger detta typsnitt om man inte ändrat inställningarna i webbläsaren. Genom en ospecificerad font-tagg tar Aftonbladet risken att deras webbsidor kan ha ett mycket annorlunda utseende på vissa datorer, så det vore kanske lämpligt att specificera även brödtypsnittet.

På PC försvinner lite av den täta tidningskänslan, eftersom texten blir större och luftigare. Här ersätts Helvetica av Arial, och brödtextens Times New Roman blir öppnare och mer lättläst än i PC. Telegramspalten blir ljusare och mer överskådlig. Läsbarheten är bättre i PC, men tidningskänslan finns kvar.

Den täta och lite röriga typografin innebär dock att överskådlighet och orientering i materialet inte är så bra som på vissa andra webbplatser.

Det bestående intrycket är en fungerande tidningstypografi, där man riktig känner trycksvärtan på musknappen.

Expressen (www.expressen.se)

Expressen Verdana

Expressen är i typografiskt avseende Aftonbladets raka motsats, med en mycket öppen, överskådlig och lättillgänglig typografi, helt byggd på Verdana.

Typografin är enkel, och lite distanserad till sin karaktär, som ger en lugn överblick och mycket god orientering i materialet.

På webben känns Expressen sval och intressant, inte påträngande och het, och den har inget som helst med kvällstidningar att göra typografiskt. Den representerar ren webbtypografi för en nyhetstjänst.

Rubriker varierar i grad och vikt, vilket ger variation och orientering.

I telegramtexter och artiklar används Verdana size 1 (7,5 pt eller 10 pixlar), i brödtext och ingresser, medan fet Verdana size 4 eller 5 används i rubriker.

Om man ska hitta någon svaghet så kan man tycka att artikeltexterna är lite svårlästa. Rubriken är fet Verdana 18 pt size 5, med taggen <"Verdana, Geneva, Sans-serif" SIZE =5>. Ingressen är fet Verdana och brödtexten mager Verdana size 1. Personligen föredrar jag i brödtexten Aftonbladets Times 12 som är mer lättläst. Bruket av Verdana i artiklarna ger en sval och distanserad känsla, som fungerar utmärkt i och för sig, men den har inte den puls som Aftonbladet har.

Som helhet är i mitt tycke Expressens typografi dock att föredra, eftersom den genom sin neutrala och svala typografi fokuserar på nyhetsinnehållet och ger en förnämlig överblick.

Utseendet är identiskt i Mac, med den skillnaden at PC-versionen är något öppnare och ljusare.

Med Verdana har Expressen även i mac-miljö en imponerande enkel, överskådlig och tilltalande typografi.

Artikeltexten är mycket tydlig och lättillgänglig, men Verdana 7,5 pt är lite för liten för att läsas utan ansträngning.

Utan Verdana aktiveras Geneva, med mycket gott resultat. Expressen har en väl genomtänkt tagg: "Verdana, Geneva, Arial". Disposition och brödtext ändras praktiskt taget inte alls, men rubrikerna blir avsevärt fulare. Läsbarheten påverkas marginellt.

Expressen Geneva

Artikeln blir med Geneva fullt läsbar, men kisa och anstränga sig får man även med Geneva. Size 1 är och förblir för liten grad för god läsbarhet, även med detta förnämliga typsnitt. I artiklarna kunde man gott ha size 2 eller ännu hellre Times size 3.

I all sin enkelhet är detta en mycket bra anpassning mac/PC.

Som helhet fungerar Expressen utmärkt i båda miljöerna, med en överskådlig, öppen och lättillgänglig typografi.

Allt om Stockholm (www.alltomstockholm.se)

Denna webbplats är primärt utvecklad för PC och dåligt Macanpassad. Den har en mycket enkel och överskådlig typografi helt i Arial med tydliga avsikljande rubriker i nyhetsspalten. Textspalten är lagom smal och mycket lättläst i PC-miljö.

Faktum är att den är så enkel att den känns lite grå och utslätad, med alltför lite typografisk variation och alltför mycket mager Arial 10. Därmed blir överskådligheten lidande när man inte har typografisk hjälp i orienteringen.

Textsidor blir väldigt grå och utslätade, genom att såväl kategorier, notiser och textspalt är satt i samma Arial 10. Mer variation med olika vikter och grader och kanske lite färg skulle göra Allt om Stockholm gott.

I Mac blir Allt om Stockholm rätt svårartad. Arial ersätts nämligen med Helvetica, vilket gör den mörk, rörig och otillgänglig. Nyhetsspaltens satsyta blir för bred och texten blir svårläst. En avdelningssida som Samhället blir hopplöst kompakt och otillgänglig. Det ska till stor beslutsamhet att tränga genom textmassan i Veronicas spalt.

Hade man arbetat med mer varierad typografi, med Verdana som variation till Arial, och med Geneva som mac-alternativ till Verdana och Arial hade resultatet varit bättre. Allt om Stockholm känns inte riktigt genomtänkt typografiskt sett.

Amfora Vinhus (www.amforavinhus.com)

Amfora Vinhus har en typografi som motverkar webbplatsens syften, uppenbarligen utvecklad för PC.

Den har å ena sidan en ansats till elegans, med kantutjämnade script-rubriker, gråtonade avdelningsknappar och rätt trevliga illustrationer.

Grå versala gif-texter som avdelningslänkar fungerar bra. Med den grå och nedtonade texten gör den disiga kantutjämningen ingen skada, utan kommer tvärtom till sin rätt.

Typografin dras dock ned av en jobbig stilblandning, där elegans blandas med robust klumpighet på ett aningslöst sätt, så att det blir varken hackat eller malet.

Förstasidan har svårlästa feta kantutjämnade gif-texter i för liten grad, och avdelningen "Våra viner" dras ned av de stora och fula länkarna i fet, kantutjämnad linjär.

Alla dessa element är kantutjämnade gif-texter, som är identiska i Mac/PC-miljö.

Det är i de viktiga vinpresentationerna som typografin fullständigt spårar ur. Här används nämligen Times size 2, 10 pt. Egentligen finns ingen font specificerad alls, endast size 2, vilket blir Times om inget annat anges i webbläsarens inställningar. I PC-miljö är det fult, men med viss ansträngning är det läsbart. I Mac-miljö är det bara fult.

Det är helt omöjligt att läsa ingressen i kursiv Times, beskrivningen kan man ta sig igenom, men artikeltexten avstår man nog från att förstöra ögonen för. Om man nu absolut ska ha Times på denna sida, borde vara Times 12. Men här kunde man snarare variera typografin och använda Verdana eller Geneva i uppställning och ingress, och Times i artikeltexten. Katastrofalt.

Amfora vintext

Listningen av vita och röda viner är också den hopplöst oläslig, av samma skäl. De små feta rubrikerna beckar igen och namnen i kursiv Times får man verkligen gissa sig till. Beteckningarna på cirkeldiagrammen i mager Times kan tolkas. Det enda man utläser lätt är nummer och pris, och så var det nog inte tänkt. Här behövs en rejäl översyn om Amfora vill sälja vin till Macanvändare.

Amfora vinlista

IDG (www.idg.se)

IDG pc

Det intressanta med IDG:s webbplats, är att den som portal och nyhetstjänst har en varierad typografi som fyller sin funktion att ge orientering och överblick.

Den har också en föredömlig anpassning till Mac/PC, utan att använda stilmallar, nämligen "Arial, Geneva, Verdana, Helvetica" i textspaltens brödtext och "Verdana, Arial, Geneva" i ytterspalterna. Även andra taggar används, men poängen är att Geneva får rollen som första alternativ i mac-miljö.

Med avgränsande fält och variation mellan feta och magra, versala och gemena texter och rubriker i länkar och nyhetslänkar till svenska CNN ger den en lugn överblick och god orientering.

IDG Geneva

Bruket av Arial eller Geneva i senaste-nytt-spalten ger ekonomi och läsbarhet.

Texterna är förstås större och mer lättlästa i PC-miljö, men tjänsten fungerar utmärkt i mac-miljö. Med Verdana installerad är ytterspalterna öppna och läsbara, medan Geneva svarar för läsbarhet i mittspalten. Utan Verdan tar Geneva över och IDG känns riktigt macmässig och hemtam, även om ytterspalternas rubriker och länkar får alltför liten grad.

Uppsala kommun (www.uppsala.se)

Uppsala kommuns hemsida är utvecklad för Mac och mycket bra anpassad till PC. Dessvärre dras den med en gräslig förstasida som vi väljer att inte visa här. Men resten är bara bra.

Man har font-taggen "Geneva, Arial, Helvetica", där man kan räkna med att Helvetica aldrig ska behöva tas i bruk, eftersom Geneva är standard på mac. Detta är en utmärkt och enkel typografi som fungerar i båda miljöerna. Webbtjänsten ger som helhet intryck av att vara typografiskt genomtänkt och är nästan i alla avseenden föredömlig.

Geneva respektive Arial är det genomgående typsnittet i texter, medan man arbetar med ett system av olikartade rubriker för att ange nivåer. Avdelningsknappar är kantutjämnade gif-texter, som således är identiska överallt. Mot förstasidans vita bakgrund blir de lite dimmiga, men mot den gula plattan på insidorna fungerar gif-texterna utmärkt.

På huvudavdelningarna används gif-texter med Garamond kursiv i stor grad som avdelningsrubrik, vilket är mycket snyggt. I kombination med avdelningsknappar i form av gif-texter garanteras härmed en identisk ramtypografi på Mac och PC. Arial och Geneva garanterar båda god läsbarhet, trots liten grad, och ger sidan ger allmänt sett ett trevligt och lättillgängligt utseende åt sidan.

Uppsala Avdelning

På underavdelningar används Times i size 5 som huvudrubrik och sidrubrik. Tanken är utmärkt, men inte så lyckad typografiskt. Times blir väldigt ful och tråkig i stora grader och stilbytet känns lite smaklöst. Vore det inte bättre att behålla stuket med Garamond, men rak garamond-gif kanske på underavdelningar. Därmed ger man ju webbplatsen en typografisk profil och får både konsekvens och estetik. Finns det särskilda behov av levande text på underavdelningarnas sidhuvud och sidrubrik är definitivt Verdana att föredra.

Som rubriker används helt enkelt blå fet Times, som i all sin enkelhet fungerar bra och ger variation åt sidan. I PC-miljö är sidan mer lättläst, eftersom all text här är större, men även i mac-miljö är sidan ljus, öppen och lättläst. Geneva är ett bra skärmtypsnitt.

Uppsala politik

Uppsala kommuns hemsida är ett utmärkt exempel på hur man med mycket enkla medel kan skapa en vacker, variationsrik och lättillgänglig typografi som fungerar lika bra i Mac- och PC-miljö.

Nacka kommun (www.nacka.se)

Nacka kommuns hemsida har en mycket enkel, stram och nästan spartansk typografi, utvecklad för PC och inte alls Mac-anpassad. I PC-miljö fungerar den bra, men saknar typografisk variation. Vissa lösningar är inte heller så lyckade, t.e.x. bruket av blå fet Arial 10 i ingresstexter och blå textlänkar i mager Arial 10 som avdelningsknappar. Det blir mycket blått och tänligen svårläst. Som sidrubriker används fet röd Times i stor grad.

I Mac-miljö rasar webbplatsens totalt, eftersom man inte angivit Geneva som alternativ till Arial. Man har nämligen inte angivit något alternativ alls. Med standardinställning på webbläsaren blir all text därmed blå Times size 2, 10 punkter. Den rena, spartanska typografin rasar samman till en ful röra av närmast oläslig text, eftersom Times i 10 pt blir väldigt liten i Mac-miljö.

Nacka Mac start

Den vackra och överskådliga förstasidan blir nästan omöjlig at läsa, textlänkarna får man gissa sig till vad de står för. Här betalar den spartanska enkelheten med levande text-knappar ett dyrt pris. Gif-texter med Arial hade varit att föredra. Ännu hellre med Verdana förstås.

Eftersom hela webbplatsen baseras på levande typografi blir det inte heller mycket kvar av de minimala avdelningslänkarna i sidhuvudet, så det är också mycket svårt att orientera sig.

Avdelningen Barnomsorg/utbildning, som redan i PC-miljö är svårtillgänglig med blå fet Arial i brödtexten, blir i Mac brutalt avvisande, med liten fet Timnes 10 i brödtext och små, blå oläsliga avdelningslänkar i mager dito. Gräsligt helt enkelt.

Nacka avdelning

Även avdelningen Aktuellt är svår, men här är bara rubrikerna i fet Times, så det går att läsa nyheterna, men inte känns det lättillgängligt och användarvänligt.

Nacka aktuellt

Nacka kommun skulle lagt in font-taggen "Arial, Geneva", så kunde situationen ha räddats ganska bra. Men man borde dessutom arbeta med Verdana som variation till Arial. Avdelningslänkarna i sidhuvudet kunde man göra lite större om de absolut ska vara levande text-länkar, men bäst är förstås att göra dessa länkar till gif-texter som blir identiska i båda miljöerna.

Slutkommentar

Webbplatser som utvecklas för Mac och anpassas till PC ger bra resultat i båda miljöerna, eftersom Macen är den svaga länken med dess mindre teckenåtergivning. På PC kan sådana sidor blir lite röriga och luftiga om man inte ser upp. Times måste användas i size 3 eller 12 pt för att bli läslig i macmiljö. Geneva fungerar i size 2, vilket automatiskt blir Arial på PC. Font-taggen kan vara ospecificerad för Times. Font-taggen för linjärer bör vara "Geneva, Arial, Sans-serif". Arial bör undvikas på Mac, liksom Helvetica på Mac och PC.

Om man utvecklar webbsidor för PC och Macanpasser dem är den enklaste lösningen att ha font-taggen "Verdana, Geneva, Arial, Sans-serif". Verdana fungerar bra i båda miljöerna, Geneva är bra på Mac om Verdana saknas och Arial bra på PC. Texten blir mindre på Mac, men är fullt läsbar. Size1 1, 7,5 pt, kan användas i mycket korta texter, men blir mycket liten på Mac, size 2, 10 pt är att föredra.

Bäst blir förstås webbsidor som medvetet utvecklas för båda miljöerna med hjälp av stilmallar. Här kan man styra typografin i detaljer och ange teckenstorlek på pixelnivå. Därmed kan man kompensera för skillnaden mellan Mac och PC och till och med få större text på Mac.


Bra och dåligt

Passagen

+ Identisk i Mac/PC med hjälp av stilmallar. Verdana och Geneva i fonttaggen. Lättläst och överskådligt, trots liten textstorlek. Variation och åtskillnad med rubrikstilar, korta texter, plattor och färger.

– Har inte hittat nå't

Uppsala kommun

+ Enkel och genomtänkt typografi som är i stort sett identisk i Mac/PC-miljöerna. Geneva och Arial i fonttaggen. Gif-knappar i avdelningsrubriker. Trevlig och lättillgänglig.

– Times i sidhuvud och sidrubrik är fult, Garamond-gif eller Verdana är att föredra.

IDG

+ Lättläst och överskådlig typografi med Verdana och Geneva/Arial, under förutsättning att man inte har Arial installerad på Mac. Bra variation med versaler och gemener i länkar. Fonttagg Verdana, Arial, Geneva. Fungerar lika bra i båda miljöerna.

– Med Geneva size 1 i stället för Verdana blir ytterspalterna svårlästa. Taggen borde vara "Verdana, Geneva, Arial".

Expressen

+ Öppen, överskådlig och lättillgänglig typografi helt baserad på Verdana. Bra variation med rubriker i olka grad och vikt. Verdana size 1 fungerar i förstasidans korta texter. Identisk i båda miljöerna, i PC mer lättläst på grund av större tecken. Font-tag: "Verdana, Geneva, Arial" är föredömlig. Fungerar utmärkt i Mac med Geneva.

– Brödtext i size 1 är för liten grad i artikeltexter och kräver ansträngning.

Aftonbladet

+ Tät tidningsmässig typografi med puls. Praktiskt taget identisk i båda miljöerna, mer lättläst i PC, mer tidningsmässig i Mac. Times 12 i brödtexter ger god läsbarhet. Taggen "Helvetica, Arial" i rubriker, brödtext ospecificerad.

– Mindre överskådlig och tillgänglig på grund av den täta, röriga typografin. Större Times på Mac skulle egentligen behövas.

Torget

+ Öppen, enkel och lättillgänglig typografi med Verdana motsvarande 11 pt ( 8 pt på PC) genomgående. Identisk i Mac/PC p.g.a stilmallar.

– Lite tråkig och utslätad p.g.a liten typografisk variation. Utan Verdana blir texten kompakt och svårtillgänglig, ty då används Helvetica på Mac. Borde ha Geneva som alternativ till Verdana.

Riksdagen

+ Varierad och överskådlig typografi i Verdana och Arial. Verdana i uppställningar och Times 12 pt i långa löptexter. Mycket god läsbarhet i PC. Gif-text i Gill Sans i sidhuvud och avdelningsknappar.

– På Mac ersätts Arial av Helvetica med svårläst text. Font-taggen borde vara Verdana, Geneva, Arial, Sans-serif resp Arial, Geneva, Verdana, Sans-serif.

Regeringen

+ Enkel, snygg och överskådlig typografi i Verdana 10 pt med avdelningsknappar i avvikande linjär. Med Verdana på PC lättläst text och bra satsyta med tonad bakgrund.

– Dåligt macanpassad. Verdana-texten blir för liten i Mac och satsytan för bred. Utan Verdana används Helvetica och alla sidor blir röriga och svårlästa. Font-taggen borde vara "Verdana, Geneva, Arial, Sans-serif". Längre texter kunde använda Times 12 pt.

Allt om Stockholm

+ Enkel, överskådlig typografi i Arial. Lagom bred textspalt.

– Textsidor blir grå och utslätade med enbart Arial. Dåligt Mac-anpassad, Arial blir Helvetica. Nyhetsspalten blir därmed för bred och mycket svårläst, kompakt och otillgänglig. Varierad rubrik-typografi med Verdana och Arial, text i Times och font-tag med "Arial, Geneva, Verdana" skulle rädda webbplatsen.

 

CNN-passagen

+ Överskådlig och varierad typografi med Verdana 10 pt och Arial. Telegram i Verdana 10 med lagom satsyta. Med Verdana praktiskt taget identisk i Mac, med tydlig och lättläst text.

– Fula utspärrade avdelningsrubriker. Dåligt macanpassad. Med Verdana förblir telegramspalten läslig, men övriga spalter som har Arial får Helvetica och blir svårlästa. Utan Verdana blir hela webbplatsen kompakt och svårtillgänglig. Font-taggarna "Verdana, Geneva, Arial" och "Arial, Geneva, Verdana" borde ha använts.

 

Nacka kommun

+ Mycket enkel, korrekt och överskådlig typografi för PC med Arial 10 pt.

– För liten variation mellan typografiska element. Bristfällig typografi med svårlästa texter i fet blå Arial. Variation med Verdana i rubriker och länkar skulle hjälpa. Obefintlig Macanpassning: Times 10 ersätter Arial med katastrofala resultat på alla sidor. Fult och praktiskt taget oläsligt i Mac-miljö. Font-taggen "Arial, Geneva, Verdana" borde ha använts.

Amfora Vinhus

+ Gif-texter i script-rubriker och gråtonade avdelningsknappar används för profilering av elegans och smak. Smal textspalt i vin-presentationer.

– Inkonsekvent typografisk ansats med klumpiga rubriker och svårlästa texter. Misslyckad Times-typografi i vinpresentationer, Verdana vore bättre. Ingen Mac-anpassning, alla sidor blir oläsliga med Times 10 pt på Mac. Typografin bör ses över i dess helhet, med konsekvent profilering, Verdana i uppställningar och i korta texter, samt font-taggen "Verdana, Geneva, Arial, Sans-serif" skulle göra susen.

© Text och illustrationer Stefan Lundhem

| FyrisFonts | Typsnitt | Beställa | Artiklar | Ordbok | Länkar | Innehåll | Om |

< - - - Sidan uppdaterad 011022 - - - >