Best Website Design: The Services Page (Part 4) What is the best website design for services pages? The best website design for services pages includes a: Simple, straightforward layout Easy access to service, easy access to main services Enhanced usability and navigation Clear messaging Editor's note: This post was originally published on 10/5/16 and has been updated for accuracy and comprehension. This is the third blog in a series of articles covering web design. Catch the series here: Top 10 Best Designed Websites in 2016 (Part 1) Best Designed Websites: The Home Page (Part 2) Best Designed Websites: The About Page (Part 3) Best Designed Websites: The Services Page (Part 4) Best Designed Websites: The Blog Page (Part 5) Best Designed Websites: The Navigation/Menu (Part 6) Wondering what's the best way to "sell" your services on your website's Services page? If you want to effectively highlight what you do and how you do it, the Services page should clearly break down your primary services in a way that users can easily understand – and perhaps most importantly, direct prospects to get in touch or find out more information about them.
This is a conventional way to enhance usability and navigation for the user. There's more beyond the fold! A simple line with a description tells the user to keep scrolling for more information. It demonstrates top design practices like visual hierarchy (using text weights and different fonts) and contrast (color and type point sizes). Every font has text weight options, either light, regular or bold. If a phrase is bold, it's going to be more prominent within a composition, as opposed to a regular or light weighted phrase. This helps to determine the more-important information from less-important content. Majestyk Majestyk Services Page A scrolling feature uses numbers to help the user easily navigate the page. They practice what they preach. The brand says they are personally invested in their working relationships, and with the impressive lineup of partners, it's gotta be true! The imagery directly relates to the content, providing the user with a clear message. Bitnoise Bitnoise Services Page With the help of icons, color, and white space, the content is easy to follow – a key step in following great website design practices.
Clique Studios Clique Studios Services Page The Services page employs a super-simple topper image text so that no extra words needed. As a result, it gets the point across quickly and concisely. Every section has a CTA guiding the user deeper into the site, without overwhelming them all at once by placing all relevant content in one place. It embraces white space. This way, the brand can showcase critical content in a way that's easier to understand. Strategic Media 21 Strategic Media 21 Services Page It uses a powerful first statement that is all about potential clients. The page uses rich, strong photography to provide the user with compelling visuals that enhance their user experience. If the user needs more information about the brand, contacting them takes one simple step. Final Thoughts Don't waste the opportunity to create a powerful "Services" page. Whether you're building a website from scratch or freshening up your Services page only, good website design practices will go far.
In the fourth article in our "Best Designed Website" series, we'll explore best practices for your Services page by offering a few examples of it being done right. PAN Communications PAN Communications Services Page Why We Love This Services Page They break it down! The page clearly defines PAN's top four primary services, using a simple layout and contrasting colors that are in line with the brand. The hovering effects are not too overwhelming. The simple transitions provide the user with more information in a subtle and non-distracting way. The content gets right to the point! The user gets a precise message in just a couple of sentences – there's no need for a long paragraph. Fresh Consulting Fresh Consulting Services Page The hovering style for the iconography is playful, drawing attention to key points on the page. The contact form outlines their main services, providing the user easy access to get in touch with them. The language is personal, enthusiastic and inspirational. Villiers Villiers Services Page Hovering styles are implemented to elements that are linked to other pages, like titles and buttons.