Blog
Articles about web development, design, performance, and related topics. Subscribe via RSS to keep up with new articles, or browse by topic.
- Use autocomplete=new-password for new password fields
Tell browsers that a password field is for choosing a new password rather than entering an existing one.
- Using CSS without getting in the way of accessibility
Practical CSS choices for readable text, visible focus, reduced motion, and layouts that survive zoom.
- Adding Outlook-only CSS to an HTML email
Load Outlook-specific email styles with Microsoft conditional comments.
- Embedding video with the HTML video element
Embed video with HTML, provide multiple sources, and add a subtitle track.
- Set up Rouge syntax highlighting in Jekyll
Enable Rouge syntax highlighting in Jekyll and connect its generated HTML to a compatible CSS theme.
- Checking editable text with HTML spellcheck
Use the HTML spellcheck attribute to request spelling and grammar checks in editable elements.
- Using small caps with CSS font-variant
Use the CSS font-variant property to enable typographic variants such as small caps.
- Load page-specific CSS and JavaScript in Jekyll
Load CSS and JavaScript only on the Jekyll pages that need them with front matter and Liquid.
- Add reading time to Jekyll without a plugin
Estimate and display a Jekyll post's reading time with Liquid, without installing a plugin.
- Add an RSS feed to a Jekyll blog
Add an Atom feed to a Jekyll blog with the official jekyll-feed plugin.
- WordPress plugins for backups, testing, and maintenance (2018)
A practical 2018 list of WordPress plugins for backups, SEO, caching, testing, accessibility, and security.
- Use aria-current to mark the active item
Mark the current page, step, date, or location in a related set with the aria-current attribute.
- How to install Jekyll on macOS
Install Jekyll on macOS with Apple's command-line tools, Homebrew, Ruby, and Bundler.
- Highlight the current page in Jekyll navigation
Add an active class to the current navigation link in Jekyll with a small Liquid check.
- Do you need a static site generator?
See how static site generators work, where they are useful, and when a dynamic site is the better choice.
- Embedding GitHub Gists in Jekyll
Embed a GitHub Gist in a Jekyll post with the jekyll-gist plugin.
- A simple print style sheet for your website
Add print-specific CSS with a separate stylesheet or an @media print rule.
- Responsive web design starts with flexible defaults
Build responsive layouts with flexible CSS, useful breakpoints, and images that fit the screen without wasting bandwidth.
- How to disable Rouge syntax highlighting in Jekyll
Turn off Jekyll's default Rouge syntax highlighter in a local site or on GitHub Pages.
- Add image captions in Jekyll without a plugin
Add reusable image captions to Jekyll posts with a small include and semantic HTML.