Trends: the new retrò web design and the “CSS3 style”
On the web the CSS3 and the HTML5 mania go crazy and this is nothing new. Web designers from around the world indulge themselves with animations –of doubtful utility but, we have to admit, certainly creative- they experiment shades and curves and go wild mixing almost unconsciously dozens of fonts inside the same project (hooray for the font-face!).
Removed the premise: I’m sure that some of you have noticed that the boom of CSS3 potentialities created a new and curious trend for what concerns the web graphics: this is a slightly retro style- that seems a bit a paradox -, with a particular attention to the effects on the text and it’s characterized by many elements that in a short time have become a must.
In short , a new trend of 2011. Let’s see some particularities.
Light colors and pastels
This graphic style is definitely a goodbye to bright colors and lively features, among the other things, of the web 2.0 style. Radial gradients and spotlights leave the place to opaque shades, dull and with no contrasts.
The colors mostly used are without doubts, grey, beige and light blue, in delicate shades and free of visual excesses. Red becomes a salmon pink or at limit, a light brown. Emerald green leaves the place to an olive green, cyan to a light blue and so on. Even the call-to-action, that should represent the focal point of the whole layout, is adapted to the setting and loses brilliance.
Round logos
Another common feature to this style? The presence of logos from spherical shapes or chiseled edge, “as star”. It’s not a case that the circular shape was the first form of logos (of the fifties), that followed the postmark style.
Texture
The element that mostly approaches this new trend at the vintage style is certainly the massive use of texture, preferably with effects or chromatic shades that recall paper.
Regular and geometric fonts
Despite CSS3 open wide possibilities for what concerns the choice of the fonts, it seems like the major part of the layout designed in accordance with this trend choose stubbornly – for titles and taglines- the same type of font, elongated and regular shapes, almost geometrics.
Shaded text
Here it is, at last, the pride of this “CSS3 style”: the shading of the text that gives to the textual contents such a deepness that it seems built in the background (inner shade) or brighter (outer white shade).
This last point I would like to investigate better, starting from a question, probably a bit provocative:
aren’t we exaggerating?
Isn’t it that being too excited by the novelty we’re forgetting the basic rules of usability and we’re mangling the typography of the sites we’re designing?
It’s not a case that I’m asking myself these questions, but after seeing gallery sites like these:
Fig 18 – Text with shadow: impossible to read it
Fig 21 – Text with shadow: it is very hard to read.
Fig 22 – Wrong contrast of colors
One single rule: do not abuse
This is nota n article against the CSS3 effects (and the new graphic style that goes with it) but it’s a simple consideration on certain facts. And at the same time, an exhortation: always avoid the abuse of whatever trend or style.
The CSS3 effects, if used in small doses and in a creative way can give an original touch to your layout.
On the other hand the same effects can express a lack of professionalism and poor aesthetic sense if abused or used in a wrong way.
I noticed that on several blogs, Italian and non, some CSS3 properties are emphasized that personally leave me doubtful: text with 3d effects, metallic shades, outer glow, flashing buttons… effects that dangerously remind me the photoshoppiane trends dated 1999.
And I suddenly wonder: but how, it took us ten years to get rid of them and now they’re back in fashion?
To you the judgment.
*****************************************
L'immagine principale dell'articolo è stata fornita da @Fotolia
The Author
Related Posts
You may be interested in the following articles:
8 comments
Trackback e pingback
-
Tweets that mention Trends: the new retrò web design and the “CSS3 style” | Your Inspiration Web -- Topsy.com
[...] This post was mentioned on Twitter by Web RSS News, soshableweb. soshableweb said: Trends: the new retrò web design ... -
Tweets that mention Tendencias en webdesign: retrostyle + css3 #webdesin -- Topsy.com
[...] This post was mentioned on Twitter by Maria_Lc, Joel Espinoza. Joel Espinoza said: Tendencias en webdesign: retrostyle + css3 ... -
Trends: the new retrò web design and the “CSS3 style” | WebDevKungfu
[...] Trends: the New Retrò Web Design and the “CSS3 style” [...] -
Links interesantes que vale la pena tener | Descargar Programas Gratis
[...] ser suficiente para conseguir de la mejor manera la organización de contenido de las páginas. Trends: the new ... -
CSS3 Tutorials and Resources - WebsitesMadeRight.com
[...] Trends: the new retrò web design and the “CSS3 style” (Your Inspiration Web | Nov 3, 2010) [...]
Nice colection mate,
Thanks for sharing
Regards
Ned
A while ago I made myself an Infographic CV in a retro style – mostly because I find that it fits my personality.
And lately noticed this trend in webdesign also – even more for the last couple of months. It seems like they pop up everywhere by now.
To me, the retro style is beautiful, definatly, but also – as with the web 2.0 – everything within limits.
Theres a fine line between originality and just following yet another trend and I find it important not just to follow along, but to develop your own translation of that trend and develop it even further – thus maybe creating something new.
For that reason I’m in the process of creating a new website for myself – NOT in a retro style as could be expected from the style of my CV (allthough that WAS the plan at the time), but rather in a completely different direction, and not a style found on every 4.th or 5.th website.
)
(My new site won’t be ready for another couple of weeks, so no need to peek, it’s the 3 year old website that still resides there, much have happened since then
The reason for this change of mind/style is that I want to keep my originality and even if the idea for the retro website was there a long time ago, before it became a “trend” as described above, I have now abandoned it … because everyone else are making them these days.
And I’d like to keep some originality somewhere
That said – trends do have a tendency to come back after a while of exile…
It goes that way with the fashion industry, so why should it be so different in webdesign?
Nothing wrong with creating beatiful retro inspired websites – and I do love to look at them, allthough the wow-factor has worn off for me – just keep in mind to use the effects so they complement the site and especially the message of the site, in a way that allows you as a designer to retain your individual style, as well as not overdoing things. That usually gets the message of the site trough better, than the over-plastering tendency that also terrorised the web of the nineties.
What will a beautyfully crafted retro inspired site full of bells and whistles help your client, if it dosn’t fit the message?
I really do love the new possibilities of say CSS3 and HTML5. But I also belive that form follows function – or translated to webdesign:
Use the effecs where they’re appropiate and in an appropiate manner – And not just for the sake of using them.
Just my 2 cents
Good artical, totally agree. I hope that with time when the whole “newness” dies down so will the excitment to fill the page with every possible feature.
Just also wanted to say, you FIG 21 images. It looks as if the fonts are hard to read due to poor browser rendering of the chosen font. Not text shadow. That is an error on the designers part still for not testing their chosen font for performance and legibility in various browsers.