Web Design

Things to include when creating a website

Rules of thirds

Depth of field 

Lead lines 

Use of colour 

Navigation 

Design 

Language and terminology

 Usability (Jakob Nielsen) 

 Users/TA

Rules of Thirds

Rules of Thirds are like a guideline for when taking a photograph. Below is a photograph which I took showing the Rules of Thirds. If you were to look at the screen on your camera with the Rules of Thirds guidelines on you could get a better photograph by seeing the points. On the first photo there is a balance between the photographs as there is a section above the cave and below which is the floor. On this specific photograph I wanted the cave to be more towards the left and centre of the image to get more of the background into the image to make the image looks a bit fuller. The second image is showing more of the green hills and only 1/3 of the sky. The trees on the hill is then in the top right hand side of the pictures which doesn’t really make it the focus of the image it’s more of the green hill because it takes up 2/3 of the whole image. I actually took this photograph while on the move so I had to make sure I had the correct shutter speed to get the image quickly. When I saw it I knew I wanted more of the green hills but still to capture the trees in the top right corner of the image.

Depth of Field

Depth of Field is when the focus point in is the front of image of in the back of image which makes either the background blur or the front of the image blur because of where the focus point is. Below are two images which are showing depth of field. The first image is showing the object in the front being in focus and the background being out of focus giving it this blurred effect. The second image is showing the front object out of focus and the background in focus. On a DSLR camera to get this effect you should get close the object you want to focus on and then press the capture button in slightly so it doesn’t take the photo to make sure it is focused on the object you want to focus on. To focus on the background make sure the camera is slightly over the object in the for ground again press the capture button in slightly so you don’t take the photograph to then make sure it focuses into the image you are wanting to focus on. 

Lead lines

The lines in an image draw our eyes to another point of the image. Below is showing all the lines (pink) which makes our eyes then going to another point of the image which would be the background especially this image because the lines are all towards the bottom of the photograph and it makes you follow the lines up towards the rest of the photo as you look up. The second image is one I have found online to give you a better idea of the Lead Lines. You can see from the photograph that the lines between the pink flowers will make your eyes draw up to the windmill. 

Use of colour

When creating a website you must think of which colours may balance each other correct and which colours won't. Looking at colours wheels and researching into what each individual colour means could help your website. You wouldn’t want to use the wrong colours on your website each so you could always look at other websites to see the right and wrong in using colours on your site. You should also think about the colour of your text as well because if your background was bright and your text was bright you may not attract an audience as it may be too difficult for people to see/read. Make sure that you create a website which is suitable for different age ranges/target audience in the colour theory you use. Use colours which compliant each other and which will make your website give out a better look for audiences. 

Users and Target Audiences

When creating a website you need to think about the users and the target audiences for your website. If it’s a website for a younger audience you need to think about the content on the website which means having nothing inappropriate and which could cause harm or upset to the child and their parents. Don’t have anything explicit and rude which could affect any audience. When making your website you must take into consideration for varying target audiences which means males, females or both genders, the age ranges, demographics, job, sexuality and possibly their income. If you aim at the wrong target audience you may not get as noticed and a big as you may want to become via your website.

Navigation

There are three navigation which are Primary, Secondary and Tertiary. Primary (see image 1) would be things such as your navigation bar like ‘Home’, ‘Contact’ and it could also be a drop-down bar. Secondary would be what it understand your drop down bar (see image 2). Finally Tertiary is when you have clicked on something from the Secondary Navigation and it’s taken you to your new page where you can then select new pages to view (see image 3). Primary navigation is better off at the top or left hand side of the page because that’s the way that we read from so it’ll be better when it comes to people viewing your website.

Design

The design will be done in the colour mode of RGB because then the colours won’t be as in your face and CMYK is for print model rather than web based. The images you are going to use don’t need to be too over powering of your website unless it’s a photography site but then make sure you don’t have too many photographs next to each other and crowding your website. Your website needs to be consistent which means you should use guidelines (going back to rule of thirds about guidelines) and also making templates of your website so you have something to follow throughout the design stage. Kerning is the spacing between the letters of words make sure when making your website the kerning isn’t too close together or too far apart. Leading is the spacing between the sentences so again make sure this isn’t too close together or two far apart. You should also make sure that the typography is all the same size, font and colour.

Language and terminology

When looking at language for your website you should consider different audiences including your target audience because other audiences could be from different locations around the world and having something which could change the language of your website could attract possible buyers or interest from other people around the world. It also includes terminology because people might only be familiar with terms which as ‘Delete’, ‘Erase’ or ‘Empty Trash’. Some people might not know what words like ‘Expunge’ means which then means as well as thinking about using the correct language you must also use the correct terminology for your target audiences/other audiences. 

Usability (Jakob Nielsen)

When thinking about the usability someone you could research is Jakob Nielsen. He has become well known through web design circles even though he is not a graphic designer. Not everyone does agree with Jakob but he did hold a PhD in Human Computer Interactive. He thinks that you must learn to get the correct balance. Usability is describing the overall experience within Interactive Media (iMedia). Things to consider when thinking about the usability would be whether the Site Load-time Is Reasonable, Adequate Text-to-Background Contrast, Font Size/Spacing Is Easy to Read, Flash & Add-ons Are Used Sparingly, Images Have Appropriate ALT Tags, Site Has Custom Not-found/404 Page, Company Logo Is Prominently Placed, Tagline Makes Company's Purpose Clear, Home-page Is Digestible, Clear Path to Company Information, Clear Path to Contact Information, Main Navigation Is Easily Identifiable, Navigation Labels Are Clear & Concise, Company Logo Is Linked to Home-page, Links Are Consistent & Easy to Identify, Site Search Is Easy to Access, Major Headings Are Clear & Descriptive, Critical Content Is Above The Fold, Styles & Colours Are Consistent, Emphasis (bold, etc.) Is Used Sparingly, Ads & Pop-ups Are Unobtrusive, Main Copy Is Concise & Explanatory, URLs Are Meaningful & User-friendly, HTML Page Titles Are Explanatory and finally Number of Buttons/Links Is Reasonable.