Navigation Jump

Print This Post/Page

Anal Coding

…what you see isn't always what you get…

Anal coding is a commitment to the creation of perfect code. It requires a line by line “hand” edit of every single page. To accomplish this, start by learning HTML and CSS instead of relying on your WYSIWYG editor. I'm not saying anything against using such editors to save time, just don't trust them with the final version of your code. No matter what they tell you, what you see isn't always what you get.

It is the express duty of all ampersands to escape. All non-escaped ampersands will be hunted down, deleted, and replaced with escaped ampersands. Have I made myself clear, coder?
–ptvGuy (Anal Coder)

Know Your Code

You don’t have to memorize every code tag, but get to know the main ones intimately, and be aware of the others for when you need them. Play with them. See how a minor change of implementation affects the final product, not just from one browser or browser version to another, but in the exact same one.

Learn Basic Web Standards

Web standards are for making sure that everyone has access to the web irregardless of the technology or software that got them there. It not only makes web development faster and easier, it also makes it accessible for people with disabilities. Go to the Web Standards project website and start reading the posts. Learn the basics.

Use Semantic Markup

…using markup for what it was actually meant to do…

Semantics is the science or study of meaning and changes of meaning in language. When we speak of semantics in relation to web development, we're talking about using markup for what it was actually meant to do:

Code markup used in the proper way has semantic meaning. Learn more about semantics. Find out how it applies to naming conventions. Run through the SimpleBits SimpleQuiz and then go forth and add real meaning to your code.

Learn Web Accessibility

…opening your content up to everyone…

Though it's actually an extension of web standards and semantic markup, web accessibility must be considered in and of itself. It has to do with opening your content up to everyone, making it accessible even to people with disabilities. Go to the WebAIM site and start with their Introduction to Web Accessibility and then read the rest of the site. Check out the resources available on the Accessify website. Read and listen to the boagworld and WebAxe blog and podcasts. You might even want to read my own series of articles on web accessibility.

Separating Behavior, Structure, and Presentation

The separation of behavior from structure and presentation is another aspect of modern web standards. The old days of dumping DHTML markup into your code just for the sake of a cool special effect that only worked in one browser and hid content from everyone else–including search engines–has been replaced by the concept of unobtrusive JavaScript.

Learn CSS

Visit the CSS Zen Garden. Check out the Position Is Everything website. Read Bruce Lawson's blog as well as Lachlan Hunt's. By the way, don't forget to keep mezzoblue's CSS Crib Sheet handy. Look. Play. Learn from the masters. It's just awesome power over your page.

Know Your Server

Find out what kind of server your site is hosted on. Find out why that matters. Find out what you can do with that server. Experiment. Play. Learn.

Get to Know Browser Behaviors

Ideally, proper markup should work identically on all browsers. Unfortunately, it doesn't. Different browsers will handle the exact same code in entirely different ways–as will different versions of the exact same browser. Take the time to at least make sure that your code works right in the two primary browsers, Firefox and Internet Explorer, before you assume that it's done and working correctly.

The Role of Code Validation

…Code is poetry. You have your own style…

Many coders are addicted to the idea of W3C code validation as the final say on whether code is good or not, and, as awesome a resource as that is, it isn't the final say–especially as regards CSS. (Before you accuse me of heresy, hear me out.) Many proprietary CSS properties are available to enhance the appearance of a web page in a specific browser. As long as these settings do not interfere with or cause errors in other browsers or limit the useability of the page or site to a specific browser (In other words, they're minor style settings only.) then they're not bad code even though they may not validate. As long as there's not extra content that can only be seen or accessed in one browser or the other, it's just a style choice. There's nothing wrong with that.

Validating your code is a way of eliminating mistakes and typos. It's not the final say. In the end, it's you who is responsible for what you put out there. Code is poetry. You have your own style. Make it a good one, but don't exclude people from your content.

Start Your Journey to Anal Coding

…don't exclude people from your content…

Below are just a few resources to get you started on your journey to anal coding. Join us, the few, the proud, the truly anal.

Digg this post or add it to your favorite bookmark collection:These icons link to social bookmarking sites where readers can share and discover new web pages.

Comments»

1. timethief - May 4, 2006

Thank you for the links. I have bookmarked some of the html ones like the one for kids and will begin working on them after our June 1st pottery orders have been shipped. :)

2. ptvGuy - May 4, 2006

The Webmonkey one is a good place for beginners too. Also, the Tech Support Guy forums (http://forums.techguy.org/) are a great place to go for any computer related questions including basic coding.

3. Dennis - November 12, 2006

Excellent article. To add to the Semantic Markup points, use lists for lists.

4. ptvGuy - November 13, 2006

Good point, and done, BTW. Thanks for the tip, Dennis.

5. Joao Inacio - December 22, 2006

Good reading, thought there’s actually one thing where newbies will have a horrid experience:

tables for tabular data (not for page layout)

Using divs for page layout and making sure it works on both IE and other more compliant browsers is a real pain.
A couple of links for this topic would help.

6. MARGARIDA.NET - Private Emotion » Blog Archive » Feeds e webstandards - December 31, 2006

[…] “Ontem” (há umas horas atrás e já era “hoje”), esqueci-me de falar de um site também muito bom e de um artigo muito bem explicado, estão em inglês: The Web Standards Project - FAQ What are webstandards and why should we use them? , o outro tem um nome muito sugestivo, mas não tem nada de mal, e é mesmo mesmo útil: ptvGuy: Anal Coding. Vou citar a primeira parte do artigo dele: Anal coding is a commitment to the creation of perfect code. It requires a line by line “hand” edit of every single page. To accomplish this, start by learning HTML and CSS instead of relying on your WYSIWYG editor. I’m not saying anything against using such editors to save time, just don’t trust them with the final version of your code. No matter what they tell you, what you see isn’t always what you get. ptvGuy: Anal Coding […]

7. ptvGuy - January 20, 2007

Joao: I apologize for being so long getting back to you. I’ve been moving and haven’t written anything here for a while. I’ve added your suggestion. Thanks. Also, the best links for that kind of information are A List Apart and Position is Everything.