Website Design

First Impressions on a website mean a lot, they can affect bounce rates dramatically, so getting key information above the fold is integral to entice the user to continue through my site. Information needs to be easy to find, relevant and look pleasant.

User Experience

I have learned about user experience and how it relates to the user’s online experience and journey. It uses existing beliefs, attitudes, and behaviours to create a more efficient and optimised user-friendly experience.

I have discovered that interactions can help to increase the ease of use, by encouraging positive ‘flow’.  A good interface allows users to navigate my site without getting confused or distracted, and will help users to feel like they are in control and are then more likely to have an enjoyable experience.

Design Elements

As well as good functionality, it is also important for me to create online interfaces which are presented in aesthetically pleasing way. As first impressions are formed within the first seconds of entering a new website. Typography, font size, layouts, and colour schemes are all important factors in creating credibility, as they help to shape users responses through aesthetic cues and their associations.

The following elements can help create good user experiences:

• White space

• Page speed

• Call to actions

• Interactions (thinks to do or click)

• Use bullet points instead of long paragraphs (easier to scan read)

• Headings guide the user (explains what the section is about)

• Pages must be uniformed and consistent in fonts and styles

Responsive Design

I have also learned about responsive website design, which is the process of designing a website that changes and adapts to different viewing screens, ie desktop, tablets, and mobile devices.

It uses flexible grids and layouts, and CSS media queries to automatically switch to accommodate for resolution, image size and scripting abilities. Creating fluid grids is fairly common practice, and there are a number of techniques for creating fluid images:

• Hiding and Revealing Portions of Images
• Creating Sliding Composite Images
• Foreground Images That Scale With the Layout

Portable devices are much smaller than the average desktop computer. I have learned that it is important to reduce or hide the content on smaller screen sizes so that the websites do not become too lengthy. I have also learned about how the user accesses information on mobiles and mobiles differs to desktop; users can not see hover images, as there isn’t a mouse cursor to hover. Users need larger link buttons and menus as it is more difficult to click on small text links. Images and text need to be resized so that information is easy to access on smaller screens. These subtle differences need to be considered when creating a website that is accessible on multiple devices.