In this final part of this series, Jon Hensley will focus on the principles of continuation and common fate, which involve movement, both implied and animated, to create relationships. Using these principles, along with the principles of similarity, proximity, closure and figure-ground, will strengthen your own design skills and help you create a better experience for your users. Oh, and one final thing. After applying these principles, make sure to test out your designs with users to see what works best for them.
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…
When developers are expected to work in a corner until needed, that isolation from the design process prevents them from crafting the end product just as much as the designers themselves. The person who ultimately pays is the user. Whether you’re a developer, designer, or in another role, our mindsets need to change; we want to provide the best products for our users. Design decisions aren’t the sole responsibility of the design team. Decisions made during the design stages have far-reaching consequences that affect the entire project. A representative of each area, especially development and design, should be included when project-critical decisions are made.
Read more…
An ever-growing number of web users around the world are living with dementia. They have very varied levels of computer literacy and may be experiencing some of the following issues: memory loss, confusion, issues with vision and perception. In this article, Laurence Ivil and Paul Myles will share some lessons they learned along the way about making a dementia-friendly front end on a tight budget. By making websites more accessible to a growing group of users who are so often excluded from the benefits that the internet has to offer, designers are not only supporting people living with dementia, but also those with similar accessibility challenges.
Read more…
Creating a living style guide is a long but worthwhile process. Steven Lambert made a few mistakes along the way that prevented developers and designers from adopting it sooner or using it effectively. However, he pushed through and eventually made it to the end. This is the story of how Steven developed a living style guide, the mistakes made along the way, and why the current landscape of style guide generators did not suit his needs.
Read more…
