How to Spot Quality within Web Design: Examples & Tips

Some great examples and tips on what makes a quality web or blog design

Quality is a word that a lot of people like to use when describing their web design services. But what is quality, how do you know if a design is quality or not. Well, I think that there’s quite a few ways to spot quality within web designs. Once you can see just what goes into making a quality web design, you can use the techniques to perfect your own style.

I’ve put together a few pointers, and collected some examples to explain just how I look for quality within a website design.

01. Spacing

One of the main things that I look for within a good website design is clever use of spacing with design elements. Paying close attention to how certain things are spaced out and lined up can really make a difference to the overall appearance and sense of quality of your design.

I think the key to getting your spacing right is to look at all of the elements within your design. Looking at the bigger picture really can help you get a good idea of how best to space your elements. Sometimes zooming out and taking a different look at your designs can be a great help.

Examples of Excellent Spacing

Great Spacing on the Good.is Website

As you can see here, there is a very clean and open feel to the content here. This is completely down to the designer allowing a good amount of space around the text & images.

s

A very well spaced out Digital Mash Website

Having well spaced out elements can make them a lot more attractive, and a lot more clickable. Digital Mash is a great example of a very welcoming website.

Creatica Daily has heaps of space

Again the great use of spacing here really helps let the content speak for itself. There isn’t a lot of content in each post, but they’ve not been afraid to give the content a lot of space. Just because you only have a few lines of text, doesn’t mean it can’t use a lot of space.

Lots of Space on the Postbox Site

Taking a close look at the Postbox website, you can really see how space there is around the edges. There’s actually a 60px padding here. It sounds like quite a lot, but when you see it in action it looks great.

Getting Spacing Wrong

The main mistake people make when it comes to spacing is having their content too close to the edges. No matter how well you’ve styled your content, if you cram too much in, it loses a lot of it’s style and quality.

Example of not using enough spacing

We showed in the previous section how good the spacing was on the PostBox website, but we’ve made the  mock-up below to show how it would look with less spacing. And you can see just how much bad spacing can effect your design. It takes a lot away from the design and certainly removes the quality feel from it.

Tips on Effective Spacing

Deciding on how much spacing to use is something which will vary from time to time, you really need to train your eye to allow for the correct amount of spacing for each element, and use it effectively to fit the design. It’s touch but something you can pick up with practice.

Design using a grid system
Using a grid certainly helps you to understand the importance of spacing

Try & Try again
You can always use a method of trial and error until you find what looks right.

White Space isn’t a wasted space
Just because you have an empty area, it doesn’t mean you have to fill it.

Less really is More
Rather than trying to fit more in an area, fit less, give it space and keep just the vital important information.

02. Pixel Perfect Detail

You can really tell when someone has put real effort into the finish of a web design. Sometimes it’s the subtle things that really make a difference, and a lot of people might not even notice. What I mean when I talk about Pixel Perfect Detail is the method of paying close attention to lines, edges and borders. Rather than just have a simple line, sometimes adding some small details, whether it be subtle gradients, or something as a simple 1px shadow or highlight can really make your work stand out. Some designers of note that are really good at this are: Collis Ta’eedDavid Leggett and Wolfgang Bartelme.

Examples of Pixel Perfect Details

A close look at the detail on Envato

If you look in the examples I’ve cut out, you can see in Example 1, how the green bar has a 1 pixel lighter green line on the border. Example 2 uses a soft gradient shadow on the inside of the box and leaves a 1px clear white border at the top. Clever, using a shadow to give the impression of a highlight above it. The green area behind has a very soft subtle shadow which helps draw attention to the clean and crisp detail within the white box below. Although it doesn’t seem like much these thing really do help to make everything look that little bit more polished, they give a sense of 3D and realism, almost like the elements are placed onto the page, rather than just a flat and static layout.

The Details on Tutorial9.net

David Leggett has a great understanding of how to really make pixel’s pop. His recent redesign of tutorial9 is a great mix of so many pixel popping techniques. In Example 1 you can see how he’s made the tabs look that little bit slicker by adding a simple 1px highlight to the top. Example 2 see’s a variety of techniques. A Drop shadow on the camera icon, a shadow highlight on the white area, and a 1px highlight on the top of the navigation bar.

Pixel Perfect Buttons & Separators on RedBrick Health

This beautiful navigation, created by Ryan Scherf is another great example of using pixel perfect details to get that feel of quality in your design. The pink button has a 1px highlight, and the separating lines between the links have the same level of quality and detail, as you can see rather than just having a gray line separation, Ryan has included a 1 pixel highlight below it to prevent it looking flat and 2 dimensional.

Pixel Perfection Applies to Grunge too: AvalonStar

Here we have the beautiful AvalonStar: Distortion blog, which uses a great grunge style. But even with a dirty & grungy design using a 1px highlight can still make a big difference. If you look at Example 1 you can see how a shadow gradient has been used on the brown top area, the green box which lies below it has a 1px highlight at the top. The combination of the shadow above and the 1 pixel highlight really make the boxes look that little bit more polished.

Quick tips for Perfect Details

Practice makes perfect in this case, as you can see from the examples something as simple as a 1px highlight line can add some really cool depth to your designs, you don’t need to rely on really over the top bevels and gradients to give the impression of something with a bit of depth.

Keep it Subtle
Small details that compliment the content are the key.

Think in Pixels
Borders, gradients, lines and shadows etc don’t have to be huge to be effective.

Before & After
Compare your results to how they looked before you applied the effects. Then you can see just how effective they are.

03. Well thought out Typography

Although the actual content of the website won’t be written by the designer, they play just as important role in the overall quality of the content. Their role is to make sure that the content is displayed in a way that is easy to follow and read through. There are many ways that you can ensure your type is readable and usable, and while I’m not going to list a set of rules and regulations on what, and what not to do, I will give you some examples of where clever typography really does make a difference.

Examples of Well Thought out Typography

Big & Beautiful on The Netsetter

Titles are important within web design, especially when you are designing for a blog. A recent trend in web design is to use big & bold fonts for titles. This works in a number of positive ways, not only does it tick all the right boxes from a usability point of view, but it helps to create space and define structure within a design. This example from Netsetter is a great illustration of these points, you can see how the title creates a lot of white space around it, and naturally it’s very easy to read.

Leading & Spacing with your Text

The Viget website really is a beautiful example of how important typography is within web design. The example we see below (taken from their portfolio showcase) shows once again how using a larger sized font helps to create and open space. Even with the thin, crisp font they have used you can see just how much space has been created in that area. The actual typeface itself is very slick, and is a great choice of font. The other thing that stands out here is their attention to detail with the line height (Leading), the spacing between each line of text has been increased from the default value to create a lot more space and make the text much more readable. A trick which you could try in your next design.

Web Design Ledger, Fonts to Fit your Mood

Finding the perfect font can be done through trial and error, or you can make your choices based upon the different moods certain fonts help bring to a design. The example here, Web Design Ledger, has a retro and worn look to it, while still having a very open and modern feel to it, so choosing fonts that help evoke a similar moods to these is essential to it’s success. Henry Jones (the designer) has chosen a popular transitional serif typeface: Georgia for the titles which compliment the retro & worn aspects of the design very well. The modern feel to the website comes from using a very different font to the titles, the main content body is written in Helvetica, a sans-serif typeface with a very rounded, open feel to it. The two choices of typeface in this example are very clever and really help to compliment and set the mood of the design.

Quick check list for Typography in Web Design

Spotting good typography within web design becomes a little easier when you’ve seen some great examples of typography (above) But when exactly is it that makes these examples so good, and what should you be looking out for when you come to design your next website?

Is it Readable?
Don’t be scared of making your titles big and bold.

Have you thought about spacing?
Spacing can vastly improve readability.

Do your fonts fit the mood?
Make sure your fonts compliment the design.

There are probably a thousand more tips out there, but I don’t consider myself an expert in this area, I think I’ve just learnt to appreciate the impact of good typography. If you want to learn more about the things to look out for and see some better examples i strongly suggest you check out this post from Smashing Magazine.

04. Organization of Elements

Being a designer appeals to many because of it’s creative nature, and sure it can be a lot of fun. Now I know that Organizing doesn’t sound at all creative or fun, but once you get into a habit of good organization it doesn’t have to be as dull as it sounds. The way you organize the elements in a website is always going to be different, it depends on what type of site it is, and how important certain features are to the content of that website.

Although there’s always a variation in how and where you place things, there are some things you can do to make organizing your content very easy. The first thing you need to do is decide what you want your design to achieve. For example, are you designing to sell a product, are you designing for content, or are you designing for signups & referrals etc.

Designing to Sell: 37Signals

Taking a look at the massively popular 37 signals website it’s easy to see that it’s no coincidence they are selling their products so well. They’ve made it as easy as possible for you to see what’s for sale and help you to make the final decision to buy. Everything you want from a site designed to sell.

In the Example image you can see that the site has 4 key features that make it ideal to encourage you to buy. Attention is the first thing, they’ve made a very dark box with a quick summary & big bold titles. Next they generate your Interest by listing some benefits of each product with a lovely illustration. Desire is the next point, and this is archived by placing quotes & testimonials, and as in this point some videos of “What our Customers have to say.” The final feature to keep in mind is Action; on 37Signals there are various action points throughout the page, also nice to see that as the page is quite long they even have some action points in the footer.


Designing for Content (Blog): Well Medicated

When you’re designing for a blog it’s a completely different story. You don’t need to spend time convincing and re-assuring your users about your product, your “product” is already on display, your content is your product. Make it easy for your users to see your posts, explore them and connect with you & your blog.

Content should be (one of) the first thing(s) you see on a blog. In this example a nice bold pink title font really draws your eyes straight to the content. There’s a good sized preview image and a good 2/3 paragraphs of text followed by a “Continue Reading” link. There’s also the standard date & author information. For me this is one of the most perfect examples of what I would class as quality “Content Design.” Attention can be directed to anything of interest, here the nice big subscribe icons are the focus and help the users to stay connected with your content. Plus it without doubt will increase the amount of subscribers, so it works on two levels. Encouraging your users to Explore is quite simple, you can use anything from tabbed recent or popular content in the sidebar, to drop down menu’s or simple & effective lists. It’s easy to do, but very effective, especially on a blog. Blogs tend to be very personal things, so allowing your visitors to Connect with you in a variety of ways can be a big plus, and can help encourage people to get to know you, and visit

Tips to Help with Organizing your content.

Of course there’s always times where you’ll need to do things differently and break the norm. But there are some simple tips you can follow to keeping a well structured and well ordered design.

What are you designing for?
As we’ve shown above, decide the goal of your design

Design using a Grid
Grids allow you to make the most of your space.

Test the Placement of Elements
Be the visitor, would you be able to use it.

Remove any unnecessary Elements
Anything that isn’t essential should be removed, or out of the way

Balance of Attention
Some things need to stay simple to allow others to shine

05. Restraint & Subtlety

Designers are always looking for ways to make an impact with a unique design or special effect within a design. But sometimes you can make a bigger impact by restraining yourself. There comes a point where something crosses from being good to being too much. A good designer can spot when the line has been crossed, and avoid putting too much into a design or special effect.

Examples of Subtle Effects within Web Design

Soft Gradients on “Things” Website

I’m always on the look out for subtle effects on all the websites I visit. Sort of sad maybe, but I can’t help but pick out all the little details for future inspiration. Gradients are often over used and really in your face, but used correctly gradients can add a element of reality and depth to a design. Most people might not even spot the gradients, and those for me are the best ones.

Drop Shadows on Icon Dock

Icon Dock is a smorgasbord of subtlety. Pixel highlights, gradients and drop shadows. But for the sake of this example we will focus on the drop shadow, it’s not very big, and it’s opacity has been reduced to just put the highlight on the content box and bring it forward very slightly. It’s a beautiful example.

Quality in Web Design - Subtlety, Soft Gradients: Icon Dock

Subtle Background Textures; Scouting for Girls

Having a textured background can make or break your design. A lot of times the background becomes too much of a distraction that it actually takes away from the quality of the design. So it’s often a good idea to keep your background textures subtle and soft. The Scouting for Girls website does a great job of using a texture to compliment the overall style & quality of the design.

A hint of Wear & Tear: Viget Advance

I don’t think you can ever be too subtle, any amount of detail no matter how subtle will be noticeable, and whether people are aware of it or not it does have an impact. This example from the Viget Advance blog shows some hints of wear & tear, just a very small amount of wear, but without it the paper would look flat and dull. It’s the small imperfections that make it more believable and real.

Watercolours on WebDesignerWall

When using watercolours it’s always nice to make sure you mix the colours and keep the colours very soft, faded, and well… Watery. Using watercolours can benefit your design in many ways, it allows you to inject some subtle colours and bring in some texture, which is why it’s become quite a popular choice for many designers to include.

Subtle Floral Elements; Dara’s Garden

This is a brilliant example of subtle floral detail within a design. There are some more vivid floral illustrations that are also quite stunning, but in this example we are focusing on the lighter & softer details in the background. This really shows the importance of subtlety, the soft colour and worn look to the pattern means that your eye is aware of the detail, but it isn’t the main focus.

