webfonts « fonts.com blog

Posts Tagged ‘webfonts’

30 October 2012

Today Monotype announced the acquisition of Design By Front, makers of Typecast – a browser-based tool for designing Web pages with Web fonts. Design By Front has been a valued partner of the Fonts.com team and we couldn’t be happier to have them as part of the family.

We welcome a talented group of individuals with intimate knowledge of creative markets and the challenges Web designers face. Over the past year, we’ve worked closely together. We’ve helped integrate our Fonts.com Web Fonts service into Typecast and participated in its private beta. We’ve also collaborated on speaking sessions and interviews about Web typography. This move ensures that these collaborations will continue, and we think you’ll like the outcome.

Typecast was born out of the desire to make Web fonts easier to use. We’ve shared that aspiration at Fonts.com, yet our focus in achieving this goal has been limited to the usability of our own Web font service. With Typecast in the fold, we can ensure Web fonts are easy and fun to use throughout the entire design process – from ideation to implementation.

Typecast allows designers to work more efficiently with Web fonts. So it only makes sense that we make this powerful tool readily available to Fonts.com Web Fonts subscribers. While we won’t disrupt Typecast’s compatibility with other services, we also intend to make it easier for Typecast users to select our own Web fonts. We believe this relationship will benefit users of Typecast and Fonts.com Web Fonts. We also hope it will help inspire more designers to choose Web fonts for their next project, resulting in a more beautiful and readable Web.

Johnathan Zsittnik is the eCommerce Marketing Manager at Monotype Imaging. Johnathan holds both a bachelor’s degree in marketing and a master’s degree in business administration from Bentley University.

Tags: css, css3, Design ByFront, Typecast, typefaces, typography, web fonts, webfonts
Comments Off | Posted in Type for Web

Typecast Enters Public Beta

26 October 2012

by Johnathan Zsittnik

This week we were pleased to see that our friends at Design by Front ushered Typecast, a browser-based tool for designing Web pages with Web fonts, into public beta. We’ve been big fans of Typecast since its introduction into private beta one year ago. With a beautifully and thoughtfully constructed UI, Typecast is a joy to use. More importantly, the application succeeds in its mission of making Web fonts easier to use.

Typecast allows users to position and manipulate live text directly within the browser. This provides a more accurate preview of how text will appear when part of a website. It also simplifies the design workflow by reducing dependencies on static images when creating website mockups. Users can select Web fonts from several services including Fonts.com Web Fonts for use in their designs.

One of our favorite aspects is the ability to incorporate some of the typographic finer points that have typically been reserved for print design. Web designers can make adjustments to kerning, line spacing, coloring and shadowing or insert OpenType features such as ligatures and small caps with ease.

Typecast is free to use while in beta. We encourage you to give it a shot. The Typecast team is looking for feedback, so be sure to let them know what you think.

Tags: Typecast, typecast beta, typefaces, typography, web fonts, webfonts
Comments Off | Posted in Type for Web

Adobe Fonts Now Available on Fonts.com Web Fonts

25 October 2012

by Johnathan Zsittnik

At Fonts.com, we’ve always prided ourselves on the vast selection of fonts we offer. Today that selection improves with the fonts of one of our closest and longest standing partners. We’re very pleased to announce the release of Adobe fonts to our Fonts.com Web Fonts service.

This initial batch includes the most recognizable designs from the Adobe Originals collection including the Chaparral, Minion, Myriad and Adobe Caslon families among others. Over the years, these families have served as the typographic foundation for countless brand identities and design projects. Now our customers can easily extend these brands and projects to the Web.

Each of these fonts has been hand-tuned for optimal screen quality by Adobe’s team of type experts, ensuring they’ll look every bit as good on screen as they do in print. More Adobe fonts are on their way. If you’d like to see the release of a particular family prioritized, let us know in the comments section.

