Här är en intressant tanke; Ju bättre finansbörserna går, ju fler plagg klär vi på oss. Ja, och så klär vi av oss i bistrare tider. Utan att blanda in allt för mycket psykologi och underliggande orsaker så har Puma snappat upp detta. Resultatet är en smart kampanj för deras klädkollektion, i ett ganska tyskt manér, där man kan följa tre olika börser i realtid med tillhörande modeller.
Jag får väl börja med att be om ursäkt för den klena uppdateringen på sistone. Jobb kommer som oftast före det mesta. Som plåster på såren bjuder jag på ett litet länktips, nämligen Ffffound som är en bildsökingstjänst. Användare till Ffffound länkar in bilder till siten och sammankopplas genom konstnärer, stil, färg och uttryck. En helt fantastik tjänst som lätt snor åt sig ens uppmärksamhet några timmar.
Den senaste veckan har jag skruvat lite i min layout på bloggen. Javisst, allt ser likadant ut, nästan i alla fall. Jag har vridit åt muttrarna för typografin, och samtidigt byggt om layouten en smula så den ska te sig lite mer generiskt. När jag tänker efter är det nog mest skillnad i koden och inte i utseedet. Hur som helst, så blev det lite skillnad.
Den senaste tiden har det börjat dyka upp fler och fler webbaserade verktyg för att skapa och testa CSS-kod. De jag har funnit mest användbara är bland annat Grid Designer som jag tidigare tipsat om för att skapa kolumner och snabba layouter.
När det gäller typografi är ett av mina favoritverktyg utan tvekan TypeTester. SIten låter dig testa din typografi, enkelt fördelat i tre spalter för att ställa olika typsnitt och vikter mot varandra. Ett klart plus i dessa CSS3-tider är att man kan även testa de lokalt installerade typsnitten och inte bara de vanliga standard webbtypsnitten.
Den typografiska måttenheten Em är egentligen en relativ storlek. Den baseras på hur bred bokstaven “M” är i ett typsnitt. Kort och gott så varierar hur mycket 1 em är beroende på vilket typsnitt du väljer att använda. Till exempel har Arials M en annan bredd än Times New Romans.
På webben är det dock inte så enkelt, då olika parametrar måste räknas in (så som hur olika webbläsare tolkar typsnitt, personliga inställningar med mera) för att få typsnitt att uppfattas så bra som möjligt. Generellt sett kan man utgå från att 1 em är lika mycket som 16 px.
1 em = 16 px
0.88 em = 14 px
0.75 em = 12 px
0.625 = 10 px
Varför ska man då använda em och inte px när det är så omständigt?
Vill man kunna skapa storleksskalbara siter, vilket kan vara bra för synskadade eller om du helt enkelt ska hålla en presentation, så är tyvärr inte px något bra alternativ. Boven heter Internet Explorer 6 och webbläsaren kan inte förstora upp, eller förminska ner, typsnitt som anges i pixelmått.
Med det webbaserade verktyget Em Calculator får man bättre koll på storlekarna genom att konvertera px till em. Man kan även nästla flera noder och är ett utmärkt verktyg för att bygga upp din CSS.
Jag blev något nostalgisk för ett par dagar sedan när jag tänkte tillbaka på hur webben såg ut förr i tiden. “Det nya mediet” är ju inte så hemskt nytt längre och mycket har hänt på väldigt kort tid kan man tycka.
Jag kände mig tvungen att samla på mig lite grymma länkar på old school-siter och ett gäng riktiga bottennapp.
Siten The FWA (Favorite Website Awards) är till försäljning enligt deras hemsida. FWA har varit den ledande inspirationsbanken och det högst rankade online-baserade priset för kampanjsite-makare under de senaste åren. Jag var själv med och vann site of the day i april 2006 med IKEA-kampanjen Stockholm.
Vad som händer med FWA i framtiden återstår att se, men jag hoppas att den nya köparen (om det nu blir någon) kan axla ansvaret och driva siten vidare i minst samma goda anda.
När jag ändå har varit inne på ämnet CSS 3 så tänkte jag fortsätta med lite på det spåret. De senaste årens “riktlinjer” för design på nätet har mångt om mycket handlat om Web 2.0 och de karaktäristiska dragen som detta lite tråkigt har fått axla. Vi är alla bekanta med rundade hörn, transparens och skuggor. Metoderna för att framställa detta har varit en kombination av Photoshop och CSS2.
I den senaste versionen av CSS har man anammat mycket av det formspråket. Nättidningen Smashing Magazine listar fem användbara tekniker som man kan räkna med kommer användas flitigt framöver. Mer matnyttigt kan man hitta på siterna CSS3.com och CSS3.info.
CSS3 är fortfarande i utvecklingsstadiet och därför har inte alla webbläsare stöd för alla metoder än, dessutom har olika webbläsare olika sätt att anropa metoderna på. Lite absurt kan det bli när man tikar på t ex border-radius:
Till och från använder jag den ypperliga danska siten Grid Designer när jag ska rita upp mina grider. Det är verkligen en supersite i all sin enkelhet, och ett verktyg som borde vara standard i program som Dreamweaver och Photoshop.
I CSS (Cascading Style Sheets) version 3 finns numera möjligheten att använda egna typsnitt på serversidan. Metoden kallas för @font-face. Ni som har lite nyare webbläsare Safari 3.2 eller Mozilla Firefox 3.1 kanske redan har lagt märke till att min portfolio och denna sidan använder lite andra typsnitt än vad man är van vid att få se på nätet.
Kursivschrift används för rubriker och ledtexter
Museo medium används för brödtext.
Kursivschrift blev jag förälskad i när jag hittade tidningen Lula Magazine. Typsnittet har lite fula versaler, men precis som tidningen Lula har gjort så går det ju att rita om dem. På senare tid har jag sett att typsnittet har förekommit i Vings reklamer som Forsman&Bodenfors tagit fram.
Museo är ett typsnitt under utveckling och görs av holländaren Jos Buivenga. Schysst som Jos är så har han släppt några vikter helt gratis för användning innan typsnittet är helt färdigställt.
Anders Henke arbetar som art director och har över tio års erfarenhet av kommunikation och formgivning på internet. Anders jobbar på Dallas STHLM i Stockholm och har tidigare arbetat på platser som Clavis reklambyrå i Lund samt IKEA Communications i Älmhult.
Kontakt: henke(a)works.se