July 26, 2006
You know, having got stuck into John Dvorak the other day, I kinda feel a little bad now. See, underneath it all, I sense his frustration with CSS. And I do agree both the issues of browser compatibility and the learning curve with a new technology can be frustrating. It's actually why we wrote "Everything you ever wanted to know about Style" (now called the Complete CSS Guide, but the earlier name I still like more) coming up to 8 years ago, and Style Master, and why we've developed courses and continue developing Style Master, why I run workshops, and conferences.
So enough negativity: here is something positive I am going to suggest. I want to help Mr Dvorak, and show that CSS is not as big a pain as sometimes people think it is. That CSS actually works, that it can easily be made to be cross browser, and that it can achieve beautiful results with very little effort.
So here is a challenge for all you CSS designers:
Develop a CSS redesign of John Dvorak's blog.
- Make it work across all contemporary browsers with no browser hacks
- You have 25 statements or fewer to use (to demonstrate that good CSS based design doesn't have to be complex)
- Document your work with comments so someone new to CSS can see what you've done and why
Dvorak uses WordPress 2.0, so at least the HTML you'll be working with is reasonably nice and clean - but please no one try to pass off Kubrick as your own work ok :-)
The first 10 redesigns we receive, will receive a free copy of Style Master for Mac OS X and Windows (Valued at $USD80).
In addition, we'll give the best redesign $100 of iTunes credit, and 4 "runners up" $50 iTunes credit.
John Dvorak gets a nice new blog. And the world gets to see CSS can be straightforward, actually does work, and produce elegant results.
So, get designing!
July 25, 2006
Professionalism and Best Practice in Web Design and Development
For the last 12 months of so, I've been thinking quite a bit about the issues of what professionalism means in the web development world, and best practices in web design.
It seems a little surprising to me that neither of these has really received a lot of attention. Molly Holzschlag has recently been writing on the issue of professionalism and web professionals (she's actually goign to be adressing this issue at the Web Directions Breakfast in Sydney in a couple of months), and Roger Johansson at 456 Berea Street among others  has spent some time on the issue of best practices, but neither subject has really received the attention that any number of web development and design subjects, from image replacement techniques to search engine optimization, have got over the years.
Certainly, this area isn't as sexy as "sliding doors" or SIFR or other technique based subjects. They are complex issues, open to interpretation, and don't have an immediate pay off, the same way learning a new trick does. But I think it's long past the time we should be addressing issues like "what does it mean to be a professional web designer or developer?" and "what does constitute best practice in web design and development?"
Now we do hear a lot of talk about validation, doctypes, correct use of CSS, semantic and structural markup, accessibility and so on. These discussions are all very very valuable. And together, these areas, and others, go together to build up the overall field of "best practice".
Now where does professionalism come in all this? I'd suggest that a useful definition of professionalism (which is not as easy as you might think to define) would include something along the lines of
A professional web designer and developer understands best practices in their field, among them the use of valid HTML and CSS, the appropriate use of CSS and HTML (separating presentation from structured content, using the appropriate semantic HTML elements where available), and the development of accessible web content.
A professional designer and developer uses these techniques knowledgeably and intelligently to develop solutions which meet their client's, employer's or own needs, and which meet the needs of the users of the sites they develop.
Recently I spoke at an event organised by Adobe in both Sydney and Auckland, addressing the issue of what constitutes best practice in web design and development, which built on my survey late last year of 83 web sites by major Australian companies, as well as significant Australian government web sites.
I'll write again shortly with a detailed proposal for a set of best practices, and ways of measuring adherence to these, but I'd be very interested in people's thoughts as to what constitutes areas of best practice in web design and development, how these might be assessed or measured, and how these tie in with the idea of professionalism among web designers and developers.
For some light reading on the subject :-), the slides for my recent presentation are available as a PDF and there are slides, a podcast, and a detailed article, along with data on how well major Australian sites adhered (or otherwise) to these areas of practice.
1. Here are some other sites which directly address the issue of best practice in web design which may be worth taking a look at
- Apple on web page best practices
- U.S. Government best practices for the web - more broad than just development, includes suggested design patterns, language use and more
July 19, 2006
Dvorak and CSS
OK, so John Dvorak is an admitted troll, but his recent critique of CSS does raise, in a single location a number or myths and misconceptions about CSS that I'll try to address here.
He begins with the rather extremist claim that
none of this stuff works at all. Well, I think that one can be more or less laid to rest without too much trouble. Plenty of industrial strength sites use CSS, so we can perhaps downgrade this to "some increasingly well understood and largely easily dealt with browser inconsistencies which tend to understandably cause newcomers some frustration".
Next we find
The first problem is the idea of "cascading." It means what it says: fallingas in falling apart. You set a parameter for a style element, and that setting falls to the next element unless you provide it with a different element definition. This sounds like a great idea until you try to deconstruct the sheet. You need a road map. One element cascades from here, another from there. One wrong change and all hell breaks loose. If your Internet connection happens to lose a bit of CSS data, you get a mess on your screen
Man, there are criticisms of CSS I've never heard of in there - so credit to Mr Dvorak there - I thought I'd seen it all. You really are imaginative. But sadly wrong.
The first problem with this paragraph is that he is describing inheritance, not the cascade. Elements don't cascade, but properties are inherited from parent to child element according to a set of rules, specified in CSS. Certainly, the way in which CSS facilitates inheritance is a little complicated - some properties are inherited, some not. But on closer inspection, the rules are actually common sense. We wouldn't want padding or margin to be inherited, because if you think about it for a moment, padding or margin would then be inherited by each element from its parent, and so would specifically have to be overridden for particular elements. Other properties are very logically inherited.
More importantly, CSS is a non trivial technology which attempts to solve a number of highly non trivial problems - to enable device independent, accessible, creative designs for HTML based content. And it enables this remarkably well.
So, yes, at times when really using CSS in a quite sophisticated way, you need some sort of assistance in deciphering (deconstruction is a specific technical activity that is not synonymous with deciphering or interpreting) or understanding what is happening with your CSS. That's something a good tool like Style Master, which has features expressly designed to help in this process will do for you. But it is never a valid criticism in and of itself that a technology is complex. Some technologies are complex for the reason that they essentially have to be to help solve complex problems.
The paragraph becomes increasingly muddle headed - I've rarely seen one wrong change that caused
all hell to break loose when developing for the web. But the final sentence in this paragraph reaches the epic heights of that recent U.S. senatorial outpouring: "the internet is a set of tubes".
"If your Internet connection happens to lose a bit of CSS data, you get a mess on your screen"
I am of the possibly mistaken belief that my internet connection is incapable of losing data (even that tricky "CSS data") or any other action, and I have to say in nearly a decade of developing with CSS, I've never once, using dialup, wireless, GPRS, broadband or carrier pigeon seen a mess on my screen which was the consequence of losing CSS data. I am willing to be corrected.
Mr Dvorak is not done yet with his detailed analysis.
"That's not the worst thing. You can live with the basic cascading mess; it's a matter of debugging. The real problem is that no two browsers—let alone no two versions of any one browser—interpret CSS the same way! The Microsoft browser interprets a style sheet one way, Firefox interprets it another way, and Opera a third way. Can someone explain to me exactly what kind of "standard" CSS is, anyway?"
It's very hard to even begin addressing this. The differences between major browsers are reasonably small, if at times frustrating, but also very well understood - people have been actively analysing and suggesting solutions and workarounds (um, I think it's called "debugging") to these problems for nearly a decade now. If there is a problem with the support of CSS in almost any browser - including, let me say, WebTV, (I know, because I did the testing in the late 1990s) you'll easily find advice on how to work around it. Yes, it would be wonderful if all browsers rendered pages identically, but with the exception of Windows Internet Explorer prior to version 7, this is essentially the case now anyway.
Browser incompatibilities, real and alleged, are a significant reason why people don't adopt CSS, and continue to use completely out of date techniques for web development. Dvorak's crude rehashing of this decade old critique demonstrates considerable ignorance (or perhaps an attempt to look for troll victims outside the Mac community for a while.)
There actually are Web sites that mock this mess by showing the simplest CSS code and the differing results from the three main browsers and the Safari and Linux browsers. The differences are not trivial. And because of the architecture of this dog, the bugs cascade when they are part of a larger style sheet, amplifying problems. Worse yet, nobody except the most techie insiders wants to talk about this mess.
See, this set of tubes..., um sorry.
I've never seen these mocking sites - can someone show me a link? Let me tell you if I've not seen them they certainly haven't hit their mark. I imagine some of the "problems" the demonstrate may actually demonstrate ignorance about the underlying platform architectures the browsers run on (for instance, different default DPIs on Mac and Windows mean that text looks "smaller" on the Mac compared with Windows at the same pt size - that's not the fault of a browser, it's a fact of the operating system).
But do rest assured, people have been talking about this long and hard Mr. Dvorak, for a decade. I know, I am one of them, and I know many more. We've been critical of browser support for CSS. We've made our contribution to the development and fostering of CSS, and helped browser developer fix their bugs, all for no financial reward. We certainly didn't simply open up with both barrels 5 minutes after we started using CSS and got a little frustrated that it didn't work exactly like the "font tag".
Peering through the mist of blather, Dvorak seems to be asking for two things
1. for CSS to go away. I don't think that is likely to happen (BTW Mr Dvorak, you don't have to use CSS, the standards zealots won't come for you, I promise )
2. That CSS become SS - style sheets without cascading. Well here is the problem with that stroke of genius. Without the cascade, in every single style sheet, every element must have every property that you want set on your pages set explicitly. Every element will have to have its display type set to block, inline or list-item, every element will have to have margin and padding set for each edge, every element will have to have font, font size, color, background color and so on set explicitly. You get the idea. Really hard work for developers, and speaking from the perspective of someone with a fair idea about the technology, probably far more prone to developer error and far more likely to cause developer frustration than CSS as it has been developed.
Take note that you only see a nicely formatted page in your browser even without a style sheet associated with it because the browsers internal default style sheet cascades into your user style sheet. Would Mr Dvorak like to explain how browser could otherwise even work?
This is the problem with criticising without understanding, you say things which ridiculous to anyone with any idea about what you are talking about.
"Everyone loses here, from users who can't under stand why things look screwy"
Here's the scoop - they look screwy because the developer has not done a professional job. Probably they developed using IE on Windows for previewing, did absolutely no quality assurance at all (not even as much as changing the default font size in their browsers, let alone say validating their HTML and CSS, using Firefox or Opera to get a second opinion, or BrowserCam to check for these inconsistencies that everyone is so worried about they don't apparently do anything about them) and then blame the technology for their lack of professionalism.
"to developers who can't get CSS to do the job right "
Because they don't take the time to even understand the basics of the technology and reasons why they are there before jumping in with both feet criticising something in almost total ignorance. I swear there is more good free information, training and resources on CSS than just about anything else on the web, as well as plenty of forums where people will help you solve your problems if you simply ask them.
"to baffled content providers"
the only baffled person round here is me, trying to work out how that one follows - who are these content providers and what are they baffled about?
"And what's being done about it? Nothing! Another fine mess from the standards bodies."
Um, nothing is being done about the non issue of HTML having inheritance and Cascading style Sheet having cascading.
Browser developers, even Microsoft these days, are continuing to improve and extend their support for CSS. Hundreds of knowledgeable experts are contributing resources, training, explanation, tools, very often for free, while thousands of developers will help you at newsgroups and forums or on mailing lists.
Now, you might wonder why I have spent all this energy feeding the troll? As much it's because of the chorus of "I agrees" which the "discussion" following this article precipitated at PCMag. CSS, like any non trivial technology, or skill set, has a non trivial learning curve. But, it's also not rocket surgery people.
To any web developer not using CSS, really your days in the industry are numbered. That's not a threat, far from it - if you are concerned with your job or business, then holding out against best practice is not going to help further either of these in the long run. Dvorak's ignorant, largely incoherent trolling only bolsters the attitudes of those who hold out against adopting a technology that is well designed, works well, and solves a range of complex problems that old skool techniques such as table based design and presentational HTML simply can't. That's why it is so infuriating. Do we really have to be addressing these issues in 2006 with IE7 almost upon us, and Netscape 4 and IE 5 having an almost trivial user base. It's over people, let it go.
I hereby propose a corollary to Godwin's law of internet debating. When Dvorak enters the debate, the other side has won.
July 06, 2006
Web Directions Melbourne Event
Following the tremendous success of our recent evening with Lars Rasmussen and Dean Jackson in Sydney, Web Directions is excited to announce our first ever event in Melbourne, an evening with Ben Barren of gnoos.com.au, speaking about the trials and tribulations of setting up an Internet business in 2006 along with Web Direction's own John Allsopp talking about Microformats, one of the hottest topics in web development.
After spending over a decade working in online media for groups such as ninemsn and Sensis, in early 2005 Ben Barren co-founded Feedcorp Pty Ltd, with the aim of bringing the best of Web 2.0 Downunder. Hear about Ben's experience of launching gnoos.com.au - Australia's first local blog and media search engine - and the trials and tribulations of setting up an Internet business in 2006. The role of developers, designers, and product planners, will all be discussed.
Software and web developer, writer, speaker, and standards evangelist John Allsopp has been working with new web development technologies since his infatuation with CSS nearly a decade ago. During the last couple of years, he's focussed more closely on semantics for the world wide web, which lead him to microformats soon after their conception.
Find out what the heck these microformats things are anyway, why you should care about them, and how you can use them right now without breaking any browsers, taking advantage of all that HTML know-how you already have.
If you work with the web, we know you’ll be enthused, inspired, and informed by what you hear, and it’s also a great opportunity to meet other interesting and talented people who work in your industry.
We'll be providing finger food for the night, and there’ll be a cash bar if you feel like a drink.
You’ll also have the chance to win a ticket to the Web Directions Conference later this year in Sydney, valued at $850, as well as places at our exclusive breakfast with web guru Molly Holzschlag.
What: Web Directions presents Ben Barren from gnoos.com.au and John Allsopp from westciv and Web Directions
When: 6.00pm for 6.30pm Thursday August 10 2006
Where: Bell’s Hotel and Brewery, 157 Moray St, CNR with Coventry, South Melbourne
Cost: Free, but please RSVP email@example.com