“You are greeted by your clothes,” or the basic principles of landing page design. Examples of selling landing pages (landing page)
From the author: Hi all! We continue to get acquainted with the intricacies of web design, and today we have a creative topic, without knowledge of which you can’t do anything in the profession. Landing design is the development of landing one-page pages with high conversion, that is, return for the customer. I think there is no need to explain that high-quality landing page design is very expensive, which means it can easily become the main source of your income.
What is a landing page?
The concept of a landing page, as, in principle, landing page design, came to us relatively recently, according to the official version from the USA, 10–12 years ago. Essentially, this is a one-page selling website created for one single purpose: to prepare and bring potential customers to purchase a product or service.
Customers who visit these landing pages are called “leads.” “Lead” can also be said about an application or pre-order made from the site, that is, about the active action that the page calls for.
In professional slang, the terms “capture page” or “landing page” are more often used. In fact, these are synonyms; we will use them without any differences.
How is a landing page different from a regular website? Well, first of all, it doesn't have complicated navigation meshes. Secondly, there is no menu. All links that are on such pages lead mainly to the “order” or “submit a request” section. And thirdly, the landing grabs you from the first minutes and doesn’t let go until you scroll all the way to the footer. This is ideal, of course.
For whom are one-page websites created? For business, start-ups. The most popular landing page among:
But in fact, you can promote anything through the capture page, from household chemicals to jewelry and real estate. By the way, the target action may not always look as specific as a purchase. Alternatively, the landing page may encourage you to leave a request to calculate the cost of services, subscribe to the newsletter, reserve a place for free, take part in a survey or promotion, download a trial lesson, etc.
L-page is divided into:
Long and Short landing page;
One step and Two steps landing page.
The most common are One step Long, that is, long and one-step. Short - respectively, short; they are used to collect a subscription base, e-mail addresses, etc. Two steps are extremely rare; they are divided into two pages: so to speak, building up intrigue and the actual call to action.
How is the effectiveness of a landing page assessed?
To evaluate the effectiveness of landing pages, the most objective indicator is used - conversion. Conversion is the ratio of the number of visitors who completed the target action to the total number of website visitors. It is considered like this:
Today 250 people visited the site, 12 people left requests for consultation;
Modern trends and approaches in web development
Learn the algorithm for rapid growth from scratch in website building
This means that the daily conversion was 12/250 * 100 = 4.8%
Of course, for maximum objectivity, the indicator is displayed not only for the day, but also for the week, month, quarter. The broader the statistics, the easier it is to track trends in demand growth and decline, seasonality, etc.
For a complete picture, conversion is supplemented with indicators of abandoners, duration of stay on the page, and a situational click map.
What conversion percentage should you strive for? It depends on the business niche in which the landing page will compete for customers. Well, for example, for a tourist takeover, the conversion should not fall below 9–14%, but for luxury goods (the same fur coats, jewelry, cars), the conversion of 6% will be already beyond the upper limit. The absolute record holder for conversion is, of course, the information business. On the sale of training courses in a convenient format, you can safely demand 22–30%.
So, let's move from theory to practice. Landing page design has its own characteristics and rules, by adhering to which you can avoid significant mistakes from the very beginning. What should a landing page not do without? Let's try to answer.
1. Purpose. Before you start working on the landing page design, you must have a clearly formulated goal: why the site is being created, for whom, what target actions it leads to... well, etc. Each element of the future layout should work for the result, for conversion, and the task designer - think through each element in advance.
2. Harmony of creativity and psychology. I will not be mistaken if I say that contemporary creativity is not always accessible to the broad masses and adequately perceived by all contemplators. Your design should be understandable to everyone, no off-putting or flashy colors, crazy fonts or complicated animations. Leave experiments for a more appropriate occasion; when choosing colors, use the advice of psychologists, listen to the advice of professionals.
3. Heading. Just as a book begins with a cover, the quality of a landing page can be told by its title. If this option is unsuccessful, the percentage of page closing at 5-7 seconds of viewing will be very high.
4. Visualization. Maximum visual material. You can tell 100 times how your product works, but it’s easier to show it once on a short video clip. Does your product or service require a video presentation? Then photos from all angles, photos of satisfied clients, happy customers...etc.
5. Review block. A sea of positivity should flow from your site. Reviews should be linked to photos of real people, signed (name, age, country, city - naturally, as close as possible to the target audience). Impersonal reviews are repulsive and cause distrust.
6. Download speed. When uploading videos, photos, pictures to your landing page, do not forget about the weight of all elements. The page should work like a clock, load files quickly and efficiently, quickly respond to scrolling and transitions between blocks.
7. Call to action or call to action. The call to action should not be the final chord in the footer of the page. Buttons “order”, “subscribe”, “download”, “buy” should be evenly distributed across all blocks. I wanted to buy, but who knows where this button is hidden - this is a failure for conversion.
And finally, one more secret from fellow marketers, whose role in creating captivating pages cannot be underestimated. AIDA Rule:
Attention - attention;
Interest - interest;
Desire - desire;
Action - action.
This is a classic model of consumer behavior, according to which it is necessary to build the design of landing pages for any purpose. How it works? The entire structure of the site is conventionally divided into 4 blocks, and each is responsible for its part of the capture.
In the first - attention is attracted (unobtrusively, easily), in the second - interest is stirred up (questions are asked, a provocation is caused, a problem is presented), in the third - a solution to the problem is found, a desire appears to buy something without which further life becomes simply impossible, in the fourth - All that remains is to press the “one click to your cherished goal” button.
That's it, friends. Let's learn to manipulate consciousness and become masters of web design! Subscribe to my updates, stay tuned for new products, and see you soon! Bye bye.
Modern trends and approaches in web development
Learn the algorithm for rapid growth from scratch in website building
Design development landing page the “I want it like his” principle remained in 2014, when the effectiveness of the selling page was revealed to the maximum, and companies realized that with the help of a landing page they can not only quickly sell a product/service, but also reveal themselves from a creative point of view. Modern landing pages are not only a selling structure, but also an excellent opportunity to create a WOW effect in a visitor, to admire the idea of the page and its implementation.
If you don’t want to bother, you can download a prototype of the “ideal landing page” and create a page based on the rules, write a headline, an offer, advantages and benefits, insert a trust block and a call-to-action button and go to sleep with the thought that the work is done “ five." But if you want to exceed the expectations of your target audience, and let’s face it, your own expectations too, then use the landing page examples that we considered the best.
All 9 examples, collected from the Internet, we thought were cool. Simplicity, consistent with the landing page principle, convenience and consideration of the basic requirements inherent in the landing page, make examples of selling Landing pages highly converting.
Example of a selling site No. 1
The first landing that we will consider has an incredibly attractive and stylish design, but poorly thought out marketing component and copywriting. On the first screen we see a bright banner without any unique selling proposition, the emphasis is on a bright photo. When visiting a one-page website, it is initially unclear whether it is dedicated to one unique product or an entire series, which confuses the client at the initial stage.
Each person has a specific goal, why he needs a product or service. In this block we will observe dry selection criteria, but not the final need. At the same time, “from and to” indicators can confuse the client. In this case, it is better to focus on maximum characteristics. Describing a product in the style of “brevity is the sister of talent” raises a certain question about competence.
The essence of the block should be to obtain advice from a professional who knows everything about the product and is ready to give proper advice about the product depending on the client’s operating conditions.
It’s hard to imagine how the simplest landing block can be made so complex and incomprehensible. In addition, texts need to be written in the style of addressing the client. Not “leave a request”, but “leave a request”.
Landing page example No. 2
Cool landing page structure, corporate design and amazing work by the marketer made this landing page our favorite. It is clear that the client took a responsible approach to the selection of videos and photos for the development studio. On the first screen we see a unique selling proposition, several needs and criteria have been completed. The most powerful and beautiful element is a video instead of a background, which reveals the essence of the training and the equipment of the gym.
Interest is sparked by the criteria.
Professional and bright photos and video materials further stir up interest in the service.
We “pressure” the visitor with a number of advantages and cover the needs, arouse “desire”.
The logical final part of the AIDA structure is the “action” block.
Example landing page no. 3
A unique image, a stylish insert with a USP, a navigation menu, a bright design of the first block and a headline in the style of an appeal in the overall combination make you want to sign up for a trial training session. A button with a call to action also contributes to this. The navigation arrow is missing, which should indicate that there is also new information below. The next block is advantages in the form of criteria. Made in the form of icons with a brief description.
An excellent solution was to place a block with a call to action with a discount offer and a time limit. Photos inspire confidence in the visitor, motivate, and are also an unusual and stylish addition to the design.
An excellent block with motivation for the first lesson. The big minus is the character of a different nationality.
An example of a landing page demonstrates the style and conciseness of the design, but, at the same time, motivates the reader to the main action due to the absence of distracting details and minimal colors.
Landing Page Example #4
A good landing page developed by our web studio, which can become a role model and inspiration for other developers and clients. The one-page website reveals the problem of the target audience (in our case, women with large breasts), and immediately solves it through a high-quality offer.
Each block is an exact hit to the pain of the target consumer. Immediately behind it is the correct and competent solution to clients’ experiences based on their discomfort.
A bonus for both the visitor and the landing page in terms of lead generation is a block of benefits and advantages, supplemented with real photographs that clearly demonstrate the result.
A great way to communicate benefits not only verbally, but also visually. Thus, all information is perceived better.
Social proof uses two powerful marketing elements. A video that once again puts pressure on the problem and talks about the benefits of properly selected underwear.
And a photograph of the company director with his address to the client.
A large amount of negative white space, due to which attention is concentrated on the content, as well as a fairly simple design of the content, create the impression of a stylish and modern design. The landing page is captivating with its concept and converts visitors into clients thanks to competent marketing.
Landing page example #5
A stylish example of a landing page focused on selling a service - the design and construction of luxury private houses and cottages. The landing page was developed according to the AIDA marketing strategy - a classic that tirelessly demonstrates its effectiveness.
Each block demonstrates an integrated approach of a marketer, copywriter and designer. Powerful and motivating calls to action, original and stylistic graphic images and sales text leave the visitor no chance but to cause him to take the action that is expected of him.
The main goal of a one-page website is to form a positive impression of the company and its reputation, which becomes the main motivator for the target audience, which is wealthy consumers. This group of target audience is less interested in the issue of price, more interested in the image and capabilities of the performing company. Therefore, the landing page aims to highlight the benefits of a construction company.
In total, with the help of this selling one-page website, the consumer is provided with a solution to his problem in finding a reliable and professional contractor. The landing page fully reveals all the strengths of the company, which become a motivator for cooperation.
Example of a successful landing page No. 6
Here is an excellent example of a beautiful and functional landing page. Modern design with thematic pictures, developed in a combination of dark and light tones with bright accent inserts creates a pleasant impression of nobility.
This landing page has a distinctive feature that other developers rarely use. It reveals the issue of price as much as possible, inviting the user to independently choose the price range, having considered the options that he can afford.
This is a very convenient and practical function that visually shows the user online all the offers that are suitable for the price. Another advantage of a one-page website is its focus on all the requests of the target buyer. Using this landing page, a visitor can get advice, place an order, get an idea of the cost of a kitchen set, and also receive an estimate for their order. Each opportunity comes with a call to action.
Overall, the project inspires confidence in the company. And this is the main thing that a one-page website offering services should form for a potential buyer. After all, it is based on trust in the performer that the client turns from potential to real.
Landing page example #7
We chose this landing page example because it is fundamentally different from the usual traditional one-pagers.
The site is dedicated to the milk delivery service. But it is made in a comic form and is aimed only at a small group of the target audience.
After reading the storytelling, which is where the one-page page begins, it becomes clear that it is aimed at young people who are interested in slang.
There is no selling structure or elaboration of problems here, as can be seen in the previous beautiful examples of landing pages. However, the message of the site is clear and interesting, so the landing page itself has a place.
A large amount of information content, which is presented “for fun” to make you smile, is complemented by an audio playback function, which also adds humor to the page. But, scrolling a little lower, we see a block with a call to action, typical of “classic” selling landing pages.
There is no social proof, no block of trust, no blocks of advantages and benefits. But there is a recipe for cutlets :-)
It’s difficult to say about the effectiveness of this landing page. What is obvious is that the page is interesting, with excellent design and “school” humor. And despite the fact that such projects are a rare occurrence in the field of Internet marketing, they are worthy of existence, as they will definitely find their audience.
Example of a selling site landing page No. 8
An example of another of our work that deserves attention. The landing page sells a service for selling or renting mobile stands/photo zones. With the help of this one-page page, a potential client finds all the answers to his questions.
An excellent solution for those who want to understand the service in detail. There are unique photographs for each category of service, the cost of each with the ability to immediately select the one you are interested in. For those who could not make a choice, the landing page offers an individual order service indicating personal requests, formatted as a call to action.
The benefits block focuses on the convenience of cooperation.
The block of benefits is complemented by a block of company advantages, which together create a powerful motivation for the client to act.
An interesting design decision that combines white and dark gray with red elements to create a stylish aftertaste when viewing the landing page. Unlike other landing pages that work on the problems of the target audience, offering their solution, this project reveals all the advantages of the company’s services, and also helps the client find answers to all his questions.
Example landing page No. 9
This landing page, which was developed by our web studio, holds the visitor’s attention from the first turn of the screen and motivates him to action. A landing page dedicated to selling design and construction services opens up a ton of opportunities for the client. This is confirmed by the feedback form, which allows you to immediately order an individual project or download a free example of a project.
When choosing a contractor, a potential client needs the reputation and experience of the company. It is on this information that the consumer forms benefits for himself.
A special bonus for the visitor is real photographs of projects created by the company. Bright, beautiful and attractive photos become a plus for the visitor’s trust.
Next is the block of “goodies”. That bonus that competitors rarely offer is the opportunity for the client to look at the houses built by the company with his own eyes. This service does not oblige the visitor to order the service. But with the help of the feedback form, the visitor already becomes a lead.
As a result, the client is presented with a website with an original design, thoughtful structure and concept, and competent content, which has a comprehensive effect on page conversion, leading to high efficiency.
Parting words
The modern user, sophisticated with the countless number of sales pages that catch his eye, is already tired of the same type. Today, uniqueness has come into fashion; the more interesting and unusual the landing page, the higher the likelihood that it will attract the user’s attention. In addition, good and exclusive design is always a plus: both to surprise the visitor and to please yourself. And a pleasantly surprised visitor is at least +10% to conversion. We wish you original and delicious ideas! And if you have any difficulties with this, you can always order a landing page from our web studio.
Subscribe to the blog and follow our updates.
The design of this page is unique, completely imbued with the brand's personality and is not similar to others.
The peculiarity of this design is that all the elements are visible, but at the same time very neatly arranged. The simple but beautiful slideshow also attracts attention.
Simple but cute design. The advantage is that you can log into the site via Facebook without wasting time on registration.
An excellent example of demonstrating the company's products. Every month the company updates the list of products shown on the page.
Understanding what is sold on the site is not a problem thanks to well-structured content, beautiful slides and large font price tags.
The most successful product sales pages always contain clear, easy-to-understand product examples.
The key to this design is simplicity. A simple menu and a bright slider go together perfectly.
The page successfully displays different sections. For more detailed information, just click on the image you like.
The design is not overloaded with unnecessary elements; you can immediately see all the characteristics and prices of the product.
Entertainment sites
Simple and tasteful. The purpose of the page is immediately clear: watching a documentary video.
The page design is very well thought out, it fascinates and literally hypnotizes. Great combination of colors and shapes.
This site is above all praise. The brilliantly thought-out design and abundance of interactive elements will not leave anyone indifferent.
This Harry Potter franchise page is designed using colors, phrases, and names familiar to fans.
This page not only looks beautiful, it is also very functional: many interactive elements, integration with Google Maps, use of tabs.
Uncrate, even after the redesign, does not change its tradition of arranging all sections of the site in a convenient top navigation menu.
This site showcases the power of graphic design and web development. It’s better to go to it and see for yourself.
An excellent example of a “tiled” design that allows you to stylishly arrange a large number of content blocks.
The visuals of this site are stunning. Vivid images instantly capture the attention of users.
Jay-Z sure knows how to have fun. On his site, articles, images and other content are presented in the form of interactive tiles.
This design uses natural shades that go well with the main issues raised on the site.
Portfolio landing pages
On this page, the dominant role is again given to images that literally come to life when you hover the mouse.
This example has a very interesting combination of colors. Moreover, all elements on the page use the same background structure, wood-like.
The “old school” style is used very well here, the design of each element is thought out to the smallest detail and is unique. Thanks to endless scrolling on this site, you can enjoy such beauty for a long time.
A clear and thoughtful design helps the page most effectively convey the main information to visitors. The color scheme matches the brand and shows the designer's style in action.
The page is an excellent presentation. Each banner is dedicated to a separate project.
An example of an unusual tile design.
Typography plays a major role on this page. Using different fonts helps in conveying ideas.
The design is laconic and concise. On the page we can see everything we need: a portfolio and links to other sections.
Icons and nothing more. A good example of minimalist design.
The portfolio page displays the most important thing - examples of work.
Retail
The page contains many user photos, which you can easily scroll through using scrolling and hovering.
Large, bright photographs of the company's products make you want to drink a can of cold beer.
Nothing distracts the visitor from contemplating the most beautiful watch.
The highlight of this site is the slideshow at the top of the page, which showcases mouth-watering culinary delights.
The font and graphics combine perfectly, creating a unified perception of the site. There are only three menu items, and they are impossible to miss.
Elegant style, high-quality images, beautiful presentation. Nothing distracts from the main elements.
Toyota has created a Pinterest-style site for Camry lovers. Here you can find many photographs, articles, statistics.
Despite the fact that this page fits into one screen in height, there are many interesting interactive elements and unusual details on it.
The page design fully reflects the brand's style: colors, fonts, pictures are immediately associated with this company.
The design is made in calm, light colors; this color scheme is ideal for the product being offered.
This site is like a book that captures your attention with its unusual plot and illustrations.
The floating red button in the middle of the screen does its job: you really want to click on it.
Many entrepreneurs pay a lot of money to develop a design and corporate identity: they choose a web studio or a freelancer, draw up technical specifications for the landing page design, look at dozens of layouts, agree on the size and placement of the logo and other elements - and can often be dissatisfied with the result.
When developing a design, a number of points are usually taken into account: page layout and layout, appearance and placement of the logo, header, buttons and forms. In addition, it is important to understand where prices for services, special offers, product descriptions should be located, how these blocks should be designed, and what amount of text and images on the page is optimal. Often, clients leave websites, in particular, landing pages - the design “didn’t catch my attention.” A thought unconsciously forms in the user’s head: “If their design is not very good, and it is impossible to find anything on the site, then where is the guarantee that you can use their services?” To prevent this from happening, you need a beautiful landing page.
The service of ready-made solutions 1C-UMI offers organic and stylish landing page design for any type of business. The big plus is that each design template is responsive. This means that your website will be displayed correctly on all devices: both on a computer monitor and on a smartphone screen. Determine which color scheme is right for you and choose the optimal landing page design.
In 1C-UMI templates, all blocks are already arranged in a certain order, in accordance with user behavior on the site. There is a menu at the top of the site. The user, by clicking on one or another section, will immediately go to the selected part of the page. This is very convenient from a navigation point of view.
Just below, across the entire width of the page, there is an image, against which there are blocks for the title and a feedback form. Next you will find a description of the offer or product, supplemented by a photo carousel. Only after entering the site, the user will see all the relevant information. He will find the rest, less important, in the middle and bottom of the page: a more detailed description of the company’s activities, photographs of employees, a countdown counter to the end of some promotion or to the start of an event, customer reviews and more.
If you want to change the background color, buttons, font, header and link style, block layout and size, do it using CSS styles. This is a simple tool that allows you to expand the scope of a standard template, radically change the look of your website and create a unique design.
If you don’t have the time and ability to develop design yourself, just register on 1C-UMI in 2 clicks and create really cool landing pages!
