Two articles about trends in web design

Source: Internet
Author: User
Tags header
The first text comes from: http://www.ontoinfo.com/2006/09/13/current-trends-in-web-design/the present excellent design summed up in 8 styles, suggest to the original look at the author's interception of graphic examples.

1.Web of desktop
www.yahoo.com
Mail.yahoo.com
Www.live.com

Affirmative: It looks so cool, it's worth admiring.
Negative: Spending too much

As close as possible to the gorgeous graphics on the desktop, this is the most elegant style. As a result, this style looks great, but it takes a lot of work and consumes a lot of network resources. In short, desktop style is unique in its surroundings, expressive graphics, shadows, and imitation of desktop applications.

Examples of features for desktop elements:

Block level: An area on the screen usually accompanies a border, head, bottom (border, header, footer) to connect logically similar elements, such as links, text, scorecards (note: I think of Digg that score bar), the article preview. Block levels are usually accompanied by seemingly random shadows (optional shadow).

Mini blocks: Usually they are a combination of small pictures and fine text.

Button: This design element is accompanied by a certain angle, a stylized border, a seemingly random shadow. The button may be glass-style, and there are some shadows from the light projected from below, and there will be visual feedback when the mouse moves up.

tags (Tabs): They also use angled, stylized borders, seemingly random shadows. Also has the mouse suspension feedback.

2. Mercury Orange Style
Www.mozilla.com/firefox
Www.digg.com
Www.silverorange.com

Affirmative: Usability is good, lightweight, simple
Negative: fashion, followers, slightly expensive

It looks slightly simpler, with a balance between styling and lightweight, and Mercury Orange is more focused on usability than a visually rich interface. Instead of trying to impress viewers like desktop style, it offers an excellent usability experience. The silverorange.com is the designer of the mercury-orange style.

Examples of mercury-orange style features:

Top menu: Usually it is dark, the text color is light-colored, in the background, the prominent angle color is rich in the change, and forms the intense contrast.

Guide line: More three-dimensional, the guide line and the top of the menu background color contrast, the text color is gray.

Text Split Line: More three-dimensional, the separation line looks very moderate.

3. Apple style
Www.apple.com

Affirmative: elegant, have quality, luxurious
Negative: Too special, too much spending

This design, with a glass label and a button as the main feature, is not suitable for small fonts, but fortunately, this style is acceptable if you don't usually use small fonts. The workload is great because you need to do a lot of design. There are features that you need to design to stay unique, so using Apple to design the web is almost impossible.

Examples of Apple style features:

Apple menu: Apple's menu embodies the Apple style, each has the same style: Glass button, three-dimensional, rounded corners ...

4. Microsoft Style
www.microsoft.com
www.msn.com
www.rsdn.ru

Affirmative: Strong function, simple, low cost of development
Opposition: You are an MS ally

One of the most important things, such as the floating menu in the left column of the Microsoft Style site, is clear, but too earthy. Simple, clear but ordinary. It's like an engineer created for an engineer.

Examples of Microsoft style features:

Microsoft Menu: The main menu of Microsoft style is gray, powerful, simple. The only border, mouse hover effect, Floating submenu ... occupy the left column.

The difference in Microsoft's style is the three-dimensional sense of the header, when you scan from left to right, until the top right corner of the search box will find this feature.

All block levels are separated by clear gray lines, which I think is due to the usability of the view. People have too many choices on Microsoft, but one thing is clear: Microsoft's design style is simple, functional, and usability is good.

Compared to the Apple style, it is not luxurious. But it's good to run.

5. Magazine style
Www.style.com
www.drive.ru

Affirmative: attractive, simple and concentrated.
Negative: Need a lot of photos and text, the quality of the content is the key

Web magazine design style is ... Well, it's like a magazine. It looks like a visually stunning magazine on your computer screen, so you can look at the Web page with a magazine perspective.

You will realize that there are many links to articles in high-quality photos and images.

The magazine-style target group is the magazine's reader. Not an engineer, not a web designer, not even a net worm. It was really designed by a group of professional designers who loved their jobs. If your goal is this type of designer, work for yourself and love it ...

6. Round Corner Plain Style
www.youtube.com

Affirmative: simple, fresh, content outstanding
Negative: A bit boring, not novel, not easy to impress

This design is not bad at all. Its purpose is to let the viewer's eyes focus on the content, but also to reduce traffic. The top navigation of a typical site (www.youtube.com) has only rounded corners and deliberately the simplest elements.

7.WEB 2.0 Design Style
Blogger.com
Netflix.com
Target.com
ruby-lang.org
Yelp.com
Blubolt.com

Affirmative: Modern, easy to be accepted by the public, novel
Negative: Usability issues, Fixed width

The design style of web2.0 can be identified by:
-Fixed width
-Fillet shape and shadow
-Large font
-Header for highlighted color
-substantial amount of gray text
-The font is wide
-Fillet shapes and buttons
-Shadows, glass effects, more stereoscopic

8.adobe/macromedia style
Adobe.com
Macromedia.com

Affirmative: Clean, simple, balanced, noble
Negative: The expense is big, the individuality is outstanding, usability question

This style is like Apple's: once you've seen it, you'll immediately identify other imitators. This design costs a lot, the pursuit of graphic effects, and the pursuit of the overall balance. It was Macromedia's original style a few years ago, but it's still one of the best web designs ever.

Macromedia Design style of the difference: Complex stereo buttons, rounded corners, the shadow is unique, fixed width, central sense.

Another article in contrast to the design of many of the world's best sites, summed up their common characteristics, as follows: 1. Simple layout 2. Center Positioning

3.3D effect

4. Soft, use natural background color more

5. Bright colors (but careful use)

6. Cute icons

7. There are many white

8. Large Font



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.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.