Tips for Subtlety in your Design

For me, subtle details in a design can really push a design from being good, to being amazing. If you’re looking for a way to inject something special into your design, subtle details really are the way to go. Here are some tips to keep in mind when including subtle details in your design.

Build up your layers
Never just use one brush or texture, build your details up.

Experiment with opacity & Colour
Sometimes even 3% opacity can have a positive impact.

Don’t worry, Be Brave
Done be afraid to be too subtle, or too faded.

06. Using Colour to it’s Full Potential

People often judge colours on their personal taste, which is a huge mistake. If you’re ever in a situation where you need to decide upon what colours look good in a design your mind should always be on the brand, and building a theme and mood using a colour scheme.

Brilliant uses of Colour In Web Design

Real Estate can be Real Colourful: Oypro

The thing I like about the Oypro website is that it proves that a “boring” subject doesn’t have to have a boring design. All too often corporate sites have a reluctance to allow designers to really put across some creative flair in their designs. There seems to be a need to keep things simple, flat, and gray. But this design proves that you can still have a corporate looking website, without the need to hold back.

Keeping your Colours Relevant: Tennessee Summertime

Summertime in Tennessee is a vibrant, bright and very warm website. Everything you’d want to associate with a site that is promoting summer activities. There are a lot of different colours in play here, but all of them are relevant. Good quality designs have a colour scheme that is relevant to the service or product that they are designing for. Sometimes it’s the obvious colour choices that make for the better design, a good example of my point is Hell Design - it wouldn’t make sense being any colour than a firey red.

Variety in your Backgrounds: Saturized Studio

It’s not enough just to have colour in your background and expect that to make it interesting. Some of the best backgrounds are those that have a bit of variety, in this example we see that the beautiful orange/red colour is subject to all sorts of lighting effects and gradients. It gives an extra something to the background, and prevents it from looking stale and flat. Important to note here too that the contrast between the dark & deep orange works really nice set behind the much lighter content area.

Tips for using colour in design

Colour is always a good area for exploration and trying different possibilities and variations, but it’s always important to keep a few things in mind when choosing colours and a colour scheme.

Experiment
A boring topic doesn’t have to have a boring colour scheme.

Variety
Try using gradients, patterns, brushes on your colourful backgrounds. Colour alone doesn’t make something look good.

Stick to a Theme
Make sure your colours are relevant to your product/service.

07. Doing something Nobody else has done

Some of the best websites around are those that are out of the ordinary, strange and somewhat bizzare. But those that challenge the norm may end up changing what the norm is. But being truly original and creating something nobody else has done before is the toughest thing to do in design.

You could end up making something of amazing brilliance, or you could end up with a design that’s worthy of nothing but criticism. It’s a very thin line between success and failure; I mean there are reasons something’s never been done before, and it’s usually because it’s a shit idea. You’ve got to be brave to step away from what people know and love, and here are a few examples of that point:

Unique Navigation on MB Dragan

Not exactly your average site navigation, but would the website look as good if it just had a standard navigation. I’d say it was a bit of a risk having the navigation in such an unusual way, but it does fit in with the site, it is relevant, and it’s done to such a standard that it’s hard not to appreciate how well it works with the overall design.

Visualbox & their very Visual Navigation

Visualbox have one goal in mind, showing you their brilliant work. So they’ve got very little text, on first look all you see is their Name and a selection of their work. The preview box changes when you hover over it to reveal details of that project, so it’s actually a very effective and functional solution, and much more appealing then just having a list of links.

Straight to the point with Nikola Mircic

So you’re a interface designer, you want people to see your work, and hire you. Nikola Mircic shows us how getting straight to it makes for a really impressive site. You are greeted with a wide variety of his work, his name & what he does at the top, and a contact link. There’s no mass of text or fancy words to convince you to use his services, he literally lets his work talk for itself. Of course you can click on the images to see more & get some text, but the layout if very unique and I love how it works.

Tips for trying something new

The examples above are not meant to be “inspiration” for unique ideas, just simply a couple of sites that I found that I’d deem to be quite unique. The fact is you can’t really search around for inspiration on new ideas, as it kind of spoils the point of it. So really you can just ignore this whole section if you are trying to think up something new!

Keep it Relevant
If you’re going to do something very new and unique, ask yourself “does it make sense” and “does it fit with the branding?” if so then go do it!

Ignore everything you know!
Okay maybe not everything, basic principles may stay the same, but there’s no point looking for inspiration on new ideas, you’ll just be heading in the wrong direction.

Keep a level of quality
I think generally if your new idea looks good, and works well it’s much easier for you to justify.

What Do you look for in a Quality Design?

There are so many things that can make a design stand out as quality, I’d say I’ve just covered a few of the base points. So I’d love to see your ideas and thoughts about what you look for when you decide whether a design is good or not.

Written by liam on April 13, 2009

Tags: , , ,

Share This:

