Intro

Make links recognisable with underlines, clear focus states, useful text, and behaviour that does not surprise the reader.

Keep Grid and Flexbox layouts aligned with the HTML order so keyboard focus and screen reader reading do not jump around the page.

Keep a clear keyboard focus indicator while avoiding the same focus ring after every pointer interaction.

Two megabytes can still mean slow downloads, expensive JavaScript, wasted mobile data, and a page that depends on ideal conditions.

Focus CSS performance work on stylesheet weight, layout, painting, DOM size, and unused rules before benchmarking ordinary selectors.

Start with the page's job, use the browser's native features, and add JavaScript only where its behaviour justifies the cost.

Put simple limits on page weight, JavaScript, images, third-party code, and user-facing performance before small additions accumulate.

Width and height attributes tell the browser an image's aspect ratio early enough to reserve space and prevent layout shifts.

Social media image sizes, video and advertising specifications, and downloadable templates in one place.

Check your camera’s shutter count from an original JPEG or RAW file with a free browser tool.

A curated collection of creative website designs, with details about their layouts, technologies, and fonts.

A Chrome extension for saving visual ideas, screenshots, and web references in a private, local library.