Our guide to web design
 
 
Jade O'Donoghue

Our guide to web design

Our guide to web design

Published September 16 2014

When you look at a website, how much do you think about what’s gone on behind the scenes and how it came to look the way it does? Do you ever wonder why the search box has been placed at the top of the page or why the logo is the colour it is? Probably not, and that’s probably because someone has put so much thought into making it all look as great and intuitive as possible that they don’t even want you to think about all of that.

However, if you’re someone who visits a site and can’t help but think about the choice of colour or judge the arrangement of the icons, then you might want to consider studying web design and turning your fascination into a new hobby or even a career.

 

Behind the scenes of the internet

A lot of work goes into any website and the process that starts with an idea and ends with the finished product can be lengthy. To begin with, the client or manager of the project would come to a web designer with some ideas of how they’d like their site to look and the functions it should have. The web designer will then work on a ‘wire frame’ which is essentially a really rough look at how those ideas could be visualised. Generally this is done on a computer, but it could also be just a quick sketch.

Once the web designer has finalised what the client wants he/she will then move onto creating designs. Then, when these are finished, they will be turned into programming language so they can be viewed and interacted with online. This job might also be done by the web designer (as some can also code), or it may be taken on by web developers.

 

Technical vs creative

Designing for the web is quite different to designing for print. While the principles of what looks good are generally the same, sometimes the restraints of the internet mean you have to compromise what you see as best practice creatively. Things like the functionality of a site or SEO requirements for it can affect the designs you create.

You also have to create designs for every eventuality when it comes to the web because the page is likely to look different depending on what action the user is taking on the page. For example, if they roll their mouse over something, will it change colour to indicate it’s selected? On a typical web designer course you will be taught how to ensure your designs cover all the options of actions you can take on a web page.

 

The web designer’s tool box

On most web design courses you will try out the software used to create great looking websites. Here are some of the most popular names you’ll hear…

Photoshop

Photoshop is a type of photo editing software that many designers use, not just to edit photos, but for other web graphics too. You might be improving the colours in photos, resizing images for the web or adding effects to them so they stand out more. There are several different types of Photoshop software, depending on the level of editing you’re planning on doing.

Dreamweaver

Dreamweaver is used to design, build and manage websites. You might use it to do some coding but there is also a WYSIWYG editor so you can see what your website will look like as you make it. Dreamweaver is popular with web designers who not only create the look of a website but turn it into code and thus bring it to life.

Fireworks

Fireworks is used mainly for creating graphics and layouts for websites. It does a similar job to Photoshop in that you can edit images and optimise them for the web. It is also possible to design prototypes of apps using Fireworks and create animated GIFs.

InDesign

InDesign is predominantly used in print to create layouts for books, magazines, posters and other printed materials. However some web designers do use it for prototyping. It allows you to create layouts for websites fairly quickly so that you can show clients or developers how the site should look.

Flash

Flash is used to create animation on websites. It might be a banner advertisement across the top of the page that moves, or a graphic that reacts when the mouse hovers over it. Basically if there’s anything moving on your web page, you’ll probably be using Flash to make it do so.

 

Tips from a web designer

We asked Jai, Junior Designer here at Hotcourses a bit about his experience in web design…

‘I studied Multimedia Technology and Design at the University of Kent. My course covered so many different subjects. We did some programming, filmmaking, flash animation and even 3D modelling. Web design was actually only one module in my first year. There are certain sites that I think are particularly well designed. I would say Amazon, Smashing magazine and Mailchimp to name a few. Oh and Hotcourses!’

Similar Subjects

  • Apps
  • CGI
  • Content Management Server
  • Dreamweaver
  • Flash
  • HTML
  • Iphone
  • Javascript
  • Markup Languages
  • Photoshop
  • WordPress
  • Wordpress
  • XML
  • Browse all fun courses

Special offers

Basic WordPress Development (LIT03)

Next start: 23rd Nov 2017

Price: £300.00 £150.00

Where: London

Create, test and launch your first WordPress blog page! WordPress is the world’s most popular tool for creating websites. This course will...

Web Design Course

Next start: 28th Nov 2017

Price: £690.00 £621.00

Where: London

Web Design Course Description Learning Web Design and Graphic Design can be a fun and very exciting experience if the environment is...

HTML & CSS Combo Essentials Introdu...

Next start: 04th Dec 2017

Price: £450.00 £425.00

Where: London

This 2-day Essentials course will cover everything you need to get started with producing HTML and styling your content with CSS. You will learn...

HTML Training

Next start: You choose

Price: £199.00 £59.00

Where: Online Course

Web Developers are well-paid and in high demand at the moment, so if you want to work in this area you can enjoy the perks of this fantastic...

HTML Essentials

Next start: You choose

Price: £499.00 £299.00

Where: Online Course

HTML is one of the main programming languages that power the internet. And once you master it, you can begin to create your own web content,...

Creating a Google AdWords Campaign

Next start: You choose

Price: £99.00 £39.00

Where: Online Course

Many companies advertise with pay per click ads. This course focuses on the largest machine available: Google AdWords. In this course,...

HTML Essentials Online Training Cou...

Next start: You choose

Price: £120.00 £59.00

Where: Online Course

COURSE DESCRIPTION HTML is one of the main programming languages that power the internet. And once you master it, you can begin to create...

WordPress Introduction Masterclass

Next start: 06th Dec 2017

Price: £474.00 £379.00

Where: London

This 2-day Masterclass course will help you to appreciate the power and flexibility of WordPress, the world's most popular free tool for the...

CSS Essentials Online Training Cour...

Next start: You choose

Price: £120.00 £59.00

Where: Online Course

COURSE DESCRIPTION Whether you’re a web developer responsible for thousands of pages or a freelance web designer working on websites for...

Adobe Dreamweaver CS6 Essentials On...

Next start: You choose

Price: £48.00 £27.00

Where: Online Course

Our Adobe Dreamweaver CS6: Essentials will give you the tools needed to plan, design, create and maintain compelling websites. Instructor and...

Adobe Edge Animate Essentials Onlin...

Next start: You choose

Price: £48.00 £27.00

Where: Online Course

With our Adobe Edge Animate: Essentials online training course you'll learn a new motion and interaction tool for creating animated, interactive...

Microsoft ASP.NET AJAX Online Cours...

Next start: You choose

Price: £48.00 £27.00

Where: Online Course

Build rich, dynamic, and interactive web applications with the Microsoft AJAX Library. This video series, explores not only the slick user...