Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
This course focuses on the theories behind web fonts: what makes a good font, why different fonts look the way they do, and how fonts affect the look of a web page. Author Laura Franz covers common tasks, including downloading a font from an online source such as Typekit or Font Squirrel, implementing the font in HTML and CSS, and changing the size and line-height to improve the readability of text. The course also covers different periods of type design and explores the history behind handwritten fonts, text fonts (used for large amounts of text), and display fonts (used for headlines).
Art Deco fonts were originally in use in the '20s and '30s, about the same time as Paul Renner was designing the Geometric Sans Serif font, Futura, and Eric Gill was designing the Humanist Sans Serif font, Gill Sans. Art Deco fonts are usually streamlined and strive for geometric beauty like the lettering seen here on the American Stock Exchange. They represent luxury and prosperity even during the Great Depression. They celebrated new technologies and materials.
Art Deco was opulent and luxurious, a reaction to the forced austerity imposed by World War I on the French artists and designers who initiated the style. As a general style, Art Deco was often described as purely decorative. Some Art Deco fonts are characterized by straight lines and sharp angles, like the lettering here in the Empire State Building. There aren't many Art Deco fonts available for the Web. A contemporary digital font, LTC Broadway, is based on the original font designed by Morris Fuller Benton in 1927.
It references the heavy strokes of the lettering found in the Empire State Building. Broadway is a decorative font with the geometric quality and an emphasis on the vertical line. This version is available via Typekit's Personal Plan as is LTC Broadway Engraved. Limelight, available on Google Web Fonts has similar characteristics. Finally, Cassannet is a recently released free font that's available for download at cassannet.net.
It looks more like the lettering we saw on the American Stock Exchange Building. I love the open geometric forms of this font. I'm not crazy about the big R, but I think it would be fine if we would use the same size as the rest of the letters. But even though I like this font, it's not my first choice. I know this as an Art Deco font, but most people probably don't. Some of the books available at the used book sale are about architecture and history. There are also biographies. All of these categories could be represented by an Art Deco font.
Limelight is more cliche and would certainly communicate early 20th Century history, the period between the First and Second World Wars, better than Cassannet. And also selfishly, I would like to use a font with extreme thicks and thins. We haven't been able to use one yet in this course because they haven't held up on the screen. So we're going to use Limelight. I tested it cross-browser. It gets a little jagged on a few browsers, but I think it's going to be a great choice.
There are currently no FAQs about Choosing and Using Web Fonts.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.