This morning I checked out a screencast by Nate Koechley called Professional Frontend Engineering, provided by YUI Theater. It’s quite lengthy (1:30), but well worth your time. Although nothing ground breaking or exciting is covered, I found it to be a good kick in the pants. Nate goes over the main technologies that we as frontend guys are responsible for – (X)HTML, CSS and JavaScript.

A few useful things I pulled from this video where…

Build from the ground-up and ensure there is a solid platform that is accessibility to everyone. Nate calls this Progressive Enhancement.

HTML needs to be as rich and meaningful as possible. Sometimes, its easy to get in a rut and ‘presentational’ tags start creeping into your document. Its probably a good idea to create your HTML without previewing it in a browser, because, its not the layout/look you should be concerned about at this stage – that will come later (i.e. progressive enhancement).

This is a nifty one – why have 100 different icons images (or graphical headers for that matter), which represent 100 HTTP requests, when you can just stuff them all into one file and use CSS to ‘navigate’ to the proper one? This method is called CSS Sprites and it can really improve page load performance, especially on a graphic-heavy design.

Finally, ensure all JavaScript is validated. Nate recommends JSLint to do the job. Once everything is good to go, it may be a good idea to compress (YUI Compressor) all the source files to further improve the performance level of the Web site.