Top 10 Web Design Tips

The basics of web design are invaluable skills to anyone. Whether you’re a computer whiz, just starting out or working in a completely different industry, being able to design your own website is a great skill to have on your CV. It may seem daunting at first, but it’s not half as difficult as you would expect. Plus, it’s pretty easy to practice at home! Here are our web design tips.

Web Design Tips

If you’re new to software development, you can still practice some of these web design tips. How? Set up a WordPress account to try out your hand at web design. You’ll be able to figure out the basics by following their easy guide to building a decent looking blog. Once you take the next step, to tweaking your website and making it look nice, you’ll need some tips. In this blog, we will look at ten helpful tips to get you started and make you a great web designer.

  1. Planning your website
  2. The layout of your website
  3. Choosing a colour scheme
  4. Choosing your typography
  5. Images and Videos
  6. Calls to action
  7. Make your site searchable
  8. Make your site responsive
  9. Start building a portfolio
  10. Get feedback

Planning your website

Before setting out to build your website, get planning. When it comes to web design, planning is key, and if you’re starting afresh on a website, then understanding the goal of the site and the customer journey from the moment they enter the site to clicking on the relevant CTA is key.  Every website should serve a purpose, and your user should be able to understand the use of your site from the second they come on. Planning allows you to map out their journey and the full purpose of your site. 

The layout of your website

The layout is key to a successful site. Even in your web browsing, you probably recoil when you see a website that’s not designed well. You should approach your own designs in the same way – if you don’t think it looks professional, neither will a viewer. Wireframing is key here. Wireframes let you simply layout a web’s page before you fully design it. With a wireframe, you can decide where images, text, CTAs and more sit on your page. Orbit Media Studios puts it nicely by saying that a wireframe is much like “your home’s blueprint, where you can easily see the structural placement of your plumbing, electrical and other structural elements without any interior design treatments.” 

Choosing a colour scheme

Get inspired and make good use of colour. The colour you use will be associated with your website forevermore, so choose wisely! Well-marketed websites are linked to their colours. The decision should match your product. If it’s a website selling children’s toys, blacks and greys should really be avoided. If it’s a personal website, you’re free to choose what you like. Check out ColourLovers to get inspired.

Choosing your Typography

The font you use is another important decision. It may seem simple, but the use of a nice font can make all the difference to your website. Test the waters – your own preference might not appeal to the majority of people. You might be a huge fan of Times New Roman which, in the last few years, has pretty much fallen out of fashion. Check out Typecast, a Belfast-produced app, to help you make an educated decision.

Images & Video

You’ll know from looking at any website that it’s just incomplete without images. Using pictures brightens up your design and makes it a more interactive experience for the website’s user. Of course, the size of the file you use and the type of image will come into play. Make sure the image takes up the right amount of space, which should be covered when you’re wireframing. 

Embedding relevant video, where necessary, can also help liven up your site. However, don’t add video just for the sake of it. It must be relevant for your user. Multimedia allows your user to find out more about your product, but also, it can help your SEO, which we will mention later.

Calls to Action

In our first recommendation, we talked about every site having a purpose. While some sites are not used for marketing reasons, many are. Therefore, the purpose of many of these sites is to bring the customer into the companies funnel. We do this through forms and calls to action, or CTAs. A call to action is often a button on a site or a form that asks the user to provide details on themselves, or indeed sometimes a call to action can be a button that takes the user to another part of the site. So, for example, a blogger’s CTA might be, click here to read my next blog. Or, if the blogger wants to make a database of readers for a newsletter, the CTA might be “sign up for my newsletter. Importantly, a call to action is often the “Buy Now” button, which of course is essential for eCommerce websites.

Another call to action could be as simple as adding your social media symbols and asking your users to follow you on social. 

Make your site searchable

By now, we should all know that a website is an extremely useful tool – especially if the site has been built for a business. A website offers a window for users to look into and find out about a company’s products or services. However, if no one can find that website, then what’s the point in having it, right? 

Of course, by paying for PPC (Pay Per Click) campaigns, people can be directed to your webpage, but ensuring that your content is optimised for search is a great way to get organic traffic to your website. Good SEO practices should help your readers to land on your site through the likes of Google and Bing searches.

Make your site responsive

Internet users now browse from devices of different shapes and sizes. This is related to our last point, when it comes to search rankings, etc, search engines take into account whether or not your website has been designed to accommodate different devices. For example, it’s now essential that a reader can view your site seamlessly on a desktop and mobile device. This is what we mean by designing your site so that it is responsive. It must be readable and well laid out for all kinds of devices – laptops, desktops, smartphones and tablets.

Start building a portfolio

If you’re embarking on a web designer career, don’t wait on the work to fall into your lap. Work on your portfolio during your downtime. You could be waiting for a while before you get commissioned, so practice all the time. Build sample websites every chance you get. It will help your web design skills and make your clients happy.

Get Feedback

Just like anything else you turn your hand to in life, feedback is crucial to your learning and development. Getting critique, though not always pleasant, will help your web development skills and improve the overall look and feel of your website. For feedback from your own peers, check out Dribbble, a social network for designers and digital artists to post screenshots of their work as they go, allowing them to tweak their designs if needs be.

Try Our Coding Challenge

So, they are our simple web design tips. However, if you want to sample what it’s like to design your own web page, try our free 5 Day Coding Challenge. On it, you will learn the basics of HTML, CSS and JavaScript. Register now through the form below.

Semantic HTML: A11y Series - 4

What is semantic HTML? Semantic HTML forms the building blocks of the web. They are the correct ingredients to make a cake. It’s the difference between putting 4 cups of flour into a bowl or putting flour, butter, sugar, and eggs into a bowl. One of those makes a cake (or in our case, a […]

Alt text with Images - A11y Series 3

What is alt text? Alternative text, more commonly known as alt text, is the text that users will hear if they are unable to view an image – an alternative option. Alt text is a short, written description of an image, which fully describes the image when the image cannot be viewed. Alt text is […]

Colour & Accessible Websites - A11y series 2

What does it mean to be colour blind? Colour vision deficiency, more commonly known as colour blindness, causes difficulty identifying and distinguishing between certain colours. This is usually genetic and is present from birth. However, it can appear later in life due to other health conditions, medication side effects, or exposure to certain chemicals. Many […]