2010: the year of web typography - webdirections
DESCRIPTION
For almost 15 years, Web designers have had a list of 10 “Core Web fonts” to choose from. Many ask, “Why can’t I just download a font file from my Web server the same way I can an image?” Well, actually, you can. The verbiage for font linking is a little different than images, but the syntax for Webfont linking has been around for over 10 years as a part of the CSS standard. Web typography expert Jason Cranford Teague shows you how to apply the principles of fluid typography, to choose, find and use Webfonts and create your unique typographic voice. Come and find out why 2010 is going to be the year of Web typography.TRANSCRIPT
Jason Cranford Teaguejasonspeaking.com | @jasonspeaking
Web Directions USA28 July 2010
2010The Year of Web Typography
@fluidwebtypefluidwebtype.info/web-directions
Q:What do these 3 Thingshave in common?
Flying Cars
Trips to Jupiter
Webfonts
A:20103 things I was supposed to have.
2008
20082009
2010The Year of Web Typography
20082009
What's New?Webfont SupportEasy font conversionWeb font service bureaus
Web TypographyUseFindChoose
AA A A AAA A A A
AA A A A
A
A
AA A A AA
AA A A AA
“Type design is an act of plagiarism in itself — you basically recreate the flesh of the same skeleton.”
Alejandro Saraviapampatype.com
What if everybody looked the same…
…and everybody was UGLY?
typography::type
voice::speech
If I say…“I’m going to kill you”
“I’m going to kill you”
“I’m going to kill you”
“I’m going to kill you”
“I’m going to kill you”
UglyQua
Sybil Green
Synchro LET
Cooper Black
Brand XBrand D
Brand IBrand H
Brand EBrand BBrand M
Brand F Brand NBrand C
Brand A
Brand GBrand KBrand J Brand Q
Brand X
Brand RBrand TBrand S
yahoo.com
aol.com
msn.com
Web Typography =HTML + CSS
Web Typography =Limited Font Choices
Web Typography =UGLY!!!!!
Why I WriteBy DORIANNE LAUX on 2.08.10
I have recently begun to think of writing as what Susan Sontag calls “awisdom project” in her forward to Another Beauty, a collection ofautobiographical essays by the great Polish poet Adam Zagajewski.
“…autobiography is an occasion to purge oneself of vanity,while advancing the project of self understanding—call it thewisdom project—which is never completed, however long thelife.”
I am still hard at work on this project of the self. The solitary self, as wellas the self in relation to the world and the unknown universe we swirlaround in, uncertain of our purpose or future. When I wrote the poemsthat would become my first book, I didn’t think of it as a book, but ratheras a need to understand the basic questions that all human beings ask:Who am I? Why am I here? Where am I going? What is beauty? Why isthere suffering? Where is truth? These questions would arise in me in theform of poems, and in making the poems into a collection, I tried toarrange them in a shape, find a path for them to travel to make clearerthose questions. I write to know the questions.
Poem after poem, book after book, the ante is upped. I think this could bewhy it takes so long between books. The poet is working harder each timeto go deeper, farther, layering on or stripping away to find the exact coloror texture, the core or the root, the frail light or the watery dark. I write towork things out. I write to concentrate, to feel a sense of purpose rise upin me. I enjoy the struggle of making a new object to present to the world,a gift made from scratch—whole, unique, edible as bread. And I want thatgift to travel well, packed into an old boat on calm water or hidden insidea greased body diving into a blue pool, a sleek arrow that leaves afeathered silence and wonder in its wake. I like moving, word by word,toward a sense of discovery, toward an awareness of self—a curious,energetic, intelligent, sacred, baffling, depthful, heartful self. I work tofind my subject, something I can sink my teeth into. I live for that flaringup of language, when the words actually carry me, envelope me, grip me.And all the above is why I read poetry, to hear the truth, spoken harshlyor whispered into my ear, to see more clearly the world’s beauty andsadness, to be lifted up and torn down, to be remade, by language, tobecome larger, swollen with life.
I write to add my voice to the sum of voices, to be part of the choir. I writeto be one sequin among the shimmering others, hanging by a thread fromthe evening gown of the world. I write to remember. I write to forgetmyself, to be so completely immersed in the will of the poem that when Ilook up from the page I can still smell the smoke from the house burningin my brain. I write to destroy the blank page, unravel the ink, use up whatI’ve been given and give it away. I write to make the trees shiver at thesliver of sun slipping down the axe blade’s silver lip. I write to hurt myselfagain, to dip my fingertip into the encrusted pool of the wound. I write tobecome someone else, that better, smarter self that lives inside mydumbstruck twin. I write to invite the voices in, to watch the angelwrestle, to feel the devil gather on its haunches and rise. I write to hearmyself breathing. I write to be doing something while I wait to be called tomy appointment with death. I write to be done writing. I write becausewriting is fun.
Editor’s Note: This short essay is from RedThread, Gold Thread: The Poet’s Voice ananthology edited by Alan Cohen. It is a book ofessays by poets on how they came to poetryand why they practice their art. Funds fromthe book are going toward the continuation ofthe annual Power of Poetry Festival held inLogan, Ohio since 2002. You can buy the bookhere.
topics: columnists
1 COMMENT
Jessie Carty said on 2.09.10 at 12:20pm:
Terrific essay, I love the quote and how Dorianne expounds off of that.
Thanks for sharing
POST A COMMENT
Name
Email Required, will not be published
URL
http://
Comment Textile permitted
The editors reserve the right to delete comments that areoff-topic, inflammatory, or anonymous.
search
Dorianne Laux is the author of fourbooks of poetry and co-author of The
Poet’s Companion: A Guide to the
Pleasures of Writing Poetry. She hasbeen the recipient of the Oregon BookAward and was short-listed for theLenore Marshall Poetry Prize. She lives
in Raleigh, North Carolina where she teaches poetry at NorthCarolina State University. For more, go to DorianneLaux.com.
Facts About the Moon
Buy from POWELLS
Buy from INDIEBOUND
In her powerful fourth collection,Dorianne Laux once again strikes firefrom neighborhood moments: a quietstreet at dusk, a pool hall, a bare tree.Focusing on the grace of working
people, she captures the pain and beauty of women in all
their variety, caught in the “lunar pull” of our time. more »
Dorianne Laux reads Facts About theMoon
Home / Audio / Video / Columns /
Newsletter / About / Subscribe / Contact
Photo Credits / Author Login
Design by Mandy Brown / A Working Library
audio video columns
newsletter about subscribe
Poems Out Loud
summerautumn
©acidsmile (unless otherwise stated)
the views expressed throughout this site are my own and do not necessarily reflect those of my employer
When life serves you lemons make lemonade goes the saying and these dayslife does taste like home made lemonade. Some times overly sour, sometimesoverly sweet. On occasion sour but with the grains of sugar crunchy betweenyour teeth. Some things are going extremely well, others very badly and insome cases I have no clue what is going on. Days merge into nights, weekschange and suddenly it’s the end of February and I’m wondering where twomonths of my life have gone and what have I done with them. Existentialquestions aside, everything since the 6th of Jan when I went back to workseems like a blur. Very stressful, too much work, too many variables.Normally I thrive…...
tsimitakis Watch this video: http://slide.com/t/5/5/iRdYgA7YzOlGΣκληρόβίντεογιατηΓάζαfrom web, Mon, Mar 01, 2010 - 15:03:25from web, Mon, Mar 01, 2010 - 15:03:25
tgeorgakopoulos http://twitpic.com/16178x - ΤζάστινΠλιάτσικας(@The_Stranger_gr μεπρόλαβες) #pliatsikasfrom from TwitPicTwitPic, Mon, Mar 01, 2010 - 15:02:46, Mon, Mar 01, 2010 - 15:02:46
djzinc that chat roulette thing is rawfrom web, Mon, Mar 01, 2010 - 15:02:25from web, Mon, Mar 01, 2010 - 15:02:25
2010 - #p52 - loose thoughts - ramblings
1 Comment | leave a comment | read the whole entry24/Feb/2010
@sophiaw happy monday / monthto you too!
Mon, Mar 01, 2010 - 14:00:22, fromTweetDeck
17 February
12 February
27 January
Coming home tonight the last thing I wanted to do was cookand it was something I was dreading all the way home. I hadthe sort of day where a server goes down at 17.10, twentyminutes…
Today I took the opportunity to work from home, somethingthat I don’t do very often, but absolutely had to be done inorder to make some significant progress in what I am…
Over the last few weeks I have been thinking a lot aboutpaying for content. When in November Murdoch…
Rails programming
CSSxHTMLRails programmingJavascript
CSSxHTMLRails programmingJavascript
I have a dream that all my websites will one day existin a Web where they will not be judged by how theylook and behave in each browser, because all browserswill follow the same standards and display them thesame.
This is my hope. With this faith in Web Standards andAccessibility for all people and devices we will be ableto make a better Web. With this faith we will be ableto transform the jangling discords of the browsers to abeautiful symphony of design, functionality andcontent. With this faith we will be able to work better,to play better, to struggle less, knowing that alldevices will treat our work equally & with respect.
Your Email:
Subject: Hello!
Message:
about this site || sitemap
search the site submit
or use the advanced search
Acid Smile
per piece
per piece
per piece
per piece
per piece
VoicesVoice morphing for your iPhone!
ConvertThe unit converter & calculator
plasma
ParabloxFeed your brain and test yourreflexes!
ClassicsEscape into some of the greateststories ever written
Where To?Make any iPhone function morelike a real GPS device
$199
99¢
99¢
Free
$299
• ContactContact • AboutAbout • BlogBlog SubscribeSubscribeTwitterTwitter
TapTapTap
Workflow andcollaboration.Content management solutions that don't feel templated.CONTENT MANAGEMENT SYSTEMSDRUPAL CMSALFRESCO WCM
The right tools for the job
Proven tools for engaging experiences.
We leverage many different technologies, frameworks and methodologies to solve problems for
our clients.
Work at Play is continually improving and expanding our knowledge base, processes and
understanding of the latest trends and best practices.
We are passionate in the pursuit of discovering what's possible and what we can bring to our
clients and our agency partners.
Solutions driven.
No matter how big and messy the problems are, we endeavour to ensure we've got the tools to
provide the right solutions.
TOOLBOX
SOCIAL MEDIA STRATEGY
SOCIAL NETWORKINGAPPLICATIONS
FACEBOOK APPLICATIONDEVELOPMENT
TWITTER APPLICATIONDEVELOPMENT
IPHONE APPLICATIONS
CONTENT MANAGEMENTSYSTEMS
ALFRESCO WCM
DRUPAL CONTENTMANAGEMENT SYSTEM
TOOLBOX
SEE OUR WORK
Knowledge trustedWork at Play's CMSexpertise.
VISIT DEQQ
Work at Play launchesthe Deqq iPhoneApplication.
START HERE
Fortune 500companies useDrupal. Is it the rightCMS for you?
Work At Play
Webfontsor
Web fonts?
USINGWebfonts
How many fonts are there?>100 Thousand
How many fonts are used on the Web?5 Fonts
Andale Mono
Arial
Arial Black
Comic Sans MS
Courier New
Georgia
ImpactTimes New Roman
Trebuchet MS
Verdana
Arial
Georgia
Times New Roman
Trebuchet MS
Verdana
ArialGeorgiaTimes New RomanTrebuchet MSVerdana
(Pre)InstalledOSSoftware
Web Safe Fonts~190 Fonts
Windows & Mac = 59 FontsWeb Safe Fonts
1 Academy Engraved LET 3-Likely
2 Agency FB bold 4-Less Likely
3 Algerian 4-Less Likely
4 American Typewriter bold 2-Almost Certain
5 Andale Mono 1-Certain
6 Apple Chancery 2-Almost Certain
7 Apple Symbols 2-Almost Certain
8 Arial bold, italic, bold/italic 1-Certain
9 Arial Black 1-Certain
10 Arial Narrow bold, italic, bold/italic 3-Likely
11 Arial Rounded MT Bold bold 3-Likely
12 Arial Unicode MS 4-Less Likely
13 Bank Gothic 3-Likely
14 Baskerville bold, italic, bold/italic 2-Almost Certain
15 Baskerville Old Face 4-Less Likely
16 Bauhaus 93 4-Less Likely
17 Bell MT bold, italic 4-Less Likely
18 Berlin Sans FB bold 4-Less Likely
19 Berlin Sans FB Demi Bold 4-Less Likely
20 Bernard MT Condensed 4-Less Likely
21 Big Caslon 2-Almost Certain
22 Blackadder ITC 4-Less Likely
23 BlairMDITC TT 3-Likely
24 Bodoni MT bold, italic 4-Less Likely
25 Bodoni MT Condensed bold, italic, bold/italic 4-Less Likely
26 Bodoni MT Poster Compressed 4-Less Likely
Websafe Fontsß3Introduction | TBD | Back to Fluid Web Type !
Font NameFont Name Weight and StyleWeight and Style OSOS RankRank SampleSample
Web Safe Fonts
← Increase Your Font Stacks with Font Matrix
!"#$%&'()')(*#+',-*./0.'1%#2'!"3'"*.'4%*.(1+'(50$"#%*6+7+#08+9'!%3$(+()#':))%30'"*.';.(,0'<$0"#%=0'>-%#0
Mac OS Windows OS Office WindowsOfficeMac Adobe Creative Suite
OS XTiger
OS XLeopard
WindowsXP SP2
WindowsVista
Office2003
Office2007
Office2004
Acrobat7
IllustratorCS2
InDesignCS2
CS2extras
CS3install
CS3disk
Adobe Caslon Pro x x x
Adobe Garamond Pro x x x
Adobe Jenson Pro x
Agency FB x x
Agency FB Bold x x
American Typewriter x x
Andale Mono x x x x x x
Apple Chancery x x
Arial x x x x x x
Arial Black x x x x x x
Arial Narrow x x x x x
Arial Rounded MT Bold x x x x x
Arial Unicode MS x x x
Arno Pro x
Baskerville x x
Baskerville Old Face x x x
Bauhaus 93 x x x
Bell Gothic Std x
Bell MT x x x
Berlin Sans FB x x
Bernard MT Condensed x x x
Bernhard Modern Std x x
Bickham Script Pro x x
Big Caslon x x
Blackadder ITC x x
Bodoni MT x x
Bodoni MT Black x x
Bodoni MT Condensed x x
Bodoni MT PosterCompressed
x x
Book Antiqua x x x
Bookman Old Style x x x
Bradley Hand ITC x x
Braggadocio x
Britannic Bold x x x
Broadway x x
Brush Script MT x x x
Brush Script MTItalic
x x
Caflisch Script Pro x x
!"#$%&$ x x
Californian FB x x
Calisto MT x x x
!"#$%&" x x
!"#$"%" x x
Castellar x x
Centaur x x
Century Gothic x x x
Century Old StyleStd
x
Century Schoolbook x x x
Chalkboard x x
Chaparral Pro x x
Charlemagne Std x x
Chiller x x
Cochin x x
Colonna MT x x x
Comic Sans MS x x x x x x
!"#$"%&$ x x
!"#$%&#%'& x x
Cooper Black x x x
Matrix of Fonts
WebfontsAny font?
font-‐family: verdana, arial, sans-‐serif;
star understudy understudyweb-safe core web generic
Diavlo
name you give it
... }@font-‐face { font-‐family: Diavlo;src: url('fonts/Diavlo_BOOK_II_37.otf');}
font-‐family: 'body copy';src: url('fonts/Diavlo_BOOK_II_37.otf');}
path to font file
font-‐family: 'body copy';src: local(Diavlo) url('fonts/Diavlo_BOOK_II_37.otf');font-‐style: normal;font-‐weight: normal;font-‐stretch: normal;font-‐variant: normal;}
font properties
local name
tahoma, arial, sans-‐serif;diavlo, verdana, arial, sans-‐serif;font-‐family:
name you gave it
'body copy', verdana, arial, sans-‐serif;
True Type (.ttf)Open Type (.otf)
File Formats
Embedded Open Type(.eot)EOT Lite (.eot)
File Formats
Scalable Vector Graphics (.svg)File Formats
Web Open Font Format (.woff)File Formats
Browser Font Support
EOT/EOT LITE
TTF/OTF
SVG
WOFF
✔
✔ ✔ ✔ ✔
✔ ✔ ✔
Coming Soon! ✔ ? Coming Soon! Coming Soon!
SVG or WOFF???
src: local('☺'),
font-‐family: 'body copy';src: url('fonts/Diavlo_BOOK.otf');}
font-‐family: 'body copy';src: url('fonts/Diavlo_BOOK.eot');
url('fonts/Diavlo_BOOK.woff') format('woff'); url('fonts/Diavlo_BOOK.otf') format('opentype'); url('fonts/Diavlo_BOOK.svg#diavlo-‐regular') format('svg');}
@font-‐face {
EOT for IE
Local NameWOFF
OTF/TTF
SVG
Sub-setting = Compression
EULAEnd User License Agreement
IPIntellectual Property
Exljbris
Emigre
Chank
sIFR & CufónWhat about
FINDINGWebfonts
Webfonts SourcesLicensed WebfontsWebfont Service Bureaus
Licensed FontsUnder Your Control
Fonts Blog Help CART (0)FAVORITES (0)HISTORY
Copyright © 2009 FontShop USA | Proud sponsor of ATypI | Shop Region: USA & Canada
Founded by Erik Spiekermann andNeville Brody in 1989, FontShopis the original independentretailer of digital type. We offermore than 100,000 fonts fromdozens of expert-selectedfoundries, including our housebrand: FontFont.
FontFeed.comFontStruct.comFontBook.comTypeNavigatorFontFont Microsites
Get FontShop News
Enter email address
FontShop NewsNew and NotableTypographic TidbitsTypography 101: What’s thedifference between Std and Pro?New Foundry: Hubert JochamNew Fonts: CastleType
The FontFeedThe Best of FontFonts on the We...Designpreis Deutschland 2010 La...FIFTY|1: The New FontFont Relea...FontCast #9 — TypeTogetherThe 1879 Spencerian Compendium...
New FontsVerse Sans OTVerse Serif OTVoice OTVoice Serif OTGoudy Trajan Pack OTCarisma Package OTCarisma Inline OT
BestsellersSuomi Hand Script OTFF DIN OTEstilo RegularKlavika Basic OTOlicana Smooth OTFF DIN ProEstilo Script
Font ServicesCustom TypeHandFont
HelpType ResearchFont InstallationEducationLicense AgreementsMUL InformationFAQGlossaryOpenType
About UsMeet the StaffWhy FontShop?
Contact & Follow
Flickr
Late edition towebfonts showcasehttp://ow.ly/16BVGZ— http://liftux.comuses FF Dagnyhttp://j.mp/8KvDieeven on their tastycontact form
Log InEnglishCelebrating 20 years!
We welcome four new foundries toFontShop.com: Hubert Jocham, CastleType, HvD Fonts, and ReType. Seethem all.
A font to benefit victims of theHaiti earthquake.
The FontFeed is a daily dispatch of recommendedfonts, typography techniques, and inspirationalexamples of digital type at work in the real world.
Important developments, from new products tonew website features - anything that affects theway you use FontShop.com
Search for fonts...
Get StartedBrowse & buy fonts ▶Browse by Category,Foundry, or Designer. Orlet our research team dothe work for you.
Discover new type ▶Our blog is updatedfrequently with fresh fontsand recommendations, theNewsletter brings thelatest to your email inbox,or discover type in printwith FontBook.
Get smart ▶Expert advice on formats,installation, or licensing isjust a click or Call away.
Voice Embryo Goudy Trajan
Browse Fonts
CategoryFoundryDesignerRandomGallery
Top Fonts
New FontsBestsellersStaff Picks
Your Fonts
HistoryFavorites
FontFont
ONLY THE BESTCOMMERCIAL-USE FREE FONTSFree fonts have met their match. We know how hard it is to find
quality freeware that is licensed for commercial work. We've done
the hard work, hand-selecting these typefaces and presenting them
in an easy-to-use format. Here are some of our favorites:
Find Fonts
| View | Download TTFPT Sans | 8 Styles | TrueType | Paratype
| View | Download OTF (offsite)Museo Slab | 2 Styles | OpenType | Exljbris
| View | Download OTF (offsite)Museo Sans | 2 Styles | OpenType | Exljbris
| View | Download OTF (offsite)Calluna | 1 Style | OpenType | Exljbris
View | Download TTFAller | 7 Styles | TrueType | Dalton Maag Ltd | Expires: 9/1/10
| View | Download OTFQuicksand | 7 Styles | OpenType | Andrew Paglinawan
| View | Download TTFCantarell | 4 Styles | TrueType | Abattis
| View | Download OTFTitillium Text | 7 Styles | OpenType | Accademia di Belle Arti Urbino
| View | Download OTFChunkFive | 1 Style | OpenType | The League of Moveable Type
| View | Download TTFSansation | 3 Styles | TrueType | Bernd Montag
| View | Download OTF (offsite)MEgalopolis Extra | 1 Style | OpenType | SMeltery
Advertise Here
17172627913942
32426
435
1184762192111
629
Twitter | RSS Feed
FILTER
All Formats
@font-face
STYLE
BlackletterCalligraphicComicDingbatDisplayGrungeHanddrawnInitialsMonospacedNoveltyPixelRetroSans SerifScriptSerifSlab SerifStencilTypewriterTotal Families:
Font Foundries List
ABOUT
Font Squirrel is yourbest resource for FREE,hand-picked, high-quality, commercial-use fonts. Even if thatmeans we send youelsewhere to get them.
WEBFONTS!
Fontspring
FREE
MyFonts Free PageFontFont Free Fontsdafont.comFont River
DIY
Your Fonts (Handwriting)FontStruct (Modular)
OTHER
fontlover.comilovetypography.comFlickr Type PoolSmashing MagazinetypesitestypeneuNice Web Typetypegoodness
TOOLS
Font Squirrel RSS
Advertise Contact 3803859 downloads since Jan 09 | ©2009-2010 Font Squirrel. All rights reserved.
Font Squirrel
My account / Login
My shopping cart
My favorites
Font Finder Font Products Font Services Font Lounge News Support Company
Site Map Contact Imprint/Legal Terms of Use Monotype Imaging
Copyright © 2010 Linotype GmbH. All rights reserved.We reserve the right of errors and changes.
Top of pagePage last edited: 2010-02-16
presented in: Linotype Authentic™ Sans Bold
We serve all your Font and Type needs at Linotype.com
Try, purchase and download complete font families, value packs and single font weights from US$ 26.00. Weoffer you more than 12,000 original, high-quality fonts from classic to cool in OpenType, TrueType andPostScript. – Try them out!
Font Finder (Shop)
Looking for a special font?Explore the various ways to findthe font that fit your needs.more ...
Foundries and Libraries
Browse through our comprehensiveproduct catalog.more ...
Font of the Week
A literal labor of love, created byDaniel Pelavin – Save 20%!more ...
News
The new FontExplorer X productline – high-level professional fontmanagement for you.more ...
Award
Malabar received the 2010 GermanDesign Prize. Award ceremony on12th February 2010.more ...
Font Services
Take a look at our comprehensiveservices, tailored to your needs.more ...
Search for Fonts
Advanced search ...
Text Fontsfor books andmagazines
Script Fontscalligraphy,handwriting fonts
Handwriting/Grungefonts with apersonal touch
Corporate Fontsfonts forcorporate design
Celebration Fontsevents from birthdayto Halloween
Blackletter Fontsgothic, celtic fonts
Comic Fontskids and fun fonts
Western Fontsinspired bythe Wild West
Cool Fontsmodern, technical look
Screen Fontsoptimized for smallsizes
Symbol Fontspi fonts forany occasion
Linotype Top Sellers
1. Neue Helvetica®
2. Helvetica®
3. Avenir®
4. Optima®
5. Rotis® Sans Serif
Complete Font Charts …
Type News
New Font Releases
Font News
Platinum Collections
Fonts in Focus
Subscribe to ournewsletter or viewthe current issue.
Make the most outof your website –become an Affiliate!
Linotype offers allkinds of webshopping andlicensingadvantages.
BA Graphics
Linotype
➡ One Time Purchase
➡ Desktop Use
➡ Unlimited Domains
➡ Unlimited Page Views
Purchase Advantages…
What to look for in License…✓ Webfont linking in EULA
✓Compression
✓ Formats
✓ Price Structure
Licensed FontsFontSquirrel FontFont FontSpring
Webfonts
Compression
Formats
Price
560+fonts
100+families
1800+families
✔
EOT, OTF, TTF, SVG, & WOFF EOT & WOFF EOT, TTF, SVG, & WOFF
Free $80–860family/WS
Free–$100font
Easy License & Deployment
Webfont Service Bureaus
Typekit
View all news Subscribe
Featured
News
Typotheque now supports WOFF inFirefox 3.6 (25 Jan 2010) Selection of websites using Typotheque
Web Font Service (23 Jan 2010) Open Manifesto (18 Jan 2010) Gore’s choice (07 Jan 2010) Typotheque Web Font System now
supports Chrome (23 Dec 2009) New articles: Methods of distribution (21
Dec 2009)
Fonts
A contemporary typeface familyspecifically designed for the demands ofnewspaper printing; it consists of fourprimary text weights (each in threegrades) and is optimized for use at smallsizes.
T-shirts
‘A piece of text that looks good butdoesn't say anything’, printed in typefaceIrma, using its OpenType features mixingpositive and negative spaces of letters.Printed on Organic Fine Jersey T-Shirtsfrom American Apparel.
Mailing list
Add yourself to our news email list. Weuse the list to help keep you informed ofthe new fonts, special limited offers, andmajor updates. We never sell your email.Read about our privacy policy. Would youlike to unsubscribe?
your e-mail here
Articles
The articles section is our attempt tocollect relevant published and previouslyunpublished texts, not directedexclusively to academic peers andstudents, but to a broader audience ofindividuals with an interest in designcriticism, typography and graphic design.
Books
We Want You To Love Type by JohannaBiľak / Alan ZárubaThis publication presents work of 44Czech and Slovak designers, and focuseson the process of creating innovativetypographic solutions that often useexperimental processes to venture intounknown territory.
Font collection
BrioniBrioni TextFedra ArabicFedra HindiFedra MonoFedra SansFedra Sans AltFedra Sans CondensedFedra Sans CondensedAltFedra Sans Display 1Fedra Sans Display 2Fedra Serif AFedra Serif BFedra Serif DisplayFedra Serif PhoneticGreta DisplayGreta Display NarrowGreta GrandeGreta Grande NarrowGreta TextGreta Text NarrowHistoryIrmaIrma SlabJigsawJigsaw StencilKlimaxNara
Fonts in use
Search
© 1999-2010
Typotheque
➡ No license worries
➡ No cross browser worries
➡ Reduces server strain
➡ Quality Fonts
Bureau Advantages…
✓Available Fonts or Font Families
✓How Fonts are Added
✓Local Use
✓Bandwidth Usage
✓Price Structure
What to look for in a bureau…
Webfont Service BureausTypekit Kernest Typotheque
# Fonts
@font-face
Local Use
Bandwidth
Price
500+families
600+fonts
40+families
<script> <link> <link>
✔
5-500GB/month
Unlimited 500MB/month
$25-250/year
$1-75/font/year/WS
$100-900/family
Webfont Service BureausFontdeck WebType FontsLive
# Fonts
@font-face
Local Use
Bandwidth
Price
250+families
200+fonts
300+fonts
<link> <link> <link>
✔ ✔
Unlimited 1–18GBmonth
1-18GB/month
free-$12/year/font
free-$105/month/font
$10-105/font/year
Webfont Service BureausGoogle Font API Fonts.com WebInk
# Fonts
@font-face
Local Use
Bandwidth
Price
18families
7500+fonts
2000+fonts
<link> <script> @font-face
✔ ✔
Unlimited 12.5K–12.5Gpageviews/month
1-80GB/month
Free free-$500/month
99¢-$19.99/month
CHOOSINGWebfonts
web safe genericcore webwebfont
h1 { font-‐family : diavlo, verdana, arial, sans-‐serif; }
p { font-‐family : cambria, georgia, serif; }
web safe genericcore web
Choose forSelect understudy fonts with similar widths and kerning to the primary font.
consistency…
Looking GlassLooking Glass
Diavlo
Verdana
Looking GlassTahoma
Choose forSelect fonts with bold, italic, and bold/italic versions.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc sed ligula. Pellentesque non felis vel lorem tempor ultricies. Class aptent taciti sociosqu ad litora torquent per conub ia nos t ra , per inceptos hymenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In hac habitasse platea dictumst. Aenean venenatis hendrerit tellus. Nunc posuere, nulla quis sollicitudin pretium, dui mi ultricies magna, id placerat lorem.
style availability…
Cambria Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc sed ligula. Pellentesque non felis vel lorem tempor ultricies. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In hac habitasse platea dictumst. Aenean venenatis hendrerit tellus. Nunc posuere, nulla quis sollicitudin pretium, dui mi ultricies magna, id placerat lorem.
Baskerville Old Face
Choose for legibility…Select fonts with consistent weight and thickness with simple, low contrast strokes and serifs.
Looking Glass
Looking GlassWeight & Thickness Strokes & Serifs
Diavlo
Tahoma
Choose for
Looking Glass
readability…Select fonts that are well balanced between letter spacing, counter width, letter width, & x-height.
letter spacing
counter width
letter width
x-heightTahoma
Choose for optimization…Select fonts that have been specifically optimized for screen viewing.
Choose for consistencystyle availabilitylegibilityreadabilityoptimizationVOICE!!!
“Typographic gaffes will be readily visible; but that should make it even clearer when you're looking at a smart web page or a dumb one.”
Chank Dieselchank.com
2010The Year of Web Typography
2011The NEW Web Typography…Where the Sexy is!
✓Fluid Web Type
✓Nice Web Type
✓Clagnut
✓I Love Typography
Web Typography Resources
www.fluidwebtype.info
fluidwebtype.info/web-directionsQUESTIONS
jasonspeaking.com | @jasonspeaking