Stylelint is a powerful style sheet linter. It brings clarity to code and saves you from errors. It’s useful for everyone. Once you start using it, you will hear no more comments like, “You forgot to remove it there.” in this article, Aleks Hudochenkov will show you why linting a style sheet matters, how stylelint brings order to a style sheet and how we can avoid errors. Happy developing, and may you have a peaceful code review.
Read more…
Dependencies are everywhere. They’re unavoidable. They aren’t inherently bad, but if you don’t consider the possibility a given dependency might not be met, you run the risk of frustrating your users. Reducing dependencies improves the likelihood that your site will be usable by the greatest number of people in the widest variety of scenarios. Even knowing this, however, it’s easy to overlook the most basic dependencies our projects have, undermining their resilience in the process. To illustrate this point, consider the humble submit button.
Read more…
If you write CSS for a living, it is important to understand how to write valid CSS property values correctly. Once you understand how different values can be combined or multiplied, the CSS property value syntax becomes much easier to comprehend. The following syntax can be hard to understand if you don’t know the various symbols and how they work. However, it is worth taking the time to learn. If you understand how the W3C defines property values, you will be able to understand any of the W3C’s CSS specifications.
Read more…
What’s going on in the industry? What new techniques have emerged recently? What insights, tools, tips and tricks is the web design community talking about? Anselm Hannemann is collecting everything that popped up over the last week in his web development reading list so that you don’t miss out on anything. The result is a carefully curated list of articles and resources that are worth taking a closer look at.
Read more…
Image filters are a fun and effective way to provide visual unity and aesthetic appeal on the web. Keep in mind that they do come with a slight performance hit, but also with the benefits of speedy design in the browser and the opportunity to design interactions with. In this article, Una Kravets will take a look at one of the most popular image effects, grayscale, and assess both the ease of implementation and performance implications of HTML canvas, SVG, CSS filters, and CSS blend modes. Which one will win?
Read more…
Microsoft Edge has evolved over the past year — from being announced as a brand new browser, with Microsoft moving away from Trident (or MSHTML) to EdgeHTML, to the browser usage share increase curve similar to the one Google experienced when Chrome was first introduced in 2008. This article is part of the web development series from our tech evangelists and engineers on JavaScript skills, community projects and best practices including Microsoft Edge browser and the new EdgeHTML rendering engine.
Read more…
Using external SVG sprite maps to deliver lossless scalable vector images is widely used in responsive web design today and well-supported by tools like svg4everybody. At German newspaper Zeit Online, we embraced this technique quite a lot. However, we recently changed this workflow back to completely inlining the SVG into the HTML owing to a bug in Apple’s Safari browsers– the same way GitHub is doing with its octicons.
Read more…
Varnishtest can be used to test a cache invalidation method or to reproduce bugs when filing a bug report. To ensure optimal performance from a Varnish Cache deployment, one should integrate Varnishtest into the design. Varnishtest can be used by system administrators in two scenarios: (1) when configuring a Varnish Cache installation, and (2) when writing complex caching policies in the Varnish Configuration Language (VCL) or when tuning Varnish Cache. Code tinkerers who work on extensions written for Varnish Cache (called VMODs) can use Varnishtest to define and test their modules.
Read more…
What’s going on in the industry? What new techniques have emerged recently? What insights, tools, tips and tricks is the web design community talking about? Anselm Hannemann is collecting everything that popped up over the last week in his web development reading list so that you don’t miss out on anything. The result is a carefully curated list of articles and resources that are worth taking a closer look at.
Read more…
Fluid typography resizes smoothly to match any device width. It is an intuitive option for a web in which you have a practically infinite number of screen sizes to support. Yet, for some reason, it is still used far less than responsive techniques In this article, Michael Riethmuller will teach you how to apply the techniques you know in a slightly different way. Careful attention to detail will ensure you still have a perfectly crafted experience at all screen sizes.
Read more…
