The best web developers are lazy

That's the first thing I tell partners when I'm coaching them on building better websites. They always laugh before I say,

"I'm serious! You work too hard. It wears me out just looking at all the work you've done on this site!"

And I'm not exaggerating. Upon my initial view of a web project, I'm often overwhelmed with the sheer, unnecessary, complexity of the build. Redundancy is the worst of the offenses, but there are others.

The truth is, great web development is terribly efficient. I'm sure you could come up with a number of reasons for that without any help from me, but you're reading my blog, so I'll start the list. Efficient site builds are:

  • cleaner
  • less error-prone
  • easier to maintain
  • more profitable
  • more fun

So here are a few tips for you soon-to-be lazy web developers. I mentioned that redundancy is the worst of the offenses, so my tips will be centered around that.

Root out redundancy

Lazy developers hate to repeat themselves. Redundancy is avoided with passion. It just so happens that Business Catalyst has some really handy tools to aid us in avoiding this problem. The two that can solve the most problems are Page Templates and Content Holders.

Page Templates

Page templates are the kind of thing where less is certainly more. The purpose of a page template is to take all the site's general layout (like the head, header, footer, navigation and branding) and place them in one document that is used throughout the site. Now, It's often not possible to make an entire site on a single page template, but it is certainly possible to limit it down to two, three, or four templates, depending on the type of site. As a rule of thumb, the more page templates you need (beyond, say, three), the less consistent the user experience will be, and the more difficult the site will be to maintain. Too many page templates certainly defeats the intent to be lazy.

I usually start with one template, which I label DEFAULT (just like that, in all caps), and I do as much of the site as possible with that. Then, for the remaining pages or sections of my site, where it simply didn't make sense to use that template, I create a second. The second is usually just a slight variation on the first. For example, if my first template was a two column layout, maybe the second has a single column. I have built many sites that only use two templates.

Content Holders

As a lazy man, myself, I find myself reaching for content holders all the time. Content holders should be used primarily for repeating sections of html. When I start building my first page template, I always include the same four content holders in it:

  1. TECHNICAL - Head.html contains all the html that goes inside the head element. That includes links, meta, scripts (most scripts should go at the foot of the page)
  2. TEMPLATE - Header.html contains the general header of the site. Usually, it will have the logo, primary navigation, account navigation, search and the other elements that should be consistently at the top of the page. This area being the same is an important part of usability for site visitors.
  3. TEMPLATE - Footer.html contains legal information, footer links, search, newsletter forms, etc., that you want consistent throughout your site.
  4. TECHNICAL - Foot.html should be placed right before the closing tag of the body element. It contains scripts and other non-layout, js-oriented html. Most of a site's scripts should be included in this content holder.

Here's an example of a typical DEFAULT page template with its content holders:

<!DOCTYPE html>
<html lang="en">
<head>
    {module_contentholder,name="TECHNICAL - Head"}
</head>
<body>
    <div id="pagewrapper">
        <div id="pageheader">
            {module_contentholder,name="TEMPLATE - Header"}
        </div>
        <div id="pagecontent">
            {tag_pagecontent}
        </div>
        <div id="pagefooter">
            {module_contentholder,name="TEMPLATE - Footer"}
        </div>
    </div>
    {module_contentholder,name="TECHNICAL - Foot"}
</body>
</html>

There are many great uses for content holders, such as for storing forms that will be used in multiple places on the site, or for social links that will be at both the top and bottom of the page.

Content holders can also be abused. If you find yourself adding content holders simply because it reduces the amount of html written directly on your page, that's probably a misuse. Also, using content holders as a method of giving clients access to some of the content, while protecting the general page layout from their misguided hands, might seem like a good idea, but there are better solutions. Think InContext Editing!

There's so much more

I really could go on and on, but really, it comes down to a few simple take-aways. First, try to avoid repeating yourself. It's not appreciated in polite company. Second, when building your sites, think ahead about maintenance and troubleshooting. Wouldn't you rather solve a problem once, in a single location, than searching for repetitions throughout the site?

The most important take-away I can tell you, though, is this: becoming efficient and thoughtful in your site builds will bring a sense of satisfaction, order, and confidence in your abilities as a web developer. Not too shabby a reward for your laziness, if you ask me.

Author:
Adam Cook

Post Date:
Monday, October 21, 2013

Trackbacks:
(0) | Permalink

Trackback Link
http://onecreative.pro/BlogRetrieve.aspx?BlogID=17300&PostID=1138780&A=Trackback

Trackback List
Post has no trackbacks.
comments powered by Disqus

Blog posts, discounts and updates. Oh my!

Note: If you are not a Business Catalyst partner who wants to build better websites faster, you should reconsider subscribing. Because that's all I do and write about. Otherwise, this is going to rock!

Blog posts, discounts and updates. Oh my!

Note: If you are not a Business Catalyst partner who wants to build better websites faster, you should reconsider subscribing. Because that's all I do and write about. Otherwise, this is going to rock!