Web Basics: Design - Classic City Consulting

Part 2 in the Series, Web Basics: How to Crush Your Next Website Project

Introduction

This post is part two of a six-week series called Web Basics: How to Crush Your Next Website Project. These posts are targeted at business owners, marketing or web directors, or just the person in the office who was asked to handle getting the company a new website. The info and tips in these blog posts will help you be prepared to be an ideal client for the agency you work with, but what’s more, you will be empowered to know how to make sure you walk away with a website you can be proud of, and that will actually help achieve your company’s goals. This series will cover specifically what it’s like to run a website project with us at Classic City Consulting, but everyone on our team has worked with other agencies as well, and the processes, expectations, and client responsibilities are similar to almost anyone you might work with.

In the previous post, we discussed the first phase of a website project, which we at Classic City call “Discovery.” In this post, we will discuss the Design Phase. In my opinion, the Design phase is the part of the website project that clients are most interested in, but it’s also the part that comes with the most preconceived ideas…many of which can become a stumbling block to the progress of the project. In this post, we’ll discuss what the Design phase is for, as well as what it isn’t for, and how you can navigate the process to get the absolute best product for you and your company.

What Design is

In one sense, people commonly think of the entire process of building a website as Web Design. In technical terms, however – at least here at Classic City Consulting – when we say “web design,” we’re referring to creating the visual design elements that will be used on a website, and the customized layout of those elements for each section, page or page type.

Components

After Elements, we have layout Sections or Components. For Classic City, these are typically reusable sections that can be placed in different places on a page, depending on the needs of that page. I suppose that certain website designs might not have any reusable sections, but for most websites, you’ll have a certain set of sections, which can be reused by changing the images and text.

For Classic City, we use the name “Section” and “Component” pretty interchangeably. You can call it either, and we’ll know what you’re referring to. What components are needed for a project is prescribed by the wireframes.

Here are some of the basic components we would expect to use on a website project:

Header w/Navigation
Hero (large)
Hero (small)
Call-to-Action strip
Icon bar
Multi-column layout
Navigation
Footer

Page Types and Page Elements

Beyond the Elements and Components that are used in the design, we also have Page Types and Page Templates. A Page Type is not a technical term, but rather just a way of talking about how a particular page might be set up. So, if a website has one page as the homepage, one page to tell about the company, one page for each of its services, and one page dedicated to contact information, we would say it has four-page types – even if, in the end, the website has many more pages added. If there are 5 services offered by the company, we would likely use a similar page layout for each of the single service pages. So, not only would they each be the same page type, but they would likely also use the same Page Template.

Page Type would basically describe the page’s purpose. All of the Single Service Pages, for example, would serve the same purpose: to give information about a single service offered by the company. Page Template is more of a technical term, and it refers to the page’s specific layout. Consider a blog: each blog post on a website may have all of the exact same sections as each other, even if the main content is different: The title of the post, the author, a sidebar with navigation to related posts, the main content, and links at the bottom of the page to go to the next or previous posts. Every single blog post would display the exact same way, with the same exact layout (and the only variable is the actual words on the page). This would mean that they share a Page Template*.

*As a reminder, while these terms will definitely make sense and be similar from web agency to web agency, the terms I’m using here may not be entirely universal, and this post describes the terms we use here at Classic City.

What Design Isn’t

If your idea of a web project is very fluid, you may think of the whole website process as Web Design. We find it helpful to think of the Design part of the process as separate from planning tasks, writing code/development, and reviewing and launching the site. So, for our purposes, Design is not:

SIte planning/Discovery – The design process is not the time to gather requirements or discuss the basic needs of the site. This should have already been done and was agreed upon during the Discovery phase.
Site Architecture/Layout – What pages are needed and what types of information should go on each page should have already been decided in the Wireframing part of the Discovery process. In fact, with the wireframes approved, it’s technically against the flow of the process and maybe even against your contract to change the layout of the pages during this phase.*
Content Writing – For the most part, the Design Phase should be for setting out the look and feel of each element and section of the site. And in most cases, placeholder text will be used, so there’s no need to get hung up on the words that are used in the designs. They will be replaced later, during the Content Phase.
A Full Working Website – The designs are not working website. If the design includes an animation, then the designer will likely explain or possibly provide a few key frames of the animation, but the full animation will not be viewable until it is developed onto a working website. The same is true for carousels, maps, etc. While the design may be clickable, using prototyping software, it is not a working website. This all comes later, in the Development Phase.

The One Thing Your Agency Wants You to Know About Design

If I could leave you with just one thing, that you would remember, it would be this:

Don’t move on ‘til you love it. You can trust in the fact that the core “what it does” about your website was already planned, decided, and approved in the discovery phase, so take this part of the process to make sure you feel excited by the look and feel of the site. It’s worth it.

When we ask for feedback, tell us what you think. Use descriptive language to say exactly what you like, don’t like, and aren’t so sure about. Together, we’ll work together to end up with something amazing.