You can browse the selection of Web fonts from the Adobe foundry page by clicking the ‘WEB FONTS’ tab. They are also available in our inventory of hand-tuned fonts adding to a selection of more than a thousand of our highest quality designs. These typefaces are available immediately to all our Standard and Professional plan subscribers. So what are you waiting for? Go ahead and add one to your project.

Tags: adobe, fonts, typefaces, typography, web fonts, webfonts
Comments Off | Posted in Type for Print, Type for Web

Customer Spotlight: IHOP

24 October 2012

by Ryan Arruda

First established in 1958 as International House of Pancakes, IHOP is a national restaurant chain known for their food, friendly atmosphere, and iconic blue A-frame buildings. While their namesake pancake dishes and breakfast specialties are perhaps most well-known, IHOP serves all manner of fare in over 1,500 restaurants — with locations in all 50 states.

The IHOP website extensively features the Helvetica Rounded Bold designs. While the Helvetica family consists of typefaces normally heralded as being beautifully neutral, the rounded strokes of its compatriot transform the otherwise unemotional design into one bursting with jovial liveliness. Headlines and subheads are set in the regular width of the typeface, while the site’s top navigation employs the condensed version. The use of white Helvetica Rounded Bold type upon a bright blue background provides the site additional levity – echoing the family friendly atmosphere of its locations, both type and image render the IHOP website warm and inviting.

Fonts.com features six rounded styles of Helvetica — bold, black, and bold condensed, each with a matching oblique. The entire breadth of the Helvetica family is available in 34 styles for Web use through the Fonts.com Web Fonts Service, and for desktop licensing as well.

Ryan Arruda is the Web Content Strategist at Monotype Imaging. Ryan holds a bachelor’s degree in film studies from Clark University, and an MFA in graphic design from RISD.

Tags: fonts, helvetica, helvetica rounded bold, pancakes, typefaces, typography, web fonts, webfonts
Comments {2} | Posted in Type for Print, Type for Web, Uncategorized

Fonts.com Web Fonts and FOUT Control

19 October 2012

by Domenic Barbuzzi

A Brief History

With the start of the Fonts.com Web Fonts service, the FOUT (flash of unstyled text) phenomenon was a wide-spread problem. To remedy this issue we added code to our JavaScript implementation.

Our first method included hiding the visibility of elements on pages that used Web fonts. We then crafted a more efficient and cleaner method of preventing FOUT – we use a single class to hide only the text for elements using Web fonts. We then strip that class’s properties when the Web fonts are ready to display. One thing to note is that the class is left on these elements in the DOM; however, without properties, the class has no meaning and is invisible to visitors, save for those using some manner of developer tools.

Back to the Present

Since the introduction of Web fonts, broadband connections have grown more common, and browsers have matured in handling embedded fonts. So has the Fonts.com Web Fonts service. We have adjusted our JavaScript in two key ways:

FOUT-prevention is disabled by default
Now there are configuration options that can be set before loading our JavaScript in order to turn FOUT-prevention back on and traverse through the DOM to remove the mti_font_element class

The goodies

Below is a sample usage of the FOUT configuration options. To utilize them, simply define the options before including the SCRIPT tag for your Web fonts project. If any of the options are omitted, their default values will be used instead.

<script type="text/javascript">


// create the configuration object

var MTIConfig = {};
// assign the variable to enable FOUT prevention

// default value -> false (prevention disabled)

// true -> enable FOUT prevention

MTIConfig.EnableCustomFOUTHandler = true;
// assign the variable to remove ‘mti_font_element‘

// this is only valid if FOUT prevention is enabled

// default value -> false (class is left on elements)

// true -> remove class when FOUT prevention finishes

MTIConfig.RemoveMTIClass = true;

</script>

Tags: flash of unstyled text, fonts, fout, typography, web fonts, webfonts
Comments {1} | Posted in Type for Web, Uncategorized

Customer Spotlight: Wawa

18 October 2012

by Ryan Arruda

With nearly 600 locations across the Mid-Atlantic, Wawa is a chain offering not only typical convenience store staples, but also assortments of freshly made sandwiches, soups and salads.

