Tags: optimisation

35

sparkline

Sunday, August 12th, 2018

Let’s serve everyone good-looking content

A terrific piece by Hidde, about CSS grid, but also about a much bigger question:

I don’t think we owe it to any users to make it all exactly the same. Therefore we can get away with keeping fallbacks very simple. My hypothesis: users don’t mind, they’ve come for the content.

If users don’t mind, that leaves us with team members, bosses and clients. In my ideal world we should convince each other, and with that I mean visual designers, product owners, brand people, developers, that it is ok for our lay-out not to look the same everywhere. Because serving good-looking content everywhere is more important than same grids everywhere.

Tuesday, July 31st, 2018

Prioritizing the Long-Tail of Performance - TimKadlec.com

Focusing on the median or average is the equivalent of walking around with a pair of blinders on. We’re limiting our perspective and, in the process, missing out on so much crucial detail. By definition, when we make improving the median or average our goal, we are focusing on optimizing for only about half of our sessions.

Tim does the numbers…

By honing in on the 90th—or 95th or similar—we ensure those weaknesses don’t get ignored. Our goal is to optimize the performance of our site for the majority of our users—not just a small subset of them.

Saturday, June 23rd, 2018

The Critical Request - Speaker Deck

There are some handy performance tips from Ben in this slide deck.

In this talk we’ll study how browsers determine which requests should be made, in what order, and what prevents the browser from rendering content quickly.

Thursday, June 7th, 2018

Fostering a Web Performance Culture - José M. Pérez

Six steps to kickstart a web performance culture:

  1. Your dev environment is not your user’s environment
  2. It’s better to learn the fundamentals than the library
  3. Get the time to experiment and validate
  4. Educate your colleagues
  5. Share and celebrate success (and failure) stories
  6. Make performance part of your workflow

Saturday, March 10th, 2018

It’s Dangerous to Go Stallone. Take Glyphhanger | Filament Group, Inc., Boston, MA

You’ll need to be comfortable with using the command line, but this is a very useful font subsetting tool from those clever folks at Filament Group.

Thursday, January 18th, 2018

Finding Dead CSS – CSS Wizardry

Here’s a clever idea from Harry if you’re willing to play the long game in tracking down redundant CSS—add a transparent background image to the rule block and then sit back and watch your server logs for any sign of that sleeper agent ever getting activated.

If you do find entries for that particular image, you know that, somehow, the legacy feature is potentially still accessible—the number of entries should give you a clue as to how severe the problem might be.

Thursday, November 9th, 2017

The Contrast Swap Technique: Improved Image Performance with CSS Filters | CSS-Tricks

A clever performance trick for images:

  1. Reduce image contrast using a linear transform function (Photoshop can do this)
  2. Apply a contrast filter in CSS to the image to make up for the contrast removal

Wednesday, November 1st, 2017

Rebuilding slack.com – Several People Are Coding

A really great case study of a code refactor by Mina, with particular emphasis on the benefits of CSS Grid, fluid typography, and accessibility.

Monday, October 2nd, 2017

Essential Image Optimization

Following on from Amber’s introduction, here’s a really in-depth look at image formats, compression and optimisation techniques from Addy.

This is a really nicely put together little web book released under a Creative Commons licence.

When Should You Use Which Image Format? JPG? PNG? SVG?

Amber has been investigating which image formats make sense for which situations.

Choosing image format is only one step towards optimising images on the web. There are many, many other steps to consider, and so, so much to learn!

Sunday, March 12th, 2017

WebPonize - webponize.github.io

A Mac app for converting PNGs and JPEGs to WebP.

Thursday, February 9th, 2017

Performance Under Pressure - performance, responsive web design - Bocoup

The transcript of a really great—and entertaining—talk on performance by Wilto. I may have laughed out loud at points.

Most of the web really sucks if you have a slow connection

Just like many people develop with an average connection speed in mind, many people have a fixed view of who a user is. Maybe they think there are customers with a lot of money with fast connections and customers who won’t spend money on slow connections. That is, very roughly speaking, perhaps true on average, but sites don’t operate on average, they operate in particular domains.

Tuesday, March 15th, 2016

Managing Mobile Performance Optimization – Smashing Magazine

Some solid sensible advice on optimising performance.

Sunday, February 28th, 2016

Preload: What Is It Good For? – Smashing Magazine

A comprehensive overview of rel="preload" which looks very useful indeed …I just wish it wasn’t (like “nofollow”) a nonsensical value for the rel attribute: a resource can’t have a relationship of “preload” to the linking document.

Tuesday, December 8th, 2015

briangonzalez/fontprep

The missing font generator for Mac OS X.

Very handy for subsetting fonts for the web. It doesn’t (yet) export WOFF2 unfortunately.

Thursday, November 19th, 2015

Tips for Creating and Exporting Better SVGs for the Web

Sara enumerates some handy tips aimed squarely at designers exporting SVGs. It focuses on Illustrator in particular but I’m sure a lot of this could equally apply to Sketch.

Monday, October 27th, 2014

Official Google Webmaster Central Blog: Updating our technical Webmaster Guidelines

Google has updated its advice to people making websites, who might want to have those sites indexed by Google. There are two simple bits of advice: optimise for performance, and use progressive enhancement.

Just like modern browsers, our rendering engine might not support all of the technologies a page uses. Make sure your web design adheres to the principles of progressive enhancement as this helps our systems (and a wider range of browsers) see usable content and basic functionality when certain web design features are not yet supported.

Thursday, November 1st, 2012

Trimming the Fat — Paul Robert Lloyd

A great in-depth description by Paul of how he optimised his site. More of this please!

Sunday, July 22nd, 2012

JPEGmini - Your Photos on a Diet!

This looks like a really handy tool for reducing the file size of JPEGs without any perceptible loss of quality (in much the same way that ImageOptim works for PNGs)—available as a Mac app or an installable web service.