Landing Page Design

Home Landing Page Design

Landing Page Design

I believe many of you designers have read this article back in 2010 on the Lost Cat Design Poster. It is hilarious, isn't it? If you have look through the proposals that the designer had sent, you probably thought, a few of the posters actually look quite good. However, we have to bear in mind some collaterals are better off looking like a plain jane rather than applying different design principles to them. For instance, Lost and Found leaflets, Travel Tours leaflets etc.

Having said that, Design needs to be optimized to further improve readability and enhance its focus. Though some of these identified leaflets does not need to have fanciful designs, basic optimization in the layout and typeface is still essential in drawing the attention. Same goes for Landing Page. A landing page is like a web version of a sales brochure. I have identified 4 zones which I felt would be beneficial to anyone out there, be it creating a Landing Page or any other print media. I am sure you would not choose to put your living room sofa in the kitchen. You could use this as a guideline to help you create a successful Landing Page. It is all about the placement, manipulation of typefaces and choice of images.


Landing Page Design


1. Big Titles

Well obviously, you don't pick a 60px font type just to shout out the product name or service. This title generally needs to be bigger than the rest of the text on the page. Bold it, use contrasting colours against the background. It should steal the show.

If you have a tagline for your product or services, place it right under the Title and use a smaller and thinner typeface, it should be supporting the title but not stealing the limelight.


2. Impactful images and Forms

This zone is partitioned into 2 sections. Image/Video column and Forms column. You can switch between the two, it is all up to you.


Impactful Images 

Your choice of image is highly important. Nobody can tolerate low-quality images in this era. The image must also be relevant and concise. The composition of the image should be considered as well. Imagine you are selling a coffee mug but the emphasis is placed on the teaspoon. Gather a few opinions and test out a few images with your colleagues or friends before publishing them. Also, if an image speaks a thousand words, what would a video say? If you have the resource or budget to create a video, go for it.


This is an important area where your customers raised their hands and said they want a piece of what you are providing. Usually, they are sold by just reading the title and looking at the image. Therefore, placing Forms in zone 2 is strategically the right thing to do. Do not include too many fields that you do not require. Most businesses generally would want to collect customers' emails for list building purpose, therefore, a name field and email field should be enough for most businesses. However, it all depends on your businesses as well, for example, you are a web design firm, and you require more information about customer's current website, you may need to create a website field and contact field for analysis and consultation purposes.

Call to Action

Inside the form lies the most important button ever on web design history. The Call to Action button. This button should stand out from the rest of the page with persuading message and bold, striking and contrasting colours, depending on the overall colour scheme of your landing page. A good example of a persuading message could be "Get your Free trial now" compared to "Free Trial".


3. Description and Benefits

I would call this is a free play area. You can choose to have what I proposed a description column and a benefits column in a row, or simply a column for both. You could also use a 4 column image with description layout etc. However, I would advise against the use of too many images for it would clutter the page. You can use icons to describe each benefit though.

4. Contact Info

Lastly, provide contact number/email and social media links for your customers to contact and connect with you. This is where your facebook, twitter, google+, linkedin, pinterest etc badges sit. Some may choose to put it where the title is, it is not right or wrong, just remember, keep it simple and sweet.
Besides getting the design done, you also need to take note some mistakes commonly made in poor landing pages. Once you have completed your landing page, its time to launch it and measure the results. Use analytic tools to help you measure the results. Try using different images, copy (A/B testing) and see the difference in result.
Good luck!

Subscribe to our Blog

Like Us On Facebook