How to Design a Website from Scratch

by | Feb 8, 2017

How to Design a Website from Scratch

 

This week I wanted to share some ideas about how to design a website from scratch. Most DIYers are all starting from the same place. Having minimal knowledge about graphic or web design. This is why so many people feel in a total state of overwhelm about where to begin. The mistakes that a lot of DIYers make is to skip the planning and design phase altogether and jump right into WordPress and start “making their site.” While taking action is a great thing to do, I can’t stress how important it is to slow down and take time to design your site. Now, I know what you’re thinking: “Clare, I have no idea where to start.”

A simple web design secret

Today I wanted to share with you a simple web design secret with you. You might be surprised how simple this stage of my design process is and how you, a DIYer, can adopt the same strategy for designing your own website. Grab a piece of paper and a pencil and draw it out. Why do I suggest this? Because designing, creating and building a website all use different elements of the brain. Which means by doing these tasks separately you are more likely to succeed.

Step One – What pages do you want?

Firstly work out what pages you want on your website. For example, these page titles are very common for on-line entrepreneurs. Home, About Me, Work With Me, and Contact.

Then ask yourself

  • Do I want to have a blog?
  • If you are selling physical products – Do I want to display my products on a “shop” page or via a third party platform like Amazon or Esty? BTW Etsy is also a great place to sell digital downloadable products as well.
  • If you are selling a service – Do I want an individual sales page for each service? or do I want them all listed on my work with me page?
  • What legal pages do I need on my site – Terms and conditions, disclaimers, privacy policy? You may also want to consider if you want a separate Frequently Asked Question Page.

You may ask yourself, why do I suggest this as the first step. Simples. It gets all these ideas out of your head, so there is brain space for the next step.

The Real Step One – Why do you want a website? What it’s goal?

Now the real first step is to understand why you want to have a website. List all the reasons down. No-one will see them, so be honest with yourself. Include reasons like – Everyone else has a website, I feel I should have one, I don’t know any other ways for potential clients to contact me.  As you reflect over the list, note which ones are driven by your ego.

Obviously, as a website designer, I would love everyone to have a website. However being realistic I know some people jump in a little too quick. Know that you need a flexible mindset. Know that websites do and will change over time. Most on-line entrepreneurs redesign/rebrand their websites every 6 – 18 months. Know that nothing is set in stone.

Next, get clear on what the goal of the website is. Is it to Help people? Build a community? Transform lives? Again you may want to spend some time journaling this out. Write down a list of ideas will help bring clarity to what your goal this.

Then look at the list you wrote in step one. What the goal is for each page? How that interlinks with your overall aim for your site.

Step Two – Think build blocks

In essence, most websites are built like building blocks. Think of the different sections, elements, copy/text and graphics as building blocks. One of these may be the social media follow building block. Another could be, images for products and services. Headers. Text blocks. Headshot images block. Menu block. Contact form block. Again list them out – I would suggest doing this on sticky/post-it notes. You can then start to arrange an outline for each page.

Step Three – Design your layout

Now the real first step is to understand why you want to have a website. List all the reasons down. No-one will see them, so be honest with yourself. Include reasons like – Everyone else has a website, I feel I should have one, I don’t know any other ways for potential clients to contact me.  As you reflect over the list, note which ones are driven by your ego.

Obviously, as a website designer, I would love everyone to have a website. However being realistic I know some people jump in a little too quick. Know that you need a flexible mindset. Know that websites do and will change over time. Most on-line entrepreneurs redesign/rebrand their websites every 6 – 18 months. Know that nothing is set in stone.

Next, get clear on what the goal of the website is. Is it to Help people? Build a community? Transform lives? Again you may want to spend some time journaling this out. Write down a list of ideas will help bring clarity to what your goal this.

Then look at the list you wrote in step one. What the goal is for each page? How that interlinks with your overall aim for your site.

Step Four – Start collecting element of your brand

Next get some big A4/A3 pieces of paper and write at the top of each, the web page title ie. home page, about me page. Then you can transfer these blocks onto those pieces of paper. At this point, it can be a good idea to look at other people’s sites. Work out how the website flows. Look out for these different blocks, seeing which appeal and which don’t. Analyse how easy or different it is to buy a product or to get the information you need. Review how easy it is to understand what they are offering and how they are talking to their ideal client – words, pictures or a combination of both. Take all this investigation work and review how you would like each page to look and feel. This will help you create a list of elements to be created.

The Benefits

When trying to figure out how to design a website from scratch, the benefits of using my simple, but effective, strategy are clear:

  • You enter the development phase with a clear roadmap for how you want your website to look;
  • You think through every element of your site and how it relates to your site goals;
  • You come up with a practical list of tech and visual to-dos that you’ll need to address before your site can launch;
  • It allows you, a DIYer to adopt good design practices even if you don’t end up putting your design “pro program” before beginning to develop the site.

So, tell me the truth…did you create a design for your site before you started OR jump right in to the development? What would you do differently if you could start fresh right now?

Clare Fielder

Clare owns a digital and web design studio at ThePistachioClub.com. She loves making the internet more pretty (and functional) one website at a once. However, she has some other hidden talents and has been in a Hollywood movie and was a dance performer in the 2012 Olympics. She loves to explore the local coastline in Dorset, and at weekends you’ll often find her hiking.

I’d love to hear your thoughts? Comment below.

0 Comments

Contact

Office Hours: Monday-Friday 9am-5pm GMT

Email: clare {at} thepistachioclub.com

Skype ID:  Clare_Fielder