TYPE DESIGN INFORMATION PAGE last updated on
Tue May 22 04:19:48 EDT 2012
|
|
|
||
|
Web fonts |
| ||
|
|
|
||
24 Ways
| Jon Hicks gives a clear mini-tutorial on how to display icons in web pages using fonts (with icon symbols in them) and data-attributes using simple CSS definitions. [Google] [More] ⦿ |
In 2010, Adobe started offering web fonts via TypeKit for a fee---only Adobe Garamond is free. The fifteen re maining families are Adobe Text, Bickham Script, Caflisch Script, Chaparral, Cooper Black, Cronos, Garamond Premier, Hypatia Sans, Minion, Myriad, Myriad Condensed, News Gothic, Poplar, Rosewood, Rosewood Fill, Trajan, and Voluta Script. Mike Duggan : based on what I have seen so far at the Typekit site, the hinting does not appear to be as good as in the Adobe Web fonts of old. [Google] [More] ⦿ | |
Pankratov's advice in June 2011: @font-face for Mac, Cufon for everyone else. Some discussion follows with two points of interest, the fact that zooming---a common Apple ferature---makes Cufon files look pixelated, and the observation that Cufon-ed files are not text accessible. [Google] [More] ⦿ | |
Attila Korap | Font technology specialist at Linotype, Germany. He was born in Manisa (Turkey) in 1974 and grew up in Marburg (Germany) before moving to Frankfurt in 1994. He studied political science and computer science at the Johann-Wolfgang-Goethe Universität and later at the Fernuniversität Hagen. He joined Linotype as an intern in 2000 before becoming the full time Font Technology Specialist in 2002. At ATypI 2008 in St. Petersburg, he spoke about Automation in font production. Speaker at ATypI 2011 in Reykjavik on the topic of web fonts. [Google] [More] ⦿ |
Born in Los Altos, CA, he studied art history at the University of California at Santa Cruz and worked as a graphic designer until joining the type group at Adobe in 1997, where he assists with the design and production of Adobe's type library. He was (and still is) involved in the creation of Adobe's OTF fonts, and has a hand in both Myriad Pro and Tekton Pro. At Font Bureau in 1997, he created Elmhurst, a 7-style transitional family. FontShop link. MyFonts link. FontBureau link. Adobe link. At ATypI 2011 in Reykjavik, he spoke on CFF on the web. The abstract is quite promising and the talk may quite opossibly be the highlight of the technical program at that meeting: Digital type outlines are described, for the most part, in either of two fundamental formats: PostScript or TrueType. Today, OpenType fonts convey PostScript outlines with CFF (the Compact Font Format), which is an optimized successor to the original Type 1 font format. Although the world of print output has been dominated by PostScript Type 1/CFF, the TrueType format has prevailed in the Windows and Mac OS operating systems. TrueType is well known for its accommodation for extensive hinting instructions, evident in many Windows core fonts which have become de facto standards on the web.In the explosion of web fonts during recent years, TrueType's reputation as a screen font format and its superior rendering in Windows browsers has made it a virtual requirement for those seeking consistency and quality in type rendering with web fonts. However, with recent improvements in text rendering from Microsoft's DirectWrite, CFF rendering quality will soon be comparable to TrueType in the next generation of Windows browsers. Despite its second class status on the web today, CFF still possesses advantages worth assessing as its rendering quality on screens approaches parity with TrueType. For example, CFF is inherently compact, and its PostScript (Bezier) paths are the default format for virtually all font designers. This presentation will explain the technical and practical advantages of the CFF font format and compare them to TrueType. It will examine what the future holds for CFF as a web font format, and make the case for CFF as a worthy, if not superior, solution for web typography. [Google] [MyFonts] [More] ⦿ | |
Comparing Open Source Fonts
| Comparison in May 2010 of the Google Font Directory fonts by Colin Fahrion. For each font, in Windows Cleartype, Windows Standard, and Windows No Aliasing modes, he list pixel sizes for which each font is "best viewed at or above", "ugly at" and "illegible at". Across the board, the Droid fonts outperform the others: The Droid Family is the only font in this set that I would use for body text. All others are only suitable for headers or display text. And I would avoid using Inconsolata, Tangerine, Josefin, and Cardo except at really large display sizes (36px or larger). [Google] [More] ⦿ |
Free Firefox add-on. It displays the size (in px), font-family (the one chosen by Firefox from the font-family listing), font-style, font-weight, and font-variant of selected text in the context menu. Also displays the downloadable font files for the font if specified by a @font-face rule. [Google] [More] ⦿ | |
Here we'll explore the nexus of legal rulings, Capitol Hill policy-making, technical standards development, and technological innovation that creates -- and will recreate -- the networked world as we know it. Among the topics we'll touch on: intellectual property conflicts, technical architecture and innovation, the evolution of copyright, private vs. public interests in Net policy-making, lobbying and the law, and more. [Google] [More] ⦿ | |
A style sheet example for creating useful colored variabl-size icons for web sites. [Google] [More] ⦿ | |
The headline of this page is jibberish: Cufon plug-in directory for the most commonly used in the world you've made the font from which you access all the fonts cufon file. Anyway, there are a few thousand fonts here. The majority of fpnt downloads are not functional. One can also manually download Cufon style font files. Plus: nice font previews. Minus: no infrmation on the font creators. [Google] [More] ⦿ | |
Custom Fonts for the Web | We are in November 2008. The proposals for font usage on web pages are coming in from all sides. These include
|
He designed La Avería en El Ordenador (2011, OFL), an average of all 725 fonts on his computer. The fontfamily was split into Avería, Avería Sans and Avería Serif. Now, this may seem like a simple thing, but it is not! He took almost a year to complete this task, giving it a lot of thought. In the process, he created Font Path Viewer, a free web app for viewing the font outlines (with control points) of all fonts on one's system. He did the following clever thing: each font contour was split into 500 equal pieces (a serious exercise for Bezier fanatics), numbered from 1 to 500, and all 500 positions were averaged (over the fonts on his system) to obtain Avería. Interpolations between fonts have been attempted before (see Superpolator, or Font Remix), but to have it automated in this way is quite another achievement. More images of Avería: i, ii, iii. Averia Serif Libre (2012) exists in six styles, and there are also the Averia Libre, Averia Sans Libre and Averia Gruesa Libre families. These are available from Google Web Fonts. So, here is my small request for Dan: build an on-line tool, based on the Bezier outline cutting principle you pioneered, for interpolating between two typefaces. The user would submit two fonts, and the interpolation would be shown on the screen after a couple of seconds. I am sure you can do it! Abstract Fonts link. Google Plus link. Dafont link. Fontspace link. [Google] [More] ⦿ | |
The entire text below is due to David Brezina, 2010. I think we (type designers) maintain an old illusion about how our market works. People do not buy fonts because they could not get them for free anywhere else. They buy them out of sympathy, understanding the value of our work and/or legal reasons. They could get them for free, easier, and faster (!). It is not that we would be shooting in our faces. It is more like we have been shot already. We already accepted the piracy as a burden of our business. If I am right in this view, we do not need any kind of DRM. The expected "new" web piracy won't change a thing. I would very much like to see some study or educated estimate re this view. Or at least an authoritative opinion. It is crucial information for designers in order to evaluate the formats properly. Otherwise, they are just left aiming for the most security. What we, however, want is a tool to limit webfont licences exclusively for web. We want to make a profit out of this #webrisk and keep distinction between web and print fonts. Why? If I am not sure whether opening my fonts for web use is going to make me money I would rather keep the new market separated from the old working one. That is the motivation behind the web-specific format. Acceptance of non-security, but limited to web. Personally, I think that opening to web market is surely going to make a profit. An objectively, we are not going to have strictly (that is: not-convertible) webspecific format ever. Not with current technologies where the fonts are described with curves. The only option I see is bitmap fonts &c. .webfonts is just bundled metadata with print font (we can have them in OT table as Berlow suggest, why another format simple-to-hack when most are not going to care?), EOT Lite is a very thin wrapper as far as I understood, but at least not so trivial. It will become easy convertible (assumption), but at least something. Typekit and similar tools offer only limited security by obfuscation. So far too easy to circumvent. These techniques are not imo worth complicating life of paying customers. Even though the interface is sexy, it is still another interface. Therefore: prepare the fonts for web (have them subsetted, add web exclusive license, permission tables, and go naked! Or if you are shy, have EOT Lite. Sidenote about obfuscation methods. Some of them impair the fonts' kerning and OT features. Not a good idea. My concern is purely of egoistic designer. With my limited abilities I tried to produce as good font as possible and I don't want crippled copies of my font ripped off from various webservices floating around. I want constant quality of my work world-wide, nothing smaller, if possible. The very first person who paid a compliment to my typeface on web was the one who posted it on a Russian download server (being it ripped from my MATD PDF specimen). Just thought it illustrates the situation pretty well. :-) [Google] [More] ⦿ | |
At his home page, one can look at his beautiful all-caps geometric grotesque Curtis CSS (2010)---this typeface was entirely coded using CSS primitives! [Google] [More] ⦿ | |
Dawn Shaikh | Dawn Shaikh received her PhD in human factors psychology in 2007 from Wichita State University. Throughout graduate school, she worked on a grant from Microsoft's Advanced Reading Technologies group. Her master's thesis focused on line length in news&narrative articles. She worked on the legibility of ClearType fonts, and on that of onscreen fonts. Her dissertation focused on the perception of typeface personality. After graduation, ironically---despite Microsoft scholarships throughout her life---, she joined arch enemy Google, where she worked on Google Web Fonts, Docs, Ebooks, Android, and Internationalization. Speaker at ATypI 2011 in Reykjavik on the topic of typefaces for Android OS (with Steve Matteson). [Google] [More] ⦿ |
Carlsbad, CA-based creator of the Pictos1 and Pictos2 series of commercial dingbats. He drives home the point that for icons and logos, one can now use CSS and @font-face to use scalable fonts instead of static images. [Google] [More] ⦿ | |
Dynamic fonts | Dynamic fonts are fonts formatted in such a way that they can be either automatically grabbed from the author's site or embedded in an html page. This insures that the html page reader sees the page in the intended font, which is especially useful for non-standard scripts. Two competing formats exist today, PFR (Portable Font Resource) and EOT (Embedded Open Type). Tools exist to create PFR or EOT files from TTF files. PFR is supported in Netscape 4.0 and above. EOT is supported in Internet Explorer 4.0 and above. It is Bitstream/Truedoc (PFR) versus Microsoft (EOT). Why the original TTF files could not have been used for this purpose, only the devil knows. Tools to create these dynamic fonts are here: [Google] [More] ⦿ |
Embedded Open Type
| Dave Crossland discusses EOT. He states seven reasons why it is wrong:
|
Charlie Ruland's free tool for previewing EOT font files created by Microsoft's WEFT or other EOT-creating programs. The current version is 1.4.1. [Google] [More] ⦿ | |
The Embedded OpenType File Format (EOT) was developed by Microsoft to enable TrueType and OpenType fonts to be linked to web pages for download to render the web page with the font the author desired. This link prepared by Paul Nelson (Microsoft) specifies the format of the EOT file so that authoring tools can create embedded or linked fonts and add them to a page, and servers serving web content can serve font content with web pages, and 3) User Agents may download, extract and temporarily install fonts of the EOT file suffix that are included in the @font-face definition of a CSS style sheet. It is a dynamic font format supported in Internet Explorer 4.0 and above. It permits an author's font to be used in an html page without explicit downloading. Developed and marketed by Microsoft to choke the competition (Bitstream/Netscape/Truedoc's PFR), the format can be obtained from a truetype or opentype file by using WEFT. [Google] [More] ⦿ | |
EOT versus OT, part I | [Written in September 2008.] When a web page designer wants you to see a page in a certain font, one simple solution would be to provide a copy of the font with the web page. But fearing yet another loss of precious font data, and unaware that even scarier things will be served in the next few years, Adobe and Microsoft (as explained by Thomas Phinney) are plugging another font format to be attached to web pages, the EOT or Embedded OpenType file format. Again, there is nothing Open about this format, as it was initially designed to have an obfuscated structure. In 2008, the specs came out, but the EOT format was not directly usable in common operating systems. Adobe hoped that people would feel more secure about putting fonts up for download in EOT format. Phinney: If an end user wants to take an EOT file and convert it, there won't be anything physically stopping them. But it will be difficult for them to be unaware that what they are doing is usually wrong and illegal (dependent on the copyright and licensing status of the font in question). Adobe and Microsoft hoped that EOT would take off. The truth is that if it does, then surely someone will write a good font converter to extract the font data. At that point, Adobe and Microsoft will probably suggest something else. The success of EOT will be its undoing. In the meantime, Adobe was proactive (still in 2008): Adobe is strongly supportive of the effort to make Microsofts EOT web font format an open standard. Indeed, Adobe pays for Steve Zilles' time, and he will be chairing the EOT standardization effort, should the W3C accept the proposal in principle. We will be updating our licensing FAQ to make it clear that our existing font license terms allow EOT usage, and do not allow linking to original fonts placed on web servers. And simultaneously, the race is on for young computer scientists: who will write the first EOT to TrueType or OpenType converter? Please liberate us from yet another "font format"! Note added in 2009: EOT seems to lose out against WOFF, according to the reactions heard at ATypI 2009 in Mexico City. [Google] [More] ⦿ |
EOT versus OT, part II | [Written in September 2008.] EOT is the Embedded OpenType file format proposed by Adobe and Microsoft for embedding into web pages. OT is the well-known OpenType format. Adobe wants to convince font designers that it is safe to let people use EOT. But think about it---if EOT does a good job, then it must contain the same information as OT. In other words, from an information-theoretic viewpoint, they are equivalent. Just consider these scenarios.
|
Free software sponsored by Readable Web (Richard Fink) for transforming truetype files into EOT files. [Google] [More] ⦿ | |
A free on-line test tool for checking fallback font choices in CSS statements. [Google] [More] ⦿ | |
Font Burner uses a technology called Scalable Inman Flash Replacement (sIFR) to change the fonts in the headlines of your site. Basically it hides the headline and puts a Flash file in their place. The Flash file is able to render the font without breaking the usability of your site. SIFR is an open source project available to one and all through novemberborn.net. After you find the font that you would like to use, Font Burner gives you a chunk of code that you will insert into the head of your webpage. The font searching is from a list of about 1000 fonts archived on their site. Unfortunately, the font designers are not identified! The embedded code looks like this (for the font Andron Scriptor): [Google] [More] ⦿ | |
Font Dragr
| A free web font tool by Ryan Seddon: Quickly test those new fonts. Drag and drop your truetype (ttf), opentype (otf), scalable vector graphics (svg) or Web Open Font Format (WOFF) fonts in the left hand side module and it will be added to the list. The last font dropped will change the font-family of this text and the above title. [Google] [More] ⦿ |
An on-line utility for testing fonts for use on web pages. Their blurb: font dragr allows you to easily test custom fonts, through the @font-face at-rule, without the need for any CSS coding or knowledge of CSS coding. All you need to do is drag and drop. [...] It's incredibly easy to use. All you need to do is drag and drop a font file from your computer into font dragr in a supporting browser (Such as Firefox 3.6+ or Chrome 6+). [Google] [More] ⦿ | |
Font Squirrel
| Ethan Dunham's list of free fonts from and for professional type designers. The archive is huge (622 at the end of 2010) and clearly organized. There are useful @font-face kits to help users place these fonts on their web sites. Newly added faces. List of foundries. Ethan Dunham also runs a similar commercial web font service, Fontspring. [Google] [More] ⦿ |
FontAwesome
|
|
FontConf --- The Unconference for Web Fonts
|
|
Clearleft and OmniTi present Fontdeck, a web service delivering real fonts to your website. Foundries that participate here include TypeTogether, URW++, Parachute, PSTypeLab, and Insigne. [Google] [More] ⦿ | |
An on-line tool for testing fonts on live web pages, brought by WebINK. [Google] [More] ⦿ | |
Fontfeest
| A free webfont service run by Dutchman Gerard Salomons. [Google] [More] ⦿ |
FontFonter
| A web tool by Tim Ahrens and FontShop, dated 2010: enter a web address and try out various web fonts directly. It did not work for me (iMac, Google Chrome, my own pages). [Google] [More] ⦿ |
FontHead Design
|
Fonts created in 1999: AppleSeed, Caterpillar, Chinchilla, ChinchillaBlack, ChinchillaDots, CrowBeak, CrowBeakLight, CyberMonkey, DanceParty, DingleHopper, FourScore, FourScoreTitling, Hopscotch, HopscotchPlain, Ladybug, Leaflet-Regular, LeafletBold, LeafletLight, ReadOut, ReadOutSuper, Smoothie, Swizzle, TwoByFour, VeryMerry. Made in 2001: ButterFinger, ButterFingerSerif, CatScratch, Catnip, FighterPilot, FrenchRoast, Handheld, HandheldItalic, HandheldRaised, HandheldRaisedItalic, HandheldRound, HandheldRoundItalic, Kingdom, OldGlory, Quadric, QuadricSlant. MyFonts page. In 2006, several dingbats fonts were added, such as the ClickBits Arrow series and the ClickBits Icon series. In 2008, he created InfoBits Things and InfoBits Symbols, Abigail, Assembler, Click Clack, Drawzing (children's font), El Franco (grunge), Good Dog New (handprinted), Helion (futuristic), Lead Paint (brush), Schema (architectural lettering), Skizzers (handprinted), Tachyon (2008, techno, futuristic). Free font download. This place has Allise, Americratika, AppleSeed, AsimovSans, Asterix-Blink-Italic, Asterix-Blink, Asterix-Italic, Asterix-Light-Italic, Asterix-Light, Asterix, BadDog, BattleStation, Beckett, Bessie, BlackBeard, Blearex, BlueMoon, Bonkers, BraveWorld, Brolga, BrownCow, Carnation, CatScratch, Caterpillar, Chinchilla, ChinchillaBlack, ChinchillaDots, CircusDog, CornDog (2004), Croissant, CrowBeak, CrowBeakLight, CyberMonkey, DanceParty, Dandelion, Dannette-Outline, Dannette, DayDream, Democratika, Diesel, DingleHopper, DoomsDay, DraftHand, Flowerpot, Font-Heads, FourScore, FourScoreTitling, FunkyWestern, Goliath, GoodDog-Bones, GoodDog-Cool, GoodKitty, Greyhound, Grimmy, Gritzpop, GritzpopGrunge, Gurnsey20, HandskriptOne, Holstein-Bold, Holstein, HolyCow, Hopscotch, HopscotchPlain, HotCoffeeFont, HotTamale, Isepik, JohnDoe, JollyJack, Keener, Klondike-Bold, Klondike, Ladybug, Leaflet-Regular, LeafletBold, LeafletLight, LillaFunk, LogJam-Inline, LogJam, MargoGothic, MarvelScript, MatrixDot-Condensed, MatrixDot, Mekanek, Merlin, Millennia, Mondo-Loose, MotherGoose, Navel, Network, Noel, NoelBlack, Oatmeal, Orion, Pesto, Randisious, ReadOut, ReadOutSuper, RedFive, Rochester, Samurai, Scarecrow, Scrawl, ShoeString, ShoeStringRound, SlackScript, SloppyJoe, SmithPremier, Smock, Smoothie, SororityHack, SpaceCowboy, SpillMilk, Sputnikk, StanLee-Bold, StanLee-BoldItalic, StanLee-Regular, Stiltskin, Submarine, Swizzle, TekStencil, Teknobe, Torcho, ToucanGrunge, TwoByFour, Tycho, Typewriter2, TypewriterOldstyle, VeryMerry, Vladimir, WashMe, Watertown-Alternate, Watertown-Black, Watertown-Bold, Watertown, ZipSonik-Italic, ZipSonik, ZipSonikSketch-Italic, ZipSonikSketch. Font Squirrel carries ElliotSix (simple handwriting), GoodDog (children's hand) and Millennia (squarish). In fact, in 2009-2010, Ethan Dunham became a very active web font persona, offering a commercial web font service, Fontspring, and a free font service, Fontsquirrel. [Google] [MyFonts] [More] ⦿ |
Web font software by Roman Shmelev and Vitaly Puzrin. With it, one can choose symbols from various fonts, combine and merge them into a new font, and generate such subsetted fonts. This is especially useful for selecting icons. [Google] [More] ⦿ | |
Another web fonts site with both free and for-pay fonts to be served with @font-face. [Google] [More] ⦿ | |
The font subpages at the San Francisco-based computer software site GitHub. Most links are for apps and small utilities related to fonts. [Google] [More] ⦿ | |
Google and Web Fonts
| Adam Pope in May 2010 on Google's entrance into the web font scene. [Google] [More] ⦿ |
Google's answer to web fonts, including a directory of over 170 free fonts. Their goal is to have 1000 fonts by the end of 2011. Download all fonts in one 36MB file. Blog. On May 19, 2010, Typekit announced and open source collaboration with Google called the WebFontLoader: Now you can have complete control over how fonts are loaded and what happens when they're rendered. You can download the code and use it however you like, or link directly to the latest version via the Google Ajax APIs. [...] You can use WebFont Loader with fonts on your own server, links to the just-announced Google Webfont API, or any Typekit account. We've also made sure the code is modular, so other font hosting services can add to it in the future. [Google] [More] ⦿ | |
On-line tool for creeating the necessary style code snippet for including a Google Font Directory font in a web page. [Google] [More] ⦿ | |
Demo (in Dutch) on how to use the google fonts. See also here and be sure to check the source code. [Google] [More] ⦿ | |
| |
Software engineer and CEO of Small Batch Inc. Founder in 2008 of San Francisco-based TypeKit, a commercial project for serving fonts (free and for a price) on web pages---the model is that an annual fee is paid for using a commercial font on pages of a given domain. He spoke at ATypI 2009 in Mexico City about this. The Typekit blurb, as of 2011: Built around web standards, our service gives designers and developers a subscription-based library of hosted, high-quality fonts to use on their websites. We have over 250,000 customers including some of the largest sites on the web today: The New York Times, Conde Nast, IGN, Twitter, and many others. We are also actively integrating Typekit into hosted platforms---such as WordPress, TypePad, and Posterous---so that anyone with a website can use real fonts. [Google] [More] ⦿ | |
John Daggett | Software engineer at Mozilla, based in Tokyo. Among other things, he is involved in the development and research on web font technologies, and is part of the Mozilla team that proposed WOFF as a web font format in 2009. [Google] [More] ⦿ |
Jonathan Kew | Software engineer at Mozilla in Thame, Oxfordshire, UK. Among other things, he is involved in the development and research on web font technologies, and is part of the Mozilla team that proposed WOFF as a web font format in 2009. [Google] [More] ⦿ |
From March 10-15, a conference was held at Las Vegas in which Jonathan Snook explained the web type situation. A summary by Luke Wroblewski:
| |
Just Another Foundry
|
At ATypI 2008 in St. Petersburg, he spoke about Font Remix Tools and on Optical Sizes. In 2010, he started a web font service. In 2011, I found his name listed as an employee of the web font service Typekit. Abstract Fonts link. MyFonts page. FontShop link. Linotype page. Home page. Klingspor link. [Google] [MyFonts] [More] ⦿ |
Kernest
| |
Lettering.js
| Advice and examples of a jQuery plugin for making nice headlines on web pages. [Google] [More] ⦿ |
A project started by FontShop in 2011---one can buy handpicked FontShop fonts for installation on mobile computer devices. [Google] [More] ⦿ | |
Monotype Imaging Holdings Inc. is accepting entries through Nov. 7, 2010 for the first Web Font Awards, an international competition designed to recognize web sites that incorporate exceptional use of Web fonts. Prizes include two $3,000 cash awards, Apple iPad mobile digital devices and various typeface offerings from Monotype Imaging. Winning entries will be determined at a live judging event on Nov. 16, 2010, during the Future of Web Design conference, Nov. 15-17, in New York City. Winning entries of the Webfont Awards, in order: (1) The fifth issue of the German design magazine, Design Made in Germany, set in FF DIN, and designed by Martin Rack, (2) Armin Vit's Quipsologies, a division of UnderConsideration, uses Typekit fonts, (3) The German real estate database Markert Immobilien, which uses DIN Web Pro. A brief post mortem: This contest was all about web page design---it had nothing to do with type design. I will not report on similar contests in the future. [Google] [More] ⦿ | |
MyFonts selection for the six Windows Vista fonts, now sold by Ascender. [Google] [More] ⦿ | |
MyFonts listing of fonts that are appropriate for web graphics. This includes both icons or dingbats, and alphabets. [Google] [More] ⦿ | |
Link pages realted to font choices, CSS, and web typography. [Google] [More] ⦿ | |
Nice Web Type
| Tim Brown discusses web typography. A bit in blog format. [Google] [More] ⦿ |
Omnibus (est. 2011) is a coop that focuses on web typography and high quality web fonts. They released Rosario (2011, Hector Gatti), Unna (2011, Jorge de Buen), Chivo One (2011, Hector Gatti), Asap (2012, Pablo Cosgaya) and Sansita One (2011, Pablo Cosgaya). All can be found at the Google Font Directory. All designers are from Argentina and Mexico. Another URL. Google Plus link. Fontsquirrel link. Catalog of typefaces. [Google] [More] ⦿ | |
Free on-line font converter (truetype, dfont, opentype). I checked this out, and have to warn people not to use it---it does not preserve several tables. Most importantly, the "name" table is lost in the conversion. Furthermore, this may be a way of grabbing your font. One should do these delicate tasks with trusted software on one's own computer. Nevertheless, if you insist, here are the formats between which it converts: .dfont .eot .otf .pfb .tfm .pfm .suit .svg .ttf .pfa .bin .pt3 .ps .t42 .cff .afm .ttc and .woff. [Google] [More] ⦿ | |
Technical guy who offers CSS and javascript tips regarding fonts and @fontface in web pages. Plenty of technical discussions in blog format. His comments on the Google Webfont API in 2010, right about the time he joined Google Chrome. [Google] [More] ⦿ | |
PFR stands for Portable Font Resource. It is a dynamic font format supported in Netscape 4.0 and above. It permits an author's font to be used in an html page without explicit downloading. Developed and marketed by Bitstream/Netscape/Truedoc, the format can be obtained from a truetype file by using tools provided by truedoc. [Google] [More] ⦿ | |
Raphaël
|
|
Readable Web
| Web type news, edited by Richard Fink (Naples, FL), a web developer, research analyst, journalist and critic. [Google] [More] ⦿ |
Richard Fink on web fonts
| On the topic of Google's entrance into the web font feeding frenzy, I align myself a lot with Richard Fink's comments---they seem closest to "reality", if this exists at all in the virtual circus. Some excerpts.
|
A useful on-line tool for recognizing symbols. It returns unicode characters in decreasing order of likelihood. Great tool! [Google] [More] ⦿ | |
Slideshare has a number of slide presentations on web typography and web fonts. One I particularly like is called To ell with Web Safe Fonts. [Google] [More] ⦿ | |
A free web font tool by Soma Design. They write: FontFriend is a bookmarklet for typographically obsessed web designers. It enables rapid checking of fonts and font styles directly in the browser without editing code and refreshing pages. 2.0's killer feature is instant drag-and-drop font previewing right in the browser (Firefox 3.6+ only), in any document you're currently viewing. [Google] [More] ⦿ | |
We are in April 2010, and Apple has just launched its iPad. Stephen Coles is not happy with Apple in general, and summarizes Apple's typographic disasters. Some passages: The string of odd missteps began with the release of Mac OS X. Amid a bunch bundled fonts not worth mentioning, the system came with Lucida Grande, an excellent screen font family based on Kris Holmes' Lucida Sans. The clean, readable face, contemporary but fairly neutral, was used throughout the OS X interface and embraced by web designers (along with its Windows equivalent Lucida Sans Unicode) as their go-to family for small text. Yet, to this day, there is no Lucida Grande italic. I can't explain why, and neither has anyone at Apple. This is the short and simple reason why sites like Facebook don't use italic. If you design with Lucida your options for emphasis and hierarchy are limited to size and weight. Meanwhile, Microsoft - the company that traditionally eats Apple's dust in design - worked with some of the world's best type designers to develop the ClearType fonts, six complete families designed specifically for the screen. A lack of Lucida Italic could be considered a mild irritant, but Apple's typographic neglect in OS X ran deeper. The system came with a font manager that was, until recently, the least reliable software bundled with a Mac. Even now it has has a reputation that belies Apple's high customer satisfaction. The words "Font Book" are often accompanied with "sucks" and "hate". Then came the iPhone, its fantastic display with a high pixel-density enabled legible type at small sizes. But Apple essentially erased that potential by choosing Helvetica as the iPhone's system font. Sure, Helvetica is a graphic designer's favorite, but its closed forms and tight spacing hinder reading, especially when small. It was a classic style-over-substance decision. The even more egregious spit in the face of readability was forcing Marker Felt users of the Notes app. More often than not, Apple's recent decisions about type either ignore its importance or value form over function. The iPad represents a new opportunity to reverse this trend. A device designed for media consumption could validate Apple's dedication to design by emphasizing design's most basic element: typography. But so far, it flops. [And he goes on with details about the iPad's flaws in the typography department.] [Google] [More] ⦿ | |
| |
Technical Web Typography
| Harry Roberts deal;s with the technical aspects of web typography. This is very detailed and quite an instructive read. [Google] [More] ⦿ |
The sad state of web fonts embedding
|
@font-face { font-family: "Your typeface"; src: url("filename.eot"); src: local("Postscript name"), local("FontName"), url("filename.woff") format("woff"), url("filename.otf") format("opentype"), url("filename.svg#filename") format("svg"); } [Google] [More] ⦿ |
Three CSS Typography Tools For Web Designers
| Jennifer Farley introduces Typechart, Typefolly and CSS Type Set. [Google] [More] ⦿ |
A great article by Toni Kukurin from 2010 entitled An Analysis of Typography on the Web explains the basic rules and tricks for designing solid and readable web pages. [Google] [More] ⦿ | |
ttf -> eot
| A free on-line tool by Sebastian Kippe to convert truetype files into EOT files. [Google] [More] ⦿ |
ttf2eot
| A free on-line conversion service called ttf2eot developed by Noah Petherbridge. He explains: This web tool is a front-end to the ttf2eot converter program, written by taviso. Noah merely wrote this front-end. [Google] [More] ⦿ |
A free Windows utility ttf2eot at this Brazilian site allows one to convert truetype files into EOT files. [Google] [More] ⦿ | |
ttf2eot
| Small free utility (by "Taviso") to convert truetype fonts to EOT (embedded OpenType). EOT is used by Internet Explorer to support css @font-face declarations. The developer is Taviso. A front end to this software was written by Casey Kirsle in 2009. [Google] [More] ⦿ |
ttype
| Henrique Gusso's on-line font selection service. It eventually leads to a MyFonts link. [Google] [More] ⦿ |
Type Browser
| Free utility for viewing web fonts in a browser developed by Per Sandström. Alternate URL. The blurb: Type Browser helps you get a good overview of how a font looks on the web. It's all HTML/CSS/JavaScript and can easily be used on locally on your computer. Convert your fonts to the various web formats using FontSquirrel's @font-face generator. The site also carries a number of free fonts: Blackout-2AM, ChunkFive, GoudyBookletter1911, Junction, LeagueGothic, OFLGoudyStMTT-Italic, OFLGoudyStMTT, Orbitron-Black, Orbitron-Bold, Orbitron-Light, Orbitron-Medium, ProcionoTT, Raleway-Thin, Sniglet. [Google] [More] ⦿ |
Type-a-file
| Russ Maschmeyer's absolutely great HTML / CSS code for typesetting web pages. [Google] [More] ⦿ |
TypeFolly
|
|
Web font server service based in Springwood, Australia. [Google] [More] ⦿ | |
Typekit
| Typekit was founded by Ryan Carver, Bryan Mason and Jeffrey Veen in 2008, and is located in San Francisco. Typekit, the software, is a 2009 pay-as-you-go proposal for web page fonts, but there is a monthly bandwidth limit: We've been working with foundries to develop a consistent web-only font linking license. We've built a technology platform that lets us to host both free and commercial fonts in a way that is incredibly fast, smoothes out differences in how browsers handle type, and offers the level of protection that type designers need without resorting to annoying and ineffective DRM. As a Typekit user, you'll have access to our library of high-quality fonts. Just add a line of JavaScript to your markup, tell us what fonts you want to use, and then craft your pages the way you always have. Except now you'll be able to use real fonts. This really is going to change web design. We'll be launching this summer with a great collection of beautiful and hardworking typefaces. We'll offer a free version of the service to get you started, and a low-cost way to grow from there. A truly scalable professional version will follow soon after. Interview with Bryan Mason. As of 2011, the only type designer on staff is Tim Ahrens. In October 2011, Typekit was acquired by Adobe. [Google] [More] ⦿ |
Web font hosting services
| Sylvia Egger compares 13 web font hosting services: Google fonts, Fontdeck, FontsLive, Fonts.com (Monotype), Typekit, WebINK, Webtype, Just Another Foundry, Typonine, Typotheque, Kernest, FontServe, TypeFont. [Google] [More] ⦿ |
Hosting and related web font services, as posted in May 2010 on typophile:
| |
Web Font Specimen
| Tim Brown tries to improve web typography. His web font specimen demo is very useful. Free prototype pages for font testing using @font-face. [Google] [More] ⦿ |
| |
An on-line discussion and comparison of @font-face, cufon and sIFR by the people at Odopod in 2009. [Google] [More] ⦿ | |
Web font blog and web fonts news page. No indication who owns or runs this. [Google] [More] ⦿ | |
Hosting for web fonts, by Extensis, the makers of Extensis Suitcase font management siftware. The web page does not permit easy browsing of the catalog. Also, most importantly, and indicative that money and only money matters, type designers are not identified. How can one sell URW Grotesk without tipping a hat to or even mentioning Hermann Zapf? [Google] [More] ⦿ | |
Webtype
|
Webtype comments: The quality of the type seems to be fine. I think that in their pricing, they underestimated the traffic level by a factor of ten, which will end up costing users a lot of money. I explain. Let's say that you have about 600,000 unique visitors per month. At 18GB monthly traffic---their basic pricing level for that number of unique visitors---, individual fonts cost 100k per year and up. If each unique visitor looks at only 3 pages, each containing one font (assumed to take 10k worth of space, as a lower bound---it is usually much more), then we are looking at 18GB monthly traffic. So, any additional traffic (several fonts per page, more active unique visitors, and traffic from repeat visitors) will easily bump up the bill because additional traffic above 18GB is linearly priced. The pricing improved slightly in 2011. For a million pageviews, one starts paying about 160 dollars per year. Pricing will be in flux because I have a feeling that we will see Chinese and Indian web type operations at a fraction of the prices now shown---in fact, we have seen nothing yet. [Google] [More] ⦿ |
Whatfont Bookmarklet
| A small free tool, to be placed in the bookmark bar of a web browser. It permits one to see what font is being used in text that is visited by one's mouse. By Chengyin Liu. [Google] [More] ⦿ |
Microsoft's new Cleartype collection (released in 2006 after years of preparation) available here for free download in truetype format (and also sIFR format). These fonts are now sold by Ascender. The fonts are: Calibri, Calibri-Bold, Calibri-Italic, Calibri-BoldItalic, Cambria, Cambria-Bold, Cambria-Italic, Cambria-BoldItalic, Candara, Candara-Bold, Candara-Italic, Candara-BoldItalic, Consolas, Consolas-Bold, Consolas-Italic, Consolas-BoldItalic, Constantia-Regular, Constantia-Bold, Constantia-Italic, Constantia-BoldItalic, Corbel, Corbel-Bold, Corbel-Italic, Corbel-BoldItalic. See also here and here. The OpenType versions are automatically installed when one downloads the beta 2 of Office 2007 or The Microsoft Office Compatibility Pack for Word, Excel, and PowerPoint 2007 File Formats (Beta 2). Comments by Poynter Online. Another download site. Candara download. Zip file with the fonts. Calibri source. Jeff Atwood claims that Consolas, which was designed for ClearType, can barely be used without it. [Google] [MyFonts] [More] ⦿ | |
WOFF: Opinion from Mozilla | October 2009. I was given permission by John Daggett and Jonathan Kew from Mozilla to post this piece on my web site---it was in response to something I wrote earlier, and clarifies the situation. The tool for making woff2ttf is trivial, a novice Python/Perl programmer could write it in a couple hours. Most font designers involved in discussions on www-font realize this, they're more concerned about trivial piracy where someone simply copies a font on a webpage to their fonts folder. I've repeatedly said that the difference between that and an obfuscated format is trivial but that example *always* comes up in discussions. For us, WOFF is compressed so it does offer some advantages (nothing HTTP compression couldn't solve) and there is ability to decompress on a per-table basis so that a font is only decompressed under certain conditions. Here's an interesting description of the state of things that a coworker wrote, I think it sums up things nicely: Some font creators would still prefer stronger "DRM-like" protection of some kind, but I think most have accepted that this is not going to happen in an open-standards Web, and even that it's not technically feasible: if the fonts can be used at all on the user's computer, they can also be pirated (so it's not just that the free browser developers are being obstinate!). For the most part, though, the vendors' position was that they wanted a distinct format that would differentiate "web fonts" from "desktop fonts", and make the act of taking a web font and installing it for local desktop use something that involves a deliberate act of conversion to circumvent this distinction. The common analogy was a "garden fence": it doesn't keep out a deliberate intruder, but it indicates the boundary of the property, so that a passer-by is aware that stepping over it may constitute an act of trespass. The other key factor is the expectation (it's not part of the WOFF spec as such, but of how browsers are expected to implement it -- eventually part of a W3C recommendation around @font-face, most likely) that same-origin controls will be used to prevent cross-site linking, both for licensing and bandwidth concerns, except where a font-hosting site makes a deliberate choice to permit it (e.g., openfontlibrary.org). In general, the vendors seem to have accepted that browsers will not be agents of license enforcement for them. By supporting a distinct web-only format (i.e. WOFF files won't "just work" if you drag them from the browser's cache to your Fonts folder), and allowing them to attach metadata to the files, we're giving them a model where they feel the threat of rampant, often unconscious, piracy is reduced, and where they have some possibility of tracking abuse if they wish (e.g., a vendor could easily "watermark" the WOFF files they deliver to customers, and use a web crawler to look for copies being used by others). They realize that there's no ironclad protection, but we're giving them a compromise -- a level of risk -- they feel they can live with. [Google] [More] ⦿ |
WOFF specs prepared in October 2009 by Jonathan Kew (Mozilla Corporation), Tal Leming (Type Supply), and Erik van Blokland (LettError). A WOFF font file is simply a repackaged version of a sfnt-based font (truetype, opentype) in compressed form. The format also allows font metadata and private-use data to be included separately from the font data. WOFF encoding tools convert an existing sfnt-based font into a WOFF formatted file, and user agents restore the original sfnt-based font data for use with a webpage. [Google] [More] ⦿ | |
A heated discussion in October and November 2009 regarding WOFF and type delivery on the web. [Google] [More] ⦿ | |
October 2009: Mozilla announces that Firefox, in its next update, will support the Web Open Font Format (WOFF). Conceived by Mozilla's own Jonathan Kew and font-designer/programmers Erik van Blokland and Tal Leming, WOFF addresses the concerns about unlicensed distribution expressed by many font-designers and, at the same time, holds the promise of a web-friendly, interoperable font format for the future. In the specs of this compressed format, one reads: This document specifies a simple compressed file format for fonts, designed primarily for use on the web. The WOFF format is directly based on the table-based sfnt structure used in TrueType[1], OpenType[2] and Open Font Format[3] fonts, which are collectively referred to as sfnt-based fonts. A WOFF font file is simply a repackaged version of a sfnt-based font in compressed form. The format also allows font metadata and private-use data to be included separately from the font data. WOFF encoding tools convert an existing sfnt-based font into a WOFF formatted file, and user agents restore the original sfnt-based font data for use with a webpage. Here are my reactions:
| |
WOFF2OTF and OTF2WOFF are two free on-line conversion tools between the ".woff" web font format and OpenType (.otf). Similar converters are available for TrueType (ttf) and ttc formats, to and from woff. This, I think, is the last nail in woff's coffin. No commercial foundry will ever again agree to have their fonts used in ".woff" format. I did not test the tool, so I cannot attest to the losses incurred in the conversions, and I cannot judge the quality of the conversions. Feedback welcome. [Google] [More] ⦿ | |
Wordmark
| An on-line tool to showcase the fonts installed on one's computer. Description: [...] Wordmark.it detects fonts installed on your system with a small Flash script written by Marko Dugonjic of Type Tester. It also uses Remy Sharp's font detection script. [...] I'm Fahri Özkaramanli (b. Nicosia, 1980), a freelance visual communication designer living in Istanbul. I received my BA in Visual Communication Design at Istanbul Bilgi University in 2005 where I am a candidate in VCDMFA and currently teaching Web Design and Interactive Web Projects courses as a part time instructor. [Google] [More] ⦿ |
|
|
|
|