Mastering the True Craft of Web Typography

Professional Typography is featured in the Smashing Newsletter, Cat Clark writes:

The time when web design was limited to just a handful of default system fonts seems like a distant memory. But with the coming of web font services, and all the choices they offer, the process of selecting and implementing the perfect typeface can sometimes feel like more of a chore and less of the pleasure that it should be.

Donny Truong is here to help change that. With his new free eBook “Pro Web Type“, described by Jeremy Keith as “practical and refreshingly succinct”, Donny leads his readers step by step through the craft of making beautiful, successful typographic choices. From the various ways of delivering web fonts, through to selecting body text, setting type in the browser and picking type for UI, chapter by chapter, the website offers plenty of practical, applicable advice that is sure to put you back in confident control of your typography.

Thanks for the love.

Redesigning Đẹp Designs

I am working with Đẹp Designs to redesign its website. Located in Takoma Park, Maryland, Đẹp is an architecture, interior design, and master planning studio founded by Chuong Cao and Giang Dinh. Dep is committed to creating modern and elegant design solutions that contribute to the environment and the experiences of the occupants. I am also excited to be implementing Kirby for its content management system. Stay tuned for the relaunch announcement.

Smashing Friday

Woke up early this morning and discovered that my Twitter notification was on fire. Smashing Magazine tweeted about Professional Web Typography to its 900K followers. I couldn’t be happier to see a respected publication in the web community supporting a little guy like me. Big props to Vitaly Friedman. I also want to thank the readers who supported the book.

Fed Up

Stephanie Soechtig’s documentary, Fed Up, provides an informative and frightening perspective on obesity, sugar, and the food industry in America. You probably already know what causes most Americans to be overweight, but it is still worth watching. It is available on Netflix.

Speaking of fed up, I am in my third week of intermittent fasting and cutting off sugar as much as I can. In the morning, I replaced my hot coffee with hot green tea. I don’t eat anything until 1pm. Yesterday, I was so into working that I didn’t eat until 2:30pm and I felt fine. My daily lunch had been Spring Mix with four pieces of Thanh Sơn’s fried tofu and lots of Sriracha sauce. If I get tired of that, I would go to Così for a bit more fancy salad. I also walked a mile or so after lunch. Then I had another hot green tea. Dinner I just have a regular meal with my family. Skipping breakfast is not a big deal for me. I did that when I was younger. I usually had breakfast all by myself so I don’t miss it at all.

I am feeling better with the new routine even though I haven’t made that much change in my diet. Let’s see if I get better result in a few months.

Frutiger on Legibility

Adrian Frutiger, Adrian Frutiger Typefaces: The Complete Work, (p.65):

I must stress, however, that most harmonious line is not automatically the most legible one. Only the diversity of individual letters with ascenders and descenders, with straight or diagonal strokes or curves guarantees the best legibility.

A Critique of Book Design on the Web

Antoine Fauchié wrote a detailed analysis of the design of the website for Professional Web Typography. The article, “Un design de livre web,” is written in French, but I could understand it thanks to Google Translate. Although I haven’t talked about my design decision, Antoine pointed out a critical intention:

L’une des grandes originalités de ce livre web, c’est justement cette table des matières en pied de page, et non dans un menu dédié comme c’est souvent le cas. Les menus habituels sont encore majoritairement placés dans le header – dans la partie supérieure du site, avant le contenu – avec une adaptation en menu hamburger – les fameuses trois barres horizontales – pour des écrans plus petits. L’accès aux différents chapitres et sous-chapitres se fait très facilement, et quoi qu’il arrive l’arborescence est toujours visible.

En terme de design et d’ergonomie, ce choix de la simplicité est à mon avis le bon. Limiter les subterfuges dynamiques – menu sandwich, éléments de navigation qui n’apparaissent qu’au survol, introduction d’interactions issues du tactile – permet une grande accessibilité de l’outil, proche de celle d’un livre physique, papier.

To offer an accessible design, I moved away from the popular trend of hiding everything under the hamburger menu. The menu or the table of contents is always available on every page and readers don’t have to click on the hamburger to access it. In term of technical implementation, I was able to get away with the dependency of JavaScript.

Many thanks to Antoine for spending the time to write this article.

Is There a Print Version of Professional Web Typography?

I have been getting a handful of inquiries about a print version of Professional Web Typography. Even my professor suggested that I should go for it. And here’s an email from a reader:

Hi Donny!

I just discovered your book, it is fantastic. I’m a graphic design student who has learned a lot of typographic specifics, but none directed at web usage, so this is a really great tool.

As much as I love what you’ve done, this is exactly the kind of book I would want to buy as a physical thing. Do you have any plans to setup some kind of publishing? If not, I’m considering copying the content, laying it out myself and printing and binding it myself (only to be used for personal use of course).

Thanks,
J
Graphic Designer and ProWebType.com Enthusiast

I have no plan to make a print version for several reasons. First, the book about web typography should live and be read on the web. Second, I took the advantage of the web to keep the book as succinct as possible. If readers want to learn more, I have provided links to other resources throughout the book. Third, readers can download and practice the examples I have uploaded to GitHub. Forth, I am about to graduate with a MA in graphic design, and yet I am still don’t know my way around InDesign. I am getting really good with Illustrator though. All the illustrations in the book are created with Illustrator because I love SVG. With all the benefits of the web, I don’t see any reason for me to go print, even though, I must admit, I still love reading books on paper.

D.L. Hughley – Clear

D.L. Hughley goes through a huge pile of laundry list in his latest special Clear. It’s hard to remember every jokes he made, but one particular stood out on the topic of police brutality. His routine would have been more effective if he dove deeper into a particular topic rather than landed short punchlines. It took me a minute to get the “airbag” reference.

Inspiration of Book

Tingli’s Inspiration of Book showcases books designed to offer unique experiences. Readers can crumble a piece of paper into a ball with Play More, spill coffee on the Expresso, or even eat a Cookie Bookie. My personal favorite is Snoop Dogg’s Rolling Words: A Smokable Book. You can roll it up and smoke it. With the vast number of projects and the minimal writing make it a perfect coffee table book to flip through for inspiration.

Thanks for Supporting My Book

When I set out my price my book based on the pay-what-you-want model, I put my trust in the readers. I am glad to see readers like Kevin Lorenz supporting it. He tweeted:

If you enjoy reading @visualgui’s book ‘Professional Web Typography’ on https://prowebtype.com please be fair, share and pay for it! <3

I chose the web because I wanted to deliver valuable information in a legible, readable, and accessible format—anyone with an internet connection can read the book. The book is available to be read, but it is not free, as Kevin puts it:

@visualgui thank you for writing such an amazing book and making it accessible for so many people.

Readers have been paying for the book in various amount: $1, $3, $5, and $10. Thank you.

Contact