Apr9, 2009
It's CSS Naked Day again :) Websites all over the world are stripping off to show you that, even without styles, a well-coded and semantically inclined site will still be readable. Visit the naked day site for more information and instructions on how to take part.
Feb3, 2009
I feel like shit, and have spent a proportion of the afternoon in bed so really shouldn't be involving myself in this right now, but I can't help it.
Hacker News and Reddit have been bickering today on CSS vs. tables. I have, for the most part, kept out of it. Despite being an advocate of CSS, I don't need to justify that to anyone. I am more efficient, and can produce better websites in CSS than I ever could with tables. I positively cringe whenever I have to do an e-mail newsletter/"e-shot" at work, because they generally only work in tables. Anyway, I've stepped in because now both sides are spreading misinformation.
Firstly, pro-tables Ron Garret used a 3-column layout taken from a 3rd party website that was "back to front" to argue that:
The reason that the order matters is that this layout, like all multi-column CSS layouts, is achieved with floats, and the way that floats get rendered depends on the order in which they appear. So we have not managed to separate content from presentation.
Then, pro-CSS Joel Sutherland agrees with him:
A central point of Ron Garret's "Why CSS should not be used for layout" is that CSS is flawed because you cannot rearrange the elements of an html document and maintain a consistent presentation. This is true, but it misses the point
They're both wrong. You can order your content how your like. You are restricted only by your knowledge of CSS and not its ability as a styling language to render your documents. It took me about 30 minutes to knock up a demonstration, which you can see for yourself: columns in order and columns out of order. Both are visually identical in appearance, both use CSS to control the positioning of the columns, but one is in "correct" logical order in the document (left, center, right) and the other out of order (center, left, right). (Only tested in Firefox3 on Linux.)
I have nothing against programmers who choose to use tables, nor do I care if the world takes on the CSS revolution, but these are the kind of anal perfection-obsessed hackers and programmers that freely comment on the mistakes of Jeff Atwood and Robert Scoble at every opportunity, and yet are happy to support other's mistakes as fact when they add weight to their somewhat misguided arguments? That's just hypocrisy.
Update (04/02/09 8:51): I took a lot of flack last night because I only tested my examples in FF3. Such is the downside of running nowt but Linux at home these days. However, I've had the opportunity to re-test all 5 of my examples this morning and they are absolutely identical in IE6 as they are in Firefox 3.
Jan25, 2009
Validation — to validate HTML or XHTML — is the process of tidying up the syntax of a web page to conform to standards set by the World Wide Web Consortium, the group that develops the standards and guidelines of our beloved mark-up languages.
Valid pages retain a horde of benefits over non-valid counterparts, upto and including lower bandwidth due to optimised code, greater chance of cross-browser and cross-platform compatibility, and often backwards compatibility too. However, this article is not about the benefits of validation. It's a frustrated rant aimed at those who either take on validation, or ignore it completely, for the sake of being trendy.
Validating your pages for the sake of showing a yellow W3C button on your page, while for a mighty cause, undermines the very point of validation. Strict syntax rules should come into play to ensure our pages are properly structured and that content is marked-up appropriately and semantically. Often those who wish to validate choose to ignore these rules and simply pick the most valid HTML tag for the job.
Take for example: <b>. The "b" tag, while not deprecated, should not be used in a valid page. It is a presentational tag designed only to alter the appearance of text and not for any semantic meaning. To combat this minor problem, most users simply switch to <strong>, which has an identical default behaviour. The problem is, <strong> is designed to give strong emphasis on an item (and does so in screen readers).
Instead of changing to visually similar tags that actually have a set meaning, use Cascading Style Sheets (CSS) to customise the appearance of your page. Where this is redundant or over the top, simply ask yourself whether the tag is needed in the first place. Does there really need to be a bold word in every sentence? Can you use headers (<h1>—<h6>) to structure your document instead of fake bold text?
The initial step into CSS-based layouts can seem daunting, so many users choose to stick with <table> based modular layouts often constructed in Frontpage or Dreamweaver. The code can often be bloated with redundant attributes, is slower to load and can often have a negative affect on search engine rankings (search engines can more easily index lean code).
With an ever-increasing understanding of CSS and <div> based layouts, there is no excuse not to get stuck into the code and have a go yourself. If you're determined that you just can't do it, there are plenty of sites with free CSS templates too.
On the other side of the fence there are plenty of webmasters refusing to validate their pages because they think that standards are a fad. While the interest in validation of many may be described as such, validation and standards themselves are not. The Web Standards Project have been campaigning for a standardised web since 1998 — over ten years! If standards are a fad, that's the longest fad I've ever seen.
Aside from the "it's a fad" shouters, there are those who refuse to believe that standards can do anything for them. Sure, if your code is 99% valid and all you're missing is an unescaped ampersand, you're not likely going to make a difference by changing it to its entity reference. On the other hand, if your pages are a mess of table based design and presentational code you could be costing yourself both money and visitors.
The difference between a trendy valid page or trendy non valid page and a decent, well-coded website are many. It boils down to more than just a valid page. What the web really needs are webmasters, designers and web developers taking standards by the balls and using them to their advantage. Accessibility, usability and semantics are the future.
Of course, you don't have to listen to me. Why not listen to the experts instead?
Jan21, 2009
Those of you interested in coding and programing — specifically those of you who are dabbling with releasing your own scripts — are probably already aware of my lengthy rambles on sanitising input data, not trusting anything, etc etc. However, where I leave you to discover the nuances of individual language security on your own, OWASP (Open Web Application Security Project) have gone straight to the core of one of the biggest security threats to online applications and scripts: XSS
I heartily recommend reading, digesting, favouriting and then re-reading the XSS (Cross Site Scripting) Prevention Cheat Sheet.
It's either that, or you risk ending up on the milw0rm web apps exploits/vulns list. (Talking of which... any of you running Dodo's Quiz might want to read this advisory; but then I have warned you all of the dangers of Dodo's scripts before.)
Jan5, 2009
Some 8-9 years ago when I started knocking up pages in my Geocities page builder, I specified 8pt Verdana and considered myself ahead of the curve because my site text was bigger than most at the time. A couple of years later (or thereabouts) I learned that pt was bad — pt, or 'point', is a print measurement not intended for screen — and moved to 11px. Same size, but 'more correct'.
A few years passed, and I involved myself in accessible design. Catering to the visitor's many needs was suddenly at the forefront of everyone's mind and so I swapped from px to em and/or % measurements; instead of 8pt or 11px Verdana, I gave you 72%. My text — the text that you're reading now — became your text.
Of course, therein lies a small problem. I make the effort but you (generalisation), as readers, don't. I provide you with the facility to resize my text to suit your individual needs and instead, you complain that it's too small, or the opposite (on 'big' designs).. you complain it's too large. So why do I bother? After all, even if I changed it to suit one hypothetical person's wants, it wouldn't align with those of another.
So, do yourself (and me) a favour: learn to use your browsers text resize facility to make the text look how you want it to look. I don't just use relative font sizes for the crack of it, you know.
Welcome to the blog of girl geek & php ninja; Jem. Web developer, mum and crazy cat lady talks about parenting, pets and php »
