Blog
Articles about web development, design, performance, and related topics. Subscribe via RSS to keep up with new articles, or browse by topic.
- Start website performance work with the biggest bottleneck
Improve website performance by fixing heavy images, unnecessary code, caching, slow delivery, and expensive database work.
- Show a post's word count in Jekyll
Count the words in a Jekyll post with Liquid's number_of_words filter.
- Add a Custom 404 Page to Jekyll on GitHub Pages
Create a custom Jekyll 404 page that uses your site's layout and works on GitHub Pages, including sites with organised source folders.
- Redirect Old URLs in Jekyll
Keep old Jekyll URLs working with the jekyll-redirect-from plugin, including multiple source paths and external redirects.
- Style Selected Text With CSS
Use the CSS selection pseudo-element to change the colours applied when someone highlights text on a webpage.
- Different CSS for touch and mouse input
Use pointer and any-pointer media features to adapt controls to coarse touch input, precise pointers, or devices with several input methods.
- How to Improve Website Traffic Without Chasing Every Tactic
A practical way to grow useful website traffic by improving content, search visibility, distribution, performance, and measurement.
- Marking up abbreviations with HTML abbr
Use the HTML abbr element for abbreviations and acronyms, with accessible expansion text and optional CSS styling.
- Build a Navigation Menu From Jekyll Data
Keep Jekyll navigation links in a YAML data file and render them with a reusable Liquid include, including nested project links.
- Tools for Testing Structured Data Markup
Tools for validating Schema.org structured data, previewing extracted values, and generating JSON-LD, Microdata, or RDFa markup.
- Monospaced Fonts for Coding
A varied collection of monospaced fonts for code editors and terminals, from practical open-source choices to distinctive paid families.
- How to Secure Your Website With HTTPS
Set up HTTPS with a TLS certificate, redirect HTTP traffic, remove mixed content, and test the finished configuration.
- Marking Up Keyboard Input With HTML kbd
Use the HTML kbd element to mark up keyboard keys and other input in instructions, with a small styling example.
- Designing a Website Layout People Can Actually Use
Practical layout choices that make a website easier to scan, read, navigate, and use across different screen sizes.
- Highlighting Relevant Text With HTML mark
Use the HTML mark element to highlight text that is relevant in the current context, then style it without losing its meaning.
- Open-Source Email Templates Worth Knowing About
Open-source HTML email templates and frameworks that give you a practical starting point for client-compatible email.
- You can transition z-index
CSS can transition z-index, but because it is an integer the change happens in steps rather than as a smooth visual animation.
- Places to Learn How to Code Online
A practical list of online courses and learning platforms for people who want to learn programming and web development.
- Sublime Text Packages for Front-End Development
A practical collection of Sublime Text packages for front-end development, covering syntax support, linting, editing, and project tools.
- Rename Downloads With the HTML download Attribute
Use the HTML download attribute to suggest a clearer filename when someone downloads a file from your site.