Web Design

What Is Web Design? – Essential Guide

What Is Web Design

Most of us will have arrived at this page roughly knowing what web design is, but there are the finer details and for the typical business owner this is where things can start to get sketchy. What is really involved? Can I do it for myself? Do I need a web designer or a developer?

At the most basic level, web design simply involves the publication of information on your own website and domain for the world to see. But things would look fairly basic if you this approach. It would be a website, but without any creative design flare. And this is typically the difference between knocking something up on Wix and appreciating the benefits that a good web designer can bring to the party.

Web design actually involves a range of different skills including; web orientated graphic design, planning and conceptualisation, user experience and interface design, working with the tools and HTML markup / code, copywriting, marketing and search engine optimisation, and the technicalities of publication.

Often many individuals will work in teams covering different aspects of the web design process, although sometimes a designer will cover them all. A single person covering all aspects is particularly likely in the development of a small business website, where a freelancer or smaller web design company may be hired to undertake the task.

What is the Difference Between a Web Designer & Developer? (and does a web designer need to be able to code?)

Does a Web Designer need to be able to write code? Not necessarily. Or more specifically it depends to what extent is meant by 1). ā€œwriting codeā€ and 2). How complex the project is? Most websites do not require a skillset which could be genuinely described as development. This is particularly the case in the modern age. Complex websites can now be built without ever writing a single line of code, since the advent of powerful website building tools like WordPress.

The difference between web designer and developer is a developer is primarily concerned with the mechanics and lines of code that goes into the backend of a website, app or piece of software. A designer is more concerned with the front end, or visual aspects of a website and its construction. A designer will typically take the tools a developer has developed and use them to help build a website. Generally, a good developer is not a very good designer and vice versa.

There is however overlap, and to be able to build a website a web designer needs to have an awareness of development, good HTML (structuring markup) and CSS (styling markup) skills, and a basic working knowledge of JavaScript and jQuery (client side code). This level of technical skill does not make them a true web developer, but this may feel the case to someone from outside the industry ā€œhaving a goā€.

Do All Web Designers Have a Similar Skill Set?

The simple answer is no. There are obviously strong similarities between all web designers – they build websites. But some web designers will be better at the visual side of web design and others better at the technical side.

This is important to consider when hiring a designer to help build your website. If your website is on the more complex end of the spectrum then a more technically orientated designer will be required. They will be better at plumbing all the plugins and advanced configuration. On the other hand, if you want to create a glossy website, you would be better suited with a designer who leans towards being more of a graphic designer.

When Do I Need to Hire a Developer?

The simple answer is either 1). The functionality required canā€™t be achieved using off the shelf plugins, or 2). The website is actually a bespoke platform.

In the first instance, if working with an agency they might have the internal resource to help resolve the problem. Or if working a smaller designer, you may be able to continue working with them and outsource the bespoke requirements using a marketplace like Upwork, Freelancer or Guru.

Examples of a platform include eBay, AutoTrader or Right Move. It is a full-scale digital business with a website. Having been in the industry over 20 years Iā€™ve lost count how many times a client has approached us wanting to ā€œknock upā€ a website for a few quid, only for to start sounding like an eBay clone. Creating a complex website with very bespoke functionality is by no means impossible. But it is wise to stop thinking about such projects in simple terms of being web design, and start thinking about the implications of setting up a fully digital business. In which case you will need a developer, and probably a team.

Is it Possible to Build My Own Website?

The short answer is yes. But before committing to undertaking the task, it is worth considering all the factors and whether it is the best use of your time.

If your web design requirements are quite complex, either technically or from a visual point of view, then it might be worth canning the idea building your own website right from the start. But it might be worth considering when 1). You have the time and only very basic requirements and 2). A website is not critical to your business. This is the situation for some small businesses who operate within their local community and their main sales channels include footfall, word of mouth, Facebook and other social networking. In this case a website is a great asset in an effort to support the business, but customers are less likely to be critical if your websites design isnā€™t completely ‘on point’.

If you are looking for your website to add a completely new sales channel and growth, or possibly replace something else which is dying, always consider hiring a professional to help.

Ultimately, whether or not it is a good idea to build your own website will depend on each individuals circumstance, including your patience, availability of time, how technical you are, ability to pick up new skills, and how good an eye you have with design and style.

As the Websites Owner, What Web Design Tasks Fall on Me?

If you hire a web designer to help build your website, unfortunately you donā€™t get off completely scot free. The biggest mistake a small business owner can make is to completely hand over the process and contribute very little. ā€œIā€™ll leave it to youā€ and ā€œletā€™s see what you come up withā€ are common phrases any web designer who works in the SME sector will have heard. The end result is likely to be very poor if you find this being the foundations of discussion with your web designer.

One of the main reasons to not build your own site is that you still have a lot of work to do. Possibly more than the web designer. Time is finite, and your time will almost always be better spent planning your website and its content, rather than getting involved in the actual execution of the design.

It you are fortunate enough to have someone acting for you in consultancy capacity, they are likely conduct a lot of probing, hound various departments, and drag vast amounts of information out. But if you are a smaller business, even if you have a designer who is most vigilant, you as the owner knows your business best and so ultimately best placed to gather content.

As the business owner it is essential that you provide as much information as possible about what you expect from the site. Visually, structurally, your goals, and information about your business including your unique selling points, services and products. Otherwise your website will end up being thin on content and not promote your company in the best light.

For example, say you were a plumber and went the extra mile of hiring a dedicated copy writer. The copy you get back might talk about what a plumber is, about radiators and what central heating systems do. The context may be all wrong. At the very least, it would be very ‘wooden’ and not relate to your business with any level of individuality, unless you had provided detailed information at the outset.

