Web Design Elements: Effective Web Design

Screen Shot 2015-09-06 at 6.45.24 pm

It’s slightly daunting to realise that I’m the only student in this semester without an engineering background, and has decided to challenge myself by taking up CS2024 Web Design & Technologies. I wanted to step out of my comfort zone, but why Web Design?

I previously did an internship at a Web Design agency as a Project Manager, and realised my deep interest in beautifully designed and interactively developed websites. Taking a closer look at these websites, I acknowledge that every single web design element on the website matters.

Each basic element, whether it is a Header, Navigation Bar, Hero Banner, Button, Sidebar or Footer, creates visual interest for the individual who visits the website.

However, based on research, 98% of websites don’t achieve their intended goals. That’s 55 out of 56 million websites. But why is that so?

There are several reasons:

(1) Poor Web Design

There are a lot of websites that are not aesthetically pleasant because content is cluttered and layout is complicated. This will dissuade the user to interact with the website, and distracts him or her away from the main purpose of the website.

(2) Low Engagement

I believe this relates largely to the Body as a web design element, where copywriting plays a huge role in creating engagement.

“Content is King. Serve up something interesting.”

(3) No Reach

Without traffic, there will be no reach. A good website should aim to create traffic (apart from SEO) by playing on an effective web design that will attract people onto the website.

(4) Weak User Experience

The user needs to have a seamless and smooth experience when navigating through a website. Nothing frustrates them more than a website that’s tough to understand and confusing to navigate around.

To fix this, there are 3 keys to an effective website.

(1) Form & Function

Screen Shot 2015-09-06 at 6.15.13 pm

An effective website needs to have Clear Onboardings, Neat & Structured Layouts, Strong Call to Actions, and Beautiful Typography to appear aesthetically pleasing.

This can be achieved by a few crucial web design elements:

(1.1) Space

Consistency is key. Space dictates everything from flow to readability. It also comes to create a focal point for users.

space

(1.2) Simple Navigation

Navigation should be easy to identify and easy to use.

Screen Shot 2015-09-06 at 6.49.39 pm

(1.3) Search

The tool is vital for repeat users. Make sure that it is unobtrusive and easy to notice.

Screen Shot 2015-09-06 at 6.50.16 pm

(1.4) Web Fonts

Beautiful typography enhances the aesthetic of a website.

font-status

(2) Reach

An effective website needs to make people want to visit it. “Acquiring traffic on the Web can be a breeze, but only when you take the right action steps.”

This means that the website must contain elements that are interesting and attractive.

(2.1) About Us

This page should tell users who you are and what you do.

about-8hour

(2.2) Informational Footer

Make the footer useful and keep it simple. A minimalistic feel would do great for this aspect.

footer-housing

(3) Conversion

Screen Shot 2015-09-06 at 6.46.03 pm

This would probably require, in my opinion, the most important web design element — Call to Action. “A website without a call to action defeats its purpose.”

(3.1) Call to Action

Call to action prompts need to be obvious and strong. Techniques such as colour, contrast and space can help lead users to the “right” buttons.

Screen Shot 2015-09-06 at 6.52.42 pm

References: 

Carrie Cousins (2013). 10 Crucial Elements for Any Website Design.

http://designshack.net/articles/layouts/10-crucial-elements-for-any-website-design/

Fixx Digital (2014). Effective Web Design.

http://fixx.sg/effective-web-design/

Lim Hui Kai, Kiven

6 September 2015