01183282496
  07703732396

Web design tools that we use

Some of the stuff we use.

If you are pushed for time, we have created a summary at the bottom of this post with links etc. 

We have always been a fan of posts where people share details of what they use to achieve the results they get i.e. the photographer that shares a ‘what’s in my bag post’, especially useful if they discuss some of their editing techniques.

So, what stuff do we use as web designers? We can’t discuss everything we use as that would just take too long. Instead, we will just mention our current favourites.

HTML editor, while 90% of websites we build are now WordPress we still need to be able to regularly edit HTML/CSS, it’s a lot easier to edit the code outside of WordPress our current favourite editor is Pinegrow web editor that lets us build responsive websites faster with live multi-page editing, CSS & SASS styling, CSS Grid editor and support for Bootstrap and even create WordPress themes. We must also give a mention to Atom a free text editor which we use daily.

Well before we complete any website design we do a lot of testing to ensure that the web design looks good across all devices and have no technical issues, we test over on real physical devices however where it is not possible to test over a particular device we fall back on using software emulation, the tool we use for this is the Sizzy App. The goal of Sizzy is to save time and increase the productivity of web designers like us. We can Work on your website and instantly preview the changes on multiple devices at once.

the sizzy app allows testing across multiple device types

As well as testing for layout across devices we regularly perform SEO technical audits on our website projects testing for broken links, incorrectly filled out meta and alt tags, and more. One piece of software we use for this task is 'website auditor' from 'link assistant'. This audit tool looks for such tech SEO issues such as broken links and images, duplicate content, poor mobile usability, site speed, redirect chains, internal linking problems, heavy pages and scripts, W3C validation errors, thin content, and more.

For photography and images, we use the Adobe Creative suite mainly using Lightroom, Photoshop, and Illustrator.

So now for some of the more miscellaneous but more fun stuff (or so we think)

Often when we are out and about, we see a colour we love, i.e. we see a poster with a colour that would be great on a website. In the past, we took a picture of it and then got an RGB value for it in Photoshop, but no more. Now we have a Nix colour sensor in which we can directly scan a colour into a mobile device it even suggests colour palettes with that scanned colour.

the nix colour sensor and smart phone app

For photographs that we capture for websites, we are currently using a Nikon Z 6 which is a mirrorless camera, at the time of writing Nikon has just named its successor the Z 6 ii. We also use the camera to make some of our YouTube videos which we edit in Blackmagic Davinci Resolve. And to finish off, while we work, we are usually listening to Music to ensure we don’t annoy everyone else in the office we listen via headphones our favourites at the moment are B & O H4 headphones that look and sound amazing.

Summary of tools mentioned in this article

Listed here are the tools listed, please note these ARE NOT affiliate links and we make no money from them.

  1. Pinegrow visual HTML/CSS editor
  2. Atom text Editor
  3. Sizzy App the Browser for developers
  4. Web Auditor by Link-assitant.com
  5. Abobe Lightroom
  6. Adobe Photoshop
  7. Adobe Ilustrator
  8. Nix Colour Sensor
  9. Nikon Z6 Mirroless Camera
  10. Black Magic Davinci Resolve, DaVinci Resolve is a color correction and non-linear video editing application for macOS
  11. B&O H4 Generation 2 Headphones.

Leave a Reply

Your email address will not be published. Required fields are marked *

Peppard Creative 

Established in 2014 we specialise in small business website design. Affordable web design in Oxfordshire, Berkshire and beyond.
web design directory
envelope-ochevron-downphoneenvelopephonebubblemenu-circlecross-circle linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram