What follows are my top 10 web design tips from me (a professional web developer – amongst other things).

A quick synopsis of my web design process

A quick synopsis of my process is to the the UX design, or wireframes in Balsamiq, and get the structure, navigation and content agreed with the content. Then I move on to the graphics, fonts and colour scheme, for which I use Sketch. I will either build the site from scratch – if the client wants a static site, or I will build it in WordPress if the client wants a content management system, and/or blogging tool. Alternatively for eCommerce, I will tend to build on the Shopify platform.

For building from scratch, I usually base the build on Foundation (see below), and for building the site in WordPress I will use Elegant Themes Divi theme, which is a great way of constructing a responsive site in WordPress, that is very close to the original UI design in Sketch.

Top 10 web design tips

Here is a summary of the above web design tips and some others too:

HCL UX Design in Balsamiq

1) UX design – For UX design I use Balsamiq – ($89)

DTL UI Design

2) UI design – UI design gets fabulous using Sketch – (£100)

Canva - I don't sleep I code

3) For generating logos & graphics – So for generating logos and graphics, I use a variety of tools including Canva – ($free) or Gimp ($free)

DTL Magic Mockups render

4) For rendering on devices – Magic Mockups can be used for rendering websites and apps in situ in beautiful looking scenes – ($free)

Foundation building from scratch

5) For building from scratch – I use Foundation when building a static website from scratch – ($free)

Google Fonts

6) Fonts – And for fonts I tend to use google fonts; they’re awesome, free and easy to use – ($free)

Awesome icons

7) Icons – For iconography, I use awesome font, it’s fabulous – ($free)

Wordpress content management system

8) For building with a content management system (CMS) – For this I use WordPress for my content management system, and with WordPress installs, I use Elegant Themes Divi – THE best way to build sites! – ($89 / year)

Shopify for eCommerce

Worldpay for eCommerce

9) eCommerce – To build a full eComm site from scratch, I recommend Shopify, for integrating payments to existing site I use Worldpay

Unsplash beautiful photography

10) Photography and Imagery – And for all my photography & imagery I use unsplash; best photography website ever! – ($free)

Please share – and it would be lovely to hear others feedback about these tools.