August 2007 - Broken Links Archive

The web needs more & better fonts

Aes¬≠thet¬≠ics also pro¬≠vide a strong argu¬≠ment for web fonts. There are many beau¬≠ti¬≠ful and inter¬≠est¬≠ing fonts that can improve aes¬≠thet¬≠ics and increase visu¬≠al vari¬≠ety on the web. Just as I am some¬≠times stunned by beau¬≠ti¬≠ful book designs, I want to be over¬≠whelmed by beau¬≠ti¬≠ful web pages. And, I don‚Äôt want those beau¬≠ti¬≠ful pages to be made up of back¬≠ground images. 

H√•kon Wium Lie has writ¬≠ten anoth¬≠er call for more atten¬≠tion to be paid to typog¬≠ra¬≠phy on the web. I‚Äôm in com¬≠plete agree¬≠ment; being lim¬≠it¬≠ed to only a small hand¬≠ful of ‚Äėsafe‚Äô fonts was okay for a while, as it made peo¬≠ple think about the best way to present those fonts; it‚Äôs fast becom¬≠ing a lim¬≠i¬≠ta¬≠tion, how¬≠ev¬≠er ‚ÄĒ when we‚Äôre using images and Flash to get around the prob¬≠lem, it‚Äôs way past time to address it.

The two main argu¬≠ments raised in the arti¬≠cle against font embed¬≠ding ‚ÄĒ rights restric¬≠tions and aes¬≠thet¬≠ics ‚ÄĒ both have the same solu¬≠tion: respon¬≠si¬≠bil¬≠i¬≠ty. As a web¬≠site mak¬≠er, it will be up to you to use fonts that you have the right to use, and to use them in a way that does¬≠n‚Äôt look like an explo¬≠sion at a print fac¬≠to¬≠ry. Leg¬≠i¬≠bil¬≠i¬≠ty must still be the first rule of web typography.

All signs indi­cate Opera 9.5 will be the first brows­er to allow font embed­ding using the @font-face dec­la­ra­tion; if so, it’s anoth­er good rea­son why there’s so much antic­i­pa­tion of its release.


Seeing the light on microformats

It took me a while to see the ben¬≠e¬≠fits of micro¬≠for¬≠mats, but now I‚Äôm def¬≠i¬≠nite¬≠ly there. In Octo¬≠ber 2006, the UK WSG meet¬≠ing was all about micro¬≠for¬≠mats, and I decid¬≠ed it was too fad¬≠dy, too niche for me, and that I would¬≠n‚Äôt both¬≠er. I regret that now.

The first thing that changed my mind for me was see¬≠ing Dan Ceder¬≠holm‚Äôs pre¬≠sen¬≠ta¬≠tion, Inter¬≠face Design Jug¬≠gling. He clear¬≠ly explained their ben¬≠e¬≠fits, and made me think about ways my own sites could be enhanced by them.

The sec¬≠ond thing was the suite of tools sup¬≠plied by Tech¬≠no¬≠rati; the hCard and hCal¬≠en¬≠dar con¬≠ver¬≠tors are easy ways to dis¬≠play how use¬≠ful a lit¬≠tle bit of stan¬≠dard¬≠ised mark-up can be.

The third thing ‚ÄĒ and the real deal-clinch¬≠er ‚ÄĒ was the Oper¬≠a¬≠tor add-on for Fire¬≠fox. This dis¬≠plays a small icon in the brows¬≠er which alerts you to the pres¬≠ence of micro¬≠for¬≠mats on the page, then allows you to use the data for an amaz¬≠ing array of pur¬≠pos¬≠es; adding events to your cal¬≠en¬≠dar or con¬≠tact details to your address book, search¬≠ing for address¬≠es in online maps, search¬≠ing the lead¬≠ing social web¬≠sites for relat¬≠ed con¬≠tent‚Ķ it real¬≠ly shows the poten¬≠tial of the seman¬≠tic web.

For any­one still not con­vinced of the ben­e­fits of micro­for­mats, I urge you to install Oper­a­tor and right-click on the fol­low­ing para­graph; once you see what you can do with it, you’re unlike­ly to remain unconvinced.

This post was written by Peter Gasston, who lives in Camberwell, South-East London in the United Kingdom. You can email him at if you want to say hello.


