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
Need to translate your website? Learn how to use the JavaScript Internationalization API (I18n) and how easy it is to implement it in your apps.
There are several ways to define a block of JavaScript functionality. Learn which is the most appropriate one for your particular use case.
Sprites are popular for bundling graphics into a single file. And they can even be made with SVGs! Learn how SVG sprites work and why they're so awesome.
Sass is handy, but can't do everything. Learn how to use PostCSS to create a custom CSS preprocessor that compiles Sass syntax but also adds extra features.
Too many options in your HTML Select list? Try a Datalist! Learn how to work with this lightweight, accessible, cross-browser autocomplete form control.
How should you add scalable vector graphics to a web page? Learn about six different methods, including inlining, image tags, iframes, and CSS backgrounds.
You want to offer static-site benefits to clients, but they want WordPress! Learn how to use Eleventy with WordPress to offer the best of both worlds.
Snowpack, webpack and Parcel bundle your JS but are hard to custom configure. Rollup.js is faster and more configurable. Learn how to set it up!
Date handling in JavaScript? Ugh. It's a mess. But there's hope! Find out what the new JavaScript Temporal API will bring to a browser near you in 2021.
Are you frustrated by immutability issues in JavaScript? Learn how records and tuples will finally permit robust immutable data storage and comparisons.
Got your JavaScript toolset organized for 2021? Not so fast! Check out our predictions for rising stars that are looking hot for 2021.
Need to access the OS clipboard using browser JS? Learn how to use the new asynchronous Clipboard API, a better option than the old document.execCommand().
The SVG path element offers a range of curve effects, and in this article, Craig Buckler demonstrates how to draw cubic bézier curves.
The SVG path element offers a range of curve effects. In his first tutorial, Craig demonstrates how to draw quadratic bézier curves.
Mix DOM and vector interactions in SVG, translating from SVG to DOM coordinates and back, and translating to transformed SVG coordinates.
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/article posts.
Windows Terminal is an ideal accompaniment to WSL2. It's fast, configurable, looks great, and offers all 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.js. Find out how to use them, best practices to make your life easier, 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.
Craig Buckler presents the various CSS methods available for hiding elements on a web page, looking at how they differ and which is best when.
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.