There are nearly 31 million ecommerce websites up and running as of 2024—an increase of 25% from 2022. And while there’s maybe never been a better time to launch an online store, not everyone knows how to start building a website.
Sara Mote, creative director of Studio Mote—a digital design agency and Shopify partner—says the challenge of designing for ecommerce is balancing business functionality with an intriguing aesthetic.
“Design elements such as imagery and typography shouldn’t overshadow or impede the basic functionality on the website,” she says. “You can get stuck on creating a website that is an exciting experience and lose track of the core, to really communicate your products and ensure that every single customer has a clear sense of your new unique offerings and the confidence in making a purchase.”
Here’s how to stay on track and build a quality website that engages and converts customers.
Table of contents
Methods for building a website
There are three ways to build a custom website: code it from scratch, use a content management system (CMS), or use a drag-and-drop website builder. Here’s what you need to know:
Do-it-yourself website building
Building your own website requires technical expertise. You need to manage your own domain, and even a simple one-page website requires manual coding of HTML and CSS. Dynamic websites require coding knowledge of JavaScript and other programming languages, as well as how to handle files on a web server. You also have to upload and link to your own images. And if something goes wrong, support options may be limited.
CMS website building
A content management system (CMS) uses a different creation process and streamlines website creation through a template-based process. A CMS interface lets you publish and modify content, like blog posts and product listings, with minimal coding knowledge. The design process is handled by standardized website templates, and the components used for individual webpages (text, images, videos) are stored in a database on the web server.
CMS setup typically requires a separate web hosting provider. Popular platforms like WordPress and Shopify offer these capabilities plus technical support.
Using website builders
Website builders are the most user-friendly option, typically offering a drag-and-drop website creator, simple interfaces, free templates, and free images that make them accessible to non-technical users—ideal for a one-page site. They often include hosting as part of a subscription package. However, they tend to be less customizable than using a CMS.
The line between a website builder and a CMS can get blurry. For instance, Shopify combines CMS capabilities—including online store functionality—with the ease of a website builder. Website builders are ideal for smaller, simpler sites, while a CMS provides more flexibility and scalability for larger, complex websites.
“Shopify’s code editor is really well built,” says Rembrant van der Mijnsbrugge, co-founder and software engineer at Mote. “It even has autocomplete and version control built in. The drag-and-drop editor is very intuitive. You don’t really need any outside tools. You can prototype in the theme editor, then fine-tune the code if you wish. But it’s usually not necessary.”
How to build a website
- Choose a website builder or CMS
- Pick a domain name
- Pick a web design template
- Customize your template
- Build the site structure
- Add quality content
- Add extensions
- Optimize for mobile
- Optimize for search engines
- Maintain the site
No matter your web-building approach, keep these tips in mind:
1. Choose a website builder or CMS
For a simple website, start with a basic free or paid website builder provided by your web hosting company. If you need a scalable, database-driven website, opt for a CMS. In either case, compare features, extensions, plug-ins, themes, templates, usability, and tech support.
Evaluate whether you can make do with a free plan or need a paid web hosting plan. Free plans are enticing but often have limitations like slower load times. Paid plans vary, from affordable shared hosting for small businesses to robust, dedicated servers for enterprises. For most ecommerce businesses, a paid plan is necessary.
🌟Want to build a beautiful online storefront that impresses customers and makes sales? Here are 2024’s best-in-class ecommerce website builders to get you up and running in minutes.
2. Pick a domain name
You’ll register your domain name through a domain registrar, which is usually affiliated with the web hosting company. Choose a custom domain name (your website’s web address) that reflects your business or purpose. Make it short and easy to remember.
Free website builders offer free domains but typically tack on the builder’s name in the URL, making it less professional. Instead, invest in a custom domain for a clean and memorable website address.
3. Pick a web design template
Templates are professionally designed layouts that give your web content a polished start, sparing you from staring at a blank canvas. Select a web template aligned with your company’s communication style. Your CMS or website builder likely offers various templates, both free and paid. Use filters and search tools to find the best match for your needs.
“Like a conversation, design has the power to captivate the audience, convey information, and evoke emotions which will directly impact consumer decision-making,” says Sara.
When choosing a website template, consider your business goals and target audience. A good websitetemplate or theme not only reflects your brand but also includes key features, like strong product displays for your online store.
🌟Explore what the Shopify Theme Store has to offer, including the best website templates for every business.
4. Customize your template
Templates bring consistency, but Sara points out the downside to using them.
“It’s when you enter this sea of sameness, where websites feel overly optimized and devoid of character,” Sara says. “This is where brand elements such as typography, imagery, and color really come into play to make sure that you are creating a really strongly branded cohesive experience.”
Customization options are vital for any template or theme. Elements like font choices, color palette, grid layout, headers, footers, hero images, social tools, and navigation bars can all be fine-tuned to add personality and distinctiveness.
🌟Color psychology can influence the way shoppers feel about your brand. Here’s how the colors you choose can impact sales and loyalty.
5. Build the site structure
To create a website that’s user-friendly, focus on clear navigation and organization. Create a sitemap to outline your website structure and optimize your navigation menu for easy access to important elements, like:
- Menus. Use a mega or anchor menu to make navigation accessible on both desktop and mobile devices.
- Shopping sections. Add a shop or gallery to showcase products or services.
- Contact info. Include an About Us and Contact page with clear information.
- Featured sections. Establish expertise and drive traffic with a blog section. Consider adding membership areas, an FAQ section, testimonials, and social media links.
“It really comes down to prioritizing product discovery,” says Sara. “The biggest tip for improving navigation design is to prioritize product discovery through all navigation elements. That means menus, collection page filters as well as search.”
6. Add quality content
Make your site informative, functional, and visually appealing with informative blog posts, product tutorials, product descriptions, and customer testimonials. Meaningful content opens a communication channel, invites engagement, yields better organic search results, and drives customers to action.
Consider creating:
- Written content. Ensure the text is well-written, concise, and displayed in a readable font.
- Product pages. Add clean, clear product images, pricing, descriptions, and purchase options.
- Pre-built pages. A template may have various design elements pre-built for food menus, product catalogs, contact forms, and social media feeds, which you can easily drag and drop.
- FAQ page. Answering common questions helps establish authority and reduces the load on your customer support team.
- Testimonials and accolades. Celebrate your success. Share positive reviews and media coverage.
- Images and video. Upload high-resolution images and videos optimized for web loading. Many website builders give access to stock image galleries, offering solutions if you’re short on original content.
According to Sara, data analysis suggests that the faster the load time, the higher the conversion rate.
“Yes, you want crisp, beautiful immersive imagery and video,” says Sara. “At the same time, make sure that it’s optimized for load times so that it’s not detracting from the experience by taking too long.”
7. Add extensions
As you test the website, see if any add-on tools can make your site more functional, optimal, and secure. For example, the Shopify App Store contains loads of integrations for sales channels, product selling, store design, store management, product sourcing, order and shipping management, and marketing tools.
8. Optimize for mobile
With most internet use happening on smartphones, it’s vital that you design and optimize for mobile devices. Rembrant knows what can go wrong when the mobile and desktop sites don’t match up.
“We actually had a moment where people were building separate desktop and mobile sites and sometimes it actually looked entirely different,” he says. “That’s not good because it’s discombobulating for the customer. Responsive design and cross-channel harmonization is a really great way to keep cognitive ease in mind.”
Leverage additional features in the website builder for mobile editing and responsive design to ensure your site looks great and loads quickly across devices of all sizes and orientations. These tools use flexible layouts, fluid images, and CSS to adapt site content and presentation to different screen dimensions.
9. Optimize for search engines
Search engine optimization (SEO) refines a website to increase page rank in search engine results pages (SERPs). Implement SEO best practices to increase site visibility:
- Add relevant keywords. But don’t cram them in. Overdoing it can actually harm your search engine ranking, but ensure they are placed in appropriate places like headings and product descriptions.
- Edit general settings. This includes page titles, headings, meta description tags, alt-text for images, and slugs (human-readable names appearing after the domain name in a web address). The more descriptive and accurate these are, the easier it is for search engines like Google to crawl and interpret website content.
- Use alt tags for images. Describe all of your images in the alt tags so search engines know what they’re looking at and can serve this content to searchers.
- Compress images. Ensure all of your images load quickly so your overall site speed is fast.
🌟Need to optimize your images? Use this cheat sheet to find the best image sizes for your website on mobile and desktop.
10. Maintain the site
After you publish and launch, regularly update and maintain your site. Make sure your content functions and looks proper on all device types—especially smartphones. Here’s a quick checklist for maintaining your site:
- Review your content. Whenever you publish a piece of content, set a reminder to review it six months to a year later to make sure the information is still relevant and up to date.
- Re-optimize for search engines. Every month, use SEO tools to identify opportunities to improve your content and technical SEO for search engines.
- Perform regular backups. Whenever you update your site, perform a backup to protect the site from threats and guarantee data recovery.
Build a website FAQ
Can I build a website for free?
Yes. Many website builder platforms have a free subscription tier, but you may have to use a subdomain that includes the provider’s name, which can seem unprofessional. A free website builder’s features are often limited and run slower than paid tiers.
What is the best website builder for beginners?
For an ecommerce store, your best option is a platform with a simple setup and a vast app ecosystem for extensions and customization. Look for a drag-and-drop interface and a variety of templates. Popular platforms are Wix, Squarespace, and Shopify.
What is the best platform to build a website on?
The ideal platform depends on your specific needs and preferences. For ecommerce websites, Shopify combines the drag-and-drop simplicity of a website builder with the functionality and customizability of a CMS.
