Share
Sedan Hoefler & Frere-Jones tillkännagav sin förflyttning i världen av webbfonter, har internet överflödt med glädje av designers och typografer överallt. Slutligen har en av de mest populära typ gjuterierna där ute släppt sin efterlängtade konkurrent till webbtypstjänsterna senast!
Du kan redan se den nya tjänsten som används på webbplatser som Rdio, Jessica Hisches hemsida och CSS-Tricks. Men vad betyder detta nya erbjudande för dig och jag? Tja, designers och utvecklare har både mycket att se fram emot i tjänsten. Låt oss ta en närmare titt.
Låt oss först uppdatera våra sinnen med en kort lektion i utvecklingen av typen på webben. Tillbaka i dagarna för CSS 2, (OK, så inte den där långt bakåt) vårt val för webbvänliga typsnitt var något begränsat. Vi kunde använda ett litet urval av webbvänliga typsnitt som var säker på att vara på (nästan) varje enhet som sidan visades på - Verdana, Arial, Georgia och Times New Roman - eller vi valde ett teckensnitt, som Helvetica, Det skulle vara "bäst visat" på specifika plattformar. Inte idealisk. Och då fanns bilderna ersättande tekniker, där vi skapade bilder av texten i vilken typsnitt vi hade till vårt förfogande, och ersatte textsträngar med hjälp av CSS. Slutligen var det Sifr; en teknik som använde Adobe Flash för att ersätta text. Båda dessa ersättningstekniker var otillgängliga, en smärta att genomföra och en obehaglig upplevelse över plattformar.
Lite visste vi, en specifikation för verklig webbfonter pågår: @ font-face. De som känner till @ font-face kommer att veta att det inte är det enklaste i världen att implementera, så vi vänder oss till högkvalitativa webbtypstjänster som Google Web Fonts, Typekit och Fontdeck för att göra det tunga för oss. Dessa tjänster, tillsammans med H & FJs nya tjänst, hanterar värd, licensiering och optimering av webbfonter. Men varje tjänst är inte kompromisslös. Alla dessa tjänster saknar finkornig kontroll över de teckensnitt vi får. Saker som ligaturer, småkapslar och andra OpenType-funktioner är ofta svåra att genomföra utan att på allvar påverka skrivarens prestanda.
Det här är den spännande delen. H & FJ har skapat en webbtypstjänst för typografer och utvecklare.
Låt oss få den svåra delen ur vägen. H & FJs cloud.typography-tjänst börjar vid $ 99 per år. Det priset köper dig 250 000 sidvisningar varje månad. För $ 50 mer får du en svimlande 1 miljoner sidvisningar och för $ 299 får du dubbelt så mycket.
Varje av dessa planer ger dig också fem fria fontfamiljer som kastas in - ett fynd när du anser att dessa högkvalitativa fontfamiljer kostar omkring 200 dollar ensam - liksom alla dina tidigare inköp från gjuteriet, obegränsade domäner, upp till tio "projekt ", SSL-leverans och 1GB utvecklingsbandbredd. Större planer finns tillgängliga, samt ytterligare projekt.
H & FJs bibliotek är litet jämfört med liknande Typekit, men de höjer baren på kvalitet. Gieteriet erbjuder över trettio familjer, varav tio har blivit helt reengineered, omdesignad och optimerad för användning på webben och skärmanordningar. Ett betydande antal av dessa familjer har utökade uppsättningar, inklusive kondenserade och utökade varianter, vikter från ultra-ljus till ultra-svart, små kepsar, ligaturer, swashes och internationella teckenuppsättningar. I grund och botten får du några seriöst högkvalitativa teckensnitt.
De fem första familjerna du väljer är helt gratis, och därefter prissätts familjer individuellt. Alla skrivbordslicenser levereras också med en webbanvändningslicens, så att du kan ta med tidigare köpta H & FJ-teckensnitt, samt få en hel del på skrivbords- och webblicenser tillsammans för enhetlig branding. Kanske är det mest spännande skrivbordet som är tillgängligt Gotham, vilket av många anses vara Proxima Nova mer förfinade förfader.
Det finns några subtila skillnader mellan Gotham och Proxima Nova; nämligen Gothams mer generösa brevavstånd och bredder, och Proxima Nova alternativ kursiv "a". En viktig aspekt av webbfonter är hur de fungerar på skärmsenheter. Det kräver en hel del optimering för att se till att teckensnitt - särskilt de som ursprungligen är avsedda för utskrift, fungerar bra på skärmarna. H & FJ har gått ut på optimeringarna av några av sina typsnitt, ofta helt omhändertagna familjer och tecken för att se till att de ser utmärkta ut på skärmen och på webben.
Sentinel (topp) och Sentinel Screensmart (botten) båda vid 18px. Den högre x-höjden och bredre bokstäver i skärmdumpversionen gör den idealisk för mindre storlekar och kroppskopiering. Optimeringsprocessen har gjorts av "ScreenSmart" av gjuteriet. Från deras hemsida:
ScreenSmart-teckensnitt är byggda för webbtext. Upptäckt från början som fontfamiljer för skärmen, de är utformade kring pixlarnas naturliga egenskaper och konstruerade för att ge exakta resultat överallt.
Det är underselling deras arbete. Gjuteriet omarbetade sina teckensnitt i webbläsaren, Använda en uppsättning verktyg baserade på Webkit. Hela nya vikter utformades speciellt för användning i skärmen, och varje typsnitt är optimerat på en mängd olika webbläsare och plattformar för "pixel-perfekt" läsbarhet.
Med tanke på kvaliteten - och därmed filstorleken - av typsnittet, är det här snabb. Cloud.typography använder ett leveransagent för att hantera förfrågningar på deras webbfonter, upptäcker webbläsarens krav och levererar endast de teckensnitt som behövs för den webbläsaren. Det cachar också alla filer som begärs och distribuerar dem över en global CDN, vilket innebär att leveransen av dessa filer alltid blåsar snabbt.
Leveransmedlet fungerar olika beroende på status för ditt projekt och dess teckensnitt. I utvecklingsläget är fontfilerna värd på H & FJs servrar och distribueras från CDN. För varje projekt får du 1GB utvecklingsbandbredd per månad; en ganska stor ersättning. När du byter till produktionsläge, låter du H & FJ veta var tecknen kommer att finnas på din egen server, ladda ner en stor zip-fil och hålla den på din server. Därefter behöver du inte ändra CSS-länken eller göra något annat. CSS-filen pekar på teckensnitt på din egen server, men leveransnätet hävdar fortfarande tyngre för att bestämma vilka teckensnitt som krävs, vilket gör att användaren blir seriös väntetid.
När du byter till produktionsläge är den enda gränsen sidovyn för din plan.
En annan sak att notera om Cloud.typographys prestanda är att det inte använder en JavaScript-loader som Typekit och Google Web Fonts. En JavaScript-laddare har några tydliga fördelar när det gäller att justera dynamiskt till webbläsarens behov, men det kommer också till viss kostnad. extra HTTP-förfrågningar, en viss webbläsare med låg nivå och en ytterligare fördröjning medan manuset lägger till CSS i dokumentet.
En sak som verkligen intresserade mig fungerade som en ganska subtil prestationsförbättring. När du tittar på CSS-reglerna för att lägga till teckensnitt på din webbplats, anger Cloud.typography inte en, men två typsnitt. Exempelvis ser Hoefler Texts CSS-regel ut så här:
font-family: "Hoefler Text A", "Hoefler Text B";
Genom att begära två fontfiler kan teckensnittet laddas ner samtidigt (även om det inte är fallet i alla webbläsare). I teorin är det snabbare att ladda ner två 200kb-filer samtidigt än att ladda ner en enda 400kb-fil. Både A- och B-teckensnitt innehåller halva teckenuppsättningarna, så de tecken som saknas från fil A faller tillbaka och använder fil B. Smart eller vad?
Den faktiska avsikten med att dela upp filer på detta sätt (säger H & FJs Reed Reeder) är att "förhindra tillfällig missbruk av teckensnitt", men det är allt intressant ingen-mindre.
Allt detta sagt, fontfilerna kan snabbt bli ganska stora. Teckensnittet läggs till i ditt projekt, per vikt / stil, med varje vikt eller stil som ligger i genomsnitt runt 40kb. Det innebär att om du vill ha en enda teckensnittsfamilj i vanliga och djärva vikter, kursiv och små kepsar för var och en av dem, kan du förvänta dig en total storlek på 320kb.
Cloud.typography erbjuder en mycket konkurrenskraftig kontrollnivå över de teckensnitt du väljer. Dessa alternativ visar tydligt en webbtypstjänst inte bara för designers och utvecklare, men för typografer. Som standard läggs alla teckensnittsfamiljer som du lägger till i ett projekt med de vanliga, kursiva, fetstiliga och fetstilte teckensnitt med standardinterpunktion och kerning.
Här är det som blir intressant (eller obegränsat). När du väl har lagt till en typsnittfamilj i ditt projekt kan du också lägga till alla andra tillgängliga vikter (upp till nio) och stilar, sanna småkapslar, kontextuella och diskretionära ligaturer, swashes, olika nummerformat, utökade teckenuppsättningar och skiljetecken och mattecken.
Inte bara det, men du kan också definiera anpassade teckenuppsättningar. Om du till exempel använder en viss typsnitt för din webbplatss logotyp kan du berätta för Cloud.typography att bara tillhandahålla de tecken som behövs och spara några seriösa nedladdningar för användare.
Det är värt att komma ihåg att alla de extra typografiska funktionerna du lägger till kommer att ge mer vikt till teckensnittet, och det här webbläsarstödet kan vara lite patchigt, särskilt på gamla IE.
Förhoppningsvis kan du se att H & FJ har gått den extra milen och erbjuder oöverträffad finkornkontroll över de teckensnitt du väljer för dina webbplatser. Medan filstorlekarna fortsätter att stiga, har denna nivå av kontroll fått designare överallt (din medverkan) oerhört upphetsad. Om något, kan lanseringen av Cloud.typography kickstart en utveckling i de andra webbtypstjänsterna som finns tillgängliga - vi kan bara vänta och se! Glöm inte att lära dig mer om den nya tjänsten rakt från hästens mun.
Accentsconagua