Post Archive

› July 29, 2005

Bulletproof looks fantastic

As one might expect from Dan Cederholm, his new book "Bulletproof Web Design" looks great - he's provided a little sneak peak, via Flickr.

› July 28, 2005

Zoom Layout Starter Kit

My latest Italian article on pro.html.it (published last week) focuses on zoom layout, so I thought I would share it here. This is a pratical approach, together with some tips and tricks, to get started with a zoom layout. But first, some links to good articles on the subject:

In them, you'll find detailed theorical features on what is a zoom layout is. Let's recap them briefly:

view rest of article

› July 25, 2005

Footnotes and sidenotes with JavaScript and CSS

Long time WG readers may remember my June 2003 post + article about "sidenotes," in which I laid out a technique for adding footnotes inline, while displaying them in the sidebar with a touch of CSS3.

Still obsessed with the footnotes+XHTML combo, I was looking for a way to insert footnotes in WordPress entries, yesterday evening. Suddenly, I found this awesome post over at Brand Spanking New: Format Footnotes with Javascript & CSS. In reaction to a recent Daring Fireball entry, BSN's Tim Groves has come up with a very slick solution for XHTML's difficult relation with footnotes, featuring:

  • clean XHTML markup (only a span-with-class wrapped around each footnote)
  • inline insertion of footnotes (!)
  • automatic numbering (!!)
  • easy switching between inline and "classic" view
  • a touch of JavaScript
  • cross-browser compatibility

Because I really liked Tim's solution, I asked him if it was possible to make a sidenote version that doesn't require you to jump up and down on the page everytime you want to read a note - in no time, Tim posted a follow-up accompanied by a sidenote version of his script (updated URI). Be sure to check it out.

Thanks, Tim!

› July 18, 2005

Starting off on the right foot

XHTMLers know that many problems keep showing themselves over and over. Lessons re-learned are often better off incorporated into a workflow. Kevin Hale over at particletree shares the starter files he uses to keep things organized - good stuff that.

› July 16, 2005

CSS context sensitive menus in WordPress

I really like using CSS to indicate "you are here" in a menu or navigation system. I'm building something using WordPress, and wanted to do this - the solution wasn't difficult, but wasn't obvious either - so I'll share it here.

view rest of article

› July 12, 2005

How to style a restaurant menu with CSS

As every Italian, I love cooking and most of all eating... so the example I'm going to present here is a restaurant menu with CSS. But before going to see the details of its implementation, let me preface with a little background information.

Recently, two techniques on clearing floats without structural markup changed a bit our (or, at least my) way of HTML and CSS coding. The first is the FnE (Float Nearly Everything) by Steve Smith and the second one is Simple Clearing of Floats by Paul O'Brien. These techniques are really helpful, since we don't have to contain floats with markup additions anymore.

Another good point is that sometimes using the clear property is not possible, especially when the element we're going to apply this property is flanked on one or both sides by floated elements.

So we have learned how to contain floats without extra markup, even without using the clear property. My challenge was: is it possible to clear the influence of a previous floated element without using clear itself?

view rest of article

› July 11, 2005

.mobi approved - a step closer to a broken web?

Back in December 2004, I commented on ICANN's backing of the .mobi sTLD: the problem with .mobi is that it fundamentally ignores the concept of device independence and tries to solve the mobile content problem by fragmenting the web into "mobile" and "non-mobile" zones. (see also Tim Berners-Lee's opinion on the .mobi sTLD)

Apparently, the last formalities for .mobi's final approval were finished yesterday: new .mobi domains will be on sale from the first half of 2006, according to an article in The Register.

Some (disturbing) snippets from the article:

The pointlessness of accessing the internet through your mobile may soon be over with the creation of a new top-level domain, .mobi.

Yeah, right.

Since .mobi is one of a raft of new “sponsored” top-level domains, it will be run through a sponsoring organisation and applicants for the domain will have to go through a new company called mTLD Top Level Domain Ltd, based in Dublin.

That company will produce a series of style guides and policies that [Rick] Fant said he expected to come in the form of a manual and snippets of downloadable sample code.

Style guides, policies? I doubt Fant is talking about web standards.

The team is also keen to stress that .mobi is not and will not become a standards body. “This is a pick-it-and-go service,” explained Fant. “I will fight any attempt to make it a standards body.” And, he said, it will be operating system neutral.

Hmm?

I hope the Web Standards Project will somehow react against this - if not, we'll soon see a scattered, device dependent web.

› July 5, 2005

Accessible data tables - id and headers vs scope

Roger Hudson and I have been conducting some tests into the difference between "id" and "headers" vs "scope" - to see which of these options was more widely supported in assistive devices.

A range of blind users and accessibility experts were asked to take part in the testing including Andrew Downie, Roger Johansson, Patrick Lauke, Bruce Maguire and David Woodbridge.

The initial results have been published as part of a larger article - Accessible Data Tables:

" At this stage, it appears that id and headers are the most effective way to make complex data tables accessible. Although id and headers are slightly more difficult to code than scope, the apparent poor screen reader support for scope means that this is probably not an effective accessibility option."

We are still interested in further testers and feedback!