Web Design Trends of 2011
In 2010 the web was filled with details: heavy text blocks, dark color palettes and picture after picture began to see their decline as people begin to opt for much cleaner Chicago Web Design, and a more minimal look. By minimal we’re not meaning mediocre but the opposite, a better use of the diagramming without saturating the pages with irrelevant information.
Take things a little bit further by using illustrations, serif fonts and a color background. But even with these details the site should remain clean, the diagramming excellent and the fonts looking nice. What this teaches us is that you can get risky without having to make things look bizarre or old-fashioned.
Don’t be shy, start playing with typefaces
Big fonts can work if you know the secret. Usually typefaces play a minor role inside any website, as the only purpose was to display information, which means that they were utilized for their literal purpose. Since 2010, a new trend has began to gain strength and that’s utilizing big and bold fonts with the exclusive intention of grab the surfer’s attention. You can find a lot examples of how a strong title can be as eye-catching as a picture, it’s just an issue of playing your carts in a good way.
It’s ok to use a 60 pt title on top of your page as long as it looks well and not as a serious mistake.Likewise the idea of small fonts to show genius is now obsolete and on these days can be easily confused as a lack of trust.
Typography is everything on this webpage, from the small menu elements proceeded by a shocking header and the great text boxes with a subtle grunge texture. Besides the designer’s picture (which is not a photograph by the way) there’s not a single picture on this page and it doesn’t look bad but at the opposite, looks really well.
With a basic three color palette, a designer can experiment with many different typefaces and somehow nailed because the final design looks awesome, so this proves you that it’s not strictly necessary to stick to a single font family when constructing a website.
Reducing kerning and tracking values
With the present need of designing for mobile devices such as iPhone and Android, designers have learned that they no longer have huge resolutions to work with and that the 960 grid is the new commander in chief. With this reduction in sizes, one of the best ways of save space is by reducing the space between words and characters to the minimal values. So it’s now often to find really tight menu elements that fortunately look great and are still easy to read.
Creative agency Epic has started to work with typefaces on their website to fit the mobile market, the main menu features a sans-serif font with a reduced tracking value that allows to display all the elements in a small area that can probably fit inside a mobile screen. It’s important to use proper font sizes to maintain the readability as well as play with contrast, because a red font over a vermilion background is not just the best choice.
Quit using plain backgrounds, textures rock!
For the past few years, a hard tendency of zero textures and fully gradient and solid color objects ruled. One of the reasons behind this phenomena was the popularity of the web 2.0 look, which is characterized by glossy elements, gradients and plain backgrounds.
But now the trend is beginning to change and it seems that it’s time for textures to reappear in Chicago web design and the evidence relies on the several websites that are starting to use noisy textures within their places. The grunge look that was so popular during the nineties has been reinterpreted and adapted to the present time, with a new style of combining grungy textures along with clean interfaces and bold typefaces; graphic designers are returning to the creation of custom Photoshop textures, which now are way much nicer than before thanks to the advance in this popular graphic software.
The great thing about textures is that they add richness to the design, you can say that they spice up things a little bit. Currently the most popular textures are the noisy / grunge ones, wood-like textures and mostly everything that comes up from experimentation.
Pixel perfect web elements are the new look
As we said at the beginning of this article, resolutions are changing in a way that have never happened before, and now designers need to worry not only for making high-scale web elements but also super crisp icons, buttons and menus that can look perfect both in a mobile device and a 60 inch TV screen.
So now is becoming a trend in web design to make everything pixel perfect, which is a technique that can be achieved with patience and using powerful Chicago graphic design software such as Photoshop and Illustrator. The idea of pixel perfect is that every detail is carefully planned so you don’t see any blurry or pixelated areas. If you buy a template, button set or just anything web from the major suppliers such as Iconshock, you will receive a complete set with not only big objects but in several resolutions, which usually oscillate from 16 pixels to 256, covering almost every existent screen resolution.
Use bigger icons
A few years, there was an unbreakable rule that told that everything that was going for the internet had to be optimized with a 72 dpi resolution and the small size possible. Now that we’re at the gates of a new decade, all these rules are starting to seem obsolete. Mac OS X has set a maximum icon resolution of 512×512 pixels and many monitors support 300 dpi resolutions, so that thing of doing everything small and shy is over, the era of big icons and high detailed elements has began.
Step by step, most websites are changing their old 24 x 24 pixel icons for much bigger ones, this does not only affect icon’s size itself but also the amount of details that can know be incrusted within a single icon. We can expect that throughout 2011 more and more sites will insert bigger icons on their sites.
Let your pictures be the background
In the past it was considered a true genius the one that put a big image on a website as a background and that this pictures was neither pixelated or oversized. Now with the increment of DSLR cameras, megapixels and photo optimization, it’s a reality to use massive quality pictures for your backgrounds. This technique is highly appreciated by graphic designers and photographers, though we found different kinds of websites utilizing it as well.
The trick to make this work is to always shot at higher resolutions and then fix your image in Photoshop to reduce its size without losing quality, remember that everything in web has to be in RGB mode (CMYK is for printing) and cannot surpass a size of 1 Mb (unless you know that the people that are going to visit your site possess a good internet connection).
Try animated backgrounds
So using big photographs is now possible, but what if we tell you that you can go even further and place fullscreen or really big animations on your websites?. Thanks to Flash and HTML5 this is now a reality. It’s amazing how developers have managed to place incredible animations that don’t take too much broadband, making the animation possible.
These animations are part of the next era in Chicago web design, where 2D will be replaced by 3D and both hardware and applications will help in that process by adjusting to these technologies. Although this technique is still in a baby face, the applications are already great and on the next years there will be more and more sites using fully animated interfaces.
Lighter spaces will still in style this year
During the past few years, there’s been a tendency for developing heavy, over saturated websites with dark colors and bright fonts on top of them, but now that tendency is beginning to change.Along with the new wave of making everything much cleaner and minimal than before comes also a preference for lighter spaces, with pastel tones and light palettes.
By making lighter interfaces, information can be easily processed by the average viewer, because with darker backgrounds an inclination towards clutter shows up, and people spend less time on the page before switching to another one. Our advice then is for you to bright up your page during 2011.
Opt for rounded corners
During the first Internet years, the graphic programs where very basic and there was not amazing tools such as CS5 and the new CSS3, and that’s why many designers took the habit of doing everything straight, because it was much simpler to do and everyone was doing it, but now that there’s been more than 10 years since the end of the 20th century, it’s time for things to change a little bit.
One of the most common things to find was straight corners everywhere, from windows to button, everything was built with a 90 degrees corner. Now we’re seeing how many websites are beginning to incorporate rounded corners on their interfaces, which gives a smoother and nicer appearance to design, you can generate these rounded elements via Illustrator or any other graphic program or utilizing directly a language program such as CSS3.
Utilize sliders
Using sliders is a technique that does not only save a lot of space by showing many information in a single spot but also can be used as a great design element to prettify the whole aesthetic of a website design, and that can be confirmed with the fact that there’s more than one site that actually sells slider designs ready for installation.
Now we want to show you some examples of beautiful sliders that we encountered during our research, some of them used with a more chicago graphic design intention and others to provide plenty of information without using an excessive amount of space.
No more realism, place vector illustrations
If it’s true that photography will always have its place in Chicago web design, the trend for 2011 is quit using realistic illustrations and big photographs and begin implementing big vector illustrations. The reason behind this change is that this illustrations can help to set surreal sceneries and also are more lightweight than complicated designs.
So this is not an affirmation that vector illustrations are going to be the only accepted style, but that graphic design is going back to its roots and in that order of ideas, it’s time to leave aside those fancy illustrations and go with something a little bit simpler.
Footers are there for a reason
Now that 2010 is over we want to say that we were right, footers are becoming more important every day as designers realize that they’re a vital part of every design and they must be utilized with the same importance than the header.
On the past footers were used to place disclaimers, some basic company information or the contact link of the company, but now that’s changing. Footers are now areas where you can place things like social stream boxes, contact forms and tons of information.
Use boxes for diagramming
Diagramming is something implicit in Chicago graphic design and Chicago web design, so you’re probably wondering what’s the novelty of this category. Well the thing is that now many graphic and Chicago web designers are using small boxes on their websites to organize all the information instead of big columns and cluttered structures, which points to the clean look that we already talked about before.
So, during 2011, is probably that the standard web structure with a big header, a content section and finally a footer is going to be displaced by new types of grids and structures with more of these little boxes included inside of them.
Sewn badges and banners are getting popular
Once in a while graphic designers and illustrators fell in love with a little detail and begin to use it sporadically until suddenly it becomes a trend. In the past we saw the boom of glossy gradients, the connecting arrows and surreal characters; in 2011 a tendency that has been showing up for a while and that will stay during this year is the use of sewn-like elements, badges and banners in Chicago web design.
We saw many sites that are combining these elements on their designs, creating a new trend that many people are beginning to follow, so before its time is gone, you should probably take a look at these examples of really nice sewn badge and banner designs.
A few years, there was an unbreakable rule that told that everything that was going for the internet had to be optimized with a 72 dpi resolution and the small size possible. Now that we’re at the gates of a new decade, all these rules are starting to seem obsolete. Mac OS X has set a maximum icon resolution of 512×512 pixels and many monitors support 300 dpi resolutions, so that thing of doing everything small and shy is over, the era of big icons and high detailed elements has began.
Step by step, most websites are changing their old 24 x 24 pixel icons for much bigger ones, this does not only affect icon’s size itself but also the amount of details that can know be incrusted within a single icon. We can expect that throughout 2011 more and more sites will insert bigger icons on their sites.
Let your pictures be the background
In the past it was considered a true genius the one that put a big image on a website as a background and that this pictures was neither pixelated or oversized. Now with the increment of DSLR cameras, megapixels and photo optimization, it’s a reality to use massive quality pictures for your backgrounds. This technique is highly appreciated by graphic designers and photographers, though we found different kinds of websites utilizing it as well.
The trick to make this work is to always shot at higher resolutions and then fix your image in Photoshop to reduce its size without losing quality, remember that everything in web has to be in RGB mode (CMYK is for printing) and cannot surpass a size of 1 Mb (unless you know that the people that are going to visit your site possess a good internet connection).
Try animated backgrounds
So using big photographs is now possible, but what if we tell you that you can go even further and place fullscreen or really big animations on your websites?. Thanks to Flash and HTML5 this is now a reality. It’s amazing how developers have managed to place incredible animations that don’t take too much broadband, making the animation possible.
These animations are part of the next era in Chicago web design, where 2D will be replaced by 3D and both hardware and applications will help in that process by adjusting to these technologies. Although this technique is still in a baby face, the applications are already great and on the next years there will be more and more sites using fully animated interfaces.
Lighter spaces will still in style this year
During the past few years, there’s been a tendency for developing heavy, over saturated websites with dark colors and bright fonts on top of them, but now that tendency is beginning to change.Along with the new wave of making everything much cleaner and minimal than before comes also a preference for lighter spaces, with pastel tones and light palettes.
By making lighter interfaces, information can be easily processed by the average viewer, because with darker backgrounds an inclination towards clutter shows up, and people spend less time on the page before switching to another one. Our advice then is for you to bright up your page during 2011.
Opt for rounded corners
During the first Internet years, the graphic programs where very basic and there was not amazing tools such as CS5 and the new CSS3, and that’s why many designers took the habit of doing everything straight, because it was much simpler to do and everyone was doing it, but now that there’s been more than 10 years since the end of the 20th century, it’s time for things to change a little bit.
One of the most common things to find was straight corners everywhere, from windows to button, everything was built with a 90 degrees corner. Now we’re seeing how many websites are beginning to incorporate rounded corners on their interfaces, which gives a smoother and nicer appearance to design, you can generate these rounded elements via Illustrator or any other graphic program or utilizing directly a language program such as CSS3.
Utilize sliders
Using sliders is a technique that does not only save a lot of space by showing many information in a single spot but also can be used as a great design element to prettify the whole aesthetic of a website design, and that can be confirmed with the fact that there’s more than one site that actually sells slider designs ready for installation.
Now we want to show you some examples of beautiful sliders that we encountered during our research, some of them used with a more chicago graphic design intention and others to provide plenty of information without using an excessive amount of space.
No more realism, place vector illustrations
If it’s true that photography will always have its place in Chicago web design, the trend for 2011 is quit using realistic illustrations and big photographs and begin implementing big vector illustrations. The reason behind this change is that this illustrations can help to set surreal sceneries and also are more lightweight than complicated designs.
So this is not an affirmation that vector illustrations are going to be the only accepted style, but that graphic design is going back to its roots and in that order of ideas, it’s time to leave aside those fancy illustrations and go with something a little bit simpler.
Footers are there for a reason
Now that 2010 is over we want to say that we were right, footers are becoming more important every day as designers realize that they’re a vital part of every design and they must be utilized with the same importance than the header.
On the past footers were used to place disclaimers, some basic company information or the contact link of the company, but now that’s changing. Footers are now areas where you can place things like social stream boxes, contact forms and tons of information.
Use boxes for diagramming
Diagramming is something implicit in Chicago graphic design and Chicago web design, so you’re probably wondering what’s the novelty of this category. Well the thing is that now many graphic and Chicago web designers are using small boxes on their websites to organize all the information instead of big columns and cluttered structures, which points to the clean look that we already talked about before.
So, during 2011, is probably that the standard web structure with a big header, a content section and finally a footer is going to be displaced by new types of grids and structures with more of these little boxes included inside of them.
Sewn badges and banners are getting popular
Once in a while graphic designers and illustrators fell in love with a little detail and begin to use it sporadically until suddenly it becomes a trend. In the past we saw the boom of glossy gradients, the connecting arrows and surreal characters; in 2011 a tendency that has been showing up for a while and that will stay during this year is the use of sewn-like elements, badges and banners in Chicago web design.
We saw many sites that are combining these elements on their designs, creating a new trend that many people are beginning to follow, so before its time is gone, you should probably take a look at these examples of really nice sewn badge and banner designs.
--
Integraphix, a Chicago Web Design Company
No comments:
Post a Comment