6 Excellent web design details

The difference between excellent design and excellent design is relatively small. The average person may not be able to explain the specific differences of the outstanding design, but they can find their favorite web design works. By contrasting a few excellent works, I have summed up a few details as distinguished design. Not long ago, I wrote a 4 excellent website http://www.aliyun.com/zixun/aggregation/8912.html "> Design principles." Now this article is a bit like the continuation of the previous article. In the previous article, we focused on the application of contrast, repetition, alignment and segmentation in Web pages. I use several excellent web works as examples to illustrate the principle of excellence design!

Rational use of gradients

Do not misuse the gradient, not to make the gradient like a rainbow, otherwise your web works look more amateur. In a nutshell, a reasonable use of gradients is helpful for good web design.

Gradient, scatter-view combination
The Newism website is rich in color, but the subtle gradients and backgrounds are visually combined in place. If you are also interested in Photoshop to do this effect, you can go to the Abduzeedo ' s tutorial website to learn.

gradients, projections, and textures are used in combination.
Onwired website has applied these design techniques, it is obvious that his design works of great effect! Since the beginning of the onwired website design in the application of gradient, projection, texture this is just right. I also particularly like these designer designs.

Two, leave White

Leaving the white word is often misinterpreted as a literal interpretation of the void. The more accurate description of Web page design is the space between the elements of each plate. Further analysis to see how a List apart defines it.
"White" for web design is very important, leaving White will not let you page elements are stacked together. For young designers, White may be a big problem, they do design when the whole page is full, not to the page enough "breathing space." This may not be a problem for them, and if the content doesn't fit, they can use the browser's scroll bar to enlarge the space of the page.

Excellent white and clever split line site layout design is more reasonable and comfortable. At the same time, note that the site inside the dotted line will be separated from each plate, so we browse the site at a glance.

Abstract graphics
The sofa uses the abstraction, the < Beautiful, the simple method through uses the no background or the disorderly image, gives the visitor the space is smooth, comfortable.

Grid layout

Web design of the grid layout the original inspiration is to draw on the composition of the newspaper. But if you look closely at the things around you can find the grid phenomenon, from good design to the life of the transport network.
960 and blueprints may be the two most popular grid layouts. I personally prefer the 960 grid layout, it is simple, focused. You can use any alignment to arrange the elements of your site, alignment in the design of a complex page, you can make your site look more sophisticated, orderly, and you are in the page layout to add any module content when you do not have to consider other modules.

Comprehensive use of grid layout
The Poccuo Web site combines a grid layout with 3 columns and 5 columns. Give people visual attraction and visual space.

Blog with column layout
I prefer the web design ledger the top of the presentation, he put the latest announcement content to enlarge the top of the page at the same time, the other in a 3-column arrangement.

Use a large number of equal column layouts
Ecoki's beautiful Web page layout is clearly a 4-column, 2-line layout, with slides, thumbnails, and the latest reviews taking the same approach.

Iv. Improving Font Application
Font application Puzzles most designers. If you want to improve your design level, fonts play an important role. Not only plays an important role in readability, but also can increase the atmosphere of design works.

Draw attention with contrasting fonts
The Simplebits Web site does a great job of using a variety of contrasting fonts to guide viewers ' attention. Font contrast can be used in different font contrast, a variety of color contrast, font size comparison and other forms.

Don't think of fonts as signs
This site looks very nice and comfortable, but you can say what you think and feel to describe it. Especially in the spacing, font selection and other font applications to do a very perfect, I was his logo font application fascinated.

V. Clear and effective navigation
Good navigation is important for web design, and if viewers can't find it quickly and easily, they're likely to go to another site. This is something we don't want to see, and I know that Myinkblog has made some improvements and will make a radical improvement in the future redesign.

Blog navigation below display category navigation
In most cases, the blog navigation is placed on the page while the category is placed as a second navigation in the sidebar of the page. Tutorial9 did a great thing, he showed the Photoshop resources that the viewer cared about in a vivid way, and had a highlight when the mouse passed the level two navigation.

Toggle different icon Effects
Icon switching effect in the WEB2.0 Web page design Whether it needs to be a large number of random applications, and become a trend. Not all of them are bad, the reason for the bad use of web2.0 is overuse, amateur use caused. In most cases, the appropriate application icon toggle button is quite effective. Carsonified Web site in the navigation on the use of monochrome, simple icon switching effect, and the overall feeling of his site to match.

Six, use the beautiful and practical footer
At first we took the footer as a secondary content, placing some little useful content in the footer. Just spend a little bit of your time designing it. Now the footer for the overall design becomes more and more important, do not miss the good footer to complete your design.

Show a lot of information and certificates
This footer mainly shows the necessary information such as website introduction and copyright. Brian Hoff website adds some personality, interesting content in it. The author's work and suggested content are presented through a 3-column layout.

Add search function
Elliot Jay Stock's website adds an extra large search box at the bottom ...

Reprint please mark this article source: 6 Excellent web design details

Source of original English