Delicious: One of the best free fonts around

I‚Äôve done a few small tweaks on the design of my blog; it‚Äôs still not the way I had it in my head ‚ÄĒ my design skills don‚Äôt match my ideas, unfor¬≠tu¬≠nate¬≠ly ‚ÄĒ but it‚Äôs get¬≠ting there, at least. I‚Äôve had a first pass at cre¬≠at¬≠ing a logo and a match¬≠ing fav¬≠i¬≠con, both of which will be fur¬≠ther developed.

The logo, strapline and arti¬≠cle head¬≠ers all make use of the Deli¬≠cious font which, as well as being read¬≠able and beau¬≠ti¬≠ful, is also free. It works real¬≠ly well on screen, and I rec¬≠om¬≠mend it to every¬≠body; it would be nice to see it in more wide¬≠spread use, and even ‚ÄĒ who knows? ‚ÄĒ becom¬≠ing a new web stan¬≠dard font. It cer¬≠tain¬≠ly adds some¬≠thing to this site if you have it installed.


CSS 3 and HTML 5: Simple Semantics

Inter­est­ing times to be a web devel­op­er, as HTML 5 and CSS 3 are both on the (some­what dis­tant) hori­zon. I’ve just writ­ten about the Advanced Lay­out mod­ule on CSS3.info, IBM devel­op­er works have a nice intro­duc­tion to the new ele­ments of HTML 5, and Wikipedia has a chart of cur­rent brows­er imple­men­ta­tion.

In a few(?) years time, a basic two-col¬≠umn plus head¬≠er and foot¬≠er page lay¬≠out could be as sim¬≠ple and log¬≠i¬≠cal as:

body {
layout: "aa"
        "bc"
        "dd"; }
header { position: a; }
nav { position: b; }
section { position: c; }
footer { position: d; }

What a dif­fer­ence that would make to legibility.


Five simple steps to alleviate IE6 frustration

A post called Trash All IE Hacks! on the (rather love­ly) Web Design­er Wall blog has attract­ed a huge amount of com­ments recent­ly with its call to stop pan­der­ing to those who have the audac­i­ty to still be using the pre­vi­ous ver­sion of Inter­net Explor­er (approx. 80% of vis­i­tors on one site I man­age), and to dis­play the bro­ken lay­out as pun­ish­ment for any­one not au fait with mod­ern browsers.

Just in case you missed it, I was being sar¬≠cas¬≠tic there; to take that atti¬≠tude would be like a TV sta¬≠tion trans¬≠mit¬≠ting black & white sig¬≠nals to any¬≠one who has¬≠n‚Äôt yet bought a High Def¬≠i¬≠n¬≠i¬≠tion set.

From the many sup¬≠port¬≠ive com¬≠ments, a few said things like 85% of my time is wast¬≠ed cod¬≠ing for IE6! or I spent two nights get¬≠ting the lay¬≠out to work in IE6!; to that, I can only reply: either you are doing some¬≠thing wrong, or you are a bad coder ‚ÄĒ or both.

It‚Äôs not hard to get sites to dis¬≠play prop¬≠er¬≠ly in IE6; sure, you‚Äôll have to put in a lit¬≠tle extra effort, but it should¬≠n‚Äôt be any¬≠thing like 85% of your time, or 50%, or even 10%. All you need to do is fol¬≠low these five sim¬≠ple steps:

Read the full article


Jeffrey Zeldman: King of Web Standards

Jef­frey Zeld­man: King of Web Stan­dards serves as an inter­est­ing pro­file of the stan­dard­ista, as well as being a his­to­ry of stan­dards and a primer on their importance.


Older

Aside

I‚Äôve updat¬≠ed my Speak¬≠ing page to include more con¬≠fer¬≠ences, more videos, and a lit¬≠tle on my speak¬≠ing require¬≠ments and pref¬≠er¬≠ences. I‚Äôm plan¬≠ning to cut down on the num¬≠ber of talks I give in 2014 (twelve is too many), but am always open to inter¬≠est¬≠ing offers and oppor¬≠tu¬≠ni¬≠ties, so please get in touch if you‚Äôre organ¬≠is¬≠ing an event.

[#] 1 Comment . More Asides.