5 Ways to Add a Bit of Extra Detail to Your Web Design

The Admin Zone

Whenever you're designing a website, it's generally a good idea to pay some attention to small details. Details can make the difference to a flat, boring, lifeless website, and a nice, usable, fun website.

Here are a few things to remember when working on the details of your site. If you follow some of these general guidelines, it can really help to improve a website to make it stand out a bit.


Making effective use of whitespace is a great way to improve on a website design. Basically, you can improve your whitespace simply by adding more space around important elements of a page, to give them more "room to breathe".

For more information about using whitespace in web design, you can check out a previous post at FWebDe: Using Whitespace For a Better Design.

Visual Hierarchy

Visual hierarchy in web design is something to consider when creating a new website design. The visual hierarchy should give visual cues to the user so that they can tell what is most important.

A common way of applying visual hierarchy in web design is by using the heading tags, <h1> through <h6>. This applies a visual hierarchy by separating sections of content by different font sizes.

Other ways of working with visual hierarchy include:

  • Colour
  • Whitespace
  • Position
  • Shape


To ensure a definite separation of completely separate elements on a page, borders can easily help to achieve this. They are very effective, and they usually just work perfectly.

But you don't need a thick border in between everything. It might be best to use subtle borders to separate key sections of a page.


Adding some dimension to a page can take a flat, boring design and make it "pop out". Adding some 3D elements to a page can be a fun way to add details to a design.

Some examples of uses of dimension can be use of subtle gradients, shadows, layered elements, and much more. Try out everything you can think of, and use what you think looks best.


Typography is a very important aspect of web design, with many little details to focus on. These details greatly affect the readability of the content, and the overall look of the design.

To improve your web site typography:

  • Choose the most readable font for your site.
  • Add appropriate line spacing (line-height).
  • Make sure the font size is readable.
  • Ensure some spacing in between paragraphs.

There are many more typography-related details that I could add to that list, but those are four that you need to remember, and if you apply those, you can greatly improve your site's design.

Do you use any of these tips to add more detail to your design? What tips would you recommend to add more detail to your website design?

Stay Updated

Did you enjoy this post? Don't miss a single post by getting free updates!