2011 Focus on 11 Web design trends

Article Description: 2011 Web Page Design Trend analysis and forecast.

There is a line between design and development, but when the Times step into another decade, it becomes even more blurred and less likely to be felt. Use PS design page layout, enough? Maybe five years ago, yes! Internet users are now demanding more and more. The splendor without meaning will soon be discarded. If you pursue flashy designs, then believe that you will soon be abandoned by the times. 2011 no longer belongs to the pure gorgeous but pay attention to function. Design Trends for the New year or the next decade are response design (responsive), continuous contact (constant connection), and virtual reality reality.

As a designer, you are going to be a god-horse for 2011 years? The real designer is not for grandstanding but for the best of both worlds in art and function. Superficial appreciation of the superficial design is easy to be forgotten. A good designer is like a dream maker, creating a dream for the user to feel so real that they don't know they are in a dream. Such a dream requires several elements: excellent color matching, intuitive design, good interactivity and fast response speed. Also, never underestimate the power of simplicity. In the 2011, your design will not only consider laptops, desktops, but also devices such as smartphones, netbooks and tablet computers. Are you ready for this?

What is the trend of web design in the 2011? Focus on 11 web design trend hotspots:

1. More CSS3 + HTML5

This is the long-awaited thing. In the past few years designers have begun to pay attention to and use of CSS3+HTML5, but in 2011 CSS3+HTML5 will be more widely used. Web designers will eventually abandon Flash. Flash is no longer the king of the past, and new technologies (CSS3+HTML5) will be replaced. 2011, Flash gradually away, the magician "HTML5" to become the protagonist of the stage:

Of course, it's too early to say HTML5 instead of flash. From the above two screenshots you can know that flash and HTML5 still have a gap. As a result, both will remain in their own position in 2011. But 2010 years ago, the phenomenon of misuse of flash by web designers will slowly diminish. Now very few designers will be the entire site with flash design, they will be available in some places to use HTML5 instead of flash, make the site easier to run faster. However, HTML5 is not yet able to replace some of the effects of Flash,flash HTML5 for the time being can not be achieved.
The most exciting thing, however, is that CSS3 is becoming more widely used, and in some places even beyond PS (Adobe says it has a pear) because it's easy job to use CSS3 to make text shadows, picture corners, and picture transparency. If you don't, it's time to get to know CSS3 and HTML5.

2. Simple color scheme

There is no more intuitive and concise background than a solid color. A solid color can be expressed in many ways. Do not always black and white gray God horse, too do not give force. Consider green, yellow, or red as the main color of your Web page. Of course, the color is best kept 2 to 3 kinds. Adjusting the transparency of the colors may give you unexpected results. Like what:

It's just a simple green, designed to create such a beautiful Twitter visualization tool by adjusting transparency. You should know: This page is only used xhtml/css and JavaScript, to force it!

The Red Absolute Classics, if the color matching does well gives the human the visual impact to be more ... The Web site's unique red and easy-friendly text design makes people have to be impressed.

3. The advent of the mobile internet age

Smartphones, ipads and netbooks can be seen everywhere, and the omg,2011 of the year will now be more pronounced. This means that your design needs to consider more equipment.

Creating a Web site for mobile devices is not simply removing the gorgeous elements from the original design, it will be a soulless design. Although it is painful to design a website that supports mobile devices in its original design. Fortunately, the new technology makes everything simpler.

In the case of using CSS3, it is much easier to design mobile Web pages. The most important thing is that you can modify a CSS file to complete the site changes to meet users using different devices to browse the Web.

You can also design a mobile device-specific site, but I believe that the site will soon be revised to the current technology product development rate. More and more mobile sites include browsing options for the original site. If you don't offer this option or your original site isn't optimized for mobile network standards, you're not ready for the advent of the mobile internet era. According to forecasts, smartphone sales will go beyond personal PCs. Get ready to meet the arrival of the mobile Equipment army.

4. Parallax scrolling

First to explain the next Parallax scrolling,parallax scrolling is to allow multilayer backgrounds to move at different speeds to form a motion parallax 3D effect, although purely visual effects, but the visual experience in the content scrolling is still very good. The 2011 Web page Design Trend hotspot is to create such a deep visual effect. Parallax scrolling can be implemented with some simple CSS tricks or jquery plug-ins (Demo site: Site 1 site 2). Parallax scrolling can play a very good effect on the minor elements of Web design: header, footer, or background. But it is best not to use the site navigation, it seems a bit nondescript.

Old Pulteney Row to the Pole in the background of the site using the Parallax Scrolling special effects, open the site and then pull down to see the effect.

