Topics: Design: Typography
Communicating via typefaces. Fonts and layout. Designing for readers. Legibility. Typefaces, graphic design. Problems of typography on the web. Controlling web typography: size, font, color. CSS methods, browser problems, user problems, and workarounds. Typographically correct punctuation. Unicode. Scaling text in modern browsers. And in IE for Windows, too. Replacing text with images: CSS, XHTML, SVG, and Flash methods. (23 articles)
More Meaningful Typography
by Tim Brown
Issue 327May 3, 2011
Designing with modular scales is one way to make more conscious, meaningful choices about measurement on the web. Modular scales work with—not against—responsive design and grids, provide a sensible alternative to basing our compositions on viewport limitations du jour, and help us achieve a visual harmony not found in compositions that use arbitrary, conventional, or easily divisible numbers. Tim Brown shows us how.
A Simpler Page
by Craig Mod
Issue 321January 11, 2011
Want to design a book? There are mountains of beautifully designed examples to inspire you. But what about digital books? How do you create elegantly typeset, gloriously balanced reading experiences when tablets render type differently and support different fonts, text can extend in every direction, and type can change size? Craig Mod (Flipboard, Art Space Tokyo) addresses these questions and presents the initial release of Bibliotype, an HTML baseline typography library for tablet reading.
Art Direction and Design
by Dan Mall
Issue 317November 2, 2010
Sure, your design’s composition is perfectly balanced, the typographical hierarchy works, and the contrast is bang on. But, when you step back and take a look, how does it make you feel? Does your design evoke the right emotion? Dan Mall explains the difference between art direction and design on the web and challenges us to do it again, this time with feeling.
The Look That Says Book
by Richard Fink
Issue 313September 7, 2010
Hyphenation and justification: It’s not just for print any more. Armed with good taste, a special unicode font character called the soft hyphen, and a bit o’ JavaScript jiggery, you can justify and hyphenate web pages with the best of them. Master the zero width space. Use the Hyphenator.js library to bottle fame, brew glory, and put a stopper in death. Create web pages that hyphenate and justify on the fly, even when the layout reflows in response to changes in viewport size.
Web Fonts at the Crossing
by Richard Fink
Issue 307June 8, 2010
Everything you wanted to know about web fonts but were afraid to ask. Richard Fink summarizes the latest news in web fonts, examining formats, rules, licenses, and tools. He creates a checklist for evaluating font hosting and obfuscation services like Typekit; looks at what’s coming down the road (from problems of advanced typography being pursued by the CSS3 Fonts Module group, to the implications of Google-hosted fonts); and wraps it all up with a how-to on making web fonts work today.
Accent Folding for Auto-Complete
by Carlos Bueno
Issue 301February 23, 2010
Another generation of technology has passed and Unicode support is almost everywhere. The next step is to write software that is not just “internationalized” but truly multilingual. In this article we will skip through a bit of history and theory, then illustrate a neat hack called accent-folding. Accent-folding has its limitations but it can help make some important yet overlooked user interactions work better.
On Web Typography
by Jason Santa Maria
Issue 296November 17, 2009
Until now, chances are that if we dropped text onto a web page in a system font at a reasonable size, it was legible. But with many typefaces about to be freed for use on websites, choosing the right ones to complement a site's design will be far more challenging. Many faces to which we’ll soon have access were never meant for screen use, either because they’re aesthetically unsuitable or because they’re just plain illegible. Jason Santa Maria, a force behind improved type on the web, presents qualities and methods to keep in mind as we venture into the widening world of web type.
Real Web Type in Real Web Context
by Tim Brown
Issue 296November 17, 2009
Web fonts are here. Now that browsers support real fonts in web pages and we can license complete typefaces for such use, it's time to think pragmatically about how to use real fonts in our web projects. Above all, we need to know how our type renders in screens, in web browsers. To that end, Tim Brown has created Web Font Specimen, a handy, free resource web designers and type designers can use to see how typefaces will look on the web.
Real Fonts on the Web: An Interview with The Font Bureau’s David Berlow
by Jeffrey Zeldman, David Berlow
Issue 282April 21, 2009
Is there life after Georgia? We ask David Berlow, co-founder of The Font Bureau, Inc, and the first TrueType type designer, how type designers and web designers can work together to resolve licensing and technology issues that stand between us and real fonts on the web.
Understanding Web Design
by Jeffrey Zeldman
Issue 249November 20, 2007
We'll have better web design when we stop asking it to be something it's not, and start appreciating it for what it is. It's not print, not video, not a poster—and that's not a problem. Find out why cultural and business leaders misunderstand web design, and learn which other forms it most usefully resembles.
How to Size Text in CSS
by Richard Rutter
Issue 249November 20, 2007
It's a tug-of-war as old as web design. Designers need to control text size and the vertical grid; readers need to be able to resize text. A better best practice for sizing type and controlling line-height is needed; and in this article, Richard Rutter obligingly supplies one.
CSS @ Ten: The Next Big Thing
by Håkon Wium Lie
Issue 244August 28, 2007
Ten years ago, Håkon Wium Lie and Bert Bos gave us typographic control over web pages via CSS. But Verdana and Georgia take us only so far. Now Håkon shows us how to take web design out of the typographic ghetto, by harnessing the power of real TrueType fonts.
Setting Type on the Web to a Baseline Grid
by Wilson Miner
Issue 235April 9, 2007
As web designers, we sometimes may feel we're on a relentless journey to bridge the gap between digital and traditional processes. Wilson Miner brings us one step closer by offering up a way to work with typographic baselines on the web.
Big, Stark & Chunky
by Joe Clark
Issue 191January 11, 2005
You’ve designed for the screen and made provision for blind, handheld, and PDA browser users. But what about low-vision people? Powered by CSS, “zoom” layouts convert wide, multicolumn web pages into low-vision-friendly, single column designs. Accessibility maven Joe Clark explores the rationale and methods behind zoom layouts. Board the zoom train now!
Dynamic Text Replacement
by Stewart Rosenberger
Issue 183June 15, 2004
Let your server do the walking! Whether you’re replacing one headline or a thousand, Stewart Rosenberger’s Dynamic Text Replacement automatically swaps XHTML text with an image of that text, consistently displayed in any font you own. The markup is clean, semantic, and accessible. No CSS hacks are required, and you needn’t open Photoshop or any other image editor. Read about it today; use it on personal and commercial web projects tomorrow.
Power To The People: Relative Font Sizes
by Bojan Mihelac
Issue 176April 9, 2004
Relative font sizes may make websites more accessible — but they’re not much help unless the person using the site can find a way to actually change text size. Return control to your audience using this simple, drop-in solution.
Elastic Design
by Patrick Griffiths
Issue 167January 9, 2004
Not quite liquid, yet not fixed-width either, Elastic Design combines the strengths of both. Done well, it can enhance accessibility, exploit neglected monitor and browser capabilities, and freshen your creative juices as a designer. Patrick Griffiths shows how to start.
Reading Design
by Dean Allen
Issue 128November 23, 2001
With so many specialists working so hard at their craft, why are so many pages so hard to read? Unabashed text enthusiast Dean Allen thinks designers would benefit from approaching their work as being written rather than assembled.
Typography Matters
by Erin Kissane
Issue 124October 19, 2001
It’s a style thing. It’s a usability thing. It’s a tricky thing for large content sites and a step up for independents. It’s typographically correct punctuation on the web, and ALA’s Erin Kissane makes the case for it.
The Trouble With EM ’n EN (and Other Shady Characters)
by Peter K Sheerin
Issue 124October 19, 2001
More than you ever wanted to know about dashes, spaces, curly quotes, and other vagaries of online typography. HTML specs, grammatical rules, browser bugs and character encoding—it’s all here, in this famous and much-bookmarked ALA article.
CSS Design: Size Matters
by Todd Fahrner
Issue 109May 11, 2001
Everything you think you know about controlling text sizes on the web is either wrong, or else it doesn’t work. In this much-bookmarked ALA classic, UI designer and CSS Todd Fahrner provides a way out of the mess by showing how to make CSS font size keywords work – even in stubborn browsers that get CSS wrong.
Walking Backwards: Supporting Non-Western Languages on the Web
by Shoshannah L. Forbes
Issue 65May 26, 2000
And you think you?ve got problems. Try building web sites in a bi-directional language like Hebrew or Arabic. Israeli web developer Shoshannah L. Forbes discusses the mind-boggling hardships involved, and looks at what the latest browsers are doing about it.
A Dao of Web Design
by John Allsopp
Issue 58April 7, 2000
Web designers often bemoan the malleable nature of the web, which seems to defy our efforts at strict control over layout and typography. But maybe the problem is not the web. Maybe the problem is us. John Allsopp looks at web design through the prism of the Tao Te Ching, and decides that designers should let the web be the web.
*Can’t find what you’re looking for? View all topics and subtopics »