506 Comments

  • Dave said:

    Great Post, thanks… :-)
    My latest post: Billy Cobham: Extended Works

  • Benn said:

    Great article, except for mentioning Visualbox. Mystery meat navigation is horrible, and this is just a really good looking version of it.

    It may look ‘nice’, but it functions terribly, and compared with the rest of your tips they do not alter the functionality.

  • Matin said:

    Great Post :X

  • Bim said:

    Great post!

  • How to Spot Quality within Web Design: Examples & Tips | vitali software said:

    [...] Source: Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a…. [...]

  • Han said:

    I love the examples in this post. Thank you!

  • samin said:

    Great and very relevant list for any designer.

    One thing tho - the example #3 about typographic details and Netsetter screencap does show a nice & friendly header but also in this case, a typographic orphan which is a minor mistake by itself.

  • Tim Wright said:

    Great list, thanks for the examples!

    My latest post: Form Security with Autocomplete

  • Karmen said:

    Great article, thanks. It’s always nice to to see good practice.

    I’d like to share with you this unique blog design: http://blog.fritula.hr/index.php

  • kyle steed said:

    Killer post man. What a great resource.

    There is such an abundance of information here that will help me as I gear up for a redesign on my site.

    Thanks.

  • Santiago said:

    Really Great post!

    Some sites maybe have 2 or 3 years, but reaaly is nice list!

  • Scott S. said:

    This is one of the best blog posts that I’ve possibly ever read. It’s like a well-written paper. Your topic is relevant, you’ve broken the topics down logically, given specific examples of both good and bad. … Extremely informative and motivating post. I’ll be taking another look at my own site, http://www.type81.com, based on what you’ve written.

    Great work. Thanks.

    My latest post: Benefits of Managed Web Hosting

  • Mario Lat said:

    That was a very informative write up. Thank you very much for sharing them with us.

  • Matt said:

    Amazing post, love it!

  • Todd said:

    Great post! These are important things to keep in mind, it’s often easy to forget about the simple things when you get consumed by a project.

  • Marko said:

    Great article. You said it almost all :)
    My latest post: Pro Design

  • idale said:

    Wow, what a nice post - thanks for the great times and examples!

    My latest post: The Worlds Biggest Yacht, Really this time!

  • myows said:

    This is the best article I’ve read in ages.

    I love the time you’ve spent writing it and finding pictures to illustrate your points.

    I’ve recommended to all my designer friends to have a look at it.

    I think one of the most crucial points to a quality design is when it doesn’t look like anything else out there… nowdays it’s too easy to get a free template and customize it, so i am truly impressed when a website is so original it looks nothing like what is out there. ( the new obox-design.com website recently did that on me )

  • popurls.com // popular today said:

    popurls.com // popular today…

    story has entered the popular today section on popurls.com…

  • Sascha said:

    Really nice arcticle! A lot of truth in here ;)
    My latest post: Naked Day am 9. April

  • How to Spot Quality within Web Design: Examples & Tips said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • AdrianMG said:

    AWESOME POST. GREAT JOB!

  • pab said:

    excellent read. thanks for posting this

  • Gavin said:

    One of the best blog posts I’ve read in a long time.

    Awesome.

    Gavin

  • Ryan Scherf said:

    Indeed a great blog post (and not because one of my sites was listed here). The attention to detail just for this post is just as impressive as all of the sites detail above. Great work, and a brilliant read.

  • Matthew Heidenreich said:

    great post! Very useful.

    My latest post: Watercolored Design Studio Blog Layout

  • Alex said:

    It’s usually the little things that get unnoticed. If those little things aren’t put just right, the whole site will have an odd feeling to it.

  • tableaux’ blog » links on the way said:

    [...] kwalitatief webdesign - voorbeelden en tips (aanrader) 100 websites - recommended by ted [...]

  • Frederik Van Zande said:

    Typography is the art of making text more readable & understandable.

    Headline readability drops enormous (+60%) if it the headline takes more then 1 line.

    So the 2-line headline examples you describe as “excellent” actually are examples of bad typography.
    They show the font in detail, because of their huge font-size, which makes them beautiful. But the font-size makes them span over two lines, which drops their readability significantly = bad typography.

    Never let the looks of something get more important then the goals. (readability vs looking good).

    on a bright side, I really dig your example presentations.

  • Navdeep said:

    Beautiful post!

    @3drockz

  • liam said:

    @Frederik Van Zande - While I don’t doubt that the logic behind your post is true, and where possible I’m sure we’d all like to keep our titles down to one line. But the fact is it’s not always possible, especially with blogs. So as valid as your point is, I think it’s an unavoidable necessity to allow more than one line in your design.

    Thanks for the brilliant comments though (everyone)

  • Grant said:

    This was a really well done article.

    I’d like to add one more thing. One of my biggest pet peeves is bad line breaks in paragraphs on the web. Just like in print you can control where line breaks happen. But most web designers choose to flow in the copy and never go back to see how it flows viduslly.

    I found terrible widows and orphans all over the web. Not to mention really bad line breaks within paragraphs that destoy readability.

    While I know this is time consuming, especially if you post a blog that continuously updates, but it is frustrating to read text with terrible line breaks. And it tells me that the designer’s skill in typography is lacking.

  • abdusfauzi said:

    great post! love it! now, i need to redesign my website and coming projects. hehe.

  • Mini0n said:

    AWESOME ARTICLE!
    Keep up the good work. =)

  • nio said:

    Very useful list, thnx a lot!

  • Chris said:

    Another Smashing Magazine?… nooo!!!

  • Melik Yuksel said:

    Amazing post, thanks!

  • Patternhead said:

    Great article, thanks for sharing

    My latest post: Free Vector and Pixel Repeat Patterns - Organic Set 1

  • How to Spot Quality within Web Design: Examples & Tips : Design Newz said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Frederik Van Zande said:

    Liam,

    it is always possible.
    If you design after the content –> smaller font-size.
    If you write blog post after the design is in place –> less text in the headline.

    Headlines shouldn’t be too detailed, they are just there to make the visitor curious what’s written beneath it. The usage of headlines is to manipulate the scanning/skimming pattern. So just to draw the viewers eye. Long headlines don’t work well btw, research has shown that the best headlines are max 8 words long.

    @ Grant.
    welcome to the web, where you can’t control everything.
    The technique you describe shouldn’t be done on the web because you never have 100% control of what font-type, font-size & font anti aliasing is used on the visitors browser.
    - some users with visual disabilities overwrite the font-size.
    - we use font stacks like this “Arial, Helvetica Neue, Helvetica, sans-serif” –> you can’t control what font is installed by the visitor, all fonts differ in width
    - safari, firefox, IE, … all use different font-anti-aliasing, resulting in different width of font.

    If you use the technique you describe, you’ll have a lot of visitors that have text looking like this:

    Quality is a word that a lot of people like to use when
    describing
    their web design services. But what is quality, how do you know
    if a
    design is quality or not. Well, I think that there’s quite a few
    ways
    to spot quality within web designs. Once you can see just what …

    less then ideal :)

  • Sarah Hudson said:

    This is the most useful article I’ve read all year. GREAT stuff, thank you!!!! :)

    Sarah

  • Anthony Alexander said:

    I’m seriously tired of seeing these ‘inspiration’ sites spitting out this garbage. Humans..

  • J.L. O’Brien’s Blog said:

    [...] a new link from delicious that I thought I might get some inspiration from: http://wefunction.com/2009/04/quality-within-web-design/ ▶ Comment /* 0) { jQuery(’#comments’).show(”, change_location()); jQuery(’#showcomments [...]

  • How to Spot Quality within Web Design: Examples & Tips said:

    [...] Visit Source. [...]

  • Andrew Houle said:

    Wow, excellent article and fantastic examples, Liam! You hit on a lot of great points here, this will be a resource I can come back to often.

    My latest post: How to Avoid Designer Burnout

  • web design said:

    very good images and examples. but, all the secret stay in promovation. ;-)

  • cablare structurata said:

    Beautiful post

  • 7 More Useful Tips To Help Your Site Convert | How-To | Smashing Magazine said:

    [...] White space, the empty space around and between various pieces of content, is important. It gives your design air to breathe by separating elements. This separation is valuable because it allows people to focus their attention on individual areas of the page, be it the navigation, a feature description or the website’s description. When everything is stuck together, it becomes more difficult to distinguish between its components and thus more difficult to focus on and thus less scannable. You can read more about the proper use of spacing in Liam McKay’s excellent article How to Spot Quality within Web Design: Examples & Tips. [...]

  • Matt said:

    This is a really good post. It really gets to the heart of good design not only for the web, but often for print as well.

    It should be noted, that good design doesn’t happen in one step. My blogs are always under construction and undergo slight to major changes weekly if not daily. You always have something you want to do next.

    My latest post: 3 Types of Blog Comments

  • links for 2009-04-13 on studiowhiz.com said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… Some really great tips for laying out your website design (tags: webdesign design inspiration tips resources web typography tutorials) [...]

  • Zak Weiland said:

    Really good post. I’ve seen a lot of articles like this, but this one had some great newer examples and a great set of writing skills. The simplest rules line-height and the pixel perfect separation are must haves.

    Great job!

  • Star Army Space Roleplay said:

    “06. Using Colour to it’s Full Potential”

    Correct grammar is also an important element of creating a web page.

  • troubl3shootr said:

    nice post. I think Nikola Mircic is he (male) not she…

  • Jason said:

    Great post!

    I’ve used Photoshop for over 10 years but have recently given the design task to others. I’m more in tune with the HTML/CSS coding. But this article is a great inspiration for me to start some designs again.

    Thanks!
    Jason

    My latest post: Here’s a Quick Way to Add a Custom Date Graphic to your WordPress Blog

  • Chris said:

    I agree with Frederik. You can’t transform the web into a printed medium.

  • niceOne said:

    great article, but you might want to correct the part about nikola mircic, as i’m pretty sure it’s a he you’re talking about there, not a she. based on the surname he’s of similar origins as nikola tesla and by mentioning tesla i guess i made it pretty obvious nikola is a male name over there.

  • links for 2009-04-13 « Mandarine said:

    [...] How to Spot Quality within Web Design: Examples & Tips (tags: webdesign tutorial inspiration reference) [...]

  • michael soriano said:

    Love this article.

    My latest post: Took a stab at “Grunge Style”

  • agilius said:

    Great article, I must say I never read something that summed it up so well. Something like this should be read once in a while, to remind us of some essential concepts of webdesign. ;)

  • Web Design Quote said:

    One of the best posts I’ve read so far. Things mentioned along with the examples are great. It’s an excellent guide for beginners as well as professionals.

    Thanks for the post.

  • links for 2009-04-14 | This Inspires Me said:

    [...] How to Spot Quality within Web Design: Examples & Tips (tags: quality webdesign) [...]

  • Professional and reliable webdesigning and webdevelopment services at affordable prices said:

    Hi folks here the blog has provided us with good information regarding the various techniques involved in the web designing.I would like to suggest you a site where you can find various information and other services at a very reliable cost.http://www.tec-z.com/

  • Will said:

    Excellent article. The part about colors was interesting. But I think you have to treat color schemes on a case-by-case scenario. As suggested, there are lots of examples where colors could be made more vibrant with contrasting backgrounds or bright titles to brighten things up.

    But if you are working with online portfolio’s and showcases, it is likely that you would want to minimise the use of colors to put emphasis on the content.

  • liam said:

    @niceOne - Oh yeah, good point. After a little research I’ve found a picture of Nikola Mircic and it’s true to say I assumed the wrong gender. *Making changes now.

  • Calitatea design-ului | Mâ?u' said:

    [...] este s? ilustrezi prin exemple ce poate însemna un design bun.  Am g?sit un articol pe WeFunction.com excelent, care scoate în eviden?? câteva practici profesioniste în realizarea webdesign-ului. [...]

  • Mike T said:

    Great article! I plan on using more whitespace on my various websites I maintain.

    My latest post: How To Make a CAT 5 Cable

  • Chris McCorkle said:

    You made a few good observations, however, I don’t quite know what a “gird” system is! Spell check!

  • John said:

    And most importantly: Good visual design doesn’t imply good code. Having good code is even more important than having a good visual design.

  • Good Design « Frontier Label Tech Blog said:

    [...] in Web Development WeFunction.com has a great, detailed list of good design practices for the web.  I especially enjoyed the comments on [...]

  • Jaswinder said:

    Well done Liam another excellent post. consider yourself digged :)

  • Kyk Phon said:

    Gorgeous photos, good advice, and terrible writing. Learn how to spell.

  • Glenn Hilton said:

    Great post. One of the best I’ve read in a while.

    My latest post: Drupalcon DC: Gone in a Flash

  • How to Spot Quality within Web Design: Examples & Tips » lietzphoto blog-o-rama said:

    [...] Full Article: Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a…. [...]

  • Al said:

    Thanks for the great tips — being totally untrained I forget subtlety and simplicity on a regular basis.

    While beyond the scope of the article it would be nice to see something on the under-the-hood aspects of quality design for the web. Accessibility, sending the correct headers, portability and validation considerations are certainly, at least to me, as important as the presentation of a site.

    My latest post: The Quiet Coup

  • sam hayne said:

    Hey here’s another idea: hire an editor you moron. Affect is a verb. Effect is a noun. Plus this entire post is riddled with typos. Did you even proofread it?

  • Natalie said:

    No snobbery intended here, but I have to mention that all credibility goes out the window when typos and misspellings are present on a website, regardless of the design. Particularly one that is expounding the virtues of quality web design. I’ve only made it about 1/3 through the article before I felt compelled to comment on it.

  • Lee Munroe said:

    This is a great post Liam! Pixel perfect design is what stands out for me. Shows the designer has took the time and takes pride in their work.

    My latest post: Guest Post: 15 Essential Checks Before Launching Your Website

  • Kyle Bailey said:

    An excellent post and one that I will most certainly share with everyone. At E-Cubed we are fanatical about small details and while we cannot always police what happens to our designs once we let our clients get their hands on them we’ve found that providing them links such as this get them back on track if they have wandered off the path.

  • Aysha said:

    Thanks for the post. It’s a great reference.

  • Aysha said:

    Thanks for the post. It’s a great reference.

  • Joshua said:

    This was one of the best graphic design related articles I have came across and I genuinely look forward to more INFORMATIVE articles like this.

  • grundyhome.com » Blog Archive » The Difference Between You and the Design Gods said:

    [...] a good pro for $30/hour. It’s amazing. Within this range, it’s also very difficult to identify a good designer from a bad one. This is a good area to find yourself, but it takes some serious work to move up: find a mentor, [...]

  • keef said:

    This is one of the best comprehensive posts on web design details I’ve seen. Great work and a great article - I already passed it on to all of my design friends.

  • Great article on Web design | Luis Ramirez said:

    [...] Web Design: Examples & Tips. [...]

  • Mike said:

    Love this article as well. Our chicago web design studio works hard to accomplish these things mentioned in the article. Great how you highlighted the examples as well.

  • macias said:

    huge / useful article…. thx

  • matt Harvey said:

    That’s strange, I don’t see the section titled “layout your site using obnoxiously narrow columns, two of which contains ads and mostly useless buttons, so that on any realistic resolution your site has about 25% of its width being content and the rest being wasted.”

    Comprende, wefunction.com?

    your header is pretty ugly too, lots of wasted space

  • Anton said:

    Ironically, the Good.is site actually “breaks” in Firefox 3.0.8 when to many tags are applied. A ‘perfect’ site would take care of that.. But you can’t get it all.

    Screenshot: http://pollax.se/files/good_is.jpg

    Other than that, I agree with previous comments; thank you for a very good post.

  • Chris said:

    @Matt Harvey, I actually prefer reading text in a narrow column than super wide columns (on the web).

  • Ben Peck said:

    Thank you for taking the time to post this. These are excellent examples of what good web design is and the subtle things that we as designers think about and put effort into that make all the difference.

  • Martin Leblanc said:

    Great article, Liam.

  • aravind said:

    Brilliant post!
    Trust me, I was about to post a similar article in my blog.
    Recently I did a research on the trends and quality in web designing before redesigning my website.
    I noticed the white space factor, pixel magic of envato and the texture backgrounds. I tried to implement all those in my design as well.
    I wanted to share all those which I noticed and experimented with some tutorials.

    Anyway, Great post again indeed. kudos

  • Gabriel Svennerberg said:

    Thanks for a really good and well written article. Great tips and examples!

  • links for 2009-04-14 said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… (tags: webdesign inspiration tips quality) Socio-Encapsule this: [...]

  • Oggy said:

    This was an excellent article, thankyou! I’m currently working on a new website design and I’m trying to improve it in any way I can, I’ve changed the cellpadding and put a few pixel highlights and shadows in and a few other things, and I am really impressed, a vast improvment. Thankyou so much! Now to read some of the related articles!

  • Joe Clark said:

    You’ve got the wrong “its.”

  • Alberto Villalobos Solano said:

    Super Article, this a great comeback of this site, actualy there are more factors that make a quality web design, but its already a very complete post,

  • Cortland said:

    Awesome thank you! This is going to really help me out!

    In the sentence:
    “It’s *touch* but something you can pick up with practice.”

    *^*Typo with the Tough

  • Quality and web design « 0ddn1x: tricks with *nix said:

    [...] and web design Filed under: Technology — 0ddn1x @ 2009-04-14 22:15:36 +0000 http://wefunction.com/2009/04/quality-within-web-design/ Comments (0) TrackBack [...]

  • Craig B said:

    Great post will be trying to use some of these techniques on some projects im working on at the moment. =)

  • stevo32 said:

    I disagree with the tip on spacing. The “incorrect” example looks far better.

  • Bookmarks:090415 « Kuu2’s Blog said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… [...]

  • osCommerce Templates said:

    Very long article but worthy to read every single information. This should help everyone who wants to ensure the quality of their website.

  • oddEvan.com » Tools of the Trade said:

    [...] a passion, it helps to know what you’re doing. So for the web designers in the crowd, we have an article on the semantics of design brought to you via @markfunk. And for the photographers, this photographer I know pointed out a [...]

  • Mike said:

    I nominate http://www.truthalyzer.com/ as an example of a well-designed website.

  • Sean Baker said:

    This is by far your 9th Symphony, Liam bro. You know it’s a great article when even our developers here in the office are showing me this link. Lucky for me, I get to ride home about you to them all the time. Great, excellent, prime stuff.

    Keep up the great fight across the pond, my man!

  • john smith said:

    lol what a load of shit, all you did was describe what a crappy content management system is, this is stupid

  • liam said:

    @Sean - Fantastic compliment, appreciate it mate! Really surprised how well this has gone down, it’s something I’ve been wanting to write (and putting together) for a while. But the format of how I got my point across was hard to decide.

    I wanted to do a big rant, but held back as I think people don’t really take to rants very well. I think this was probably a much more effective way of doing it :)

    Nice to hear from you again man. Same to you!

  • liam said:

    @john smith - Erm… Really, did you read Anything?!

  • MidGe said:

    One of the best indication of poor quality is the use of fixed layouts rather than fluid layouts. It displays a lackadaisical approach towards the user and is unacceptable nowadays. Let the user choose the amount of screen real estate given to the browser and let the site blend in to what is given.

    Oh! you are using a fixed layout on your site. It says it all!

    My latest post: New threat to net users privacy

  • liam said:

    @MidGe - I really don’t think that’s that big an issue. Of nearly a year online you are the first person to even mention that. So while I’m sure in certain cases it’s a big plus to have a fluid width design, I don’t think it’s an issue for most people. And in either case, it doesn’t really follow the point’s I was trying to get across that’s a whole other issue for a different time.

  • Jach said:

    I believe that proper spelling and grammar go with design. I noticed two just skimming this article (improper use of “it’s” (know the difference between “it’s” and “its”!), and “gird”), and those stand out much more to me than a few pixels of spacing.

    Also I’m not too keen on pixel-perfect design, because different people have different resolutions. The laptop I’m using right now has a 1400×1050 display, and most of the sites I visit (including the form of this one) look like crap because they aren’t using proportions. A common problem is centered three-column layouts that define the width of the middle column in pixels, leaving HUGE empty space on the side.

    I did enjoy the article though, and a lot of it is good advice.

  • links for 2009-04-14 « My Weblog said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… (tags: web design tutorial) [...]

  • [root@EGA]# » Blog Archive » links - 20090414 said:

    [...] Silicon Valley, Part 4 Fir Tree Man Shocks Doctors [w/pic] 41 Great Looking Free WordPress Themes How to Spot Quality within Web Design: Examples Microsoft offers data mining tools in the [...]

  • 7 More Useful Tips To Help Your Site Convert | Simon Baier said:

    [...] When everything is stuck together, it becomes more difficult to distinguish between its components and thus more difficult to focus on and thus less scannable. You can read more about the proper use of spacing in Liam McKay’s excellent article How to Spot Quality within Web Design: Examples & Tips. [...]

  • Mikey said:

    @ Benn: “Great article, except for mentioning Visualbox. Mystery meat navigation is horrible, and this is just a really good looking version of it.”

    Ditto. Nice looking, but unusable. If you’re still doing mystery meat navigation, you’re doing it wrong.

  • Sandeep said:

    Really Nice Article!

  • choen said:

    i loved… make inspiration…. thanks.

    My latest post: Video tutorial konversi Photoshop ke HTML - NET TUTS+

  • Edward.H said:

    great article with up to 12 samples! that will inspire us on web design ,thanks! I’v submitted a link of this great article into webmasterclip.com so that I can share it with our members.

    thanks your good work again.

  • OpenSourceHunter said:

    I must say this is one of the better articles that i have seen! Keep up the good work!!

    greetz

  • Paul Anthony said:

    Excellent post Liam, the devil really is in the detail, and its no surprise that the best designers are really fussy over small pixel details. Bookmarked.

    My latest post: 35+ websites to gain serious design related traffic

  • Mahbub said:

    Wow, nice compilation. Better than smashing magazine !!

  • liam said:

    @Mikey - I see what you and Benn are trying to say, and normally I would have to agree with you. There’s no mystery about it, you can clearly see what it is you are about to click on, if anything it’s far more effective than having text only.

    Keep in mind it’s a site about showcasing their visual work, it works amazingly well. Any of the other links (contact etc) they have made text and put at the top.

    @Jach - Spelling has nothing to do with Web Design mate, I’m a Designer not a writer. I’m going to make some spelling mistakes, I’m going to mess up my grammar and I’m going to write some things sometimes that make absolutely no sense. It’s not to say I don’t care about it, or won’t fix any problems I think need fixing, it’s just not an issue that has anything to do with the topic of the post.

    Glad you found some use in the article though.

  • MyRule said:

    Great post Liam! I love how you have broken down the post in certain topics. Great examples aswell :)

  • Mikey said:

    @laim - Hey matey. I think you’re confused about what mystery meat navigation is. It’s when you have to hover over something to reveal it’s function. Every one of those rectangles does it. It’s an ugly throwback to navigation design typically done in the 90’s (most abused in Flash). It doesn’t fly these days. It hasn’t for a while.

    Take the yellow pic with the bike for example. How on earth and I supposed to know that’s actually ‘Ultra Magazine’? And if I come back to the site, how am I supposed to remember what each of the rectangle images are? I have to pass my mouse over every one of them until I find what I want. If you are forcing your users to remember a specific set of rules just to get around your web site, as opposed to - you know - them clearly seeing what their options are, you’re doing it wrong.

    It’s pretty there’s no doubt, but usability beats bling any day of the week in my opinion - even on design showcases. There’s no reason why they couldn’t have had the names of the items overlayed or below each of the rectangles. It would still look good but more importantly, be usable.

    It’s still a great post BTW.

  • Sage Media said:

    Great skim-through. I couldn’t begin to put a number on the times I’ve preached the message of subtlety and white space to our clients. Content is king, but an obese king sprawled over a mess of clutter and confinement isn’t going to do anyone any good.

    A lot of time and effort is obviously put into your articles. Don’t you people work? ;)

  • Janko said:

    Excellent reading, thanks for sharing!

    My latest post: JankoAtWarpSpeed is celebrating first anniversary!

  • Dave said:

    It’s been a while since I read a truly excellent blog post. Not only well written but relevant. Congratulations.

    Now I’m off to visit my own site and see how I can make it better.

  • Gaurav M said:

    This is the excellent
    article

    My latest post: What attract us in the opposite sex

  • Thosekennedys.com » Blog Archive » Daily Digest for 2009-04-14 said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… [...]

  • Claudio said:

    2 palabras: ex celente

  • Fred said:

    Fantastic read Liam, thanks for taking the time to blog on it!

  • DisenoWeb said:

    Thanks for the post. It’s a great reference.

  • How to Spot Quality within Web Design: Examples & Tips said:

    [...] includes: spacing, pixel perfect details, Typography, Organization of elements, and so on. just check it out Share this [...]

  • SEMANTICFLOW said:

    This is very useful articles for web designers like me. I read it and find it very useful.

  • SEMANTICFLOW said:

    Very useful article for web designers like me. Thanks

  • Square Eyez » links for 2009-04-15 said:

    [...] How to Spot Quality within Web Design: Examples & Tips (tags: webdesign design inspiration tips web typography) [...]

  • Ade said:

    You omitted a very important indicator of quality:

    08. Typographical and grammatical errors (the avoidance of).

    Its omission is ironic because this otherwise useful article is marred by quite a few such errors.

  • liam said:

    @Ade - Nope, the Irony is you took time to read my mistakes, but didn’t read the title. Quality within Web Design. Not Quality within Writing about stuff.

    As stated previously, I’m a designer sharing my thoughts & ideas. I’m not a writer, and while I try my best not to make mistakes with spelling & grammar it’s not my number one priority.

  • Matt said:

    Great list of examples.

  • Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples & Tips | Balneo-douche.com said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… [...]

  • Peder said:

    Great article, keep em’ coming!

  • kapsarovB said:

    Maybe I should show this post to my boss and start appreciate me much, much more :)

    Thanks great post! More more…

  • service animals said:

    “Better than smashing magazine !!” I agree.

  • Steph said:

    So maybe I’m the 1,000th person to post here — but I must say, great post! Haven’t had a good post like this in awhile, needless to say haven’t commented on many articles until now.

    Very, very good job — I love detail just as much as you and you just inspired me to open up Photoshop and try some new things!

  • liam said:

    @Steph - Thanks for your comment, glad you enjoyed it and it’s inspired you. Cheers.

  • April 15th said:

    [...] April 15th Apr 15 by Aaron « back to blog How to Spot Quality within Web Design [...]

  • Alex said:

    Great article Liam. One question - what program did you use to produce the magnifying/zoom glass effect and the labels? Just Photoshop? Or is there an excellent screen capture program that you are using?

  • What Do you look for in a Quality Design? | Business Marketing Experts said:

    [...] Quality is a word that a lot of people like to use when describing their web design services. But what is quality, how do you know if a design is quality or not. There’s quite a few ways to spot quality within web designs. [...]

  • 7 More Useful Tips To Help Your Site Convert | Designurimagination Blog - Let Your Imagination Fly said:

    [...] When everything is stuck together, it becomes more difficult to distinguish between its components and thus more difficult to focus on and thus less scannable. You can read more about the proper use of spacing in Liam McKay’s excellent article How to Spot Quality within Web Design: Examples & Tips. [...]

  • Shadeodz said:

    what a great lesson u gave!

    great job!

    im going to be a web designer, so this post is perfectly usefull for me!
    and others ofcourse!

    thx for share your knowledge!

  • Dan said:

    Fantastic post. Thanks.

  • Amy W said:

    Great Post Liam…
    I agree with you that we are just designers and not writers. I guess if you can spot all the mistakes maybe you are in the wrong business and should not be designing but copy writing. Thanks for all the great examples. I need to learn how to leave more white space and not fill it up.
    Thanks!

  • liam said:

    @Amy W - Nice to see someone understands :) Although I do aim to improve on things like spelling & grammar, I just think most people can read it fine. Glad it’s helped you think, and hopefully helped you design your next project.

    Appreciate the comment.

  • Andrew said:

    What a wingy bunch some are… bitching about lack of fluid layouts, spelling mistakes etc… love the look of this page / blog and article looks damn schweet (no, not a spelling mistake - intentional) too! I will go through more in-depth soon! From what I have seen, the examples provided look good, the attention to pixels a very valid point (it’s the subtle touches that make a site) and I’m sure there’s more to come. Thanks for your time and contribution!

  • Arjen said:

    Amazing post, you’ve mentioned some good point which I will pay attention to while designing.

    Thanks a lot!

  • Ade said:

    Liam. Yes, I read the title. I think that you are mistaken to think that good quality writing is not an integral part of quality website design. It certainly is. And not only integral but fundamental. Prettiness only goes so far. It is also a shame to see you dismiss it as “not my number one priority” in the context of writing an article and then react negatively to criticism of it.

  • Michael said:

    You’ve featured some really great websites and have pointed out some great characteristics of them. I can only hope to achieve them myself.

  • Joel P said:

    Liam, I understand you’re a designer, not a writer, but if you want to write, you owe it to your readers to proofread your work. If you still insist you’re a designer, not a writer, then find a writer to do it for you. I’m a developer, not a designer, so my solution is to hire designers for design, not to put out terrible design and stand on my developer credentials.

    Honestly, quality isn’t about pixels or colors or shading. It’s about caring about the entire finished product and the entire user experience. You really undermine your case by putting something out that looks like a first draft. I found the narrow columns, very tight spacing, and constant CONSTANT *CONSTANT* typos to be so distracting that I could not finish this very long article. I hope it was good.

    My latest post: Readability Updated With Some Handy Tools

  • liam said:

    Ade - I think you’re missing my point. Criticism of the writing of the article is fine, I’ll be the first to admit it’s not perfect. What I’m defending is the fact that people are connecting making a good website Design, to publishing a good piece of writing.

    I’m just trying to point out that they are two different skills, usually for two different people to take care of. Which is why I’m failing to see why people are connecting the two.

    By all means I’m not saying that people aren’t allowed to criticism or have an opinion, I just want to make clear where I’m coming from at the same time.

  • liam said:

    @Joel P - Yeah, again I can’t argue with the fact that it’s not a perfect article. I don’t think I’m ever going to write anything that’s perfect, or near to perfect. So I’ve put something out which I thought people could enjoy, and I’ve had some great feedback and it seems to have inspired a lot of people. That’s the goal of the article.

    It’s strange how none of my readers (maybe one or two) have brought up too much of an issue with my spelling before, and I know for a fact I’ve made countless errors and mistakes in the past.

    My guess is for many of you this is your first visit to the site, and if I’ve failed to interest you then, apologies. But I’m sure that most people found value in what I wrote and it’s for them people who I’ll Improve my writing for, and website for in the future.

  • Ade said:

    No, I understand and appreciate your point. But based on my own experience, I have to disagree that the two are not fundamentally part of one and the same thing. If I didn’t write copy (or edit it if the client provides it, which is rare), I would have unfinished sites. Of course, for people who work with a team around them, it may well be someone else’s job, and that’s fine for them.

  • Jesse Skeens said:

    Great article Liam. I didn’t even notice the mistakes until people pointed them out. Sure it would have been better to proof read a bit more but no need to be attacked over it in the way some of these people have reacted.

    Will be bookmarking this for future use, thanks.

  • Joel P said:

    Liam, I never complained that your article wasn’t perfect. You won’t ever write a perfect article, and neither will I. I’m also not arguing whether or not your content is accurate or useful, because I’m not a designer. It does seem to have inspired a lot of designers to make their sites look better, so if they do, I thank you for that without qualification.

    But, my point is that by putting out this post you are a) choosing to write, and b) choosing to write about quality. Failing to proofread the article greatly undermines the message to those of us who care about content quality. There are plenty of ugly sites that could use much greater attention to design quality. But my concern is the exponentially greater number of sites where peopl dont spend 5 secnds to see if there grammer or spelling is rite. [Please trolls, don't reply. I know that last sentence was all wrong. I'm making a point.]

    I’m all for quality, and I commend you for trying to raise the bar. All I ask is that you recognize that you don’t compartmentalize quality. Every website eventually gets redesigned, but nobody ever goes back and rewrites the old articles. In my opinion, the quality of your content is far more important than the quality of your design, because the content lives forever.

  • Dobes Vandermeer said:

    Little typo: http://screencast.com/t/p95Kt2ib0th

  • Andrew said:

    Thank you for this post. I fail to see why anyone is raising minor quibbles and overlooking the awesome advice you have given. I understand quality is across the board, but I don’t come to this site to be taught grammar…I am here to benefit from your web design skills and expertise. I am a beginner and really grateful.

    Please, don’t be discouraged and keep up the good work!

  • liam said:

    @Joel P - Okay, well I don’t want to go on about this too much. But I take what you are saying, and agree with the most part. I just don’t agree with the part where you say I wrote about Quality. Because I didn’t. I was very careful to pick out Quality within Web Design.

    If I’d chosen Quality websites as a whole, then maybe your points would be valid about my spelling etc. But I’m not talking about the quality of the content, or website. I’m looking at the examples purely for design. In other words, how the text looks, not whether it’s written correctly.

    Also, (this point isn’t directed at you) but I didn’t include myself in this list, and never claimed to have a quality website design, so not sure why people have decided to make this about my site.

  • Craig miller said:

    Cool advises about spacing, when I developed one of my first sites it was awful in terms of waste of space. Hope this gets read by everybody whom willing to design websites.

    Craig Miller

    internet marketing consultant

  • Daniel said:

    I cannot see how using ‘thrashed’ design trends indicate a websites quality? Amateur Photoshop trickery (gradients, drop shadows, ‘2.0′ icons… ZZZzzzzz) and floral stock art will not mean your website is of high quality. Try something different, I often look to print for some great examples of beautiful graphic design. I still cringe when I hear somebody call me a ‘web designer’ and this article is an example of why. It should be renamed ‘How to pretend your a designer in 10 easy steps’.

    In saying that I am sure that all of the ‘part time web designers’ who charge nothing for their ‘work’ and reduce the value of our profession will love it. So great article in that sense.

  • liam said:

    @Daniel - I think if anything you just back up my points. The whole reason behind it was to encourage people to hold back on the effect. Use them by all means, just keep them subtle and clean.

  • Daniel said:

    @Liam - Fair point. The subtle use of these Photoshop effects does separate the ugly from the elegant. But don’t you think these design trends have been with us long enough now? It reminds me of the late 90’s when everything had to look futuristic and like it was lifted from a rave flyer lol.

    I mean seriously, floral patterns? I have always liked this rule for anyone who might be reading: If you remove an element from your design and it does not REALLY make a difference, then simply remove it. An example is right here on this page design (which looks very nice by the way). If you removed the floral pattern at the bottom and top of the page it would make no difference to the overall effect whatsoever, in fact I think i would improve the design, it simply does not need it. I hope that makes sense, or maybe I am just a hopeless minimalist?

  • liam said:

    @Daniel - Yeah, definitely these effects have been with us since forever, but it doesn’t mean we don’t have to use them. I think it’s just about using them in a way that works, and that does mean restricting usage, and softening your gradients etc. But I don’t think we an ignore them at all.

    As for the floral point you make. I’m not suggesting you must include floral patterns to make a design look good at all. The main section title, where I included the floral example is “Restraint & Subtlety” - The one use of floral patterns there is one example of Restraint & Subtlety done well.

    As for the floral elements on my design, I think they are more a way of setting the theme / mood of the site rather than being a focus point, they’re not really meant to be noticed. And while I agree with your view that (in a lot of cases) if you remove an element without any major difference then you might as well remove it all together, I do think though that if the style fits your design you can have a bit of decoration, especially if it’s kept subtle.

  • Pradeep CD said:

    I agree with all the points…

    great post…

    thanks…

  • Martin Leblanc said:

    Ok, I’m unsubscribing this thread 8-/ I had 14 updates on email since last night.

    (Great post btw)

  • Chicago Web Designer » How to Spot Quality within Web Design: Examples & Tips said:

    [...] Link [...]

  • How Our Web Design Firm Produces Such Effective Sites | The Ocean Agency said:

    [...] great. Every web design firm will say they do the best work in the industry. However, looking at this article  regarding successful web designs, you can see that comparing the writer’s exacting criteria [...]

  • ??? ????? ???????? ? ???-???????: ??????? ? ????????????. ????? 1.. ???? ??? ??????????? said:

    [...] ??????? ?????? How to Spot Quality within Web Design: Examples & Tips [...]

  • Design Corner #9 - The Blogs at HowStuffWorks said:

    [...] 6) How to Spot Quality within Web Design: Examples & Tips [...]

  • cabhishek said:

    really awesome examples… simply superb …. no words to describe it

  • links for 2009-04-17 « doug - off the record said:

    [...] Delicious Account Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… April 17, 2009Infinite Photograph — As Seen On Earth — The Green Guide April 17, 2009Spreadtweet [...]

  • O que qualifica um bom design? « Createeve said:

    [...] princípios, seus sites ficarão muito mais criativos e terão resultados impressionantes! Fonte: http://wefunction.com/2009/04/quality-within-web-design/ 0 [...]

  • The BallistiK Blog » Fresh From delicious today said:

    [...] Blind Desperation 2009/04/16Recent FavsTwitshirt 11 hours agoMEDL Mobile AppIncubator 11 hours agoFunction Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples & Tips 2009/04/15Greasemetal - an Userscript Runtime for Google Chrome 2009/04/147 More Useful Tips To [...]

  • Chasing the perfect User Interface | My life as it unfolds said:

    [...] to read two UI-centric articles today - on healthcare software (specifically openvista), and on the usage of subtle elements in web design, and I realized that there are two simple reasons we are not presentation-focused - we assume the [...]

  • Kowalikus said:

    great job!

  • dendie sanjaya said:

    wow..
    nice psoting..

    thansk forsharing

    My latest post: backup dan restore database mysql

  • BlogBuzz April 18, 2009 said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • IT???? | 2009?4/13?4/19????????? said:

    [...] ???????WEB???????????????????? [???http://wefunction.com/2009/04/quality-within-web-design/] [...]

  • MorayWeb said:

    What an excellent post! I will be going through this again and again, bookmarking this right now!

    Thanks.

    My latest post: What’s In Line : April 2009

  • tasarim said:

    Thanks for a really good and well written article. Great tips and examples!

  • LifeStyle Link#8 | LifeStyle Web said:

    [...] How to Spot Quality within Web Design - Un altro interessante articolo che ti mostra con esempi e suggerimenti come sia possibile mostrare qualità attraverso la grafica dei tuoi lavori. Assolutamente da seguire perché risulta essere veramente molto completo e ricco di spunti! [...]

  • Bithalter Webzeuglinks 011′09 | Webzeugkoffer Webdesign said:

    [...] How to Spot Quality within Web Design: Examples & Tips: Über die oft kleinen, aber feinen Details, die den Unterschied ausmachen [...]

  • jeremiahnellis.com » Blog Archive » Best of the Week #61 said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Web Design said:

    All the 7 points are equally important for a great web design. And the article is quite a learning experience. The further you read the more you learn. Great work…

  • Enlaces semanales que no he publicado (14) | Cosas sencillas said:

    [...] How to Spot Quality within Web Design: Examples & Tips (wefunction). La calidad es una palabra que a mucha gente le gusta utilizar a la hora de describir sus servicios de diseño web. Pero, ¿qué es la calidad, ¿cómo saber si un diseño es la calidad o no. Bueno, creo que hay bastantes maneras de identificar la calidad en los diseños web. Una vez que puedes ver lo que comprende la calidad en el diseño web, puede usar las técnicas necesarias para perfeccionar su propio estilo. Los ha reunido unos cuantos puntos, que recogen algunos ejemplos para explicarlos cuando buscamos la calidad en el diseño de un sitio web. [...]

  • Sunil Kudikal said:

    I think, its amazing article. Have learned many things.

    Thanks.

  • A Tim Called Oak » Function Goes Yard said:

    [...] I don’t usually post any links here (because, lets face it, I don’t actually have a lot of traffic to redirect). Having said that, it would be a shame if anyone missed this extraordinarily well written article at Function about how to spot quality in web design work. [...]

  • [???? ????] ??? ???? ????? ????? | ???????? said:

    [...] ??? ????? ????? ??????? ???. ?????? ??? ????????. http://wefunction.com/2009/04/quality-within-web-design/ [...]

  • IT Solutions Blog » Excellent read: Quality in Web Design said:

    [...] Liked this article? Help spread the word: yahooBuzzArticleHeadline = “Excellent read: Quality in Web Design”; yahooBuzzArticleId = “http://www.mgitsolutions.com/blog/2009/04/excellent-read-quality-in-web-design/”; Stumbled upon this blog entry by liam, loved it, shared it: How to Spot Quality within Web Design: Examples & Tips. [...]

  • Karine Sabatier » Blog Archive » Links w#17 said:

    [...] How to Spot Quality within Web Design If you’re in a hurry and have time to read only one thing, read hint number 1 : Spacing. And re-read this again and again White Space isn’t a wasted space. Just because you have an empty area, it doesn’t mean you have to fill it. [...]

  • Matt said:

    Damn, what a post! I’m going to consider this required reading before every design project.

  • How to Spot Quality within Web Design | MirthLab said:

    [...] If you’re new here, you may want to subscribe to my RSS feed or follow me on Twitter. Thanks for visiting!The Function blog has a great article on How to Spot Quality within Web Design: [...]

  • Barbaros Alp said:

    Thanks for the great article

    My latest post: 15 dakikada jQuery

  • Christopher Lee Design - Professional web, graphic and print design for small business » Blog Archive » How To Spot Quality In Web Design said:

    [...] We Function tells us how to spot quality web design pointing out the small details from spacing to what they call “pixel perfect.” This is a good read for any web designer regardless of your background or seniority in the field. Be sure to give it at least a once over. How To Spot Quality In Web Design [...]

  • Professional & reiable web designing & web development services at affordable prices. said:

    Wow really amazing information is stored here in this site.

  • rahina . info | b l o g » How to spot Quality within web design said:

    [...] via Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &…. [...]

  • JeremiahTolbert.com » Blog Archive » The Week in Links: Photography, Design, and SF said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • dani said:

    I think it should be based on simple best practices of web standards, semantics x/html, accessibility, usability, and mobileOK. :)

    Should we use tabindex here?

    My latest post: Inline SVG and Valid XHTML on WordPress

  • Kasia Hayden - Reading #7 « Code Critique said:

    [...] of my favorites is How to Spot Quality within Web Design: Examples & Tips, which has visuals of all of the guidelines it [...]

  • Leland Clemmons said:

    That was, without a doubt, the best line-up of techniques I’ve ever seen (read?). I’ve notice them all used across the internet, but it’s nice to see them verbalized.

  • ??? ????? ???????? ? ???-???????: ??????? ? ???????????? | Usability.by said:

    [...] ??????? ?????? “How to Spot Quality within Web Design: Examples & Tips”: ????? 1, ????? 2, ????? 3. Comment (RSS)  |  ???????? [...]

  • Social Bookmarking said:

    Thanks for the awesome examples and tips. I have bookmarked this article over at the SEO Social Bookmarking website.

    My latest post: How to Spot Quality within Web Design: Examples & Tips

  • Banago said:

    This article is so great and well organised that is bringing me here for the several-th time. Well done and thanks!

  • Dmitry said:

    Just adding one more +1 to those praising the post :) Great work writing this up Liam. Little details like this are what makes the difference and you’ve done a great job going through all of them with detailed examples. Looking forward to reading more!

    My latest post: 8 Characteristics Of Successful User Interfaces

  • Revue de presse | Simple Entrepreneur said:

    [...] How to spot quality within web design En s’intéressant tout simplement à l’utilisation intelligente de l’espace, au choix avisé de la typographie, à l’attention portée aux détails, à la sélection d’une palette de couleurs pertinente, … [...]

  • Farid Hadi said:

    Nice article with good examples. Thanks.

    My latest post: Free desktop wallpaper with calendar - April 2009

  • What Do you look for in a Quality Design? | DG | RCG said:

    [...] Quality is a word that a lot of people like to use when describing their web design services. But what is quality, how do you know if a design is quality or not. There’s quite a few ways to spot quality within web designs. [...]

  • ??????? » [Web] ???? said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • dope259 said:

    very useful post indeed!! Thanks

  • Hem said:

    Hi,

    This information helpes me a lot. Nice post.

    My latest post: Responsibilities of a Test Leader

  • Ben Sky said:

    Great article, very detailed, a mention of symmetry in some cases i think is also worth!
    Thanks a lot.

  • ReTox said:

    Good post.

    One mistake: Nikola Mircic is he, not she

  • fedmich said:

    another useful tips :)
    thanks for sharing

  • ebook cover designer said:

    Wow! One of the best posts Ive read on web design in a while. I had a good and thorough look at it and I must say that I am very impressed with what you have said. Thanks for the great post! And I will be looking forward for more…

  • Caesar Aldhela said:

    Waaaw!!
    great post!!!
    thanks this is very useful :)

  • Merewald Valletta said:

    This is absolutely excellent. Thank you so much for writing it.

  • Top 10 articles for web dev and design - April 2009 | HieuUK said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Roberto said:

    Excellent. All of them are very important, especially Pixel Perfect.

  • Manda’s Weekly Favorites #4 - Extended Edition | Creative Opera: Design Advice and Creative Inspiration said:

    [...] as well do it right. Take a look at these tips from Function Web Design & Development Blog: How to Spot Quality within Web Design: Examples & Tips to take your design to the next [...]

  • MyInkTrail, Best of the Design Community, April 2009 | My Ink Blog said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • germanyMan said:

    gr8 job ! its my feedback worth

  • The best way to learn web design? said:

    [...] - Graphic & Web Design, Colorado Springs CO any of the sites referred from this article -> Function Web Design & Development [ Blog ] ? How to Spot Quality within Web Design: Examples &#0… And my all time favorite in web design is clearly the Envato’s group: Envato - Digital Goods and [...]

  • QUALITY IN WEB DESING « The Daily View said:

    [...] Article link:  http://wefunction.com/2009/04/quality-within-web-design/ [...]

  • Quality In Web Design | Chris Barnett | GD252 Blog said:

    [...] to recognize other good designs when you see them.  After reading a post from the Function Blog on Quality Within Web Design I got the idea to look for web design studio websites that met the criteria. To make things [...]

  • Quality within Web Design | Ryan Tan said:

    [...] look good? We’ve heard the stuff about spacing and organization, but liam went all out in this article to find precise examples from all over the web, each well edited to emphasize the respective points [...]

  • April Round Up! | CreativityDen said:

    [...] 50 Inspirational quotes on art science and design Quality within Web Design [...]

  • Matt said:

    Thanks for this, great information

  • 20 of the Best Graphic Design Articles, Inspiration & News May 2009 - Creattica Daily said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Tips de diseño para tu website | Kabytes said:

    [...] Function han publicado un artículo excelente sobre qué cosas tener en cuenta a la hora de diseñar nuestro sitio web. El post es enorme y muy interesante para leer con detenimiento (uno de los mejores que he leído [...]

  • Gj said:

    Ever think about writing a web design book. :)

  • Somaninn said:

    Great post, really. Thanks for this!

  • 3 articles on interactive/web design « John Jurik’s Blog said:

    [...] 3 articles on interactive/web design By danceformer http://wefunction.com/2009/04/quality-within-web-design/ [...]

  • ctsf said:

    Great article!

  • links for 2009-05-05 - somaninn.net - Blog de Somaninn Prok - Liens - Web - Cambodge said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… (tags: webdesign reference design inspiration tips resources) [...]

  • Daniel [HiddenCSS] said:

    Interesting, thanks for a great article.

    I will certainly be taking some of this information on board in future designs!

    You have just got another RSS suscriber for that one.

    Thanks again.
    Dan
    hiddencss.com

    My latest post: Down with IE, it’s already dead!

  • links for 2009-05-05 | BlueWave Media said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… Quality is a word that a lot of people like to use when describing their web design services. But what is quality, how do you know if a design is quality or not. Well, I think that there’s quite a few ways to spot quality within web designs. Once you can see just what goes into making a quality web design, you can use the techniques to perfect your own style. (tags: webdesign webdev reference css quality) [...]

  • Dan J said:

    VERY nice article, I will be using some of these tips.

  • Creare Site said:

    Very useful. Thank you !

  • E11World said:

    Really useful article. Amazing designs and attention to details. I will definitely be using these in the future.

  • Esra said:

    Thanks dear, great post.I like it :)

  • 20 of the Best Graphic Design Articles, Inspiration & News May 2009 « Internet Turnkey Websites said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Caught My Eye This Morning « Internet Turnkey Websites said:

    [...] A nice article from wefunction.com, detailing what makes for a “quality” web design. Great article with example illustrations. Worth a read. How to Spot Quality within Web Design: Examples and Tips » [...]

  • lily said:

    It’s a great list of what’s going on now in web design. I’ve seen these elements used countless of times, it’s definitely an outline of what’s emerged in the web 2.0 design age. I find the elements boring and overused, but the point that details make the site really stands out to me regardless of whether/not I’m going to use or even like subtle gradients and 1.0px lines and (gulp/gag) drop shadow. I agree, though, these examples use both elements very nicely. Clients usually want what’s “now” so… Well written.

  • Hazel Q. said:

    Great article! I will definitely add this article to my favorites. Thanks :)
    My latest post: Searching DOM elements with selectors

  • Rajbir said:

    What a great article. Very inspiring !!!

  • Kimberlie Bees-Guy said:

    Exactly what my subconscious mind needed. Hopefully, my future web designs will implement your great advice. Thank you.

    My latest post: Have yourself a Merry Modding Wii Christmas…

  • CAMILO AZAR said:

    En esta web se aclara las funcionalidades que aportan 100% estetica
    y del buen gusti

    abrazos desde chile

    CAMILO ZAR

    My latest post: Dr. Camilo Azar en Hospital de Antofagasta

  • web development services said:

    Hi guys here this site has really shared a good content i really thank for the site.

  • web design Bromsgrove said:

    Really great post, thanks for sharing. off course quality is most important in custom, creative and business website.

    Best regards,

  • Les Reynolds said:

    Just wanted to let you know how great this article was. Don’t normally comment on stuff like this, but it was so good I had to.

  • Issa Qandil said:

    Really a great post. Thank you.

  • Best Articles and Resources on Web Design | Customized Marketing said:

    [...] How to Spot Quality in Web Design - incredible collection of examples and tips [...]

  • Baguio said:

    This is a great writeup, adding now to my bookmarks! :D

  • Web design inspiration « uninspired/overstimulated said:

    [...] My Ink Blog: A Showcase of Popular Web Design Trends We Function: Unconventional Web Design Inspiration My Ink Blog: Best of Design Community April 2009 We Function: Quality within Web Design [...]

  • bebopdesigner said:

    This is quite useful… Thank you for explaining details so well. Cheers

  • Web Design Articles, Inspiration and News - May 2009 - Creattica Daily said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Vicky Nimbalkar said:

    Amazing Post.

    Keep Going…..

    My latest post: How Game Companies protect their CD/DVD’s from Copying?

  • ||| PEDRO GOICO. NEW MEDIA DEVELOPER||| » Archive » C´ømo mostrar calidad en el Diseño Web. said:

    [...] Guía para  alcanzr la excelencia el diseño  para web. [...]

  • Dawn Pedersen said:

    Thanks so much! I really took the spacing thing to heart and increased the spacing at blulob.com before I even finished reading the article. But it did read it all, with pleasure. I also liked your comments on pixel-width details making a difference. I’m going to keep that in mind for future projects.

  • ??????????????????? | ???????... said:

    [...] ????WeFunction???? liam?????2009?4?13?? ????????? [...]

  • ????????: ????? | ???? said:

    [...] ????WeFunction???? liam?????2009?4?13?? ??????????????http://blog.benhuoer.com/2009/05/quality-within-web-design/ ? [...]

  • Webbo said:

    Really great post, thanks for the info.

  • Como Encontrar Calidad en el Diseño Web: Ejemplos y Tips (parte 1) | Accentrik said:

    [...] Menos es realmente Más Fin de la primera parte. Artículo original de FUNCTION [...]

  • Como Encontrar Calidad en el Diseño Web: Ejemplos y Tips (parte 2) | Accentrik said:

    [...] publicado por Function Traducción [...]

  • Saturday Round-Up for May 23 2009 | Blue Lobster Art and Design said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Husien Adel said:

    Really very nice Article :) The most Thing I like about 02. Pixel Perfect Detail ..etc

  • Albi said:

    Great post, thanks for the info.

  • Kate Mag said:

    I’m impressed with this article. You open my eyes. Thank you

    My latest post: Davis Ruined Me

  • New Submissions Starting Tomorrow | CSS GALLERY - Web Gallery & Web Design Resources, Tutorials, Online Community, CSS, jQuery, Mootools, Photoshop, Illustrator, and more. said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Desarae - Web Designer MN said:

    I like the examples you used. Thanks for sharing.

  • Miami Marketing said:

    ALL information was useful.

  • Great New Post on Web Design « Marie Elizabeth said:

    [...] Sherwood with a hyperlink to a post listing characteristics of high quality web design seen here: http://wefunction.com/2009/04/quality-within-web-design/. I really like the way he set up his examples with a close up view of the point he is trying to [...]

  • Dragos said:

    this is one of the best post I have ever read about design quality; this was really helpful for me to find tips and tricks that I haven’t knew how to do.

  • Web design Speed | Web Development | Web Site Design | SEO | Tips » How to Spot Quality within Web Design: Examples & Tips said:

    [...] post:  How to Spot Quality within Web Design: Examples & Tips Share and [...]

  • All my bookmarks ever | Daniel John Gayle said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… [...]

  • Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples & Tips | Squico said:

    [...] Go to Source [...]

  • How-To Collection: Best Of 30 Greastest Tips/Tricks at honeytech | How to, Downloads ,Make money,Technology,Twitter and Web 2.0 said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • web site development said:

    Quality is a word that a lot of people like to use when describing their web design services. But what is quality, how do you know if a design is quality or not. Well, I think that there’s quite a few ways to spot quality within web designs. Once you can see just what goes into making a quality web design, you can use the techniques yourself.

  • vcom system said:

    Nice examples. However, let us not forget that whatever the design is, it should always be in accordance with the specific function a certain site tends to have, it should always be along the lines of the specific purpose a site wants to convey. Thanx

  • Dmitry Marduk - Recommended Articles said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Mankato PC Solutions said:

    Great Article and Very Useful Info…

    Mankato Web Site Design

  • Deesuza John said:

    You find much more things about Web Design Tips , Web Design business.

    In the any web design related blog,

  • Carl - Web Site Design Instructor said:

    A truly fantastic post. Something I will be sure to highlight to our design students!

    C

    My latest post: Joomla Training Weekend

  • Web Design Cape Town said:

    I bookmarked this page more than a year ago and still I visit the article to fresh up. You are Awesome!

  • Hamish said:

    Hi great article but I think it is important to make sure that these sites are accessible to persons with a disability, so some adherence to the WCAG guidelines are always an important part of web design.

  • deandrepurdie.com » Blog Archive » Adding Quality to Web Design: Examples and Tips said:

    [...] This is an article that in a short period of time I’ve come to use as a checklist to make sure my designs have some if not all of the items marked as quality in web design. This article sticks to the basics of Spacing, Pixel Perfect Detail, Well thought out Typography, Organization of Elements and Restraint & Subtlety. For each one of these 5 pointers there are plenty of screen shots and links to live website which exhibit these concepts. Read Full Article [...]

  • pakwebdevelopmentservice said:

    Good Points. There are no hard and fast rules for web designing. Websites should be unique and purposeful. There are thousands of web design ideas!

  • Mike said:

    This is an excellent article, and I totally agree about the pixel perfect detail, totally makes or breaks a website.

  • Quality Web Design said:

    great and informative stuff… thank you very much.

    Quality Web Design

  • Bookmarks for March 30th through June 18th | Luis Ramirez said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Exampl… - [...]

  • Mathias W said:

    Thanks a lot for this post! Really appreciated it!
    - Learned me a lot, thank you.

    My latest post: nn404 Not FoundnnnNot FoundnThe requested document was not found on this server.nnnnWeb Server at comluv.comnnnnnn

  • Quality Web Design said:

    informative stuff… pixel decides the quality… thank you very much.

  • Jared said:

    Lots of good stuff there, thanks.

    My latest post: nn404 Not FoundnnnNot FoundnThe requested document was not found on this server.nnnnWeb Server at comluv.comnnnnnn

  • FemaleEDPillz said:

    Hello ;) Thank you for this website! Here is mine http://motrin.wikidot.com/

    My latest post: THIS SCRIPT IS NO LONGER SERVING DATA. UPDATE YOUR PLUGIN

  • links for 2009-06-26 | Appunti di storie di web said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Examples &a… Quality is a word that a lot of people like to use when describing their web design services. But what is quality, how do you know if a design is quality or not. Well, I think that there’s quite a few ways to spot quality within web designs. Once you can see just what goes into making a quality web design, you can use the techniques to perfect your own style. (tags: quality webdesign articles) Questo articolo è stato pubblicato in Link. Aggiungi ai preferiti: link permanente. Scrivi un commento o lascia un trackback: Trackback URL. « links for 2009-06-23 [...]

  • Subash Aryal said:

    Great article, thanks a lot :-)
    My latest post: THIS SCRIPT IS NO LONGER SERVING DATA. UPDATE YOUR PLUGIN

  • I Am Paddy » Live Creation Process, Step 1: Inspiration said:

    [...] Quality within web design [...]

  • supersawsaw said:

    whoa!!! this is damn good post. bookmarked and reading it twice already.

    My latest post: THIS SCRIPT IS NO LONGER SERVING DATA. UPDATE YOUR PLUGIN

  • Kaffeesatz #1 said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Zaid Rasid said:

    Thanks for this post. I essentially went through all your points and made my latest mock-up about 3x better. Cheers!

    My latest post: THIS SCRIPT IS NO LONGER SERVING DATA. UPDATE YOUR PLUGIN

  • Jimmy Yeoh said:

    Some perfectionists may not realize what niche expertise are best use for.

    There are many CEOs in large corporations who do a damn good job in maximizing profits, but may not be that technical to run their business, so they rely on many competent managers to achieve the bigger vision. They are still instrumental in putting various skills together to deliver above the rest.

    Here we have someone who’s working hard to attain competent design work, and we have some minority group of don’t-see-the-big-picture critics who simply fail to appreciate this niche area that Liam possesses.

    C’mon people, give him a break. Do you expect a scientist who won a noble prize in some bio-tech fields to also have the ability to market it to a billion-dollar empire? People from diverse backgrounds thrive in their very own environments to achieve greater heights with other talents, lets try to be more objective here.

    Good work Liam..

  • Affordable Website Design said:

    Nice article.Have you some material about off page optimization.If you have, please share with me

    My latest post: THIS SCRIPT IS NO LONGER SERVING DATA. UPDATE YOUR PLUGIN

  • Detailed Webdesign said:

    [...] Schöner Post über die feinheiten im WebDESIGN von den Jungs von Function [...]

  • london web designers said:

    great article and great techniques! Very informative…

    Keep up the good work!

    My latest post: THIS SCRIPT IS NO LONGER SERVING DATA. UPDATE YOUR PLUGIN

  • mr nicely long down below said:

    very nice examples, although your page is doomed to be unusable in future if you ceep developing it downwards like this, people really do get scared when presented with an infinitely long page….design…
    even if the info is relevant .- it really becomes like a big pile of mess..

  • Superbiz Blog » Blog Archive » Design de Qualidade said:

    [...] http://wefunction.com/2009/04/quality-within-web-design/ [...]

  • hatkim said:

    Very professionnal web design your work is one of best i ever see on the net good works

    I will book mark you twit you digg you ….

    Best regards

  • Roald André said:

    Wow, what an great article (and long :P)

    Thanks! :)

  • Elton Liu said:

    This site is the most useful thing i’ve seen for a while. Thanks!

  • Michael Beichel said:

    Hey, das ist ein interessantes Projekt. Die Idee an sich ist auch sehr gut… weitermachen

  • April Round Up! « CreativityDen said:

    [...] 50 Inspirational quotes on art science and design Quality within Web Design [...]

  • Totallyace said:

    Really it is very nice post. i like all the examples, which are mentioned here. Very nice list and very informative also.

  • San Antonio Web Design said:

    Excellent Post, thank you for sharing and I would like to know more about the quality website design.

    Thanks again and keep it up!

  • Angela Hill | INCITRIO said:

    Wonderful post. I would add to the Pixel Perfect section: alignment of graphical elements (not just typography to headers and logos), but also the critical importance of having a strategy for the space around, between and in relation to alignment of boxes or other elements.

    Lack of attention to detail, even just one pixel off, can have disastrous consequences in terms of conversion and site stickiness…even worse if it’s so minimal that they can’t tell why they get such an uncomfortable feeling looking at your site!

  • Ski chalets said:

    Great post thanks - it is going to be very useful.

  • Awesome Links of the Week 2009-08-09 « Jon Bergan - A blog about Design, Development & Being Your Own Boss said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • 09 August 2009 | WebDesignExpert.Me said:

    [...] Great Examples and tips on how to spot quality within web design arena. [...]

  • Dallas Web Design said:

    I agree with all the open space. I think sites with a lot of white space and images/graphics spread out and clean font make for a much better site. We have started implementing these design practices in our designs and have noticed a difference in our clients reactions. Good stuff keep it coming i come here and read often.

  • storesonline.10 said:

    Nice post.I like the way you describe all the things and the examples.It will help people like me a lot.Thanks for sharing.

  • storesonlinesuccess said:

    I am interested very much in the subject matter of your blog.I like very much your way of presentation.. I got more useful information on this blog.. Thanks to sharing the useful information….Keep it up

  • wrought iron furniture said:

    Thanks for pointing out all these things in a quality website!

  • Tanner Christensen said:

    Honestly, this is - by far - the best post quality web design I have ever seen. I’d love to say something insightful or beneficial to other readers here, but I can’t think of anything. Great work!

  • imergent said:

    I like very much your way of presentation.. I got more useful information on this blog.. Thanks to sharing the useful information….Keep up the good work.

  • ecommerce said:

    Great article.I really enjoy reading your blog.The keyword sniping links are awesome.Keep it up.Thanks for sharing with us.Keep up the good work.

  • ecommerce.12 said:

    I admire the time and effort you put into your blog. I wish I had the same drive :)Thanks for an insightful post. These tips are really helpful. Again thanks for sharing your knowledge with us.

  • Joe Wolfe said:

    I’m all about eye movement in a website. If your design can carry someone from one point of interest to another then I believe you have accomplished web gold!

  • medyum said:

    I agree with all the open space. I think sites with a lot of white space and images/graphics spread out and clean font make for a much better site. We have started implementing these design practices in our designs and have noticed a difference in our clients reactions. Good stuff keep it coming i come here and read often.

  • Photoshop-Weblog said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Styles Creative said:

    A great guide!, will prove a very good resource in the office! cheers guys!!!

  • moodstudio ~ news said:

    [...] articulo es una traducción al castellano de How to Spot Quality within Web Design: Examples & Tips Fuente: [...]

  • Gedichte said:

    Great examples of fantastic designs.. I used some of them for a few of my projects. Thanks for sharing!

  • Micheal said:

    I just have to say this about a designer.
    Kanhai Patel fooled me, and took all me money without giving me the website he promised.
    Never use him or the company Guddapps.

  • storesonline123 said:

    Thanks for sharing the great examples of web designing with us.It will help the newbies must.I admire the time and effort you put into your blog. I wish I had the same drive :)Keep up the good work.

  • imergent123 said:

    Great post.Really impressive work.Very good post. It really helped me a lot, will be referring a lot of friends about this.Thanks for sharing the great examples of web designing with us.Keep blogging.

  • Dallas Towing said:

    The white space makes a site look clean and nuce. We try and design everything we do with as much white pace as possible. All the new sites out here that look really good have a lot of clean white pace. Thanks for the read

  • Nits said:

    Amazing way of describing the article great tutorial to help new web blogger like me.Thanks

  • storesonline555 said:

    Really a great post and great guide.Thanks for sharing such great examples of web designing.I think it will definitely help the newbies like me.

  • imergent said:

    I agree with all the points you mentioned about quality based web design. you have given nice examples.

  • storesonline said:

    Amazing examples and tips for the quality based web designing with good spacing. Thanks for tremendous informations.

  • Apx Alram said:

    I like your ideas about spacing. Really you have mentioned very nice examples with tips. These are excellent examples.

  • el leo said:

    I’m sorry to be crude, but this article and your website make me want to take my pants off… straight off, like tear-away pants kind of “off”. It’s just that good.

    I enjoyed your comments on spacing and pixel-perfect details. I’m really obsessive about details so I’m with you on the importance of subtlety and detail.

    I’m quite peeved at the ridiculous attacks on your grammar and typos, as I feel they were definitely missing the point. If you’re going to argue about the quality of the copy in a way that is at all relevant to the points you’re making here, then you’d better be talking about the actual rendering of the letters and how that rendering interacts with the visual design. In my opinion, the meanings of the words mean very little when you’re in the design process (Lorem ipsum, anybody?). As long as the forms fit the design, the letters might as well be considered more shapes. Copy writing and design are different categories. Besides, I still knew what you were intending throughout your article. In the end I guess the writers say the copy is most important, the programmers say the code is the most important, and the designers say… well, all the right things. ;)
    I guess I only have one additional point (lucky you). Something that you brushed on repeatedly in your article but never quite said outright is that everything in design, art, and even music, is relative. A color is is only dark if the color next to it is lighter and vice-versa, the same goes for sizing and spacing. If you space everything out a lot, it still becomes blurry and indistinguishable. It’s the variations that grab people’s attention, and being able to get the viewer accustomed to a particular style just enough to surprise them when it changes is the real trick to making a strong, leading design.

    If I haven’t made it clear enough already, I really love your article (and your site, too). Agree or disagree, this article provides great food for thought and an excellent guideline for novices and experts. Thanks for the tangents you sent me on with all the links to examples, those tangents were just as valuable as the article and I’m grateful that you provided that depth of stimulus. Cheers! :)

  • Patrick Carroll said:

    A great post with some excellent points raised. I think its all about finding the compromise between design, copy and ensuring that the website is achieving the goals that you want it to.

    The strapline of this site is ‘designing a website that works’ which is very similar to my philosophy. Design can’t trample on that, but I think that you have given some very good hints and tips which suggest ways of reaching the compromise.

  • leonimc said:

    Great post, great tips and great Site.
    thanks for your work

  • Avery said:

    [...] Function Web Design & Development [ Blog ] » How to Spot Quality within Web Design: Exampl… - [...]

  • HonlapNeked said:

    Great article. Thank you!

  • Shovan said:

    Thanks for sharing, It should help us big time

  • Limited Sirket said:

    Quality varies from different sights so it is qualitative.

  • siemens servisi said:

    If I haven’t made it clear enough already, I really love your article (and your site, too). Agree or disagree,

  • lynnettereed – How to Spot Quality within Web Design: Examples & Tips said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Practical Tips for Taking Design Inspiration without Copying | Vandelay Design Blog said:

    [...] from Function has written an excellent article, How to Spot Quality within Web Design: Examples & Tips, that is a must-read on the subject. In this article he points out the impact of design details and [...]

  • Alaska Web Design said:

    Very nice tips, but what a long post. Thanks for the info. Unfortunately, my attention span didn’t make it through to the end.

  • Webmaster X said:

    This is great. I especially like the subtle pixel popping techniques. I’ve been using them lately and they make a HUGE impact on the final feel of the site.
    I could also add that one of the things I “subconsciously” look for or notice on a web site is the contrast of elements. Each should be able to stand out well, and blend with everything else at the same time.
    Thanks for the post :)

  • KalisJohn said:

    Quality work is work and work is our word. So, in every web design the quality work is important and also accuracy is also necessary.
    I have few information about one Web design company. Red Spot Design is a full service Dallas/Fort Worth (DFW) Web Design and Search Engine Optimization Company - Call Today 214-432-1608. For more information about, Dallas web design and web design Dallas.

  • Jasmin Halkic said:

    Very nice post, really useful.

  • lkasjd lasl dk said:

    ASD ASKDJHAS ASD KLASD ASDASMNZXCM ASDASMNZXCM

  • Simon White said:

    Excellent!

    Thanks for this.

  • Travis said:

    It’s amazing that “designers” undercut each other today, and make expertise and knowledge as displayed here undervalued.

    Thanks so much!

  • CSS Gallery said:

    Great line up. We will be linking to this great article on our site. Keep up the good writing.

  • Fort Myers Web Design said:

    You have some really good points here that have been in use for years however the navigation section I don’t agree with. Some of those examples are overly complicated and take away from the usability. Great design is important but it should not impede on functionality.

  • ????????: ????? | Living the dream said:

    [...] ????WeFunction???? liam?????2009?4?13?? ??????????????http://blog.benhuoer.com/2009/05/quality-within-web-design/ ? [...]

  • What Space Means to Web Design? | Missouri Website Builders said:

    [...] How to Spot Quality Within Web Design [...]

  • Phil said:

    Great post, well written and very useful as we look to revise some of our gift sites in time for Christmas. I particularly like the section on spacing and the subtle use of gradients and pixel perfect details. Some brilliant ideas. Thanks.

  • Mit?l lesz jó a webdesign? | Blogzóna | VENTOSA kreatív stúdió said:

    [...] cikk, mit?l lesz jó egy weboldal (példák, tippek): http://wefunction.com/2009/04/quality-within-web-design/ Könyvjelz?k közé ezt az [...]

  • Web Designing said:

    A great guide!, will prove a very good resource in the office! cheers guys!!!

  • telefon dinleme said:

    Quality work is work and work is our word. So, in every web design the quality work is important and also accuracy is also necessary.
    I have few information about one Web design company. Red Spot Design is a full service Dallas/Fort Worth (DFW) Web Design and Search Engine Optimization Company - Call Today 214-432-1608. For more information about, Dallas web design and web design Dallas.

    telefon dinleme

  • dinleme cihazlar? said:

    yes its right.. thank you

  • Moodstudio ~ Blog sobre Diseño web - Negocios Digitales - Marketing Digital - Diseño Gráfico - Córdoba, Argentina said:

    [...] articulo es una traducción al castellano de How to Spot Quality within Web Design: Examples & Tips Fuente: [...]

  • Jackyon All Day-??,jackyonphotoshop,??,div+css,javascript,??,?? » Quality within website said:

    [...] http://wefunction.com/2009/04/quality-within-web-design/ [...]

  • Nits said:

    Great post nice guideline for new bloggers who looking for get most out of his blog.

  • wordpress web tasar?m said:

    nice design. really . soeone use them

  • Leon Dudovich said:

    I pick this website builder http://www.site2you.com, they got a tones of cool templates, its not a professional design, but it something that you can use to create your own website.

  • Vipin said:

    One of the GREATEST ARTICLE i have ever read in my web development career, will support me very well in my office. Thanks alot!!!

  • Function Web Design & Development Blog - » Beautiful Post Thumbnails: Top Examples & Best Practices said:

    [...] the top of a photo once again, just another example of how this can work so very well. Remember our quality tips too when putting together any [...]

  • Lustige Videos said:

    Thanks for this great guide! It’s really useful

  • PSD to xhtml coder said:

    This post very much helpful…
    I think the uniqueness and the clear look mainly represent quality and creativity in web design……

    let me know what you guys think….

  • Beautiful Post Thumbnails: Top Examples & Best Practices - Programming Blog said:

    [...] the top of a photo once again, just another example of how this can work so very well. Remember our quality tips too when putting together any [...]

  • spy phone said:

    Quality work is work and work is our word. So, in every web design the quality work is important and also accuracy is also necessary.
    I have few information about one Web design company. Red Spot Design is a full service Dallas/Fort Worth (DFW) Web Design and Search Engine Optimization Company - Call Today 214-432-1608. For more information about, Dallas web design and web design Dallas.

  • web design chennai said:

    The designs are excellent

  • WebDesign, Template et Logo « e-Devblog.com said:

    [...] Function – Article sur le WebDesign [...]

  • Berita Harian said:

    wow..comprehensive details :)
    Thanks for the guide! really helpful

  • 3g said:

    Problem with the twitter gadget, the top image is not showing under the video. Can anyone help me please?

  • Immo Turkei said:

    Great tips !!!
    Thanks for a really good and well written articles.

  • Property Turkey said:

    Thank you for the usefull informations its really very good that people share their expreriences

  • casus kamera said:

    I think quality is one of the most important thing for designers.
    Thanks for useful information.

  • gizli kamera said:

    I think time and the quality is one of the most important thing for designers.
    Thanks for useful information.

  • dinleme cihazlari said:

    True that is right though..I think all these themes are great … and they are very good quality job.

  • casus kameralar said:

    Most designers and webmasters who i know they do not care about quality when designing. They care for more functionality but in my opinion quality is always the first step.

  • Webplore said:

    Really informative post. helped me alot. thanks.

  • Beautiful Post Thumbnails: Top Examples & Best Practices | meshdairy said:

    [...] the top of a photo once again, just another example of how this can work so very well. Remember our quality tips too when putting together any [...]

  • Justin Howley said:

    Wow, bookmarked this page. Such an in depth resource.

  • ???????? | Don VUIzone said:

    [...] ????WeFunction???? liam?????2009?4?13?? [...]

  • evden eve nakliyat ve depolama said:

    evden eve nakliyat ve depolama hizmetleri
    …] Ad?: Zinmag-futura Tr Tema Sahibi: topwpthemes.com Orjinal tema : zinmag-futura Themes Türkçele?tirme: Mavinefes.net ve Wptema.com Türkçe Önizleme: Buradan ön izleme yapabilirsiniz […]

  • Jonathan Roye said:

    This is a great post! It helped a ton. Keep it up@

  • medyum said:

    All the 7 points are equally important for a great web design. And the article is quite a learning experience. The further you read the more you learn. Great work…

  • medyum said:

    Most designers and webmasters who i know they do not care about quality when designing. They care for more functionality but in my opinion quality is always the first step.

  • telefon dinleme program? said:

    yes I particularly like the section on spacing and the subtle use of gradients and pixel perfect details. Some brilliant ideas. Thanks. They care for more functionality but in my opinion quality is always the first step.

  • Web ?????????????? | Nutspress said:

    [...] ???????????????????????? ????????????? ???????Web???????“????Web???”????????????? 50 Sites That Will Help You To Become a Better Designer 42 Free Online Magazines for Designers 45 Must-See Incredible Resources And Inspirational Collection To Discover The Best Of The Web In January ?????????? ?????????????? UX Madness – 20 Fantastic Resources For User Experience Know How 160+ RSS Feeds For Web-Designers And Developers 13 Most Desirable Collection Of Free Resources For Every Designer Sketchbook for web designers Collection of free resources available for designers to download 10 Usability Tips for Web Designers Five Minute Upgrade – Making Your Design Pop 101 Examples of Text Treatments on the Web How to Spot Quality within Web Design: Examples & Tips [...]

  • Dog Training Leads said:

    That’s a great article. Thanks.

  • BigM75 said:

    thanks for the details is nice

  • Houshang said:

    In a word, WOW! You definitely help solidify a few things in my mind about design. Great job in keeping it crisp and to the point. I really liked the way you reiterated the main points at the bottom of each section.

  • discount tiffany jewelry said:

    That’s a great article. Thanks.

  • Single said:

    Your site doesn’t correctly work in Safari 4 in Mac OS X (4Version) :( Please help me How can I remove the problem?

  • ankara nakliye said:

    Very nices article.
    thank you all..

  • Intro to the Web « Design Intense said:

    [...] Design Tips [...]

  • sandeep virk said:

    i like the tips. it’s help me a lot.

  • Julien said:

    Nice post, full of nice references.

  • Liminal - Website Design said:

    Really nice article, there is a lot of junk out there - these are awesome though!

    Currently updating my bookmarks for good design resources so this is definitely going on the list!

    Ryan

  • Chicago Web Design said:

    Great resource here for anyone looking to improve on their web design skills. Anyone from a beginner to an expert can benefit from reading this.

  • hosting india said:

    It’s been a while since I read a truly excellent blog post. Not only well written but relevant. Congratulations.

    Now I’m off to visit my own site and see how I can make it better

  • Tiffany Necklaces said:

    The Tiffany nesklace is
    both great in quality and reasonable in price,it is also fashionable and good looking.

  • Brand Green said:

    beautiful piece of info

  • Foodie said:

    Thanks a lot for the wonderful information

  • Recommended Articles « Dmitry Marduk Blog said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • izle said:

    Great resource here for anyone looking to improve on their web design skills. Anyone from a beginner to an expert can benefit from reading this.

  • A Report – Smithills Hall,House & Park « skye1985 said:

    [...]  Strengths  example [...]

  • dekoratif ayna said:

    thnxx youu admin good

  • dekoratif aynalar said:

    woooowwwss

  • Recommended Articles « kooljoy.com blog said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • Bob Ruffolo said:

    Very interesting and informational.

  • Boston Web Design said:

    Great Post.Thank you so much for this list, it really helps me out!

  • website design london said:

    Good post. it is really worthy for me.

  • uzman said:

    merhaba

  • sistre said:

    ankara parke silim cila sistre

  • sistre said:

    Ankara parke sistre cila

  • viettel adsl said:

    Very nices article.
    thank you all..

  • web said:

    I am definately bookmarking this page.

  • yaozhiming said:

    ???

  • yaozhiming said:

    ???

  • ????????????? - ???????? said:

    [...] ???How to Spot Quality within Web Design: Examples & Tips [...]

  • siteler mutfak dolab? said:

    Thanks a lot for the wonderful information ….

  • joro said:

    its verry verry usefull for me…

  • ahmet maranki said:

    Thanks for a really good and well written article. Great tips and examples…

  • siteler mutfak dolabi said:

    excellent read. thanks for posting this

  • boyaci said:

    I love the examples in this post. Thank you!

  • arac sorgulama said:

    I must say this is one of the better articles that i have seen! Keep up the good work!!

  • sepetli platform said:

    this isthe best site for machines

  • Subtiel webdesign « Snotaap said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • pavelitbay said:

    Really Great post!…guys… nice…one..

    by
    (http://www.itbaymarketing.com)

  • Hoe vind je kwaliteit in Web Design « Ilusix.nl said:

    [...] hier om het te [...]

  • Hediye said:

    I must say this is one of the better articles that i have seen! Keep up the good work

  • Favoriten said:

    Thanks for a really nice and well written article.
    excellent to read.
    Great tips and examples…

    Big Thx FAV

  • Net Relief Solutions said:

    This is a fantastic resource for developers and designers. It’s amazing how many designers do not take into account white space and font size for readability. Many will hopefully benefit from this wisdom.

  • spletne strani said:

    I must agree that to spacing and alingment are common mistake by developers.

  • Website Design Firm said:

    it is very informative post and these some very common mistakes that the web developers do so it is the responsibility of the web development services department to make a good and creative web design….

  • mirfey said:

    hi, thanks for all to you web site

  • mehmet said:

    I must say this is one of the better articles that i have seen! Keep up the good work

  • hassan said:

    I am definately bookmarking this page.

  • wptidbits said:

    Wow! I never thought that all these websites would really care small things such as a pixel line, color mixings and background. Really an eye opening! Maybe that’s what they call difference between experts and amateur. Anyway this really a great post. I’ll keep it as master-guide in website design. Thanks!

  • graphic design classes online said:

    Incredible post, I am a huge believer in white space. It is the most important part of web design and can have such a HUGE impact.

  • hey said:

    this website is awesome

  • indir said:

    so thank you mf.. really good web site

  • gizli kamera said:

    I’d love to say something insightful or beneficial to other readers here, but I can’t think of anything. Great work!

  • graphic design colleges said:

    Great tips white space is my favorite “design tool” to use when creating websites. it can have such a great impact with very minimal work.

  • Pflegetagegeld said:

    Really nice article, thanks for this useful information.

  • hmu111 said:

    Thank you for idea and good work.

  • evrent said:

    Great work excellent to read!

    Big Thankzzzzz

  • Wheat said:

    Hi,

    Nice post thanks, for it your information so good about web design.We are leading web designing and development in India. Our developer’s are expert in his field. Your information is such helpful for us.
    Web Designing Company

  • Web Designing India said:

    Hi,

    Nice post thanks, for it your information so good about web design.We are leading web designing and development in India. Our developer’s are expert in his field. Your information is such helpful for us.
    Web Designing Company

  • Penny Bid Auctions said:

    OH MY GOD!! what a beautiful graphical way to spread the information about quality web design. it generates readers’ interest within. Keep the good work continue. Expectations got higher.

  • kapadokya said:

    Thanks for the info. This was very interesting.=)

  • sagem said:

    thanks you everybody

  • xerox servisi said:

    Thanks a lot for the wonderful information

  • kyocera servisi said:

    Thanks a lot for the wonderful information

  • mita servisi said:

    Thanks a lot for the wonderful information

  • seo said:

    Nice list…..This is really a good post.Thanks for it……

  • Bay Area Web Design said:

    what a deep knowledge of designing do you have… awesome! thanks for such a great post and keep posting please.

  • Best of 2009 « qeqnes | Designing. jQuery, Ajax, PHP, MySQL and Templates said:

    [...] How to Spot Quality within Web Design [...]

  • Hediye said:

    Thanks ,,, really good work

  • murat said:

    thank you

  • How to Spot Quality within Web Design: Examples & Tips : ArtyDuddy – Aggregator of the Best Blog Posts on Design. said:

    [...] Read this article: How to Spot Quality within Web Design: Examples & Tips [...]

  • Wheat said:

    Which is your new post plz give me the link.

    Software Development India

  • Beautiful Post Thumbnails: Top Examples & Best Practices « Son Of Byte said:

    [...] the top of a photo once again, just another example of how this can work so very well. Remember our quality tips too when putting together any [...]

  • cssclassic said:

    Very Excellent Posting

  • Suvarna said:

    what a deep knowledge of designing do you have… awesome! thanks for such a great post and keep posting please.

  • casus kulakl?k said:

    thank you for nice comment.. casus kulakl?k

  • Dave Y. said:

    Have to say, this is my favorite post from any design blog. I’ve read it a 100 times, but any time I’m working on a project I always read it again to get into my design mindset. Thanks for producing the best content!

  • Sharepoint said:

    Great post! Thanks for sharing

  • Suresh said:

    Just excellent, thanks

  • Webdesign???????? : SS labs | SS labs said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • niroshan said:

    The better post,thanks very much for your post

  • Paginas web Guatemala said:

    Great ideas for the implementation of a web design. Thanks for sharing all this information!

  • karton kutu said:

    thank you for good write

  • Joe said:

    Really enjoyed this post.

    It really helps show everything that goes into a site and all the little details that makes a good looking site look great!

    And also the difference between an average designer and an experience one.

    Thanks

  • mühendis said:

    I really enjoyed reading an article. As some sentences, but generally did not like full turn. health into your hands. good work.

  • wood door said:

    Great ideas for the implementation of a web design. Thanks for sharing all this information!

  • argehaber said:

    some sentences, but in general did not exactly turn a nice and helpful article. Thank you and good work.

  • munir ardi said:

    You thought your desktop looked okay? Think again before you visit
    http://wefunction.com

  • simple world said:

    http://wefunction.com
    is the best web for web design

  • DemoGeek said:

    The NetSetter link on Typography section is not correct. It should be pointing to http://www.THEnetsetter.com (instead the word THE was missing and pointing to a parked domain).

  • Damian Scattergood said:

    Excellent Tutorial, Space, fine detail and beauty make a brilliant design.
    Beautiful design is the international language of communication.

    Now if only I could leave a comment in 1 pixel!.

    Cheers
    Damian

  • Nic said:

    Its the subtlety in design that screams quality ! Great insight Liam, an inspiration !

  • Duane said:

    One of the best posts I have read in a long time - must read for all budding web designers.
    Thank you!

  • poperechny said:

    Thanks!Great article!

  • Adrian said:

    Great article, I’ve bookmarked this page and have a feeling I’ll be returning to it regularly.

    Thanks

  • Photoshop-Weblog | 100+ Photoshop Tweets in my first Week said:

    [...] How to Spot Quality within Web Design: Examples & Tips [...]

  • saç ekimi fiyatlari said:

    Oh danile very nices play goods.

  • Top Ranking said:

    hm, well, thats interesting. I have to admit that these spaces really do have a great effect on how attractive a website looks. well, the problem is how do I know upfront if a designer is capable of doing this???

Your Name: (Required)

Your Email Address: (Required but will be hidden)

Your Website:

Your Comment: (Required)

Note: Use [sourcecode language='your-lang'][/sourcecode] around your code please.


Our Motto

We Pride ourselves on giving you Great design & Functionality, providing a website that will impress on first looks, and continue to impress as you explore it.

We make it as easy as possible for you to look after once we've finished. So if you're after a website or blog design to freshen up you're site we're more than happy to help.