What are some of the Web sites that have a special edge navigation?

Source: Internet
Author: User

Navigation in a variety of ways, today focused on the side navigation. How in size, form, color and typesetting will play a different posture, to see the master's works and @anyforweb_ued students meticulous professional analysis >>>

The importance of navigation in web design is no doubt, but important does not mean that it must be high-profile, quiet and conspicuous navigation is the most consistent with the user experience, while the side of the navigation to meet the two points. The site side navigation is good or bad is easy to judge, mainly depends on its size, form, color and typesetting.

Generally speaking, the width dimension of side navigation is controlled about one-third of the width of the content part;

The main manifestations are drawer-type navigation, fixed-side navigation and hidden side navigation;

Color on the page with the overall style of coordination and integration, to avoid too bright eye color. Although the navigation should be conspicuous, but through the color to achieve is not a good way, through the layout, form, font and other ways to achieve the same goal;

The layout of side navigation is relatively simple, which is divided into left navigation and right navigation. Generally the navigation on the left side of the majority, so as to get more attention.

  Fine Goods

Realistic physical and chemical design combined with wood texture background, the application of the side-navigation in the case site has become particularly fitting. Navigation and the overall design of the Web page is very integrated, while using subtle changes in texture to differentiate, not only allows users to gain visual comfort, but also to make navigation more distinctive.

  The Max

This case is embodied in the navigation design idioms, using the color contrast with the background color to decorate the pages of important elements, while playing to highlight the role of navigation. Because the background color selected a deep stuffy black, so the color of the navigation is also selected with the black color, but relatively bright some, the overall effect is not abrupt, but also very fast and natural to attract users ' sight.


This is a relatively single site color, navigation design comparison with the sex, so let the overall effect of the mysterious with leisure. The designer will create a little wireframe experience to make the page more free and unconstrained, while highlighting the "Login" ghost button in the upper right corner of the design, to guide the user login click.


This site does not follow the navigation size between content One-third to One-second of the size of the law, so the user will be visually caused by the content of some depressing feeling. However, some of the details of this case is worth our reference, such as the natural shadow design at the top of the content plate, the watermark in the title, and so on, these elements make the site look more natural and intimate, closer to the site and the distance between users.


Pure-hand-painted web design may make the site seem too childlike, and the following case shows a different form of hand-painted style. The designer did not set the text in the site to the status of handwritten graffiti, so the user experience of the site is not affected by the style of the reason. In particular, the navigation section, with the background color and color of the light gray shading will be a good guide to distinguish between the Shong, visual fluency is not.


Georgina Bousia's website is intuitive to give users a sense of fresh and calm. Clean and simple navigation can also bring a sense of high-end atmosphere to the site, but it can not be denied that designers have spent a lot of small minds. The large image has a slight translucent geometric shadow effect, so that the scenery in the picture more than some of the design of the sun.


Site navigation can also be designed to create a feeling of staggered scenes. Part of the content of a link with the natural convergence of navigation, the use of black not only does not appear boring monotonous, but to create a unique retro fashion sense. The vertical parallax effect between the two is more appealing to the user.


This is a very special website navigation design, the designer uses the pull shape side to embody the navigation simplicity and the applicability. Navigation in the overall performance of the site is more covert, more like a page in the supplementary design.



Onymoly's web site navigation using a two-tier design, and then a simple icon design, the advantage is to let users more clearly see the content of the site classification. Color, designers use a neutral black-and-white collocation, the main content area of the visual impact to a minimum.


If you feel that site navigation is just quietly positioned on the side of the page and looks too Orthodox, try the following case. The designer adds a ribbon effect around the navigation to make the page look vibrant.

Sometimes it takes a little bit of ingenuity to make navigation different. However, based on the importance of navigation to the entire site, comfortable user experience and aesthetic choice between the need to carefully consider the designers.

Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.