Smashing Daily #4: Fonts, CSS And Modern Web Design
Lots of stuff about fonts, design, CSS and code in general in this edition, but also some instant-classic advice on modern Web design and some very interesting experiments with new HTML5 features. But even if these things sound boring, you’ll probably find something that amuses you in today’s Smashing Daily.
“The Best Browser Is the One You Have With You1”
With the increase of “desknot” users, the Web as we know it has fundamentally changed. Not everyone is aware of that fact yet, and those people (and you too) must read this article by Stephanie Rieger. She outlines seven points that are important for a modern website, points that were of less importance on the classic Web. This is an absolute must read — and must remember — for everyone, an instant classic.
“CSS: The Bad Parts3”
Here’s a nice long rant by Louis Lazaris about the bad parts of CSS, and I have to say that I agree on most parts — although I disagree on
width:100% and on CSS counters (you don’t want to put an academic article in an
ol). It’s a great read, filled with links to articles explaining the issues. Good discussions in the comments, too. A must read.
Christian Heilmann argues that brevity in code does not outweigh everything else in importance. On the contrary, he says that clear, understandable and precise code is much more important, especially in HTML. He definitely has some good points in this article; every mark-up geek should read it.
“General CSS Notes, Advice and Guidelines5”
Keeping CSS files maintainable can be really hard, especially on big websites that have many developers working on the CSS. You need to define a set of guidelines that everybody on your team should follow. Here’s an excellent example by Harry Roberts. Definitely read it if you find yourself struggling with huge CSS files every now and then.
“Creating Non-Disruptive Notifications With HTML56”
I’ve always found Growl and other system-wide notification tools to be highly disruptive and intrusive. I disable every kind of notification that can be disabled. But many people are not like me, so the HTML5 Web Notification API could be welcomed by many developers, marketers and perhaps ordinary people. The API enables a website to send system-wide notifications to users. I can imagine some clever implementations based on time and location, especially on phones.
Judging your own designs can be pretty hard. In this long, long article (if you don’t have the time to read it all, just start at the heading that reads “How does this apply to you?”), Paul Burton explains why you need criticism, why it’s important, and what tricks you can use to critique your own designs. A little critique for the author: getting to the point takes a bit long.
I linked before to this article about ligatures10 that explains what ligatures are and how you can use them on the Web. A ligature is a character consisting of two or more letters, mostly used in classic typography. The people at Oak Studios11 just found out that you can do other smart stuff with ligatures. Very clever!
“Pronunciation Game12,” Chrome Experiment by Loducca
You can communicate with your browser in more ways than with a keyboard, mouse and finger. Some browsers support speech input, and here’s a simple but nice-looking example of what you might do with speech input. Looks really good (but works only in Chrome at the moment, I believe).
“Mozilla Hacks Weekly, May 17th 201214”
Are the links in Smashing Daily not enough? Need more to read? Here are the weekly links by the Mozilla Developer Engagement team. Always good, and this week has some hilarious stuff.
So, how do type designers design their letters? How does one start a gargantuan job like that? Here’s a lengthy and beautiful article about the process that Christoph Dunst followed when he created his Novel type family. It makes you realize just how much work goes into creating a good new font. The attention to detail is incredible.
- 1 http://www.alistapart.com/articles/the-best-browser-is-the-one-you-have-with-you/
- 2 http://www.alistapart.com/articles/the-best-browser-is-the-one-you-have-with-you/
- 3 http://www.impressivewebs.com/css-the-bad-parts/
- 4 http://christianheilmann.com/2012/05/17/brvty/
- 5 https://github.com/csswizardry/CSS-Guidelines/blob/master/CSS%20Guidelines.md
- 6 http://girliemac.com/blog/2012/03/29/creating-non-disruptive-notifications-with-html5/
- 7 http://girliemac.com/blog/2012/03/29/creating-non-disruptive-notifications-with-html5/
- 8 http://www.alistapart.com/articles/artistic-distance/
- 9 http://www.symbolset.com/
- 10 http://elliotjaystocks.com/blog/the-fine-flourish-of-the-ligature/
- 11 http://oak.is/
- 12 http://www.chromeexperiments.com/detail/pronunciation-game/
- 13 http://www.chromeexperiments.com/detail/pronunciation-game/
- 14 https://hacks.mozilla.org/2012/05/mozilla-hacks-weekly-may-17th-2012/
- 15 http://ilovetypography.com/2012/05/15/making-fonts-novel-typeface/
- 16 http://ilovetypography.com/2012/05/15/making-fonts-novel-typeface/
- 17 www.smashingmagazine.com/the-smashing-daily-archive/
- 18 www.smashingmagazine.com/the-smashing-daily-archive/