Technologies

The skeleton of every web page. It says what each part of the page is: a heading, a paragraph, an image, a link or a button.

How it helps

• Works in every browser, on every device
• Clear structure helps search engines understand your pages
• Done well, it lets screen readers and keyboards use your site

Used on: Black in Fashion

The styling layer. It sets colours, fonts, spacing and layout, and changes how a page looks on a phone compared with a laptop.

How it helps

• Your brand looks the same on every page
• One layout adapts to phones, tablets and desktops
• Kept separate from the content, so a redesign doesn't mean rewriting pages

Used on: Buskspot

A friendlier way to write CSS. It lets us store brand colours and sizes in one place and reuse them, then turns it all into ordinary CSS for the browser.

How it helps

• Change a brand colour once and it updates everywhere
• Tidier styles that are quicker and cheaper to maintain
• Visitors still get plain, fast CSS

Used on: Black in Fashion

JavaScript, the language that makes pages interactive, with an extra layer of checking. It spots many mistakes while we're writing the code, before a visitor ever could.

How it helps

• Fewer bugs reach your live site
• Safer to change and extend later
• Visitors download ordinary JavaScript, so there's no extra weight

Used on: Hall Green Chiropody, S P Beattie Podiatry, Buskspot

A popular toolkit of ready-made layouts and components, such as grids, menus and buttons, that already work well on phones.

How it helps

• Quick to get a polished, mobile-friendly site live
• Well tested across browsers
• Widely known, so any developer can pick it up

Used on: Black in Fashion

A modern way of styling a site from small, ready-made building blocks for spacing, colour and type. Only the styles a site actually uses are sent to visitors.

How it helps

• A consistent look that follows your brand on every page
• Small, fast style files, because unused styles are left out
• Quick to tweak a design without breaking another page

Used on: S P Beattie Podiatry, this website

A library of ready-made components built on Tailwind CSS, such as menus, accordions and buttons, with the small bits of behaviour they need already written.

How it helps

• Common features like a phone menu are quick to add
• Components are designed to work with keyboards and screen readers
• Matches the rest of a Tailwind design with no extra styling

Used on: S P Beattie Podiatry, this website

A library of thousands of icons, such as phones, maps, envelopes and social media logos, drawn in a consistent style.

How it helps

• Clear visual signposts that help people scan a page
• Sharp at any size, on any screen
• Light to load compared with lots of separate images

Used on: Black in Fashion, this website

A modern site builder. It puts every page together ahead of time, so visitors get finished pages straight away instead of waiting for them to be assembled.

How it helps

• Very fast pages, which visitors and Google both reward
• Little to go wrong on the server, so it's secure and cheap to host
• Reusable building blocks make new pages quick to add

Used on: Hall Green Chiropody, S P Beattie Podiatry, Buskspot

A simple, lightweight site builder (also called 11ty). It turns plain text files and templates into finished web pages ahead of time, with nothing extra sent to visitors.

How it helps

• Fast pages, with no heavy code running in the browser
• Content lives in plain text files that are easy to edit
• Cheap and secure to host, because the pages are ready-made

Used on: this website

An automated testing tool. It runs a set of quick checks on the site's code every time something changes, to make sure nothing has broken.

How it helps

• Mistakes are caught before they go live
• Changes can be made with confidence
• Saves time compared with checking everything by hand

Used on: Hall Green Chiropody, S P Beattie Podiatry

An automated accessibility checker. It scans every page for problems that would make the site hard to use for disabled visitors, such as missing labels or text that is too faint to read.

How it helps

• More people can use your site, including those using screen readers
• Helps you meet the WCAG accessibility standard
• Problems are caught before they go live, not after a complaint

Used on: S P Beattie Podiatry

An automated browser. It opens the site on a pretend laptop and phone, clicks through the pages like a visitor would, and reports anything that doesn't work.

How it helps

• Broken links, menus and buttons are caught before they go live
• Checks both desktop and mobile on every change
• Saves hours of clicking through the site by hand

Used on: this website

An automatic publishing service. When we save a change, it builds the site, runs the checks and uploads the new version to your web host.

How it helps

• Updates go live in minutes without manual steps
• The same careful process every time, so fewer slip-ups
• A full history of every change, so anything can be rolled back

Used on: Hall Green Chiropody, S P Beattie Podiatry, Buskspot, this website

Google's free visitor statistics. It shows how many people visit, where they come from and which pages they read.

How it helps

• See what's working and what isn't
• Know which adverts and links bring visitors
• Make decisions based on real numbers, not guesses

Used on: Black in Fashion, this website

A control panel for tracking tools. It loads things like Google Analytics from one place, so they can be added, changed or switched off without editing the site.

How it helps

• Tracking changes don't need a developer
• Works hand in hand with the cookie banner, so nothing runs without consent
• Keeps the site's code tidy

Used on: Hall Green Chiropody, S P Beattie Podiatry

A free tool that shows how people use a page: heatmaps of where they click and scroll, and anonymous replays of visits.

How it helps

• Spot where visitors get stuck or give up
• Find buttons people miss and content they skip
• Sensitive details, such as what people type, are masked automatically

Used on: Hall Green Chiropody, S P Beattie Podiatry

An email marketing service, formerly called ConvertKit. It powers the sign-up form and sends newsletters to the people who join.

How it helps

• Grow a mailing list straight from the site
• Keep in touch with fans and customers
• Sign-ups, unsubscribes and data protection are handled for you

Used on: Buskspot