Earlier this week, I tried out a starter theme for a blog platform. The theme had loads of nice default features: pretty typography, fancy navigation, dark mode widget… and a couple of default trackers I really don’t want just sitting there in a header component, waiting for me to add my account information. As web …
Google is handing out bucks for CSS-related projects, so you might as well know about it! Nicole Sullivan: All of us who work on the web regularly benefit from the work of people who create specifications, tools, demos, tutorials, and polyfills. Many of these resources are side projects, made available and supported free of charge. …
When’s the last time you read your website? Like out loud in the lobby of a Starbucks on a weekday afternoon, over the phone to your parents, or perhaps even as a bedtime story for your kids. No worries, this isn’t a trick question or anything—just a gut check. If there’s only one thing you …
Ain’t this the truth: It’s like when you’re learning a new language. At some point your brain goes from translating from your mother tongue into the other language, and instead starts thinking in that other language. I don’t speak any other language besides English, but I’ve heard that’s true. With perhaps a last step being when you start dreaming …
What’s the one thing people can do to make their website better? Now that is a good question. One with many right answers, like improving performance, taking care of accessibility, and upgrading user experience as prime examples. These are all great tips, and there’s more like them, but how do you choose just one? And, …
I got this question from a listener the other day. Fair question, I’d say. The word “Static” in “Static Site Generator” is at-odds with the word “Dynamic.” It seems to imply that the website created with a Static Site Generator (SSG) is locked in stone, only to be changed when it is run again some …
Ya know, I used to do one of these posts after making a few podcast appearances I hadn’t had a chance to link up yet, so I could share them. As fate would have it, I haven’t been on many podcasts (other than my own) lately. One exception! I was on Episode 33 of That …
I read a recent Smashing Magazine post that included a recommendation for Hygen. I just happen to be doing quite a bit of new UI work in a Next.js app and the amount of manual folder/file scaffolding I was doing was getting annoying. So the timing was perfect here. In this app I’m working on, …
Josh’s Shadow Palette Generator is a fantastic tool. The premise is that box-shadow pretty much always looks better when there are multiple layered shadows that are a bit tinted. It reminds me of how gradients almost always look better when eased. The generator does that, but also does three levels of them so you’ve got …
So what is the one thing that people can do is to make their website better? To answer that, let’s take a step back in time … The year is 1998, and the web is on the rise. In an attempt to give a high-level overview of the architecture of the WWW, Tim Berners-Lee — …
Amazon has a vision with AWS Amplify. First, a premise: As browsers have become faster and more powerful over the last decade, front-end developers are building web apps that are more feature-rich and performant for both desktop and mobile devices. To implement these features, front-end developers are increasingly becoming full-stack developers who have to think …
I wanted to write down what I think the reasons are here in December of 2021 so that we might revisit it from time to time in the future and see if these reasons are still relevant. I’m a web guy myself, so I’m interested in seeing how the web can evolve to mitigate these …
Say you’ve got a two-column CSS grid and you want one of those columns to behave like position: sticky;. There is nothing stopping you from doing that. But the default height for those two columns is going to be “as tall as the tallest content in either column” because the default behavior for grid columns …
Take two minutes right now and visit your current project in a browser. Then, using only the Tab key, you should be able to navigate between interactive elements including buttons, links, and form elements. If you are sighted, you should be able to visually follow the focus as it jumps between elements in the DOM. …
Quick hits! There is a new web API called EyeDropper: Here’s a very good blog post intro on it. It’s only in Chrome’n’friends right now. I wish I knew better how to watchdog APIs like this. Looks like it originally came from Edge, then became a community group thing, which is where the draft spec …
This is a fantastic article from Julia Evans about duking it out with modern front-end tooling. Julia has made a bunch of Vue projects and typically uses no build process at all: I usually have an index.html file, a script.js file, and then I do a <script src=”script.js”> and that’s it. Which I think is awesome and probably means those projects …
From my perspective, the question of what one thing we can do to make a website better is not a technical one. The more I browse the internet, the more I realize that the biggest issue with a lot of websites is the fact that they don’t let me accomplish the task I am looking …
MarkUp is the leading visual commenting platform for images, PDFs, and live websites. It’s the perfect companion in your creative process to make your life easier. Manage and organize all web, PDF, and image projects in one location and easily sort between them. Here’s the point: do you need feedback on a design? Does team …
The SVG <path> syntax is a beast. There are all sorts of commands that make up a mini-language all of its own — so powerful that it’s capable of drawing anything. Don’t be too scared of it, though, because some of the commands are very straightforward to understand. They read like “put pen here, draw …
I try to keep up with WordPress news because I’m a big WordPress user and have many production sites that run on it. WordPress has been good to me as a site builder for literally my entire career. So, like we do with typography (example), accessibility (example), and JavaScript (example), I’m hoping to occasionally drop …
I’ve built websites that are used by millions of people all over the world. I’ve made more mistakes than I care to count and I’ve had to deal with the repercussions of those mistakes for years thereafter. Through all of this, my team and I have been trying to strike the best balance between user …
An interesting (scary) trick of an nearly undetectable exploit. Wolfgang Ettlinger: What if a backdoor literally cannot be seen and thus evades detection even from thorough code reviews? I’ll post the screenshot of the exploit from the post with the actual exploit circled:
What if HTML had “tabs”? That would be cool, says I. Dave has been spending some of his time and energy, along with a group of “Tabvengers” from OpenUI, on this. A lot of research leads to a bit of a plot twist: Our research showed there are a lot of variations for what makes …
There is a huge and ever-widening gap between the devices we use to make the web and the devices most people use to consume it. It’s also no secret that the average size of a website is huge, and it’s only going to get larger. What can you do about this? Get your hands on a craptop and …
I’ve always like Jeremy’s categorization of developer tools: I’ve mentioned two categories of tools for web development. I still don’t know quite what to call these categories. Internal and external? Developer-facing and user-facing? The first category covers things like build tools, version control, transpilers, pre-processers, and linters. These are tools that live on your machine—or …
I’ve built WordPress websites for I don’t know how long now, but suffice to say I’ve relied on it for a bulk of the work I do as a freelance front-ender. And in that time, I’ve used Jetpack on a good number of them for things like site backups, real-time monitoring, and security scans, among …
I recently started university and, before buying a MacBook Air (the M1 chips are amazing by the way), I had to use an iPad Pro for class. However, being a Computer Science student meant I had to find a way to use it for programming. Therefore, I started my quest to find the best way …
Perhaps the most basic and obvious use of CSS custom properties is design tokens. Colors, fonts, spacings, timings, and other atomic bits of design that you can pull from as you design a site. If you pretty much only pull values from design tokens, you’ll be headed toward clean design and that consistent professional look …
I was just going on about how many awesome little helper sites there are out there, and now I’ve ran across another wonderful little hive of them. Sébastien Noël, under the name fffuel, has created a whole bunch of great ones like: ssshape: an SVG blob generator nnnoise: a background noise texture generator cccolor: a …
As I write this, world leaders are gathering in Glasgow for COP26, the international climate change conference, in the attempt to halt (or at least slow down) catastrophic climate change by pledging to end their countries’ dependence on fossil fuels. Only time will tell whether they will succeed (spoiler: it’s not looking good), but one …