I felt compelled to offer up some advice to front-end web developers, particularly intermediate and/or senior front-end web developers, on how to present themselves for a position in front-end web development.

First off, I’d like to say that I am primarily a Sr. Designer, but also do some lite project/client management in my position. From time to time, I am required to hire contractors for my group to handle front-end development work. We do not have a full time front-end developer on staff, so I have been forced to learn more about the role and responsibility of someone in that position. I get frustrated when I see candidates who say they can code sites using html/css and are still using tables for positioning as well as inline styles. In addition, I still see sites with pages that don’t validate well. Some haven’t even declared a “doctype”!

I am writing this in hopes of helping at least one person, who is experienced and great at what you do, but might be having troubles getting past screeners to land that phone or in person interview.

We all know, that having a resume is one aspect to landing an interview. I’m not going to say much about preparing a good resume, because there is a ton of information out there on that subject already. Being a front-end developer means that you will need to show working examples of your past experiences. Here are my must-haves, when it comes to presenting yourself as a credible web developer and as a potential candidate to make it past a screening process.

1) Web Portfolio – I can’t stress enough how important it is to show samples of your work. You must have working URLs of sites that you have coded…by yourself. It’s best to have a web page of links to display. This is your “portfolio”. It doesn’t have to be a full-fledged website. In fact, I recommend that it don’t be. When developers try to design sites, it usually shows their lack of “design” talent, which reflects on their other skills; plus, it is really hard to get past a poorly designed site. If you have connections to a great designer, by all means use that resource to get a decent site up to display your experiences. But again, it is not necessary to have a fully designed site, if all you do is web development. You can even use a blog tool to display your work…it’s simple to set-up, usually has themes to choose from, has simple layouts, easy to modify and add content. Simple examples…Janic Design, Jacob Warhaftig, Dan Drinkard, Architexture, Sohtarine

I recommend one page of links and/or thumbnails, with explanations of what your role was, title of project, who the client was, length of time of project, when project launched, etc. This is ideal, for people who are screening you. Just providing a link to a site is not good enough.

2) Table-less Layouts – By the time you are an intermediate or senior level front-end developer, you should have a full grasp of how to develop a site without the use of tables and be fluent in content versus presentation layers(html/css). If you can’t show real-world examples of this, then you should re-create a site or a develop a working demo of your skills.

3) Validation – You must be able to code a site and have your pages pass the W3C Validator. And you must know “why” this is important. When a potential candidate sends me their list of links, this is one of the first things that I check.

4) File/Directory Structure – This should be common sense, but I’m amazed at how poorly a developer can structure a site. It is helpful that some prior thought be given on the overall structure of directories and files for the site you are building. You should categorize your directories based on the sections of your site, for starters. Multiple copies of the same file, should not exist on your site. Reference one file in one directory if you link to it multiple times across your site.

5) Photoshop Skills – The one thing that you should be good at using PS for, is slicing and optimizing graphics. Just learn the basics and stay away from the Filter menu.

6) Quality Assurance – Spell Check, Spell Check, Spell Check…learn to use this. If you don’t have it built in to your tool of choice, then find a free tool that will do this for you. In addition to Spell Check, you should invest in a Link Checker program. Does your site work visually and functionally in other browsers and platforms? Learn the basics of conducting a simple QA at the very least. In addition, you should be familiar with writing test plans. Any site that has dynamic capabilities or forms of any sort, should have a test plan written. In my experience, the web developer should be able to handle this. Bottom line on this one…you should have a quality assurance process that you conduct on everything that you do.

7) Javascript – You should be able to code from scratch as well as utilize existing libraries. This is another nice thing to show on your portfolio page or at least call out on sites that you have written javascript for.

Other Niceties, but not necessarily required:

• You should know who the following people are: Eric Meyer, Cameron Moll, Andy Budd, Dan Cederholm
• You should have some knowledge of basic WCAG Guidelines
• You should have some knowledge of basic SEO principles
• You should have some experience using version control software
• You should belong to at least one of the following social communities: flickr, twitter, linkedin, del.icio.us
• You should always be evangelizing for web standards
• You should be familiar with Flash/ActionScript or interested in learning
• Updated 2.17.2012… I’m not a fan of sIFR anymore with the rise of web fonts.  sIFR – Here and here. You should know how to implement this.
• Grids – Here and here. You should be able to visualize grids from the designs that you are given to develop.
• Web Analytics – You should have experience implementing at the very least, Google Analytics to a site. Other analytics companies to know: WebTrends or Omniture (Now Visual Sciences)
• You should be using Internet Explorer Developer Toolbar and/or Mozilla Firefox Developer Toolbar. Don’t forget Firebug!

Well, I’m sure that I have left off something. If you want to suggest modifications or additions, please feel free to.