Tag Archives: Fonts

Introducing OpenType Font Variations

Cześć and hello from the ATypI conference in Warsaw! Together with Microsoft, Apple and Adobe, we’re happy to announce the launch of variable fonts as part of OpenType 1.8, the newest version of the font standard. With variable fonts, your device can display text in myriads of weights, widths, or other stylistic variations from a single font file with less space and bandwidth.
 OpenType variable fonts support OpenType Layout variation.
To prevent that the $ sign becomes a black blob,
the stroke disappears at a certain weight.


At Google, we started tinkering with variable fonts about two years ago. We were fascinated by the typographic opportunities, and we got really excited when we realized that variable fonts would also help to save space and bandwidth. We proposed reviving Apple’s TrueType GX variations in OpenType, and started experimenting with it in our tools. The folks at Microsoft then started a four-way collaboration between Microsoft, Apple, Adobe, and Google, together with experts from type foundries and tool makers. Microsoft did the spec work; Apple brought their existing technology and expertise; Adobe updated their CFF format into CFF2; and we brought the tools and testing we’d been developing.  After months of intense polishing, the specification is now finished.

On the Google end, we did a lot of work to build, edit and display variable fonts:
As always, all our font tools are free and open source for everyone to use and contribute.

Now that the spec is public, we can finish the work by merging the changes upstream so that our code will soon flow into products. We’ll also update Noto to support variations (for many writing systems, the sources are already there — the rest will follow). Much more work lies ahead, for example, implementing variations in Google Fonts. Together with other browser makers, we’re already working on a proposal to extend CSS fonts with variations. Once everyone agrees on the format, we’ll support it in Google Chrome. And there are many other challenges ahead, like incorporating font variations into other Google products—so it will be a busy time for us!  We are incredibly excited that an amazing technology from 23 years ago is coming back to life again today. Huge thanks to our friends at Adobe, Apple, and Microsoft for a great collaboration!

To learn more, read Introducing OpenType Variable Fonts, or talk to us at the FontTools group.

By Behdad Esfahbod and Sascha Brawer, Fonts and Text Rendering, Google Internationalization

Adobe Typekit improves the Rosario typeface family

Since 2010, Google Fonts been collaborating with the Adobe Typekit team to create better web font technology. And now that many fonts first published by Google Fonts are also available in Adobe Edge Web Fonts, we’re extending that collaboration beyond just software to fonts themselves.

Together with Adobe, we want to improve the quality of open source fonts available to everyone publishing on the web. As a first step, the Typekit team has optimized Rosario, a humanist sans serif based on the classic proportions of Garamond’s type.

To start the process, Typekit reached out to the foundry, Omnibus Type, to request up to date copies of the font source files. Here are some examples of the possible optimizations that the Adobe team might make to a web font:

  • Convert and/or clean up outlines, for design fidelity and file size efficiency
  • Re-componentize source fonts, for file size efficiency
  • Remove/reassign glyphs with incorrect Unicode code points, for semantic value
  • Add common missing glyphs (non-breaking space, soft hyphen)
  • Set vertical metrics values according to best practices
  • Set underline and strike-through values, for design consistency
  • Contribute PostScript hints and (if a typeface was designed for small sizes like paragraph text) TrueType instructions (also called hinting), which consist of instructions to the rasterizer embedded in the font file itself

After making some of these improvements, Typekit sent their version back to the foundry to review and release on the Omnibus Type homepage. The updated Rosario family is now available in Typekit, Adobe Edge Web Fonts and Google Fonts.

Together with the Typekit team, we’re looking forward to more quality improvements in the future!

Posted by Dave Crossland, Font Consultant

A new look and name for Google Web Fonts

This week, Google Web Fonts got a simpler, cleaner look that makes searching and accessing your fonts easier than ever. And in the spirit of simplicity, today Google Web Fonts is now just “Google Fonts.” It’s still the same great collection of free fonts you know and love, but with a new name.


You can get started with Google Fonts here: www.google.com/fonts

Posted by Ajay Surie, Product Manager

Easier ways to find the right font

We know that finding the right font for your website or blog is a personal choice, and there are many great fonts available to choose from on the web. Now when you search for a font that isn’t available on Google Web Fonts, we show you additional fonts available from Monotype. Each result is shown in the actual font so you can easily preview your options. To get more information on a font, simply click the link under it’s name.

 

We look forward to adding results from more web font providers in the future.

Posted by Raziel Alvarez, Software Engineer

Web fonts: a look under the hood

Google Web Fonts are viewed more than 1 billion times every day across the web, on more than 100 million web pages. To help you sort through and pick the right font for your site you can order fonts by popularity, and now you can check out usage data for each font too.

Click on "Analytics" in the upper right corner of the homepage to view the new analytics tab, where you can see and compare numbers for individual font views by browser, operating system and see usage trends.


You’ll see a list of fonts, ranked by the total number of all-time font views and sortable by time period. To see a graph of font data for an individual font or a set of fonts, check the box next to the font name and click on the Trend button.



Clicking the views by platform tab on the left pane shows you a heatmap and pie charts of usage of each font by browser or operating system.



While browsing through fonts in the directory, you can also access analytics for an individual font at anytime by navigating to the Statistics tab on the font’s specimen page.



And finally, to help you compare and select fonts, clicking on the “Pairings” tab on the Specimen page will show you groupings of fonts that are frequently used together, based on actual usage data via the API.


Selecting the right font for your website is an expression of your personal style, and we hope to continue expanding the set of tools to help you do that. Happy browsing!

Posted by Raziel Alvarez, Software Engineer

