I Want My Name:
Homepages aren’t hard, but they’re very scary. Scary because they’re the face of your brand on the web — the first thing people see when they stumble upon whatever it is that you do.
Technically, there’s no wrong way to create a homepage. But any SEO will tell you that there are some ways that are more right than others. Fortunately (or unfortunately) for you, I’m not an SEO. I’m on the side that thinks search algorithms are finally getting to a point to where they value actual usefulness over “standards” (not that standards aren’t important), so anything goes in my book as long as it maximizes value for the customer.
And in my book, there are only three things a customer needs. Anything else is (mostly) a waste of time, and should instead live within your site nav or footer. Here’s the list:
A simple description of what you do.
A concise description of why you’re essential. It doesn’t have to be a single sentence, but it needs to be a quick read. If you’re selling an aesthetic, a good enough design can work here.
Some sort of conversion piece tied to the content above — typically a form, a CTA (call-to-action) button, or a search box (don’t just expect me to click on a ‘sign up’ button in the top right… I want some narrative flow!).
Let’s go through some of the companies in our plugins page to show off some good examples.
For me, this is homepagery at its finest. What does Postach.io do? They “turn an Evernote™ notebook into a beautiful blog or web site.” How easy is it? In huge letters, it’s “the easiest way to blog.” Is it expensive? The CTA button says, “Create a Blog, Free.” Even the two testimonials after the appealing graphic are easy to digest. “I regularly use Evernote for almost everything. How good and easy it is to blog with Postach.io!”
Nailed it. The only thing I’m missing is a clear example of what a Postach.io blog looks like (a template link in the nav would be nice), and maybe easy access to an FAQ or Features page (there’s a help button in the footer, but a short FAQ with a little more feature detail could be nice for hesitant clickers.) Less is usually more, but people do need to be able to find content somewhere.
The messaging on the Squarespace homepage really nails it. “Make it beautiful. Make your own website.” It’s short, but not in a bad way. And the clean, modern design tells me exactly why Squarespace is essential — there aren’t many other brands pitching this type of design as something I can create. Then, the primary CTA is simple: “Start a free trial. No credit card required.”
As a customer, what I see here is that I can make something beautiful, and I can probably test it out right now without getting wrapped up in something I’ll have to remember to cancel. My big gripe is that the rest of the page is fluff. As you scroll down, you’ll find all sorts of stuff coming at you via fly-in callout boxes, but I’d be surprised if any of it gets much traffic because it feels like chaos. I also think not having an accessible top nav is a mistake (they just have everything in the footer or in the fly-ins), as it makes the site harder to navigate if you’re not programmed to dive into sales funnels.
What does Fastmail do? It’s “Email, calendars and contacts done right. Get private, secure, ad-free email hosting for you or your business.” Nailed it. I especially appreciate the hero image they use — on the computer screen is a simple shot of what the email app looks like. It’s clean, organized, and looks thoroughly modern. Then there’s the “Try it free for 30 days” CTA, which is a nice improvement over the standard “Sign up” button.
Like Squarespace’s homepage, the rest should probably be tucked away into a Features page on the nav. I don’t just want to keep saying that though, so here’s my reasoning. Let’s say you’re on FastMail.com and you’re interested in signing up. The natural thing to do is to go to the sales funnel page (normally the homepage) and read it from top to bottom. The narrative flow should be: headline, supporting content, CTA. Instead, pages like this go: headline, supporting content, CTA, supporting content, supporting content, supporting content, supporting content, undesigned CTA near the end. If your homepage is your pitch, you’re wasting valuable time. Instead, give people a homepage that will convert 75% of your audience, then give the rest a supporting content page with a more casual narrative flow. And don’t make it so flashy — when people want in-depth content, they’re usually not looking for flashy fly-in content and confusing layouts. Just give them the info they want in the cleanest, most organized way possible.
As a “creative” (barf), I like to think of myself as “special” (barf barf). I unapologetically begin sentences with the word “and.” I probably use the wrong dashes throughout my posts, but I own them like a favorite shirt. So when I see a homepage that says, “Few can do what you do. Build your online portfolio. Create your next opportunity.” on top of a strange-but-appealing hipster teaser video; I say, “hell yeah!” The CTA button leaves a bit to be desired (“Get Started,” whoo!), but it’s followed by some useful content chunks: “14-day trial. No credit card required.” Awesome.
Below the main part, the rest of the page is a little cluttered with moving parts a la Squarespace. Again, I doubt they perform very well and could be improved with a simple grid of some example sites — or just make the Features page that already exists more prominent.
The bad homepage item list
I won’t go into specific example, but I can list some things to watch out for when you’re making your own site:
When figuring out the thing that makes you essential, please be bold enough to make it sound and/or look better than the free/cheap thing that dominates your industry. You’re small, but somewhere in your business plan you should be able to find your “unfair advantage.”
Don’t be vague about what you do or what service you offer. If I can’t tell within 30 seconds, I’m probably not going to stick around.
Having a bold CTA is nice, but nothing is worse than littering a page with multiple CTAs. Things can go from friendly to harassment very quickly.
Movement isn’t a feature. It’s distracting. Cut out all the fade-ins, fly-ins, and in-ins — just put the content on the page, please.
Tied to movement, if you have a screen takeover CTA timed for some action on your homepage, expect a huge portion of your audience to just leave. I can’t stand screen takeovers.
Watch out for white text over white images or black text over dark images. You wouldn’t believe how many homepages are ruined by illegible copy.
Don’t assume people will watch whatever video you have embedded into your homepage. If it’s not playing automatically, there’s a 99.8% chance I’ll never click on it.
Pay attention to your responsive design. If buttons and content blocks to strange things on different screen sizes, people will notice.
Be careful with headline fonts. Sites like Weebly do a good job incorporating that hand-drawn look, but some of it’s just sloppy.
Be careful using stock images — especially the free ones. I’ve seen a few startups use the same stock images for their homepages that I’ve used on blog posts. Most people won’t notice, but it cheapens the experience if you do.