Not a member? Why not join us or log in? (No more hassle filling in comments, less obtrusive ads and asides.)

Beautiful sites with no (or very few) images

Posted by Andrew Faulkner on October 25th, 2007.

Andrew Faulkner is the admin at fadtastic. Andrew prides himself on standards-based, accessible web design in the city of Nottingham, UK. He believes in aesthetically pleasing accessible design and that 'standards compliant does not equal boring.'

http://fadtastic.net/

Andrew Faulkner has posted 211 articles.

RSS Feed for fadtastic.net RSS Feed for Andrew Faulkner

Full Profile →

Catchy title, I know.

In stark contrast to my last post about intricate backgrounds, I’ve decided to examine (by example) the characteristics of sites that are aesthetically pleasing even though no (OK - maybe one or two) images have been used. In essence, this could also be a testament to CSS and the talented folk who use it to its full potential. Or a look into how character is injected into a deign without imagery.

Beautiful? Hardly any images? Show me…

Not convinced a design can be creative and brilliant despite the lack of imagery? Feast your eyes on the following sites and maybe my reasoning can persuade you otherwise.

Website Thumbnail

Andy Rutledge’s masterpiece, as far as I can tell, only uses the one image across the entire site. But before we dwell on his logo let’s examine the other features. Andy mixes white-space, typography and a simple grid to produce an uncluttered site that begs to be read. The serif-type suggests “sensible intellect” whilst the pull-quotes and exciting orange represent a creative flair in Andy’s personality. The structure is simple and uncluttered, suggesting a solid character. Going back to his logo for a second, the split font usage suggests the two sides of Andy - creative and solid.

Website Thumbnail

Just a few tiny images scattered around. Not in the least bit boring though in my view. On the contrary in fact. Sections are crisp, headers are ‘big and bold’ and the black-on-white approach seems less subtle than the aforementioned Andy Rutledge site. I believe that Rik’s site aims to stand out, but not through use of imagery. Whilst Andy’s site is elegant and subtle, Rik’s is bolder and sharper.

Website Thumbnail

Sparse imagery including a logo, a drop-shadow and a smattering of icons just about lets this one slip into this category. This Georgia-heavy site brings outstanding typography to the party. The tight grid layout and clever uses of white-space make it a pleasure to read. The fact that it is in a language I cannot fully understand and still makes me want to scan the page is a testament to Peter’s type-setting skills.

Website Thumbnail

John Gruber’s home is a powerhouse in the world of design. Such a wide audience, but few pictures. What keeps people coming back (aside from John’s great content of course) then? Maybe the fact that the simple, but by no means unskilled, layout means one cannot really get lost on his site. A neutral colour scheme allows for reading in comfort, rather than trying to read without getting distracted. A few nice typographical touches, like the asterisks for the permalinks, inject more character.

Website Thumbnail

Bold and vibrant are words which come to mind when seeing this site for the first time. It’s stylish, and the grid layout for the portfolio is fairly unique in the fact that no images are used on the homepage - simply title and a description. Solid hover states add a funky, trendy feel to the site but don’t go over the top and become brash.

Conclusion: What sets these sites apart?

Typography. One could argue that the examples above have almost perfect type-setting, with careful attention given to font sizes, line-heights and whitespace. This sets them apart from other sites with few images.

Images. When an image is used, it’s necessary. It feels ‘right’, not just for eye candy’s sake. Images have purpose.

Content. The text stands out. It urges you to read it. It looks elegant and the clean structure of the page allows you to read in comfort.

Colour. Colour has a meaning in these sites, whether it be for emphasis or for a link perhaps. It always has a purpose and is not splashed on for the sake of it.

Over to you…

As usual, I welcome your views and examples. Fling a comment our way below…

Make A Comment

( 34 so far )

blockquote and a tags work here.

34 Responses to Beautiful sites with no (or very few) images

Comments RSS Feed

Whitespace is the key. 

Johan
October 28th, 2007
#

Not that well-designed, image-heavy sites, but I like a site that focuses on text design and clarity. I enjoy reading well-sized text on a light background without extra imagery to distract my eyes. It can also be easier to create a heirarchy of importance for various text items when they don’t have to compete against a flash header image or an ornate navigation. Additionaly, when images <em>are</em> used, they tend to have more of an impact, as the article points out. Great article Andrew!

Ted Goas
October 29th, 2007
#

consistency between pages is also important. every page should be easier to the eyes and mind.

TechMalaya
October 29th, 2007
#

<a href="http://leenutter.com/">LeeNutter.com</a> has less images than all of those sites! :)

Lee
October 29th, 2007
#

The site "rikcatindustries.com" looks a hell of a lot like, grid-focus from "5thirtyone.com" with the images and stuff removed… wat yous think 

Anto
October 29th, 2007
#

http://garrettdimon.com/ falls into this category

Steve
October 29th, 2007
#

