Are You Valid?

Designing a website can be tricky and in the last Web Design Post I mentioned how you as a designer should check your web pages work on multiple browsers rather than just one. I also briefly mentioned the W3C, World Wide Web Committee,  and this post will go, hopefully, into more detail regarding the validation set out by the W3C.

When the web was created, well HTML anyway there needed to be strict rules to how it was laid out and written. Why? Well if there wasn’t a standard and you just slapped in bits of code in no order or regulation, how can it be understood by browsers?

It’s a lot like if I write “Today was a magical day, Cloud Bite actually got updated.” You can pretty much understand and read that clearly, well hopefully you can. However I wrote, “Tod’y. was a, Magicle day Cloud Bite. Actuly got updated”, it is probably a bit hard for you to understand.

Well in a way, browsers need html and all other code for that matter to be set out correctly in the way it was supposed to be. However like us, browsers are fairly cleaver some are able to understand mistakes you make. If you read that sentence that contains mistakes above if your English is good you can probably work out what it is meant to say. Well browsers do the same sort of thing. They look at the code see and error but display the page how it “thinks” it should. There is 1 problem with this though.

NOT ALL BROWSERS THINK THE SAME!

If your even bothering to read this your probably a person who has tried lots or at least a couple of browsers be it, Internet Explorer, Firefox, Chrome, Safari (there’s lots more). You have also probably come across a website that works fine in one browser but not another, or looks one way in a browser or another way in another browser.

Now I’m not here to tell you which browser is the best, and you can find may sites that debate this, personally I find the best browser is the one that suits YOU, no one else, just you!

BACK TO WEB STANDARDS PLEASE!

Well, web standards “should” stop websites working on one browser and not another. You will probably notice i added the word “should” in that sentence. Nothing ever simple but simply put browsers should follow certain rules when interpreting code however some, no names mentioned, IE 6, oops mentioned one decided not to follow web standards and therefore can cause problems however Microsofts latest bundle of joy IE8 follows web standards far more than before and with IE 6’s recent press that it’s awful, full of security holes and even the German and French Government have said not to use it you can pretty much start saying bye bye to IE6.

HOW DO I KNOW IF MY SITE IS VALID THOUGH? IM NOT A PRO!

Well even pro’s make mistakes, sadly I can’t claim to be that pro but you only have to have a look on some of the biggest websites out their and there are lots of errors.

W3C, remember them, I mentioned them way, way up there. Well they have this cool little thing called a validator. You stick in a web address click the submit button and it will look through your whole page and see if its valid or not. Cool eh? Well it doesn’t end there, it also lists all the errors on your page and gives suggestions on how to solve the problem. Not only can it check HTML but it has the ability to test CSS too and even has the ability to see if your site meets the mobile web standards.

If your site passes you get a nice little image you can put on your site and show off you have a valid site. Now before you ask where’s Cloud Bite’s Valid images, well, er ok Cloud Bite isn’t 100% valid, yet, the CSS is but there are a few errors I need to fix, it’s mainly due to WordPress plugins. When uni has calmed down I will hopefully work on getting it all valid!

LINKS…

• XHTML Validator
• CSS Validator
• Mobile Validator
• Find Broken Links
• W3C

Is your site valid? Have any Tips? Comment below…

Tip - Make Sure your site works on every browser!

If you have ever designed a website, or perhaps your planning to create one, one of the biggest challenges is trying to create a site that not only looks good, but looks good to everyone! A challenge that faces many web developers is trying to make a website that will always look and work correctly no matter what browser the visitor is using.

The Worldwide Web Committee set out standards that web developers and browser developers “Should” use in order to create a standard right across multiple platforms. Sadly some browsers, mentioning no names, cough, I, cough E, cough (sorry i’ve got a cold) fail or have failed in the past to adopt these clear standards or have only partially adopted them.

Now this can cause problems for web developers who make a website that works perfectly on one web browser but broken on another. Some browsers require designers to use specific code within their HTML / CSS in order to do exactly what another browser is doing but without this code!

What all designers therefore must do is test to see that their website looks and performs just the same in multiple browsers. Often web developers have lots of browsers installed on their computers to do this and compatibility with the most common browsers, Chrome, Internet Explorer, Safari, Opera, Firefox is a must in order for a website to succeed.

Ok, so that’s enough waffle, what is my point? Well Browser Shots! What? Browser Shots is a great little website I came across when designing a website as part of my University course. What the website does is allows you to enter any URL and select lots of different browsers across multiple platforms with more being added all the time. Not only that but you can select versions of browsers, like IE 6 cough awful cough IE7, IE8, Safari 3, 4, Chrome, Firefox, 1, 2, 3, 3.1, 3.5 etc etc. Also there is loads of less known browsers you can select.

So what does this actually do? Well after entering the URL selecting what browser you want to check and clicking submit the site will go a take a full page screenshot of your webpage on all those browsers you selected! It does take a while but it’s great if you are unsure whether an older browser will work with the stuff on your site!

Cloud Bite of a few of the available broswers

As it does take a while some may time out but you can extend your time period if you wish and also check different browser sizes if needed. I keep forgetting not everyone has 24” monitors

Overall Browser Shots is a great website that is useful to all those web designers out their, go on give your website a go!

Website: BrowserShots.org