Before we jump into the website design section with WooCommerce, we first need to understand what the main parts of every website are and which sections we actually need to design. Think of this article as a roadmap that shows you the right order to follow when designing a website. Also, keep in mind that the website we’re going to design will have this kind of appearance.

So, what are the main sections of a website?

Every proper and standard eCommerce website should include these sections: the header, footer, homepage, reusable grids, graphic banners, shop page, blog and category pages, article pages, product pages, contact us and about us pages, and finally the user area, shopping cart page, and checkout page.

These are the main sections that we’re going to learn how to design, and we’ll move forward exactly in the order I mentioned.

Now, there are some important points. Some sections are reusable and appear across different pages, while some sections are designed specifically for a single page. For example, for the homepage, about us page, and contact us page, we create a custom design specifically for that page. But we don’t create category pages, blog posts, or product pages one by one. Instead, we create a template and apply it to all products, services, or articles.

Let me not over-explain things here. In the next article, I’ll show you how to design your website header.