Category: Basics
A series on fundamental knowledge of web development, aimed at beginners.
A series on fundamental knowledge of web development, aimed at beginners.
We, as website makers, quite often advise our clients to avoid generic link text (read more,click here, etc.), and explain that more verbose descriptions help give context to users with screen readers. But using semantic link descriptions actually helps everyone.
I recently read Peter Morville’s fantastic book, Ambient Findability, which defined really well the motivation to use semantic descriptions for links: they give the target page aboutness.
Firefox 3.5 was released earlier today, and joins Safari in supporting the @font-face rule with OpenType and TrueType font families, allowing you to use a wider range of fonts in your designs (as long as they are correctly licensed, of course).
One slight drawback of the technique is the blank space that’s displayed as the new font is loaded into the browser; this is especially unnecessary for users who already have that font natively on their system.
The way to get around that is quite simple; use local() to check if the font is on the user’s system first.
I’m happy to see that IE8 includes native support for console.log, the JavaScript command which writes information to your preferred debugging tool (mine is Firebug). If you leave it in your code – as I did on my latest project – it throws an error in IE7 & below.
The way around it is to quickly check that the command is supported by your browser, and to provide an alternative (I use that old standby, alert) if not; and the quickest way to do that is with the if…else shorthand:
window.console ? console.log(foo) : alert(foo);
A mistake which seems to be fairly common when taking the first steps in learning about Microformats (and one which I have made) is to presume that the markup which is generated by the generation tools – for example, the hCard Creator – is the markup that must be used in the page.
That’s not the case, of course; with a few notable exceptions, the markup is completely customisable, and it is the order of the class names (and other attributes) which matters.
When building a small site or blog template with a grid-based layout I find ‘CSS frameworks’ such as Blueprint and YUI Grids are overkill; they contain a lot of extra CSS rules which I don’t use. They are (in the vernacular) like using a sledgehammer to crack a nut.
What I do instead is much simpler; I use an extra stylesheet just for testing, and a single PNG image tiled across the background.
After being a developer for a while you sometimes forget that there are a lot of people still learning. With that in mind — and working on the assumption that the more information that’s available, the easier it is to find — I’ve decided to start an occasional series of web development basics tutorials.
One of the things I see a few people struggle with when learning CSS is the concept of the cascade. I admit that as your stylesheets get more and more complicated, so the cascade gains in complexity with it. At it’s core, however, it’s pretty simple. There are three things you need to keep in mind: order, specificity, and inheritance.
Usually when I attend @media (that is, on two previous occasions) I write a follow-up blog post on what I saw there. Well I attended this year, and I’ve written the post, but it’s on the blog of my employer, Preloaded: HTML5, Mobile, and UCD: what we saw at @media.
[#] 0 Comments