Introduction
Web design – When you open up the web browser on your computer, tablet, or smartphone what is the first thing you see?
A web page.
The internet is built on web pages, all of which have been designed for a specific purpose: to give visitors exactly what they’re looking for. On a well-designed web page, visitors can navigate their way around the page (and any subsequent pages linked to it) with ease and confidence.
A web page can be created in many ways, through coding such as HTML, CSS, JavaScript, PHP, XML and several more besides. You don’t need a solid grounding in computer programing to create a dynamic website either, with the creation of CMS or Content Management Systems (such as WordPress) – systems that do the programing for you.
So we’ve established that anyone can build a web site; it sounds simple enough, doesn’t it?
The truth is that it is simple enough with the right planning and structure. Before you even begin thinking about how many visitors your site will reach, you first need to consider how your site will be organised, how easy it is to navigate, the layout (including the colours and fonts you’d like to use and any graphics that will compliment them).
Sounds like a lot of hard work, doesn’t it?
Well, with the right preparation and planning, designing and creating your web site should be fairly straightforward, just keep in mind who you want to reach and how you might want to do that.
When looking at a web page, have you ever taken the time to really consider how it’s designed, how various aspects of it are laid out? The answer is probably not. A well-designed web site gives its visitors exactly what they want, making the site both easy to navigate and pleasing to the eye.
Web Design Principles
There are a number of design principles to consider when creating a web page (and web site). These include:
Balance
This encompasses the distribution of light and heavy elements across the web page itself. The screen which you view a web page through is usually rectangular, which means that nearly all well-designed pages are built on a grid system. This ensures that the content of your page is balanced. Too many heavy elements on one side will make your page look off-kilter and harder for your visitors to read.
Contrast
The basic definition of contrast itself is to place opposite objects in close proximity to emphasise the difference in them. In terms of web design, contrasting colours, sizes, shapes and textures can all be employed to create emphasis on the web page itself.
Emphasis
As mentioned above, when you emphasise something, the human eye is immediately drawn to it. This can be used to great effect in web design, drawing your visitor’s eye to the most important elements of your site i.e. placing emphasis on the sections of the page that you want the visitor to concentrate their attention on.
Rhythm And Repetition
We as humans love patterns and repetition – it helps us to understand and store information. That’s why it is so important that a web page employs an effective sense of rhythm. Rhythm ensures that the visitor’s experience is enhanced by the repetitive patterns of the page itself. Rhythm also makes it more likely that your visitors will remember the information displayed on your web site’s pages and increase the chance of repeated return visits to your site.
Unity
Just as contrasting elements can be used for good effect in a web page, unity is also another key factor to consider. The idea of unity is to keep similar elements together and diverse ones apart. Keeping similar elements in close proximity draws them together.
Web Navigation and organisation
The basic principles of design have been covered, but having a visually appealing web page is only half the battle. We also need to consider how the web site itself will be organised and structured. Having a pleasant-looking site is not enough, we need to encourage visitors to stay around long enough to look at the web site as a whole, rather than just landing on a page and leaving again quickly.
There are thousands of aesthetically pleasing web sites out there that are almost impossible to navigate due to more time and effort being placed on design and little or no consideration to the functionality and usability of the site itself. In order to make your web site both pleasing to the eye and easy to use, we need to consider the following elements in the planning stages of creating a web site:
Information architecture
Most web sites have more than one page. It’s important that a site’s home page structures the information in a systematic and functional way. Think of the architecture of buildings – all well-designed buildings are built on solid foundations and a structure that enables the building as a whole to remain stable and upright. The same is true of web sites – time and consideration must be taken in order to ensure that all information within the site is classified in such a way that it makes it easy for a visitor to access the information they are looking for.
Navigation
Think of this as your web site’s filing system. All businesses have a filing system of sorts whereby information can be recalled or accessed easily by retrieving the folder in which it has been filed. The same is true of a web site: information needs to be labelled clearly so that your visitors can gain access to the information relevant to their search. Your menus need to be clearly displayed on your home page to ensure that this task is made as easy as possible for visitors.
Organisation
This element neatly ties in with navigation. To ensure that your visitors can access the information they require, consideration needs to be taken of how the information is classified and organised within the structure of the site itself. If your site is relatively small, putting all of your web pages in one directory may be an adequate solution. However, if your site is large and contains a high number of separate pages, a better option might be to split the site up into subfolders. This also makes it easier to access in the future should the pages need to be modified or updated.
Once you’ve planned how your web site is to be structured and organised, you will then need to give consideration as to how it will be displayed to your visitors. Returning to the theory of design itself, the following should be taken into account:
Accessible
This means making your site accessible to as many visitors as possible, whether they use a computer, tablet, or smartphone to access your site. Although most web browsers support various plugins for Flash, JavaScript etc. it is best not to use these as your only means of navigation through your site. Why? If your visitors cannot navigate easily through your site from the homepage they will quickly leave and likely not return.
Meaningful
Make sure that your links are clearly and accurately labelled. The most effective way of doing this is to create navigation links with the idea in mind that someone who has never visited your site before should know exactly what each navigation link means and the information that they can expect to find there.
Understandable
Consideration needs to be taken in regards to accessibility for visitors who may be sight-impaired or using a browser that does not support the display of images. If images are a key part of your site’s navigation, then it is essential that you also employ alternative text so that your site can still be accessed and easily navigated.
Prominent
The navigation panes for your web site should appear on every page so that your visitors can easily return to previously visited sections of the site. Where at all possible, the overall structure of your site should remain the same throughout (this goes back to rhythm and unity).
Design Presentation
We then need to consider the layout of the web site itself – which fonts, colours, images to use, while also giving consideration to how large or small we want the text to appear on the page. When designing a web site, the use of standardised fonts and small images is a wise choice.
Why?
Visitors will soon tire of web pages that take too long to load or fonts that are hard to read and make the contents of your page almost illegible. The same is true of gaudy and contrasting colours – there are various colours that the human eye finds hard to read and using these in the design of your site could turn visitors away rather than encouraging them to stay.
Take into consideration the width of your text and ensure that it fits within the web browser so that your visitors don’t have to scroll from left to right in order to read the contents of the page. The images you add to the page should be relevant and enhance the page. Too many images will make the page slower to load. Too much text and not enough supplemental images will make the contents of your page look uninteresting and bland.
There are a number of simple tricks that can enhance your web site for your visitors and make it easier to navigate and read. Lines can be employed to add borders around certain elements such as images, vertical and horizontal lines can be used to separate differing elements within the web page using a grid-like structure.
You can also employ the use of shapes throughout the design of your web page in order to place emphasis on certain elements. Different shapes can be used to organize information throughout the web page. Textures such as soft, smooth, hard, and rough can be used to give your pages a tactile feel, separating backgrounds from the information provided on the page itself.
Conclusion
For the complete beginner, web design can seem like a headache and a big challenge to overcome. The good news is that you don’t need a degree in computer programing to be able to create a dynamic and powerful web presence. All you need is a clear idea of the purpose and direction that you want your web site to take. Research, careful planning, and an eye for what your visitors want are the key elements to making your web site a success. Giving consideration to the factors mentioned within this article means that you’re already halfway there.
Designing and creating a web site may not be something that you have time to dedicate to personally. Our team at DonCharisma.com are experienced in all elements of web design and would be happy to assist you with your project, do contact us at http://DonCharisma.com/contact/ for further information.