We used to think that using eye-catching Web designs done in Photoshop is enough for people to visit our website. Well, that was 5 or so years ago. If your goal remains to astonish viewers and fellow designers with flashy designs, then you will find yourself pitifully left behind. After all, beauty without substance is a turn-off. Today, with the advent of more advanced Internet technology coupled with more demands from users, the quest is now about a website’s functionality—beauty takes the second place.

So how do you stay as a competitive designer in 2011? You need to entangle, not to dazzle, your audience. Here are some of the trends that you need to keep in mind when designing websites.

1. Use of More CSS3 and HTML5

Site designers of yonder years once used Flash in their designs. In fact, many of them made websites entirely with Flash, creating loading delays in browsers and crawling difficulties for search engine spiders. Today, Flash does not play well with some of the newer Internet technologies available.

In 2011, Web designers are predicted to increasingly move toward using CSS3 and HTML5 languages as either substitutes or augmentations to Flash. If you have not started using these languages, then now is the time to learn them.

2. Thumbnail Design

Google recently introduced thumbnail browsing as a feature in their search engine. Just click on the magnifying glass beside the entry in a search engine page result to see a bird’s-eye view of the site. Take note that the preview is not compatible with Flash-based designs. Thus Flash-based designs are not displayed.

In 2011, expect to see more people navigating through the use of a Google thumbnail.

3. Simpler Colors

A simple, quiet backdrop creates a huge impact. Limit your palette to two or three colors, and for variety, work within different shades of each color. Greens, yellows, blues, and reds are great primary colors that you could use.

4. Large Photographic Backdrops

In 2011, displaying large-scale, high-resolution photographic images that cover entire home pages will be the trend. Large, interesting, and professionally taken photos, after all, are very effective ways to grab your audience’s attention—it is impossible for users not see them. Of course, keep in mind that the image to be displayed should be content appropriate; a pretty image without context is worthless. Soft or slightly transparent imagery that harmonizes your content seems to be the latest 2011 trend.

5. Compatible with Mobile Devices

A dizzying amount of mobile products—smart phones, tablets, laptops, netbooks—will be increasingly becoming accessible to the average consumer in 2011. In fact, forecasters expect that mobile devices will outsell personal computers/desktops this year. Thus, your Web design must be compatible to these multiple viewports so you won’t get left behind. Advanced Internet technology can now easily allow your coding to be compatible to the user’s viewing medium.

6. Compatible with Touch Screen Technology

Today’s technology has shifted usability from abstract to tangible, especially with modern mobile devices. Just look: how many of us own smartphones, tablets, and even desktops that use touch screens? Electronic navigation in 2011 will be done by fingertips; mice are a thing of the past.

Your website design should incorporate touch screen technology. For instance, you need to consider how your design will indicate links. You may need to forego traditional website mechanisms such as drop-down menus; these are inconvenient for users using touch screens. Ultimately, your design must be flexible to meet any challenge, or else you will just become a relic of the past.

7. Depth Perception

Have you ever watched the blockbuster 3D movie Avatar? Movie elements seem to jump off the screen literally.

Although there is no 3D technology yet available to Web design, you can still duplicate that 3D effect on your website by adding shadows and playing with light effects and layers. Done correctly, these techniques create dimension in your design so that elements of your website will look nearer than others.

8.  Parallax Scrolling for Banners and Headers

Remember those old 8-bit video games that you used to play when you are a child? Notice how the moving background creates a sense of depth? This is called parallax scrolling, a scrolling technique in which multiple layers move at different speeds to convey a sense of depth.

Hot 2011 banners and headers use parallax scrolling to make them attention-grabbers. The technique can be accomplished with the use of simple CSS tricks or jQuery plug-ins like Spritely.

9. Use of Quick Response Codes

Quick-response codes (QR) are like barcodes for websites; feature one on your Web design so that users can shortcut to it. A QR is a specific two-dimensional code that is readable by camera phones or QR readers. The user simply takes a photo of the QR code through his camera phone. Using the coded message in the QR, the phone will connect to the website.

The Year of the Metal Rabbit emphasizes mobility, and a QR code will surely give you an advantage.

10.  Livestreaming Trend

Adding a page that features personal blogs and stories, linking to Facebook and other social networking sites, making entries on Tweeter, or updating displayed calendars are examples of livestreaming, a trend which is predicted to become popular in 2011. Livestreaming allows viewers to know more about you as a person, not as a mere online presence. This makes the website—and the person behind it—more interesting.

Users can expect to see a dedicated livestream for one’s online activity to be incorporated on a Web design on 2011.

Are you or your website ready for 2011?