Improve your web design - tidy up your HTML & CSS code

[Mrkvonic]

If you're writing HTML, then there are some things you should know - first and foremost international standards & W3C compliance. Then, you also have clean and readable code - but these go hand in hand.

To this end, I've written an article explaining how to use HTML/CSS tidying tools to clean up code and improve W3C compliance.

http://www.dedoimedo.com/computers/html-tidy.html


Enjoy,
Mrk

[Rmus]

Nice article, Mrk!

I've used a Text Editor for the reasons you list:

-{ Quote: "The WYSIWYG editors are far easier to work with than text editors, but they are usually less efficient.

And they leave behind a lot of crud." }-Having said that, I think if I had to churn out many pages daily, I would use a WYSIWYG editor to save time!

----
rich

[JRViejo]

Rmus is correct. You can't beat a WYSIWYG editor on a production level and I found that the marriage between Macromedia & Adobe, did produce a worthy program, Dreamweaver CS4, which cleaned up its generated code from older versions.

Having said that, I always run my pages through two W3C Validators: CSS Validation Service (http://jigsaw.w3.org/css-validator/) & Markup Validation Service (http://validator.w3.org/) and this is how I know Dreamweaver's generated code is good. I wanted to mention them both as added tools to Mrkvonic's excellent article.

[Rmus]

I also use the W3C Validator. Mrk mentions a Firefox extension.

Opera puts the W3C Validator on the context menu, which then displays any errors in coding on the page you are working:

210277


----
rich

[JRViejo]

Rmus, not validators per se, I have come to appreciate these 2 Firefox add-ons: Web Developer (https://addons.mozilla.org/en-US/firefox/addon/60) & Firebug (https://addons.mozilla.org/en-US/firefox/addon/1843), that provide a wealth of information when looking at how Web sites are wired.

[iceni60]

opera has a few toolbars too, here's one, it's easy to turn on and off -
http://operawiki.info/WebDevToolbar

and here's a post for setting up gedit (gtk linux), it includes adding tidy in a new pane, gedit has loads of addons -
http://www.micahcarrick.com/09-29-2007/gedit-html-editor.html
this is the tidy plugin -
http://www.eng.tau.ac.il/~atavory/gedit-plugins/html-tidy/
here are some more plugins -
http://live.gnome.org/Gedit/Plugins
http://live.gnome.org/Gedit/ExternalToolsPluginSnippets