Need some help building a long form sales page? I got you.
I wanted to get designy today, and share some tips & inspo for a LONG FORM SALES PAGE. No shit, sales pages are probably my number one fave thing to build because often there's a LOT of information that needs to be broken up and designed in way that makes people actually want to not only read the content — but most importantly, BUY into whatever you're (or your clients are) selling.
There's a real flow & an art to them, for sure. Especially these days — the content needs to be balanced, and as short as possible to give people all of the information they need. We can't be out here reading fucking NOVELS anymore, like we used to, ya know. 😉
So I got some shit here for you if you need some help in this arena! First, some sales page design tips, and then some actual design & layout/structure inspo too.
Lets start with 3 KEY Sales Page Design Tips
1 — Chop up the content into digestable chunks.
As I kinda mentioned, inherently long form sales pages have a shit load of text that really needs to be there — and it's your job as the designer (or the DIY-er) to break up that content as much as possible to make it EASILY DIGESTABLE for people.
Pull out headings & statement one-liners as big text.
Use a text highlight or background feature, as well as bold text for breaking up paragraphs.
There should never be any huge chunks of straight paragraph text styling with zero formatting. Do your best to stick to 100 words or less when you do need paragraphs of straight text.
Don't be afraid to cut text (even if that means going back to your client to ask them/give your opinion). As I mentioned, sales pages need to be as short as possible while giving people all of the info they need to make an informed decision. Keep cutting shit out until its as to-the-point as possible, while also keeping it real giving it some human-ness!
2 — If you don't have a professional photoshoot to pull from, curate a SMALL selection of stock photos
Curation of creative resources is really a MAJOR asset & skill to have, and the more you can do it, the better you'll get at it. If you or your client doesn't have a profesh shoot to pull from, you'll need to get creative and source stock photos.
Ensure the TONE & WARMTH of the images is the same. This is one of the easiest ways to create a consistent feel across your brand (this can go for any other platform too, like Insta etc). e.g. You don't want to be using 95% really warm, earthy toned images, and then all of a sudden introduce a random really blue, cool-toned image into the mix. You can easily edit images using any editing program on your desktop or iPhone.
Don't be afraid to re-use the same image a couple times on the page. If you use Squarespace, use the 'overlay' feature, where you can add a colour over the top of the image and play with the transparency. You can also try cropping the image to get a different portion of it too! Again, this will help create some consistency throughout the sales page, especially for really long ones.
If you need some help finding photos, check out my Unsplash Collections!
3. Make the payment/sign up section stand out!
This one is super simple, but it's important to make the payment section stand out from the rest of the page! This is the most important part of the page because ya really don't want this to blend in with the rest of the content.
Put a bold border around the payment section itself (like I did on The Stash sales page!)
Add some really bold buy buttons that are a totally different colour than the rest of the page.
Make sure this section is extremely SIMPLE AND EASY TO READ! Don't add fancy backgrounds or textures here. Bold and simple is the move.
Okay, those are some solid tips that should help you get started anyway. ✌️
And now, Design & Layout Structure Inspo!
I pulled this design below for you, which is actually a bit of a sneak peek inside The Stash! (The Stash is a library of 85+ creative, professionally designed Squarespace section layout templates, to help you build websites for your clients (and yourself).
These Suggested Stacks are where I'll pull various section designs from The Stash, to help you pull together specific page layouts. So today, I've got a Long Form Sales Page for ya to check out.
Regardless of the fact this is from The Stash, this structure is pretty much what I recommend and what I stick to for all of my sales page builds. The notes on the right walk through what to use that section for in terms of content & flow.
Below on the left is the name of the section so you can find it easily inside The Stash. To view the image larger, either zoom in (using command+, or right click, 'open image in new tab'.
This is the un-edited design straight from The Stash itself, so you'd plug & play all of these sections into a single page, then customise 'em as you need to!
If you build websites on the reg and you're ready to streamline the shit out of your process, I literally *made* The Stash for you!
I've actually been using it myself as I'm working on my new website, every time I get a bit stuck on a section layout I dive into The Stash, find something that will work for the content, and I customise it, and then I'm good to go. 🤠
Building a website from scratch is no joke.
It takes a shit load of creativity and patience — especially when you wanna do your best to really knock it out of the park. But just because it can sometimes feel uninspiring and tedious, it does NOT mean it has to suck.
Imagine if you had a big-ass library of PRE-MADE layouts to pull from, anytime you start a fresh new sales page or website, or when you get stuck in your design process?? How fucking GOOD!
