A little animation can make or break a design. If the animation is done well it becomes invisible, and oftentimes you won’t even notice it’s there. Invisible animation can have the opposite effect, and become noticeable when not present. This lack of animation becomes most obvious when shifting back and forth between websites with global navigation where one has a subtle animation and the other does not. In this case, it was my Svelte Headless UI Starter which lacked the animation and stook out like a sore thumb.

Taking some inspiration from my favorite WordPress theme I decided to tackle the addition of invisible animation to the global navigation in my starter. Here I’ll share the finished result and a simple pattern you can use to obtain the safe effect. And it’s easy to achieve with utils already available in Tailwind.

After recently planning to do a survey of tools for building rich web apps I stumbled across  github.com/codylindley/frontend-tools, which claims to be an opinionated list of tools for building front-end applications. For those new to building modern web applications, it’s certainly easier to take in than larger lists like github.com/joyent/node/wiki/modules. But lists aren’t necessarily the best place to start for putting an application together. At least not where the rubber hits the road.

Following is a list of cross-browser/platform web development and debugging tools useful for client-side developers. Depending on the application, one or all of these tools can be valuable in completing work on a website front-end.

Sublime Text with CoffeeScript is a JavaScript developer’s dream, but one that doesn’t evaporate in the fog of sleep shortly after waking. After learning about Sublime Text at Fluent Conf 2012 during a plenary talk from Paul Irish, I immediately began looking for ways to incorporate it into my workflow. And now, after having used it for over 8 months in my day-to-day work, I wanted to share a quick primer for those who want to amp up CoffeeScript coding with Sublime Text too.

Web applications concatenate CSS files to improve performance, which can result in large numbers of style rules in a single file. Enter the 4095 selector limitation for IE browsers. An IE bug whereby the browser will only apply style for the first 4095 selectors declared per file. Impacted browsers include IE6, IE7, IE8 and IE9.