Wawa’s website features the ITC Officina Sans family exclusively for its display typography. Headlines, subheads, and navigation are set in the typeface’s bold weight, while the website’s footer and breadcrumb trail utilize the book weight.

Designed by Erik Spiekermann, ITC Officina Sans is a friendly sans serif typeface; warm and genial, Spiekermann’s design conveys information clearly without appearing too mechanical or didactic.

ITC Officina Sans is available for desktop licensing, as well as for Web use through the Fonts.com Web Fonts service. In addition to book and bold weights, ITC Officina Sans is also available in medium, extra bold, and black styles.

Ryan Arruda is the Web Content Strategist at Monotype Imaging. Ryan holds a bachelor’s degree in film studies from Clark University, and an MFA in graphic design from RISD.

Tags: fonts, itc officina sans, typefaces, typography, web, web fonts, webfonts
Comments {1} | Posted in Type for Print, Type for Web, Uncategorized

Customer Spotlight: Ruth’s Chris Steak House

11 October 2012

by Ryan Arruda

With more than a 100 locations across the United States, Ruth’s Chris Steak House is known for its premium culinary offerings. The restaurant’s website features large, dramatic photographs showcasing their decidedly well-composed dishes.

However, also interesting is the site’s restrained use of of typography; this aspect is not simply an oversight, but a quiet counterpoint to the image-laden layout of the website. The navigation of the site is set in the Novecento family, designed by Jan Tonellato for Synthview. Top navigation is set in the family’s medium weight of Novocento Wide, while the side nav is set in demibold. This entire sans serif family (it also is available in regular, condensed, and narrow widths, too) has a certain friendliness to it — in contrast to the overtly neutral letterforms of, say, grotesque typefaces.

When the site’s side navigation expands, secondary text is set in Linotype’s Trade Gothic Next Soft Rounded family, designed by Akira Kobayashi. As its namesake implies, the Trade Gothic Soft Rounded designs feature more tempered letterforms than its original Trade Gothic forebears. However, the Trade Gothic Next Soft Rounded family still retains a composed demeanor and subtle sense of authority. Within the content of the site, the same complementary format is present—Novocento for headlines, Trade Gothic Next Soft Rounded for body copy.

The Novecento designs are available in 32 styles, and the Trade Gothic Next Soft Rounded in 9, all through the Fonts.com Web Fonts service.

Ryan Arruda is the Web Content Strategist at Monotype Imaging. Ryan holds a bachelor’s degree in film studies from Clark University, and an MFA in graphic design from RISD.

Tags: novecento, trade gothic, trade gothic next soft rounded, typefaces, typography, web fonts, webfonts
Comments Off | Posted in Type for Print, Type for Web, Uncategorized

Top 100 Web Fonts for September 2012

9 October 2012

by Ryan Arruda

Here’s a ranked listing of Fonts.com Web Fonts’ top 100 most used Web fonts for September 2012:

Neue Helvetica
Futura
Trade Gothic
Neue Frutiger
Avenir Next
Gill Sans
Avenir
Univers
Frutiger
DIN Next
Helvetica
ITC Avant Garde Gothic
Neo Sans
PMN Caecilia
Linotype Univers
Trade Gothic Next
New Century Schoolbook
Linotype Didot
Arial
Century Gothic
Monotype News Gothic
Frutiger Next
ITC Garamond
Times
Garamond 3
ITC Century
Twentieth Century
VAG Rounded
Neue Helvetica Arabic
ITC Officina Sans
News Gothic No.2
Eurostile LT
Memo
Rockwell
ITC Lubalin Graph
ITC Franklin Gothic
Harmonia Sans
Frutiger Serif
Bauer Bodoni
Soho
DIN 1451
Soho Gothic
ITC Conduit
Yakout
Compacta
Biome
Optima
Sackers Gothic
Slate
Eurostile Next
Glypha
Georgia Pro
ITC American Typewriter
Trade Gothic Next Soft Rounded
Calibri
Laurentian
Clarendon
Cachet
Akko
Heisei Kaku Gothic
Bembo
ITC Officina Serif
Iridium
Amasis
Monotype Grotesque
ITC Legacy Serif
Egyptian Slate
News Gothic
Monotype Garamond
Janson Text
Plantin
Adelle
Neue Helvetica eText
Univers Next
Agilita
Neuzeit Office
Aachen
Klint
Museo Slab
Museo Sans
Plate Gothic MT
Aeris
ITC Fenice
Futura T
Basic Commercial
Bodoni LT
Abadi
Neue Haas Grotesk
Serifa
M Hei Simplified Chinese
M Hei Traditional Chinese
Franklin Gothic
TB Kaku Gothic
FB Cham Blue
Azbuka
Camphor
ITC Franklin
ITC Stone Sans
ITC Bodoni Seventytwo
P22 Underground

