11 Beautiful Service pages

,

About – Lovechild

This could have been called “what to do with your product or services page”, but basically I want to show you awesome ways in which you can layout and design the page which tells your viewer what they  get from you. The goal of the services page is to inform your viewer what it is that you can do for them whether or not you include prices on your website. Ultimately, the goal of the whole website is to get the viewer’s money, so it’s important to do a lot of planning and background thinking about how the most effective way to set up your services page is. Some things to think about when designing your services page;

  • The psychographics of your demographic (your customer’s thought process). What their shopping style is , why are they purchasing your product, etc.
  • How the viewer got to your services page — not all traffic is qualified traffic. A person on your site is only as good as the money you get from them. The person on your services page should already be qualified as someone who needs your service and is ready to hire you.
  • Make it as easy as possible for your viewer to hire you. If all someone had to do was click ” buy” and it was done; you’d get a helluva lot more sales. I see lots of very lengthy sales pages and they just don’t work. No one wants to read 500 paragraphs about your story and 300 testimonials.
  • Keep your copy short and sweet. You can always change it later.

Services Page Inspiration:

Dean Street Society

Alright, I just can’t. I can’t wrap my peabrain around Dean Street Society’s amazing website. I really just… Who MADE this gem?! It’s so fun. All I want in my life is to build websites that make people feel how I feel when I look at this website. Breaking it on down: Hillary has broken her services down into uber-cool packages on a main page, and then more in depth on the sub-pages. See parts one and two. I’m totally going to buy every service of her’s one day. Part 1) The services page:

shopp1

Part 2) The in-depth info page styled SO FRIGGEN BEAUTIFULLY

 4PEC — Dean Street Society

Saffron Avenue

Probably my most most most favorite website. I don’t know how she does it, but I’m going to figure it out because it’s so damn PERFECTTTT. So — breaking this down, she has the page title, and her services boxed in two columns. Then she designs it with sexy little asymetrical triangles ( acute triangles, if you will ) and thin gray borders. Also – her look is so refined, yet she ‘colors outside the lines’ with the triangles which spill ever-so-slightly outside the borders. sigh. She’s so cool. Also– she uses *beautiful* images . Her website is the perfect example of why you should either purchase beautiful stock photos, get them done professionally ( yes, even closeups of styled desks) or invest in a good camera. Sink into her mint-colored glory below.

design services   Saffron  copy


Lovechild by Aileen Chang

This website is so sweet and flawless. It feels like a child is hugging you. The format/layout could be changed to fit your brand, but she basically has three circular photographs aligned horizontally with a subtitle designed below , and a three column body of text. It’s a really pretty way to display one chunk of text that might otherwise be boring!

About – Lovechild

Lauren Ledbetter

Lauren has a main information page with who she is and what she does. Her services are in a list to the left side of the page. Super chic and minimalistic. Her logo is my everything. I want to start doing brushed lettering like that for all ya’ll.

About — Lauren Ledbetter D copy

Colleen Miller Events 

This website is one of my most fave’s (If I do say so myself — I made it) Super simple full-width layout with the titles centered, lowercase, and italic. There are two images at the bottom and one aligned left next to the intro. She also has centered glitter cursive as each page title (home, about us , services, etc) to make this super organized , cohesive and fun. Also, feast your eyes on the glitter confetti in the footer. Colleen Miller Events » Se copy

Kymera Studio

so POLISHED. Their whole website is structured similarly – each page cascades downward guiding the viewer down the page so that each section kinda takes up the viewport. It’s a really stunning way to present your information if you’re not afraid of *shudder* the fold. DUN DUN DUNNNNNNNNNNN So from the top they have

  • an intro
  • their three main services
  • their offerings in list form , all neatly packaged inside a slider (you click the numbers and it shows another option)
  • and then how to work with them ( which you better not, because you should hire me instead) just kidding, kymera.

Kymera Services Page

One Part Gypsy

I pinned this and it’s been re-pinned a thousand times. It’s a very pretty website. I love her (or his) services page because it’s very tidy and succinct. The services page is like Dean Street, but it’s styled in list form rather than with images. There is a main services page, and sub-pages ( we call them “child pages” in the industry) There’s also a centered quote with a subtle teal/turquoise gradient effect which matches the gradient of the gold in the logo (and coral in the logo icon). Lovely. OVERVIEW   one part gypsy

Firefly Events

Okay, a client sent me this website as inspiration, and I really love it. There’s something about perfectly aligned elements in design that just really get my goat. Firefly events logo -first of all- is pretty amazing. The contrast of the messy lettering with the structured website just do it for me. The services page is all centered with lots of white space and that’s it. “Hire us, we’re awesome, peace out” Services — Firefly Events

Super Simple @ Jane Reaction

List form, simple, actually — not even in a services page – in the about page , to further consolidate and simplify the website. When in doubt- simplify. Erin Jane   SERVICES

Grid Style Like on shilohstyle.com

I created the website below for Shiloh McKassen and I love her services page. On click, each of the services pops open as a slider with images and text. So pretty! shilohservicesp1   Here’s where it gets super awesome. When you click one of the three main services at the top, a window slides up and tells you more about that service. Oh la la! see below:   shilohstyleservices

Heather K Jones’ Service Page inspiration:

Editorial style, a picture of her ( plus she’s stunningly gorge so how could you not want to hire her) and a list of her main services to the left of the page. Super Work With Me   Heather K. Jones

0 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *