Top 10 Web Design Tips

web design

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

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. Here’s ten helpful tips to get you started and make you a great web designer.

1 Layout

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. According to Rhys Little of Plug and Play, the use of a grid is the optimum way to design your website. Photoshop or GuideGuide are the most recommended programmes for this.

2 Colour Inspiration

Get inspired and make good use of colour. The colour you use will be associated with your website forever more, 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 realistically be avoided. If it’s a personal website, you’re free to choose what you like. Check out ColourLovers to get inspired.

3 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.

4 The Client

Think about who the website is for. Is it for a prospective employer? Keep it neat and professional. Is it for children? Make it fun and interactive. Involve your client. If the website is selling a product, test run it with people in the industry. They’ll know what the want to see online and what they want to avoid.

5 Prototyping

You won’t get it completely right first time around, nobody does. Don’t beat yourself up over it, you’ll be able to use the old trial-and-error system til you get a website that you are happy with. Use prototyping tools to get an early version of your website in front of the client as soon as possible. Get the okay for your prototype before you start adding layers to your website; this’ll make life much easier.

6 Portfolio

Work on your portfolio during your down time. If you’re embarking on a web designer career, don’t wait on the work to fall into your lap. 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.

7 Planning

Before setting out to build your website, get planning. As with anything, planning is key. One tip, from Elliot Fienberg, is to map out how the design will look on a small piece of paper like a Post-It note. “This will help you figure out what’s really important and what can be omitted”, he says. The small size of the page simulates the attention span of the average internet user.

8 Images

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. Martin Beeby’s advice is to export images as an 8bit PNG file.

9 Videos

The vast majority of websites these days will have embedded videos. Multimedia is the key to designing a successful site. FitVids is a nifty little tool that makes sure your video resizes responsively. HTML5 has simplified video embedding but where HTML5 isn’t supported, video resizing can be an issue. FitVid is the perfect plugin to sort this problem out.

10 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.

Attributes that You Might Have if you Want to succeed as a coder or software developer

Recently, a group of 15 year-olds from across the world were assessed in various subjects.  The UK came in at #26 for Maths and #20 for Science.  This is a significant decrease since the last time this assessment was taken in 2009.So, it is purely a maths and science bent that will determine your success […]

Which Programming Language Is Best For You?

Programming is everywhere today – it’s one of the top career choices for budding IT aficionados. As with anything else, there are lots of choices when it comes to choosing what is the best avenue for you. It’s even something that Barack Obama is asking of his countrymen, to learn coding. Which programming language is […]

Responsive vs Adaptive Web Design

Responsive design and adaptive design aim to achieve the same thing – a website that works on whatever size of a screen you are looking at. However, while both strive to achieve the same thing, how they achieve that goal is different.  Why Responsive and Adaptive Design?  In general, Google encourages a push towards mobile-friendly […]