Ryan Arruda is the Web Content Strategist at Monotype Imaging. Ryan holds a bachelor’s degree in film studies from Clark University, and an MFA in graphic design from RISD.

Tags: type, type design, typefaces, typography, web fonts, webfonts
Comments Off | Posted in Type for Web, Uncategorized

Classic Grotesque

3 October 2012

by Allan Haley

Rod McDonald was clearly concerned. The designer of the newly released Classic Grotesque typeface family called me the other day about what he thought could be a problem. “I just went to a web site a friend told me about,” he told me, “and it is using Classic Grotesque for the text copy.”

“Not that this is a problem,” McDonald continued, “but I also went to a bunch of other sites – and they are all using Classic Grotesque.” McDonald’s concern was that, somehow, unauthorized versions of his new typeface were finding their way into a wide variety of web sites.

A little sleuthing revealed that the sites were calling for a sans serif text typeface and that the desktop version of Classic Grotesque, on McDonald’s computer, was providing the default font. After his initial concern was alleviated, McDonald became quite happy with his discovery. “The surprise I got when Classic Grotesque turned up as the default on my browser opened my eyes to the fact that the design is pretty darn good as a screen face,” he exclaimed. “I’ve since discovered more sites that also default to Classic Grotesque and I am very pleased with what I’m seeing – and these are just the desktop fonts.”

What McDonald meant by “just the desktop fonts,” was that the Web fonts of Classic Grotesque will look even better in on-screen environments. Classic Grotesque, like all fonts available through the Fonts.com Web Fonts service, underwent special work to ensure that it was optimized for on-screen use. This means that Classic Grotesque will be as commanding a communicator on screen as it is in hardcopy. Click here to learn more about Classic Grotesque Web Fonts.

Allan Haley is Director of Words & Letters at Monotype Imaging. Here he is responsible for strategic planning and creative implementation of just about everything related to typeface designs.

Tags: classic grotesque, fonts, typefaces, typography, web, web fonts, webfonts
Comments Off | Posted in Type for Print, Type for Web, Uncategorized

Adobe Fonts Head to Fonts.com Web Fonts

25 September 2012

by Johnathan Zsittnik

The best selection of Web fonts is about to get even better. We’ve teamed up with Adobe to offer hundreds of their typefaces, including the most popular designs from the Adobe Originals catalog, through Fonts.com Web Fonts. Adobe fonts are well known for their quality and artistry and have become resources for design professionals. With many of their families being staples at the top of our list of best selling desktop fonts, we’re proud to offer these designs as Web fonts.

The collection includes hundreds of Web fonts including such design mainstays such as the Chaparral, Minion and Myriad families. Many of these designs have been optimized for on-screen display.

In the coming weeks, the first batch of these designs will appear directly in our selection of Web fonts with additional releases to follow shortly thereafter. These fonts will be available for use by everyone subscribed to a Fonts.com Web Fonts Standard or Professional plan. Stay tuned. As always, more releases from world-class designers and foundries are headed your way.

Tags: @font-face, adobe, chaparral, css, fonts, minion, myriad, typography, web fonts, webfonts
Comments Off | Posted in Type for Web

Categories

Archives

Recent Articles

Twitter Feed