11 Beautiful Service pages
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:
Part 2) The in-depth info page styled SO FRIGGEN BEAUTIFULLY
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.
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!
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.
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.
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.
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.
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”
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.
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! 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:
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
Leave a Reply
Want to join the discussion?Feel free to contribute!