Every time the ball starts rolling with a new web design client, we run through the same preliminary set of procedures. The first step is the keyword and industry research which is used to develop your website’s sitemap.
What is a sitemap?
It is a visual outline of how your website’s pages are interconnected, starting at the top with your root domain (often referred to as your homepage). We work with you to figure out all sorts of things to include in this document, including how you want your users to interact with your homepage, which pages you want to be in your navigation bar and how you’ll encourage customers to learn more about your products and services.
While this document doesn’t usually match the end product of the design process, it’s our way of getting the ball rolling and providing a working outline for the web design team.
Doing the Research
Research is the cornerstone of building a newly designed website. By figuring out what your customers are looking for online and how they want to access information about your business, you can craft an experience suited to their needs. Start by checking in on both your strongest competitors and your industry heroes.
Are your competitors using a unique way to get customers to contact them, like a form on their homepage or a big, brightly colored button next to an informative video? Maybe the businesses you look up to the most in your industry have their blog posts listed right on their front page. Once you’ve identified some of these key elements, you can pick and choose which ones you think will work best for your business.
It’s ok to copy good ideas! If they work for competitors in your industry, they’ll likely work for your business. It’s our job to make these ideas look and feel unique, original and in line with your website goals as we work on site development.
Wireframing Your Site
Wireframing is a crucial part of the planning process because it helps make your sitemap and interlinking ideas tangible. A good skeletal framework locks in most of your web architecture ideas and forms the building blocks for your web designers.
The web design team can trust they won’t have to worry about content or how pieces of your website are linked. They can instead get to doing what they do best and bring the wireframe to life. This is also the trickiest part of the process for most small business owners. You have to be comfortable with the wireframe you develop or agree to before handing it off to a designer. Nothing will hamstring the project more than constantly making revisions and broad changes to this framework.
Think you’re ready to dive in and graph out a sitemap? Mashable compiled this great comprehensive list of free wireframing tools for designers if you want to try your hand at outlining your dream website. From this list, I’ve personally only ever used Mockingbird. It’s intuitive and user friendly, making it a breeze to knock out wireframes for webpages quickly.
To keep things simple, I often use a program as simple as Microsoft Word to create a sitemap for our web designers to use. A good sitemap wireframe is just a skeletal and geometric example of how your homepage should eventually look.
Hopefully this plan and the tools I’ve mentioned help give you a better idea of our planning process. If you’ve got the time, you might even start the process on your own. Let me know how these tools work for you, and never hesitate to shoot me an email if you get stuck! We’d love to help you get your website out of idea-land and into reality.
So you’re ready for a new website with a shiny new mock-up and sitemap. Do you know how your current website holds up against your competitors, though? Use our website self-audit to measure you current effectiveness:
