bg-img3.jpg

Best Website Design: The Services Page (Part 4)

Subscribe to Flight Media Blog Notifications

Best Website Design: The Services Page (Part 4)

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 for motivational speakers and authors.

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.

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.

  1. PAN Communications

services_page 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.

services_page

  • The hovering effects are not too overwhelming. The simple transitions provide the user with more information in a subtle and non-distracting way.

services_page

services_page

  1. Fresh Consulting

services_page Fresh Consulting Services Page

Why We Love This Services Page

  • The hovering style for the iconography is playful, drawing attention to key points on the page.

services_page

  • The contact form outlines their main services, providing the user easy access to get in touch with them.

services_page

  • The language is personal, enthusiastic and inspirational.

services_page

  1. Villiers

services_page Villiers Services Page

Why We Love This Services Page

  • Hovering styles are implemented to elements that are linked to other pages, like titles and buttons. This is a conventional way to enhance usability and navigation for the user.

services_page

  • There’s more beyond the fold! A simple line with a description tells the user to keep scrolling for more information.

services_page

  • 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.

services_page

  1. Majestyk

 

services_page Majestyk Services Page

Why We Love This Services Page

  • A scrolling feature uses numbers to help the user easily navigate the page.

services_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!

services_page

  • The imagery directly relates to the content, providing the user with a clear message.

services_page

  1. Bitnoise

 

services_page Bitnoise Services Page

Why We Love This 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.

services_page

  • It demonstrates credibility by presenting facts about the company.

services_page

  • Contrasting color and geometric elements makes the page visually appealing while staying in line with the brand.

    services_page
  1. Credico

services_page Credico Services Page

Why We Love This Services Page

  • It uses helpful cues to guide the reader on the page, like contrasting arrows.

services_page

  • Simplicity is key and helps to easily get the point across, using a white background, serif type, only two lines, and a large point size.

services_page

  • The icons have labels, which is good user experience practice. With labels, the user doesn’t have to guess at what the icon is trying to say. The two should work hand-in-hand. Every icon on your Services page (and other web pages) should have labels to minimize confusion for the user.

services_page

  1. Stortford Interiors

services_page Stortford Interiors Services Page

Why We Love This Services Page

  • It shows the user how to navigate the page using visual cues, like circular brand elements.

services_page

  • The images speak to the content, showcasing services in real-life settings.

services_page

  • The content is simplified by using bullet points (that link to corresponding pages), which makes the words easier to follow.

services_page

  1. Clique Studios

services_page Clique Studios Services Page

Why We Love This 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.

services_page

  • 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.

services_page

  • It embraces white space. This way, the brand can showcase critical content in a way that’s easier to understand.

services_page

  1. Strategic Media 21

services_page Strategic Media 21 Services Page

Why We Love This Services Page

  • It uses a powerful first statement that is all about potential clients. services_page 
  • The page uses rich, strong photography to provide the user with compelling visuals that enhance their user experience.

Screen Shot 2016-09-09 at 10.06.17 AM

  • If the user needs more information about the brand, contacting them takes one simple step.

services_page

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.

Clearly leading the user through specific actions, effectively showcasing your brand and services and identifying steps to promote the user’s experience are just a few of the ways that your Services page can over-deliver.

Which service page stuck out the most to you?

Ultimate Guide To Inbound Marketing

Blog Comments

Josh Coffy

Josh is an entrepreneur at heart, dropping out of college to pursue his dream of owning his own business. Fast-forward five years later, and Josh’s unique ability to marry technology with creative marketing strategies has led to Flight Media’s steady and swift growth. Now one of the leading Inbound Marketing companies in Ohio, the U.S. and abroad, clients trust Flight Media’s expertise, agile approach, and transparency. You can find Josh at CrossFit, backpacking the West coast with his wife, Kelsey, or reading a personal development book from his ever-growing library.