Craig is a freelance UK web consultant who built his first page for IE2.0 in 1995. Since that time he's been advocating standards, accessibility, and best-practice HTML5 techniques. He's created enterprise specifications, websites and online applications for companies and organisations including the UK Parliament, the European Parliament, the Department of Energy & Climate Change, Microsoft, and more. He's written more than 1,000 articles for SitePoint and you can find him @craigbuckler.
Craig's articles
Craig explains how to add CSS styles to SVGs when used as static images, inlined backgrounds and HTML, sprites, HTML content effects and portable files.
Craig Buckler demonstrates more advanced uses of the SVG path element, explaining how each of its various parts actually work.
Craig Buckler introduces SVG drawing basics, explaining the SVG viewbox, document structure, and how to draw shapes such as lines, circles, and rectangles.
Core Web Vitals are Google's metrics for evaluating real-world web performance. Learn how to optimize for Core Web Vitals and improve both UX and SEO.
Craig introduces CSS options for setting up a responsive website, including media queries, Flexbox and Grid, and covers tools for testing cross-browser compatibility.
Craig Buckler introduces Eleventy (11ty), a Node.js static site generator, showing how to build a simple site with pages and blog posts.
Windows Terminal is an ideal accompaniment to WSL2. It's fast, configurable, and offers the benefits of both Windows and Linux development.
Learn to use the Deno built-in tools including a linter, test runner, script tools, and many others. We introduce each inclusion and provide usage advice.
Learn how Deno modules work – the biggest change from Node. Find out how to use them, best practices, and what differs from npm.
A step-by-step guide to manually installing the Apache Web Server on Windows, with links to further reading and resources.
Master modern CSS with these project suggestions, starting with the easiest and designed to build a breadth of skill in modern techniques.
Craig Buckler presents a series of tips, tricks, techniques and tools for debugging a Node.js application.
Installing MySQL is easier than you think. Craig provides a step-by-step guide to get your database up and running in minutes.
Craig Buckler examines the proposed class fields feature of JavaScript, which aim to deliver simpler constructors with private and static members.
Learn how to edit source files within Chrome and save the result to a local file. Changes can also be applied immediately without refreshing the browser.
Our list of the top ten tools to help web developers manage their agile workflows. Comparing the benefits, shortcomings and prices of what's in market.
This article, sponsored by New Relic, provides an introduction to the automated task runner, Gulp.js, and shows how it can shrink page size.
Browser DevTools have evolved from basic JavaScript consoles to fully-integrated development and debugging environments. We'll explore their features.
Web performance is a hot topic. Users expect fast, OS-like application performance. Craig Buckler explains how to do as little DOM blocking possible, and covers options for when long-running tasks can’t be avoided.
Weighing up whether to keep using XMLHttpRequest vs the Fetch API's modern take? We look at the pros and cons of both options.
Learn how to migrate to Gulp.js 4.0 and update your 3.0 gulpfile.js configurations. Find out what you need to know about changes in Gulp.js functionality.
Craig Buckler comes up with his list of the top JavaScript frameworks, libraries and tools, and explains when to use them.
Writing code can be fun. Testing is another matter. Errors can still slip into the best production code. How can you detect those issues?
WordPress theme developers need little more than a text editor and graphics package. But modern tools like Gulp can revolutionize your development workflow.
Craig Buckler shows you how to get a WordPress site up and running for the first time.
Craig Buckler demonstrates how use Gulp.js to automate CSS tasks, such as optimizing images, compiling Sass files, handling and inlining assets, automatically appending vendor prefixes, removing unused CSS selectors, minifying CSS, reporting file sizes, outputting sourcemaps and more.
Craig Buckler discusses 20 ways to optimize your CSS so that it’s faster-loading, easier to work with and more efficient, covering analysis tools, CDNs, HTTP/2, CSS3, animations and transitions, fonts, concatenation and minifying, build tools, flexbox, grid, SVG, critical CSS, and more.
Craig Buckler discusses form layout in the age of CSS Grid, discussing the difficulties of laying out forms with floats and flexbox, and demonstrating the benefits of grid in terms of form layout, the possibilities it offers, and how and why to take a progressive enhancement approach to form layout.
Craig Buckler shows how to add another dimension to your web pages and applications with the new 3D transformation functions and properties in CSS, covering transform, translate, rotations, scaling, perspective and more, along with z-index, browser gotchas, and ideal use cases.
Craig Buckler gives you an accessible introduction to using media queries with JavaScript with matchMedia for a robust responsive design approach.