[…] mostrar que um bom layout não depende, necessariamente, de belas imagens. O Fadtastic montou uma galeria de sites que utilizam nenhuma ou muito poucas imagens. Vale a pena conferir, nem que seja para ver o que é […]

Imagem não é nada | design
October 29th, 2007
#

the our site also don’t have much image…

Jonas Rafael
October 29th, 2007
#

my site has only images for form fields and voting. the rest is straight up text

paul
October 30th, 2007
#

elegant and beautiful:)here’s my own site as an example. was inspired by partly by subtraction.com

henry
October 30th, 2007
#

Hey they look good. Just goes to show that you do not need to overload with text to make it nice :D I have also just finished redesigning my website which has only three images (not inc sifr and amazon)http://germworks.net/blogThanks 

Jermayn Parker
October 30th, 2007
#

Astoundingly beautiful grids, painful attention to typography and amazing amounts of will power to polish it all off. It all comes down to how much effort you put in to make your site, sans the images, send just as powerful a message as those who do.  

Steven Teskey
October 30th, 2007
#

I see we’re on the same level as always Andrew. I love those sites, also check out this one here: http://sitening.com/ Stumbled it. 

Tadeusz Szewczyk/Tad Chef
October 30th, 2007
#

Less is More…

Matt Davies
October 30th, 2007
#

Nice selection, but I already know all of them :-/

Filosof
October 30th, 2007
#

Peter Rozek’s site is basically a direct theft of Mark Boulton Design’s amazing site.

Marcus Hodges
October 30th, 2007
#

Marcus,

They do look awfully similar. The code is not that similar though. Maybe just inspiration and not a direct theft?

I agree, Mark’s site is fantastic and should have been on the list. One for next time. 

Andrew Faulkner
October 30th, 2007
#

[…] “13 Simple Steps” in web site optimization and Andrew Faulkner’s “Beautiful Sites with no (or very few) Images“, I got my inspiration for my next blog design. In addition to this, my comments has been […]

[…] Beautiful sites with no (or very few) images […]

[…] Beautiful sites with no (or very few) images […]

[…] (con CSS se logra), también lo es no limitarse y conformarse con lograr sitio usables al extremo y usar texto plano siempre. Pienso que un diseñador conformista es un diseñador estancado. Si una web lo requiere podemos […]

[…] 15th, 2007 Hace unas semanas en Fadtastic escribieron un artículo bastante interesante “Beautiful sites with no (or very few) images“. En el examina algunas páginas que carecen de imágenes y aún así son atractivos […]

[…] lokakuussa näyttäviä websivustoja visuaalisen suunnittelun kahdesta ääripäästä. Artikkeli Beautiful Sites With No (or Very Few) Images käsittelee minimalistisia, liki yksinomaan typografiaan perustuvia sivustoja, Big, Bold Background […]

–these are beautiful sites…and have inspired me to rethink a few of the sites i administer.

gp
December 21st, 2007
#

[…] (if you’re interested in web design at all read this post) […]

Rik Catlow’s makes brilliant use of whitespace..

Adaptiv Media
February 2nd, 2008
#

I was just looking using stumbleupon and came across cssmania.com. I know there are a lot of these sites. It just occured to me that they’re all sites for graphic design not beautiful css design.  I realize they are kind of offshoots of css zen garden, but I think people realize you can make sturdy sites with css without using tables now. Anyway this was what I wrote on the stumbleupon review page after looking at it.I love CSS but a lot of these css beauty sites really wouldn’t be what they are without all the great graphic design on the sites. Challange: show me some awesome css with no images. Fact is if it said "Table design beauty" people would be amazed that someone made an awesome design still because of how great the site looks from the graphics. (ps i came across this article by googling "beautiful css design with no images" and yours was the 5th down.)   

Faith
February 14th, 2008
#

I’ glad to see an article like this, simple, straight-forward sites can easily be as aesthetically pleasing as those weighed down with pictures.. More so in some cases. Its a common mistake for people to design sites that look almost kitchy due to over enthusiastic use of images

Shane: content writer
March 3rd, 2008
#

Where can I find similar articles, but written in a different style?

Kredit
May 28th, 2008
#

Hello!,

name
September 1st, 2008
#

I have read this somewhere, but that one was written in a different style.


September 28th, 2008
#

Любопытно. Чувствуется позитив :)

Олег Лебедев
May 24th, 2009
#

[…] Beautiful Sites With No (Or Very Few) Images […]

Òîêàðíûå, ñâåðëèëüíûå, øëèôîâàëüíûå è çàòî÷íûå ñòàíêèü…

Îñîáåííîñòè òîêàðíûõ ñòàíêîâ ñ ×ÏÓ…

↑ Jump up to the comment form

Related In Some Way, Shape Or Form

The above post has obviously kept you amused. Why not discover similar material:

The posts 38 Beautiful WebsitesBig, Bold BackgroundsDesigning with Food GroupsOn Showcases/Galleries ~ Niche is niceIs Less Really More?, are related to this post.

Or why not take time out to find out about the author of the post.