5 Tips for Mastering one-page web design

Indeed, one-page design is already a big trend in web design. Many popular design elements and design methods have gradually merged with this web design approach, more and more designers and enterprise organizations began to select a single page as their gateway to the world of communication, and users began to contact more and more forms of a single page Web site.

But a long time ago, in a single page of the site is also very simple stage, many people think that this is a very low web design way, directly rough as business Card General Web page structure is not related to tall, who would think this kind of design way in today will be so popular? Under the tireless inquiry of the designers , single page design has taken off the chaotic monotonous hat, constructs a relatively perfect design system, maintains the concise and the beautiful design, attaches importance to the content, emphasizes the clear expression. From the perspective of user experience, single page design has its advantages and disadvantages, but it is noteworthy that the user is really like a single page of the Web site browsing style, this is a single page design popular cornerstone.

Ingramcoleland

Although detailed statistics have not yet been published, many scholars and experts believe that the conversion rate of a single page site is higher than that of a traditional multi-page web site. The famous website 37signals once published such a data, after the website revision becomes the single page design, the website user registration rose 37.5%, this promotion efficiency uses immediately to describe is not too.

Of course, that's not surprising.

• Single-page site navigation is simple, users are not easy to get lost, just scroll up and down.

• Single-page Web site content more focused, information transmission clearer, more targeted.

• One-page Web site can be viewed almost seamlessly on a platform-wide device, scrolling and sliding browsing instead of clicking

Plannr

The biggest challenge in designing a single-page Web site is to keep the user from scrolling through the page to view the content. Bold color use and good typography do not always attract the attention of the user. This time, if you can do the user data analysis and A/b test, can help you from the user's psychological needs closer, design more fit the needs of the page. See countless cases and tutorials, or do not make a good one-page design? What you need, perhaps, is to grasp the following 5 design suggestions, they are the essence of the design of a single page site.

1. Dividing the content into blocks

When you're going to tell a story from a single page, be careful: Don't let the story get too sloppy, don't overload the information. Therefore, it is important to cut the content reasonably, not to let too much content squeeze in a block. It is necessary to keep the content of the media as clear and tidy as possible, and to keep the logic fluent and order clear in the design of the content structure (what->why->how->where->when), The following web design is well worth drawing on: sdesignawatch.mijlo.com and agencysurvivalkits.com.

Survival-kit

Another way to keep the appeal of the user is to use the graphics and text collocation to tell the story. The story will focus on the core content in an easy to accept way to express, its natural logic will attract users to read, strictly speaking, it is within the scope of content marketing. This doesn't mean you need to hire a writer to help you write a story, what you need to do is focus on the content and its perceptual side, and try to make your page more humane.

Mijlo

2. Design Quick access Navigation bar

A single page site is usually scrolling to see more content, and many sites simply roll from head to tail. Users open a Web page, as if diving into the ocean of content, do not know the end of the page, the potential danger of this design is that it may reduce the psychological security of users. Thus, a more reasonable solution appears: the traditional navigation bar design into a single page design. The navigation bar stays at the top or both sides of the page, and changes as it scrolls, reminding the user where TA is, while ensuring ease of use and potential inner appeal.

When the page is long enough, adding navigation, back to the top button, and even scroll bars can enhance the user experience.

3, call the user action

When you ask digital media marketers what is the most important factor influencing conversion rates, the answer is usually "call for action" (CTA). Of course, this elaborate CTA behavior is only part of the web design. For a specific purpose, the CTA action is called for in fact everywhere, to attract users to download the app, to guide the user experience demo, to check the user registration, fill in forms, and so on. This is a bouquet also afraid of the depths of the era, will cry children have milk to eat, will yell to attract more users.

Cronnection

According to this case study called Kissmetrics, the rational use of CTA action call can increase the conversion rate of 591%, the effect of how obvious it is self-evident.

Fortunately, the single page of information and content more focused clearly, so the use of CTA is more obvious. On the one hand, the page is usually more simple, each part of the Division of labor detail, on the other hand, when you use the story to guide users to browse, you can subtly affect the user's mentality, in the climax-or the most reasonable place, to guide the user to operate.

Of course, there is a need to add: Do user data analysis and A/b test to determine what kind of CTA the site is suitable for, because sometimes, even the changes in font and color, can significantly affect the conversion rate.

Klyme

4, keep simple, avoid boring

In traditional web design, a very important part is to design the theme of the website, and to prepare several templates for the inner page to meet different needs. When designing a Single-page Web site, you need to face more challenges, but it also means you have more creative space. With the rapid development of CSS3,HTML5 and JavaScript in recent years, one-page design can be attractive while maintaining simplicity. The animated and beautiful transitions are all details, but which experience is not the perfect site that makes up these exquisite details?

Of course, do not abuse, too excessive, outweigh the gains.

Wristim

5. Keep the lightweight

A slow and time-consuming single page Web site is a failure. Since the content on a single page site is concentrated on one page, it is common for a single page site to be heavier than any other site, with the skills to load the content. In this way, you need to be prudent. Some unnecessary animations and irrelevant design elements that you need to remove, as appropriate, can significantly reduce the load time and improve the browsing experience. Saving the user's Web page load time is your first task, slow loading will not only affect the site's search engine optimization, but also let you continue to lose target users. Therefore, it is necessary to keep the user lightweight.

Mentor

Conclusion

In summary, single-page design is an important way to attract users, and to maximize its value, you need to not only design well, but also grasp these 5 important skills. Of course, the design of the website depends to a great extent on the characteristics of the enterprises and institutions that the website serves, which is closely related to the use of these 5 techniques. Combined with experience, flexible application, I believe you can design an impressive excellent website.