Categories
Software Development Web Design

The Golden Rule of Web Design Implementation, Part 2

This is part two of The Golden Rule of Web Design Implementation. In part one, we learned that pages aren’t views, and that thinking in terms of views is much more beneficial. Today we’ll wrap up our analysis by looking into development.

As you may recall from Monday’s post, the Golden Rule is:

The time it takes to implement a web design will always average out to one view per day.

Our first corollary was related to views. The second is about development. Or more specifically, developers.

There’s a reason I put that always in there. It’s to remind myself (and you) that this rule can stand up to a lot of variables. As I’ve mentioned already, the technologies being used and the platforms being targeted are irrelevant. Plenty of other things are too. But what I found most interesting was this:

The developer’s skill level doesn’t matter.

This is counter-intuitive. If a weak developer needs an average of one day to implement each view, then shouldn’t a more experienced developer be able to get those same views done faster? The answer is no. In fact, it will take a strong front-end developer and a weak front-end developer about the same amount of time to implement any given design. We’ll get to why in a moment, but first let’s clear up some definitions:

  • By weak front-end developer, I mean someone that knows the basics of front-end development in the technologies being used. That statement above is obviously false for someone with zero experience.
  • By strong front-end developer, I mean a real ace. Someone that can put “HTML/CSS Expert” or “Adobe Certified Flex Expert” on their resumé without exaggerating.

All set? So how is it that a below-average developer and a bonafide expert will require the same amount of time to implement the same design? It all comes down to the perceived level of what constitutes a correct implementation. In other words:

Better developers don’t code faster, they code better.

Picture a standard HTML/CSS implementation. The design is there, and you hand it off to your weak developer and your strong developer, and tell them each to get to work. After X days (where X is the number of views, of course), you get both implementations back. Here’s what you can expect:

The weak developer will have done exactly what you asked. The pages will look just like the mock-ups, pixel for pixel, and work as intended. There will be nothing wrong with the design from a typical user’s point of view.

The strong developer will deliver an implementation that looks about the same. Surprised? Don’t be. That’s all these two implementations will have in common. Let’s look at some things the guru probably did that our weak developer didn’t even consider:

  • The HTML and CSS both validate, with no errors.
  • Each page has a proper doctype.
  • There is a clear separation of structure and presentation.
  • Accessibility has been accounted for wherever possible.
  • The HTML is semantically clear, and would be easy to restyle.
  • The CSS is beautifully minimal, and optimized for maintainability.
  • There are <noscript> blocks for users that don’t have javascript enabled.

Do you see the difference here? On the surface, it’s barely noticeable. But just beneath that surface is a trove of quality that goes far and beyond what was asked. To the guru, this isn’t even extra work. This is just how HTML and CSS are used.

Don’t blame the developer.

You may be thinking: “The guru shouldn’t waste time doing what wasn’t asked of him; he should be able to translate that extra time into finishing the implementation faster.”

Please don’t ever ask this of your developers.

Would you ask a master carpenter to build a simple chair as quickly as possible, and not “waste” time without worrying about quality, durability, ethics, or craftsmanship? Of course you wouldn’t. That’s simply not how experts work.

The solution to this problem is simple: choose the best developer for the job. If you don’t care about the internals of a deliverable, assign a developer that has lots of room to learn. If the project requires some baseline level of quality, consider a developer that is better versed in the fine art of building interfaces. Only call in the guru when the project requires an unmatched level of care.

And remember that no matter how hard you push, and no matter which developer you choose, you’ll never beat one view per day.

Categories
Software Development Web Design

The Golden Rule of Web Design Implementation, Part 1

Hi folks! Today’s post was so full of awesome that I had to split it in two. This is part one, about views. Part two is about development.

Estimating is hard, and I hate doing it. But I have a trick.

Specifically, I’m going to talk about how to estimate the implementation of a web front-end project. Maybe it’s a UI refresh for an existing web site, maybe it’s a new take on e-commerce, maybe it’s one of those new-fangled web-apps… it doesn’t matter. As long as you’re implementing a relatively well-spec’d-out design, this rule will work every time.

Oh, and the technology doesn’t matter either. It can be HTML/CSS, with or without JavaScript. It can be Flex, it can be JSP or ASP or anything else. As long as you’re not doing any significant back-end work, this truth still holds.

This is really important so I’m going to write it in a really big font:

The time it takes to implement a web design will always average out to one view per day.

So if the design has 16 views, the implementation will take 16 days.

There are two interesting facets to this rule. Today we’re going to talk about the first one, the significance of the term “view”.

Views != Pages

This is an important distinction: it’s not about pages anymore. We’re past that. We have bigger monitors, and that means we can have more elaborate pages. In fact, we often put several views on the same page, just because we can.

Imagine you have a page in a standard two-column layout. The main content is one view, that’s obvious. What about the sidebar? These days, if it’s anything other than nav, it’s probably also an independent view. Even the main content can be more than one view, if it separates logically and especially if part of it will be re-used on another page.

Of course, not all views are created equal. Maybe the sidebar view in our example is a lot less work than the main content view. That’s bound to happen, and it’s fine. The rule states that this will average out, and believe me, it will. For every super-easy “only took an hour and a half” view you find, you’ll get stuck with one that takes nearly twice as long as it should because you hit some silly browser compatibility issue.

Get used to thinking in terms of views.

There’s another reason for looking at the design in terms of views: That’s how implementation works. You start with the overall page architecture, build out a grid or column structure, and then tackle each distinct view one at a time. The developer’s standard divide-and-conquer approach.

Doesn’t it make sense to estimate the same way? By considering the design in terms of views at scheduling time, you’re estimating the same chunks you’ll be implementing. This will lead to more accurate estimates.

It will also make your estimates easier to defend if they seem too high. Write out a list of all the views in the design, and say “this is a breakdown of the implementation in one-day chunks”. If there are 12 chunks, that’s 12 days. You don’t even have to use the term “view”.

By throwing away the pages metaphor and instead thinking in terms of views, you’ll get better estimates that are more accurate and easier to track, and easier to explain to others.

There’s still more to learn!

We’ve only looked at the first interesting corollary from the Golden Rule. In part two, we dig even further to reveal the secrets of development.