I just wanted to announce that part 2 of my article on my criticism of the web standards movement can be found in the January issue of Web Developer Magazine.
Yep, I’m at it again!
Who is this book good for?
I would say intermediate level web designers who are comfortable with code and concepts related to web design (like Web standards and semantic meaning of code etc …) and feel a need to brush up on some Web standards nerd stuff again while learning Dreamweaver 8.
The book is NOT FOR BEGINNERS to Dreamweaver or to web design. Yet at the same time, the author goes into topics that experienced web designers will probably not need to learn … again:
Why is this book not for beginners?
I think the problem lies in the way certain topics are covered; I think it would be too fast for most beginners.
Other topics covered:
The positives:
The writing is clear and the editing is good, as is typical of SitePoint books – please keep in mind what I said about who the reader should be!
It is a project based based book, where you are guided through the process of building a website – this may be useful for some to see. You also get a look at how to use Dreamweaver in the context of Web standards and accessibility … some good tips can be found.
The negatives:
Besides what I mentioned above, I disagree with the author’s style of building websites: she combines modern code and structural practices but uses old style methods of web site construction/production: she creates the structure of the site first, then moves to styling it with CSS.
This is a better approach than building everything up at once, but I am a big believer in starting out with page-level layouts first (by way of template,) then moving to adding elements to the page.
I also think she (like many other web designers out there today,) have smoked a little too much of the Web-standards-zealot wacky-tabacci, and have become overly enamored with XHTML and validations etc. To be fair though, my point of view is heretical … even if it is right!
For example: XHTML – please not again!
The author (like many other poor souls) love XHTML for a bunch of reasons that have little, if any relevance in the real-world. In fact, the reasons that they (the zealots) love XHTML so much, is actually lost with 80% of the users on the web today!
Let me explain:
You see, IE 6 and IE 7 will render XHTML as ‘tag soup’ – I don’t want to get into it here, but in a nutshell, IE 6 and IE 7 doesn’t read XHTML properly! So when either browser comes across an XHTML page, it reads it as crappy HTML.
On the other hand, XHTML makes pages that much harder to code, and it makes DOM scripting a pain in the butt. There is no real reason to want to use XHTML except (of course) if you want to be anal about code and you feel need to create work for yourself for no good reason …
How about another example of the authors poor choices: using CSS hacks.
Again, I don’t want to get into here but, CSS hacks are bad news since many will break in the new IE 7 – authors should not be teaching the use of hacks!
I recently had this question put to me, and I thought it would make an interesting blog post:
"What’s Apache, Perl, MySQL? As a web designer, will I need to know these for my clients?"
Apache, Perl, MySQL
Apache = a web server. The most popular (in terms of use) in the world. If your host is on Linux, they are running Apache.
You don’t need to know much about Apache as a web designer, since your hosting company will configure that all for you.
–
Perl = a programming language used a lot on Linux servers. It can be used to do all kinds of things but it is mostly known for its legacy as the programming language used to write CGI scripts – think guestbooks etc …
You don’t need to know much about Perl as a web designer. But Perl is still widely used and you will find that many scripts out there (like guest books,) are created with Perl.
–
MySQL = is a database program. Database software like MySQL are used to store information. Used a lot with things like message boards, e-commerce shops and other programs like that. MySQL is often used with PHP (a programming language) to create database driven websites.
MySQL becomes important to learn IF you want to learn how to create dynamic/database driven websites.
A final point:
There is so much (out there) in the web design world, that you will probably never need to know or use. I can tell you from 12 years experience, that nobody knows everything – there is just too much.
My advice is to concentrate on what you need NOW and to continue to work on basic skills … let the projects that come up dictate what you’ll learn.
INTRODUCTION
Following the Web Standards makes perfect sense when it allows you to build easy to mantain websites that work with the major browsers. It doesn’t make sense when using Web Standards forces you to use hacks, prevents you from taking advantage of a great technology/feature or makes your job as a web designer or developer more difficult.
Let’s take a look at 3 very useful technologies that are not in the Web Standards, but do not have any of the negative consequences associated with browser specific code:
Though each of the above are not part of the Web Standards, they provide terrifically useful functionality without any hangups.
IE CONDITIONAL COMMENTS
Though IE conditional comments only work in IE, it makes great sense to use them when you want to isolate code. Since all other browsers will see IE conditional comments as being only HTML comments, there can never be a down side to IE conditional comments. It is the proper way of dealing with IE 6’s problems with CSS code.
Example:
<head>
<link href="standardStyle.css" rel="stylesheet" type="text/css" media=screen>
<!–[if IE 6]>
<link href="ie_style.css" rel="stylesheet" type="text/css" media=screen>
<![endif]–>
</head>
In the above example, we use IE conditional comments to hide IE specific CSS from all other browsers. Spefically, the IE conditional comments:
(<!–[if IE 6]> and <![endif]–>)
is loading the ‘ie_style.css’ style sheet only if the browser reading the page is IE6.
IE conditional comments are a replacement for dangerous CSS hacks that are commonly used to deal with IE’s occasional problems with standard CSS.
AJAX
The heart of AJAX is in the XMLHTTPObject – a JavaScript function built into every major browser but is NOT part of the Web Standards. Given how powerful AJAX is, and given how popular it has become, you can be sure that every major browser will continue to support it.
So as a Web Standards zealot, you have to ask yourself whether blind adhereance to the Web standards is worth missing out on this important tool? That is to say, if you’re a web standards zealot, you couldn’t/shouldn’t use AJAX since it is not part of the official Web standards … it’s your choice.
INNER HTML PROPERTY
InnerHTML is an easy to use property supported by all the major browsers that allows you to dynamically update/change web pages without having to do a page refresh.
Example using innerHTML:
var targetDiv = document.getElementById("targetDiv");
targetDiv.innerHTML = "<p>innerHTML is fast and easy!</p>"
Example using DOM methods:
var para = document.createElement("p");
var targetDiv = document.getElementById("targetDiv");
targetDiv.appendChild(para);
var txt = document.createTextNode("Dom methods are much longer than innerHTML");
para.appendChild(txt);
As you can see with the above examples, to insert text with DOM methods takes a lot more code than innerHTML. So, should you use innerHTML?
The answer: Browser makers typically don’t remove functionality, and given that innerHTML is supported by all the browsers and is easy to use, this is yet another example where I will break from the standards and feel comfortable about it.
I recently was surfing the web and found myself on a popular web standards zealot website. The featured article referred to 3 column CSS based page layout as being the ‘Holy Grail’! My first reaction to this was: geez, how silly this is!
…
Indeed, a simple thing like a 3 column layout is a challenge – when you don’t use tables. As such, you can find many articles on many web standards zealot websites that attempt to solve this problem. All of them falling short, all of them requiring the use of hacks – hacks that can break and WILL break.
IRRESPONSIBLE ‘EXPERTS’
The article in question, though recent, still advocates/demonstrates the use of a hack to get it to work with the most popular browsers … they don’t learn, do they?
I say this because a few months ago, it was discovered by the web community that many commonly used CSS hacks will break in the new, fully standards compliant IE7 … thus breaking countless web standards zealot website’s. So much for saving time and the myth of forward compatibility.
PEOPLE SHOULDN’T USE HACKS TO MAKE THEIR CSS WORK!
It gets me ‘hot under the collar’ when I see articles that promote the use of CSS hacks – this is bad practice for obvious reasons.
I’ve been warning about this for some time before the IE7 problem. None of these web standards zealots payed me much attention before the IE7 problem came to light; and now after this problem has been well publicized, it seems that these people still have their heads in the sand!
CSS FOR PAGE-LEVEL LAYOUT IS WEAK
Even in a perfect world, where all the browsers supported the standards perfectly, CSS page-level layout capabilities suck for many types of layouts … HTML tables are much easier to use.
That said, there is a CSS tables specification that works like HTML tables, but no browsers support it! There should be a ‘call to action’ to force browser makers to implement CSS tables.
Note:
Tables are grids, and grids are a proven tool for page layout that are used in programming languages (like Java) to create user interfaces. It’s about time that we web-nerds have access to this powerful and flexible system of page layout in CSS. For now, we can use HTML tables.
HTML tables may not be semantically correct, and they may bind your formatting to your page structure, but they will work in all browsers without the need for fragile hacks and they are really easy to use.
CONCLUSION
Web standards were created to make web design easier for web developers by having the browser makers build their browsers according to a standard specification – the web standards.
As soon as you have to work harder, and have to jump through hoops (use hacks) to make your pages work – the point of the web standards is lost. It makes no sense to try and force web standards (in ultra-strict terms,) unless the browsers properly support the web standards – they don’t right now.
One of the fundamental problems people have with CSS page-level layout is matching CSS div heights. Others might call this ‘matching column heights’ in web pages.
In this article/video (see below,) we are going to solve this problem using a lesser known JavaScript method: the Matching Columns Script.
Let’s start out by checking out a diagram that illustrates the problem:
People have come out with different solutions including the ‘Faux columns’ hack: using a vertically tiled background image to create the illusion of a column.
The ‘Faux columns’ hack/trick works, but it does have some limitations:
THE BETTER WAY TO HANDLE THIS PROBLEM: DOM SCRIPTING (JavaScript)
JavaScript (sometimes called ECMA script,) is the programming language built into all the browsers that allow geeks/nerds, to have practically total control over how things appear in a web page – it’s very powerful.
Note: DOM scripting (the term,) is a quick way to describe using JavaScript to control a web page’s structure. If this makes no sense, don’t worry about it as you need no programming knowledge to use the technique that is covered here.
WHY IS THE JAVASCRIPT METHOD BETTER?
You are better off with the JavaScript method (rather than the ‘Faux columns’ hack, ) because:
GETTING STARTED
Attached with this article you will find the files you need to apply the script:
Now it’s time to watch the video to learn how to use it.
CONCLUSION
There is one downside to this technique:
It won’t work if people have JavaScript turned off. Fortunately, the vast majority of people out there have it on. Last time I checked my own stats, nobody had JavaScript disabled.
That said, though it looks a lot better when your columns heights match, I would not consider it mission-critical to a website. That is to say; people will still be able to use the website, so I am willing to accept that for some rare (paranoid) individuals, the columns will not match.
I get emails all the time from people asking all kinds of interesting questions; once in a while I post them on the blog or in my newsletter.
This time around someone wanted to know about earning ad revenue with a website:
Me and my business partner have currently set up a new site and we are wondering if you have any advice as to how we should start to make it earn us money. Do we build up the trafic first? or do we get the paid for links & ads first?
MY ANSWER:
The life-blood of any site (that those that depend on ad revenue,) is the the traffic. I’ll even go a step further: the value of a site is the traffic and the quality of the traffic. I think you guessed the answer by now … but just in case, you need traffic first.
Once you have traffic, people will contact you to buy ad space. I get lots of request and refuse the vast majority. Why? Killersites.com gets over 1 million+ pageviews a month of very high quality traffic.
Hope that helps,
Stefan Mischook (The Web Design Heretic)
In this podcast I discuss podcasting. I give a few tips on podcasting and touch on why podcasting is something that web designers need to pay attention to.
Podcast running time: 8:19
[audio:https://www.killersites.com/blog/audio/podcasting.mp3]
Download this discussion in MP3 format
Thanks,
Stefan Mischook
In this article, I will look at some of the misleading arguments used to promote Web Standards.
Before I jump into this, I would like to point out a few things:
– –
The term bait and switch has a slightly negative connotation, but I use it anyway because it sounds good …
For small and medium sized web design projects, clients will typically want a final price for the project – it’s rare that they will let you work on a per-hour basis. Strangely enough though, clients will ask what you charge by the hour …
This is where this tactic comes in handy; the idea is to give them a per hour rate that sounds good … make them feel as though they are getting a special price. If what you charge per hour actually does sound good, then this tactic is not useful for you.
On the other hand, if you’re a cracker-jack designer, who charges more per hour because your work is that much better, or because you’re just faster at what you do, then bait-and-switch is what you need.
In a nutshell: it comes down to how many hours you actually work. Your clients will have no idea how long it will take you to complete the task! So if your rate is normally $50/hour (and $25/hour is the price that makes your client happy,) and you estimate the job will take you 10 hours. You can tell your clients that the job will take 20 hours at only $25/hour. This way, you’re able to give a more competitive per hour rate , while still making the money you want for the job.
Conclusion:
At the end of the day, the bait and switch tactic I teach, is not about ripping off your clients – you MUST provide good value. Instead it just about framing your pitch.