5. Design needs to consider more touch screen equipment

Touch screen technology is more and more widely used, touch screen equipment everywhere. This means that your navigation design is no longer just a mouse navigation, you have to consider your design for a touch screen device. Does your design do the fingertip navigation?

As designers, we prefer the mouse. When the mouse hovers over the link will become highlighted, but the touch screen does not call hover. How will you show the link to the touch screen device visitor in the design?

Similarly, how can you make it easier for your visitors to read your site carefully? This may be controversial in browser standards, or it may be more appropriate to scroll horizontally to touch the screen. Designing a Web site similar to the layout of a magazine is more beneficial to visitors browsing your site.

Finally, you must consider using the fluid layout in your web design (liquid layouts). In 2011, the focus is no longer on screen resolution, but on how to make it clear that your site will be read from vertical to horizontal. Your design must be flexible enough to meet any challenge. Otherwise you will become the past.

Baby sees the IPad Magic, Copyright Steve Paine, Flickr

6. Depth Analysis

Depth analysis is about using dimensions in web design so that you can make your pages more authentic. If applied properly, it would be a virtual 3D effect, just like the 3D movie Avatar. Although 3D technology has not yet gone to the website design, you still try to use the dimension to design.

Plántate provides a rotatable 3D Earth, using the means of shading and layers flexibly.

Jordon activity page, 3D element clear and simple, design very eye-catching. (seems to have been removed)

7. Large background image

The application of Web design for large background images will be more obvious in 2011. These background images are generally high resolution, covering this site. High-definition photos are a great way to grab your readers quickly, creating a compelling visual effect-the sight of visitors will unconsciously fall on a wide background.

Of course, the color of the background map, content, etc. are very fastidious, under no circumstances will destroy the user's experience, otherwise beautiful photos are in vain. The picture type tends to some softer, slightly transparent one kind, does not affect the website text The reading, stresses the coordination, is easy to read.

The above site uses a high-resolution picture as the background of the site, the main color of the site is yellow.

This site adds playful animation and its grand scale imagery. Warning:auto-play Music.

8. Not rigidly in the top-level domain

This is not strictly related to web design, but it is also a trend to develop more creative domain names. com domain names are less appealing, mainly because you can hardly find a shorter. com domain name. In the 2011, people began to slowly shift their gaze to. me,. Co and. cc. Think about the development of domain name, the first step, or you will probably miss the opportunity again.

I use the personal display page, blog is very good.

Example of another. Me domain name

9. Qr:quick Response

If you notice that more and more business cards, magazines or other places appear with square barcodes, you have seen the trend of 2011 years of hot. But what does it have to do with web design? It's really unbelievable.

This square barcode is called QR, which is called the Quick Response (introduced in the QR Code reader Quickmark). Use your mobile phone to take a picture of a unique barcode, like magic, the software that reads QR on a mobile phone will open a barcode-related website. The most wonderful thing is that you can apply QR to many places. Apply QR to your site to make the viewer have a shortcut to your mobile Web page. You can also track your visitors by placing a special referral code QR on your Web site. Haha, you can use QR as your avatar, and then go to someone else's website to leave a message and comment. The 2011 Mobile Media Advantage is more prominent, and use this advantage of web design is the most sensible choice is also the future trend of development.

Above is the QR of the Soft mine blog. If you also want to create one, click here.

10. Thumbnail Design (Thumbnail)

Google has introduced its browsing preview technology to its users. In the past we can only see the content of the Web page by clicking on the link, now you can just click on the magnifying glass and hover the mouse over the link to preview the link's page content.

If your design is based on Flash, there is a problem that the preview will not display your design elements.

General Internet users in the 2011 have become more savvy, and they want to see more user-friendly navigation designs.

11. Continuous Contact/Life Stream

Lifestreaming, a Web application that records personal daily activities online, including directly through a video feed or by focusing on a person's online content, such as blog logs, updates on social networks, online albums, chat content, or even just some favorite sites.

The last point, not least, is that web design pays more attention to continuous contact between people, such as life Stream. The internet itself is primitive, boring, and human beings through this open platform to share their everything to become colorful. In the future, people will also strengthen the communication and interaction between people in the form of lifestreaming. As a web designer, you must understand this trend and respond to this trend.

In 2011, personal blogs were more active in Twitter feeds (not just links to Twitter pages), and people passed Foursquare to each other, where are u and what are u doing. There is no doubt that 2011 will lead us into a more heart-to-heart internet era.

Personal website, using the lifestreaming.

A business website that combines a lot of information on a single page.