References & resources

I thought it might be useful to list the main resources and information sources that I’ve utilised while studying web development.


  • Buxton, B. (2007). Sketching user experiences: Getting the design right and the right design (3rd ed.). San Francisco, CA: Morgan Kaufmann Publishers In.
  • Duckett, J. (2011). HTML and CSS: Design and build Websites. Indianapolis, IN: John Wiley & Sons.
  • Duckett, J. (2014). JavaScript and JQuery: Interactive front-end web development. New York: John Wiley & Sons.
  • Krug, S. (2013). Don’t make me think, revisited: A common sense approach to web usability (3rd ed.). Boston, MA, United States: Pearson Education (US).
  • McCandless, D. (2010). Information is beautiful. London: HarperCollins Publishers.
  • Norman, D. A. (2013). The design of everyday things, revised and expanded edition (2nd ed.). Boston, MA, United States: MIT Press.
  • Redmond-Pyle, D., & Moore, A. (1995). Graphical user interface design and evaluation (guide): A practical process. New York: Prentice Hall Professional Technical Reference.
  • Rogers, Y., Sharp, H. M., & Preece, J. (2011). Interaction design: Beyond human – computer interaction (3rd ed.). Oxford, United Kingdom: John Wiley & Sons.
  • Weinschenk, S. (2011). 100 things every designer needs to know about people: What makes them tick? Berkeley, CA: New Riders Publishing.


  • Achecker – a great little tool for checking your site conforms to accessibility guidelines.
  • Codecademy – of all the online tutorials I tried, I found this one the most useful. It has a good balance of theory with enabling you to get stuck into the practice.
  • Colorzilla – a handy extension for Chrome or Firefox to identify colour references of any onscreen element
  • Colour Contrast Checker – a handy accessibility test to check your text and background colours have enough contrast for visually impaired users.
  • Creative Commons – a handy site to brush up on the rules around copyright with attribution examples etc.
  • CSS Tricks – does what it says on the tin, my searches on CSS questions would often bring me to this site and it was always very helpful.
  • CSS validator – a handy tool from W3C to check the quality of your CSS code.
  • CSS Zen Garden – a CSS design bank, great for inspiration on the abilities of CSS.
  • EnvatoTuts+ – a source of free tutorials and general info, I found this article on CSS selectors particularly useful.
  • Favicomatic – a cool little tool with a fun design that converts your image into favicons in a load of different sizes for different devices.
  • Font Squirrel – has a lot of fonts, including free ones, that aren’t on Google fonts.
  • Font Spring – fonts plus some handy tutorials on how to install them.
  • Free WordPress Headers – the source of my rotating rainbow images on this blog.
  • Google Developers – sometimes a little technical for me but I found one or two useful tidbits on here.
  • Google mobile-friendly test – this is a quick and easy way to get feedback on your site’s mobile-friendly status.
  • hCard creator tool – useful to create the hCard tags for addresses, although I did make further edits to mine to swap the <div> tags for <p> tags.
  • HTML5Doctor – a great resource to help answer tricky questions on HTML5, I was grateful for their advice many times.
  • HTML5Rocks – another great resource for troubleshooting HTML5 issues.
  • HTML validator – a great tool from W3C to check your HTML code for errors.
  • Khan Academy – a well-constructed online educational tool, covering the basics.
  • – a handy tool for condensing image sizes.
  • – a huge bank of online video tutorials on a wide range of topics, covering web development, business, creative skills and much more.
  • Meyerweb – provider of a very useful reset stylesheet to help your site manage browser inconsistencies.
  • Mozilla Developers – sometimes a little techie but a few handy hints to be found.
  • Nibbler – a nicely-designed tool to check the quality of your website. It doesn’t like long URL strings though, only top level domains.
  • Online-Convert – this site has been very useful to convert my .mov videos into .mp4 and .webm files. It does other types of image and document conversion too.
  • Pixabay – I relied on this site to source most of my license-free images for this blog. A godsend.
  • Simple HTML Guide – yup, that’s what it is.
  • Smashing magazine – another useful source of info with a sizeable bank of articles on all things code-related.
  • Stack Overflow – a developer forum with a huge amount of content, which can be a little overwhelming to wade through but you might find some gems of information.
  • Sublime Text – an excellent text editor tool that colour codes each element to help you spot mistakes and read your code.
  • W3Schools – another mainstay for me, I have been on this site daily for the last few weeks as it has a huge amount of useful information about HTML, CSS and more.
  • Udacity – another good source of online training, often with contributions from major corporates like Google. I found this tutorial on responsive design helpful.


I learnt a lot from my attendance at these events this semester:

  • NNG UX Conference – I was fortunate to attend this prestigious 7-day event this year, getting training from some of the best in the business on a variety of practical UX techniques.
  • UX Brighton – a great resource to have locally, bringing together inspiring speakers on UX topics in a one day event.

I would like to thank everyone that’s been involved in putting together these websites, books and events, as they have been an invaluable source of information and inspiration to me throughout my studies.