How Building a Site’s Like Building a House

Penned on the 26th of May in the year 2017. It was a Friday.

Building a house takes planning, and so does building a website. Changes are more efficient earlier in the planning process and get progressively more costly. And like converting a bathroom into a kitchen, "remodeling" a website too late in the process sometimes gets weird.

To support myself while earning my undergraduate degree, I did a lot of construction work. I did some framing and siding, and a whole lot of interior paint and staining. As I’ve grown into my career in web design over the years that followed, I’ve realized a lot of the principles that went into building a house also applied to building a website.

Most prospective homeowners understand that if they have their contractor install linoleum, it’s going to cost extra to replace that to tile. But maybe because of the intangible nature of website design and development, the costs of changing things—even very late in the process—seem less well understood. Allow me to draw the comparison.

Making A Plan

Laptop and sketch book with a website wire frame designA house starts with a blueprint defining what walls go where, how many windows there are, and which directions the doors swing. Likewise, all the preliminary website strategy steps like establishing the site’s goals, creating a site map, and sketching out wire frames create a sort of blueprint codifying what the site needs to accomplish and how it will do so. Some of these steps, like moving from wire frames to high-fidelity designs, are progressive, sort of like moving from a rough house blueprint sketched on a napkin to painstakingly measuring it out in detail on graphing paper.

Post-Strategy Changes Are Costly

A houseIf you decide your garage should move from the west side of the house to the east, that’s easy while sketching on napkins: just scribble out the old rectangle and add another one in the new location. It’s a little more time consuming after you’ve carefully measured everything onto graphing paper, but not exorbitantly so. But after you’ve built the house, there’s a lot more involved.

Regressing on strategy effects build time in three ways: first, you already spent time to build the garage initially, but in the wrong place; second, you need to tear down the old garage, while ensuring it doesn’t look like there used to be a garage on the west to begin with; third, you now need to rebuild the garage in the new location. You can reuse some materials, but not everything. You can’t, for instance, pick up and move the foundation to the new location—you need to pour a new one. But you can’t just leave the old foundation there—you need to dig it up or cover it over or do something to get rid of the cement in the middle of your new west lawn.

This is really similar when building a website. It’s very easy when creating the site map to decide you don’t want four links but seven in the primary navigation and want to tweak a couple page names. A website strategist can simply drag a few new squares onto the site map and change some titles. If you progress further and make this change in design, it’s a little harder: maybe because there were four navigation items a large font size looked amazing, but now that there are seven it’s way too crowded. After switching to a smaller font size to fix that issue, maybe now the masthead underneath is still using the original font, and it looks odd since it’s now the only thing on the page that’s at the old font size.

Aquamarine's 404 pageIt gets even worse in development. The minute adjustments that made the navigation function perfectly from wide desktop screen sizes down to small mobile phones now make the text overlap, and the whole navigation system needs to change. Worse yet, with page names now different, any links directed at the old pages are now broken, and any text or graphics within the content of any page that referenced the old page names now makes no sense. And don’t forget that the masthead text now looks odd since it’s the only place using the old font size.

Content Is Like Furniture

A cast-iron stove.Can we push this analogy further? Why not…

Hopefully, the new homeowners told the contractor before beginning work on their house that they have a huge couch, they want room for their oddly-shaped cast iron stove, and they really like hardwood floors. He’s designed the rooms in the house to accommodate these requests much like a website strategist would have crafted pages that match the content a website needs to contain.

But now the homeowners have lived in the house for a little while, and they’d like to move a few things around. Turning their spare bedroom into an office is certainly doable, provided they have enough outlets in the right places and a high speed Internet hookup. But turning the bathroom into a second kitchen is going to be more difficult. Maybe that cast iron stove is great, but having two would be even better. This is certainly doable, but it’s not going to be quick. The bathroom’s plumbing is over engineered and it’s electrical setup is insufficient for the new demands.

It’s often difficult to see what content would be difficult to change on a website, but the principle is the same. Just like a plumber would know what walls need to be gutted to convert the toilet’s water source into a feed for the new kitchen sink (which on second thought sounds really unsanitary…), a web developer can determine what content is easy to edit and which is not.

Changing something from two columns to one column on a home page? That’s probably going to be pretty quick. Adding a blog feed into the footer? Still somewhat quick but there’s a bit more going on there. Adding a cartoon mascot a dozen places throughout the site so he’s pointing at the buttons users should click and coaxing them into signing up for the newsletter (yep, I’ve seen this request made)? All things are doable, but after the website’s already built, this is going to take some time.

Inefficiency is Expensive

All tweaks take time, but the longer into the project they need to happen, the more it’s going to cost. Take time to fully review and think through the website at each stage in the process. Also, make sure all stakeholders review things and sign off during the early stages of the project to get their changes incorporated when it won’t add to the project’s cost. Avoid the need to push deadlines because of hastily made decisions in the early stages that need to be revisited; trying to save time by rushing things may in fact have the opposite effect. It’s more cost effective to take time up front with your website strategist to collaboratively think things through, so they can build you a website that accounts for your unique needs from the start.

in category strategy