More places to get great fonts

Open source fonts are good for the web: they’ve helped spur web font adoption, and made it easier for anyone to contribute improvements to fonts for the whole web community.

Today, we’re happy to announce that all the fonts in the Google Web Fonts directory are also available via Adobe’s new Edge Web Fonts service.

And on the heels of the recent release of Source Sans Pro, another Adobe designed open source font, Source Code Pro, is available today from both Google Web Fonts and Edge Web Fonts.

We’re also working with the Adobe team to hint some of the fonts in the collection, a process that will make them look better at smaller text sizes.

Here’s to a more accessible, translatable, and beautiful web!

Posted by Ajay Surie, Product Manager

Preview fonts with the new Poster mode

Selecting just the right font for your website or application is a personal decision, and making sure the font harmonizes with your content is often time consuming. To help you narrow down your font choices, last week we announced a new tool to compare individual characters in a pair of fonts side by side. Today, we’re introducing Poster Images, which allows you to easily see what a font looks like with different effects, on a variety of different backgrounds.

To start, visit the Google Web Fonts directory and select the Poster tab at the top.




Change the font size or the appearance of the poster to check out how different styles look. When you find a font you like, hover over it to see more details and add it to your collection.
















We hope this makes choosing the right font easier and more fun!

Posted by Sang Tian, Software Engineering Intern

New Fonts, Early Access, and More

Over the last few months, we’ve been busy adding support for web fonts to Google documents and Google presentations. Today, we’re adding seven font families in Google Web Fonts, a new tool to compare similar fonts, and an early access program to get feedback on non-latin scripts in development.

When you choose a new font, you want it to look good for all your readers, regardless of the platform or browser they’re using. To help make fonts look better in more places, we’re starting to hint more families in Google Web Fonts, thanks to the ttfautohint project, which automates this process. Amarante, Capriola, Courgette, and Quando were hinted using this tool.

Eagle Lake expands on our existing collection of calligraphic font styles, and you can use Metal Mania to bring out your inner guitarist. We’re also very excited to be including a special contribution from our friends over at Adobe - Source Sans Pro, their first open source type family.

As the number of fonts in Google Web Fonts continues to grow, it’s becoming harder to select the right font from among many potential choices. To make this process easier, you can now easily compare two fonts side by side using the new comparison tool. Just add a few fonts to your collection, select Review, and click on the Compare tab at the top.



You can then overlay glyphs from each font on top of each other, and use the slider to transition between fonts to see the differences between them more clearly.

Non-latin fonts can be more complex than latin fonts, both as designs and as font software, which often require more time to develop and polish. The designers of these fonts may not be native readers, and we’re hoping for your feedback to help them understand where their fonts need improvement. You can try them out by downloading them from the Google Web Fonts early access page.

Posted by Ajay Surie, Product Manager

450+ new ways to make your Google presentations pop

(Cross-posted from the Google Drive blog)

Good design is an important part of getting your point across in a presentation. Over time we’ve added a bunch of features to help you bring a little something extra to your decks, like slide transitions and animations, thousands of free stock photos, and a growing collection of templates.

Today, creating eye-catching presentations gets even easier, with more than 450 new fonts to choose from. (flip through the presentation below to see them in action)



To browse and select new fonts, click on Add fonts from the bottom of the fonts dropdown in the toolbar. This will take you to the menu of all available fonts, where you can pick the ones you want to use.


Any fonts that you select will get automatically added to your fonts list so it’s easy to find them later.


Plus, fonts that you’ve already added to Google documents will automatically appear in your presentations font list too.

So next time you're working on a presentation, jazz it up with some Calligrafitti, Indie Flower, Short Stack, or hundreds of other new choices.

Posted by Erin Rosenbaum, Software Engineer

Google documents, now with web fonts!

(Cross-posted from the Google Docs Blog)

In the past month we’ve made updates both big and small to Google Docs, and today we’re announcing one more: web fonts in Google documents. Often the best way to get your point across is to present your idea in a creative, captivating way. Today, we added over 450 new fonts to Google documents to make it easier for you to add a little something extra to whatever you create.

To use these new fonts, click on the font menu and select “Add fonts” at the very bottom, which will take you to a menu of all the Google Web Fonts available.


Once you’ve selected new fonts, you’ll be able to select them from the font menu.


Whether you’re looking for the perfect font for your first comic book or fancy handwriting for your wedding invitations, we hope you try out the new fonts and create some eye-catching documents.

In addition to hundreds of new fonts, we have a lot of other exciting updates to report:
  • Google Drive launched as a place where you can create, share, collaborate, and keep all your stuff. 
  • There are now a few more options for inserting images in Docs, including inserting from Google Drive, searching for images from the LIFE Photo archive, or taking a snapshot with your webcam. 
  • Charts in spreadsheets now has support for minor gridlines and options to customize the formats of axis labels 
  • Accessibility in Docs got better with support for screenreaders in presentations and with the addition of NVDA to our list of supported screenreaders. 
  • From File > Page setup... you can now set the default page size for your new documents. 
  • It's now easier for speakers of right-to-left languages by automatically showing bidirectional controls when you type in a language that might use them. 
  • Apps Script had many improvements, including 
    • A new ScriptService for programmatically publishing your scripts and controlling when they run. 
    • A new function to find the root folder of someone’s Drive. 
    • An increase in the allowed attachment size in emails from 5MB to 25MB. 
    • An increase in the size of docs files you can create from 2MB to 50MB. 
  • There are now over 60 new templates in our template gallery.
Posted by Isabella Ip, Software Engineer