Similar goes for the overall web design. A web designer could be viewed as a ghost writer, but for the visual and technical elements of your website. The outcome is only likely to be as good as the raw input you provide.

Elements of Web Design

We get into the anatomy and elements of web design in other posts, here is a basic primer;

Static Vs Dynamic Website CMS

Websites fall into two basic categories, Static and Dynamic. A static website is a bunch of HTML files, similar to having lot of Word docs. Static websites are fast, but it is hard to maintain them. If you change something that features throughout the site, you will need to make changes in many pages.

A Dynamic website serves pages dynamically by pulling pieces of information together from a database. A Content Management System (CMS) such as WordPress is used as a front end, which makes maintenance of the website easy.

You can get flat file CMS / static page generators. But these are much less popular. For general use a dynamic CMS is much more powerful, flexible and easy to use. Any performance loss can be offset by page optimisation and caching plugins. Static pages are served most of the time, whilst other content such as shopping carts remains dynamic. Giving you the best of both worlds.

Responsive Web Design

Responsive websites adapt to screen size, so they function and look equally good on all devices; computers, tablets and smartphones. Mobile devices now account for over half of website traffic, so unresponsive websites are no longer an option. Websites must be responsive. There are alternative approaches such as having a separate mobile site or adaptive web design techniques. But responsive web design has won the day in most situations.

Graphic Design

Popular graphic design apps include Photoshop and Sketch. Designers will use these apps to create visuals including logo design, design mockups, image editing and photo retouching.

In many articles you will read about a design process which involves a designer creating a design in Photoshop before handing it over to a developer to convert into code. Whilst this process may be essential for large developments, it can be time-consuming and expensive, requiring multiple resources with different skillsets.

For smaller and simpler websites donā€™t be concerned about using more informal and fluid approaches. Other mockup tools might be better suited than Photoshop and even a pencil and paper can be effective to experiment with layouts and to lay down a basic website structure.

Modern page builders like Elementor for WordPress are very powerful and fluid to use. They feature many blocks which can be quickly assembled and moved around. They provide wireframing capabilities in their own right. With these tools a website can be the working prototype before being finalised into the published design.

Layout & Navigation

How content is arranged can have a dramatic impact on both the appearance and functionality of your site. Although there arenā€™t any specific rules when it comes to website layouts, there are basic principles you should follow. Basic principles include a clean layout which is easy to follow. Simple navigation helps visitors get around without confusion. Content must be well constructed and broken down into clear sections. If you have enough content include a discrete page for each key topic, as this will give your website better leverage with the search engines. A strong call to action (CTA) that encourages a visitor to take a decisive action, should be carefully considered part of your websiteā€™s layout and design.

An awful lot of analysis and testing can be performed with website design, but this is time consuming and costly.

Written Copy

Your website and its words go hand in hand, the two should never really be considered separate. The belief that the design, content and SEO can be dealt with on a separate basis is a common mistake made by small business owners. Aim to have content ready at the earliest phase of the design as possible. The content will then help define the websites structure and visuals, resulting in a much more coherent and powerful website.

Failing to take a unified approach can lead to performance issues in search and with conversions. Building on an already solid base is ok, needing to retrofit key content is a bad situation. It is a reason why SEO can become more expensive should be – because you are having to fix a lot of problems before moving forward.

Colors

Colors are one of the most important elements to consider when designing a website. Choose colors that align with your brand and the message you are trying to convey. There are misconceptions about the psychology of color, so keep this in mind when making your choices.

Fonts

The chosen fonts can dramatically affect the style and readability of your site. Never use too many different fonts and attention should be given to how fonts are paired. Google fonts can help discover, pair and implement fonts well.

Spacing

The consideration of space didnā€™t seem to feature very high in the days of early web, but it is now vitally important. All elements of spacing should be considered including paragraphs, letter spacing, images and sections of your page. As a rule of thumb, too much space is better not enough. The concept of whitespace is a strong features of modern web design, but donā€™t completely overdo it.

Images & Icons

Images and icons are a powerful way to communicate a lot of information quickly. A Google image search will give a lot of ideas, but donā€™t fall foul of copyright infringement. Use a licensed stock images such as https://www.shutterstock.com/

Videos

Videos are an increasing trend. When used properly, they can help convey a message and experience to your website visitors that simply canā€™t be described with words or images. But they should be used responsibly. When it comes to your homepage, consider if you are happy to prioritise video over having a lightweight page which is fully speed optimised. Videos, particularly with auto play enabled, can be distracting and should be placed to complement and not compete with your content.

Animations

Like videos, animation can help bring your website alive. But it is worth playing it safe by using them selectively and so to not alienate any visitor. Subtle animations that give feedback to using interactions on the site like forms and buttons, or ones that grab attention without being in an overpowering way, like a slider, can help improve the usability of the site.

Speed

Both visitors and search engines like fast websites. Regardless of how nice your design is, if it doesnā€™t load within a reasonable time, it will not perform in search or convert site visitors into sales. Always ensure you are using a good hosting package. If you choose to use WordPress, optimised hosting options are available and a wide range of optimisation and caching plugins.

Cross-Browser & Cross-Device Compatibility

A good website must look good and function well on all browsers and devices (see Responsive Web Design above). There shouldnā€™t be too many problems if your website is built using latest technologies such as WordPress with a good and up to date theme installed. But websites should be tested on a range of devices to ensure good compatibility.

There was a period in web design where the industry got hung up on compatibility with a very old version of Internet Explorer, but it started being at a detriment of websites being feature rich and working well on newer devices such as smartphones. Thankfully we have moved on from this now. Given that most traffic is now from mobiles and other modern devices, it is not worth getting too worried if you find a few formatting issues on an old computer from out your attic. It does not necessarily make your web designer bad at their job.

Share This

Send this to a friend