The internet is full of business websites, all with their unique strengths and weaknesses. Some have pages that promise new content but haven’t been updated in *cough* years, some are VERY slow to load, and most sadly aren’t optimized for mobile devices.
If your website is one of these – or if you’ve identified other issues that require a total site overhaul, it’s time to learn how to make a B2B website from start to finish. If this’ll be your first website because you’re a startup or just emerged from the Stone Age, welcome aboard too!
Hopefully, you’ve already established your website creation strategy and are armed and ready with:
Once you get the background and basics out of the way, you start building your big idea, brick by brick.
Use these nine points as milestones in the website project process:
Some projects are facelifts; others are total overhauls. Is your website design or redesign project simply a transfer from platform to platform? Or is it a complete redesign? Does it land somewhere in between the two?
All stakeholders must agree on what you hope to accomplish with the build. How will it tie into your big-picture business goals? The new website should help you get closer to meeting those goals.
Once everyone’s in alignment, set a budget and timeline for the web build so its costs don’t become a runaway train. To do that, put the exact scope of the project in writing. Scoping factors include:
(Note: All sites require some maintenance on a regular basis post-launch, even if you don’t add new content.)
Divvying up web project responsibilities is deceptively tricky, especially if you wait too long to set them in stone. Actually, you might want to upgrade to steel for this one.
Consider these important roles and potential bottlenecks:
Some areas of making a website are complex and must be done carefully – even the copywriting. Choose your people wisely, whether in-house or outsourced. Hold them accountable.
Whether this is v1, v2, or v152 of your website, lay out a sitemap from scratch.
A sitemap is the “blueprint” that lists all pages on your site, and how they connect to one another. If it manifested itself in physical form right before your very eyes, it’d look like a flow chart or family tree.
A more tangible comparison is the main navigation bar you see atop most websites. However, your sitemap should go deeper than that menu and include all pages you want for launch.
Now, how do you decide what pages to prioritize including?
Naturally, a finished map will help inform your website’s main navigation bar, as well as any secondary menus.
The best B2B website designs are simple, yet direct. Create menus that give users a logical direction to find the information they seek.
The main navigation should have obvious (or at least intriguing) labels identifying the top, core pages. From there, the dropdown columns should include a list of your main industries, product categories, services, or whatever’s relevant to that “vertical slice” of the site.
|
How to Create a B2B Website That’s ScalableYou might offer a satisfactory website user experience (UX) today, but what works now might not in 3 years. Time will pass, and web users’ expectations will evolve. As you choose a website host, theme, and templates, keep scalability in mind. Your CMS (content management system) should provide the opportunity to scale your site alongside your business as it grows. Think of features that might not be doable now (i.e. payment processing), but you might want to add later – if your platform can handle it. |
Choosing a platform has a big influence on the design process. If you choose to work with HubSpot CMS, there are benefits (the novice-friendly editors) and drawbacks (the sticker costs). Likewise, if you choose WordPress, there will be benefits and downsides (like having to add several plugins to reach full functionality).
Design work also includes choosing a theme. Remember that it's best to work with off-the-shelf templates, to avoid wasting time troubleshooting or trying to come up with something you like from scratch. A master template also makes it easier to visualize the design of several different pages at once, rather than having to come up with a layout for each page separately.
When starting a B2B website from scratch, you may appreciate a collaborative design tool like Figma for laying out the bigger design elements. Having a visual representation can make getting approval easier, and from there it’s not a big jump to implement the design on the actual pages.
There’s nothing wrong with getting inspiration from external sources at this point. If visual design isn’t one of your strengths, lean on experienced web designers or take a look at other B2B website examples. If you have a graphic designer on-staff, they can put their head together with the web designer to brainstorm the most user-friendly way to showcase your products and services.
Next, drop in media assets to give the pages curb appeal. Your site should look polished and trustworthy, but don’t spend too much time on snazzy videos and collages – it’s your message that matters most. Make sure the formatting looks OK on both desktop and mobile.
|
Start at the Top? Not NecessarilyOnce you have a template in mind and the core design elements you want to see on each page, it’s time to start adding content and images. Start with an important page, but not the homepage. This provides a better segue into structuring the pages and how deep you want to get into details on each layer of the site. Your homepage is your virtual storefront, and as such it can bog down the whole project if you fret over perfecting it at the get-go. Working on pages with a specific focus, like “Services/Capabilities” pages, can get momentum rolling more quickly. After that, you’ll already have most of the info and style cues you need for the homepage. |
UX and organization applies to individual pages and their text as well. There are pieces you must put in place before you build and publish a website.
Remember that small detail about needing “SEO-ready content” for your B2B website strategy? It’s actually a big detail, from your product descriptions down to the “tags” Google’s search crawlers use to understand each page’s hierarchy and flow.
To increase your odds of reaching buyers, identify a primary keyword for each page you build. This should be the term you want that page to rank #1 for in Google Search. Every page should have a different primary keyword, except in rare cases.
As for SEO tags, each page needs:
|
Location |
Tag Type |
Function |
|
Off-page |
Page/SEO title |
Hyperlinked title that appears in search results; should attract attention and include keyword to some extent |
|
Off-page |
Meta description |
Promotional blurb below page title; should clearly state what the page contains & the value it'll provide the user |
|
On-page |
H1 |
The page’s headline; should include main keyword |
|
On-page |
H2 |
Like book chapters -- makes copy more organized and scannable. At least one should include the main keyword |
|
On-page |
Alt |
Appears in place of images when pages are loading slowly or user has vision impairment. Should plainly state what’s in the image and include main keyword |
That’s the skeleton. Now you transplant the beating heart into the page – your team’s masterful writing!
Assign written copy – not too short, not too long – to the appropriate page. B2B website copywriting is a whole other animal, but here are some basic tips:
This segment of the build typically takes the most time and collaboration. The fewer people invited to review the work, the better. (Trust us; it just gets messy and super-inefficient.)
The cherry on top – or, in this case, usually the bottom – is the call-to-action (CTA).
A CTA is a graphic, button, or text link that encourages the visitor to do something. Visit another page, schedule a demo, or contact you for a quote – these actions can be the tipping point between curious onlooker and closed customer. Without CTAs on your website pages, how will you collect new email contacts to nurture?
Build CTAs targeted to different stages of the marketing funnel. Rome wasn’t built in a day – not everyone is going to head to your Contact Us page on their first visit. However, if you successfully nudge someone to fill out a form to subscribe to your newsletter or download a whitepaper, you’ve successfully influenced their process. Now your brand is lodged in the back of their mind.
Content is created and edited, and the pages seem to be finalized and ready for viewing by your target audience. Now is the time to evaluate and make sure the SEO is up to snuff:
This final review of SEO may turn up opportunities to include keywords on a page that doesn’t have them, or to beef up a keyword that was mentioned but not fully optimized.
To win over a user, think like a user. Navigate through the website as your target buyer might – or ask some people outside the office to be your experimental guinea pigs.
If the experience goes well, move on to making sure it works well:
If the site is ready to go live, you can adjust DNS settings as necessary. This behind-the-scenes work takes time and care. Not everyone has a grasp of how this works, so bringing in an expert to handle this aspect of the website transition is nothing to be embarrassed about.
Once the settings are complete, the domain can take hours to begin showing the new site, as Google has its own timeline for the process.
Make a final sweep of all text and functional elements. Separate any problems the team finds two buckets: major issues that need a fix before launch, and non-critical issues you can address afterward.
Launch the site earlier in the week. If you launch at 2 p.m. Friday and the site breaks an hour after everyone leaves for the weekend, you’ve done a bad thing.
You’ve launched a site – congrats! While you may think you can breathe that sigh of relief, you’re not quite done yet. Any site will have a few tweaks to make after launch.
Some elements that worked correctly in draft mode might look or act wonky on the published version. Or, you might get feedback from someone that gives you a new idea for a service or resource page. Either way, there is bound to be a new list of (hopefully minor) changes to make before you can consider the site complete.
A post-launch honey-do list is a great way to gather feedback and prioritize potential improvements.
Learning how to design and make a B2B website takes time and effort. The investment will be worth it – take your time, and get it right.
Start by seeking clarity on how the website will tie into your business goals. From outlining the scope to making sure your messaging resonates with the right people, you truly need to start “from the ground up.”
Applying the above steps will ensure the Google algorithm doesn’t leave your website in the dust – while boosting the human experience as well!
If you’re still learning how to improve your B2B website, check out this additional free resource: