There was only one line between the design and the development, but when the time stepped into another decade, the lines became increasingly blurred and the gap grew wider. Is it enough to design a Web page with PS? Maybe 5 years ago, that's right. Today's internet users are demanding more and more. Gorgeous without meaning will soon be discarded. But if you only pursue flashy designs, then believe that you will soon be abandoned by the times. 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 designed 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 dreams require 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?
What is the trend of web design trends in the 2011? Focus on 11 Web page design Trend hotspots:
1. More CSS3 + HTML5
This is the long-awaited thing. In the past few years designers have begun to focus on and use 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 still 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 color transparency 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 and JavaScript, to force it!
Red is absolutely classic, if the color is done well to the visual impact of people ... The 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 the 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 achieve fingertip navigation?
As designers, we prefer the mouse. When the mouse hovers over the link will become highlighted, but the touchscreen does not have a so-called hover. How will you show the link to the touchscreen 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 a fluid layout in your web design (liquid layouts). In the 2011, the focus is no longer on screen resolution, but on how to make it clear that your site will be read vertically and horizontally. Your design must be flexible enough to meet any challenge. Otherwise you will be 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, 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. (seemingly 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 and cover this site. High-definition photos are a great way to grab your readers quickly, creating a compelling visual effect-the sight of visitors unconsciously falls on a wide background.
Of course, the color of the background map, content, etc. are very fastidious, under no circumstances to 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 high-resolution pictures 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.
another. Me domain name demonstration
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?
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 content of the page.
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.
Last but not least, 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 have to understand this trend and deal with it.
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.