About this site

Explainers for Devs is the home for some of my teaching/learning materials. The explainers are written primarily for my students to help them understand the things I see them struggling with most frequently. Hopefully, others will find them just as useful. Like all good websites, this one is a work in progress. I tend to design organically rather than to a grand plan so it will likely change from time to time as new content is added and existing content is updated.

About me

I’m an educator whose been teaching at UK universities for almost 30 years. The Web didn’t exist when I was building a career back in the 1980’s, so I never got to study web design formally. By profession, I’m a Landscape Architect, but the Web has been a part of my life since I built my first website in 1996. If I remember correctly that first site was built using Microsoft Notepad and PaintShop Pro. I soon graduated to Allaire Homesite and Adobe Photoshop. When Macromedia bought Homesite and added it to Dreamweaver, I moved with it, but I fell out of love with Dreamweaver when Adobe bought Macromedia in 2005. I’ve been using a simple text editor since then. I spent a short while with Notepad++ before discovering Sublime Text. I’ve now been using Sublime for many years although I still miss Homesite's customisable menus and snippets.

So, I’ve been building websites for almost 30 years and have been teaching web design and development for over 20 years. I guess the explainers on this site are my way of sharing some of the learning I’ve done over the years. In the early days of the Web, I learned almost everything from a community of enthusiasts who blogged and wrote books about this exciting new discipline. Key to my learning were a couple of books, Web Standards Solutions (2004) by Dan Cederholm with a forward by Jeffrey Zeldman, and CSS Mastery (2006) by Andy Budd with Cameron Moll and Simon Collison. I have to thank those people for sharing their learning and for igniting a lifetime of interest. There are many others who have shaped my own understanding of the Web, including Jeremy Keith, Ethan Marcotte, Jason Santa Maria, Heydon Pickering, and many others. I thank you all!

Do feel free to get in touch with me, I'd love to hear from you. I'd particularly like to know if you spot any errors in the explainers or if you think they could be improved in any way.

About the content

All content on this site (words, code, and images) is designed, written and created by me, unless otherwise indicated. I have not and will not use Large Language Models (LLMs) to generate content. The act of writing helps me to think and to learn more deeply. The act of design and image creation helps me to think critically, a skill I do not want to lose. Using any form of Artificial Intelligence for content creation would deny myself the opportunity to learn and therefore to teach others.

About the logo

This site’s logo is very simple but it contains an important message.

The logo represents the four key components of front-end design and development, Content, HTML, CSS, and JavaScript. It uses the colours associated with the three technologies at the time it was designed, plus a neutral colour to represent content.

In November 2024, a new CSS logo was introduced which uses Rebecca Purple (#663399), in memory of Eric Meyer’s daughter who died at the age of six. The Explainers logo retains the original blue of CSS3.

The circles touch but do not overlap. This represents the separation of concerns advocated by the Web Standards Model.

Colophon

This site is coded by hand and conforms to web standards (naturally). I’m using plain HTML, CSS and vanilla JavaScript — no templates, no frameworks, no artificial intelligence — basically, no fancy stuff. I believe the Web should be simple, employing the least complex technology stack for the job in hand, and thereby maintaining a low barrier of entry to those who are learning. As far as possible, the site is designed and coded using a best practice approach so that I can use it as an example when working with students.

I’m using the very lovely Lora typeface for headings, Inter 4.0 for body text, and Hack for code.

Explainers for Devs by David Watson is licensed under CC BY-NC-SA 4.0