Full stack web developer, interested in all the things, but especially the web, code, design, Linux, OS X, PHP, WordPress, JavaScript & robots.

Tagged: web development

Optimising GIFs for the Web image/svg+xml

Interesting that the first tip is to not use gifs at all.

Surprisingly, the lossless compression algorithm used on GIFs is so unoptimised that video formats such as MP4 or WebM will provide a smaller file size than GIF images. Because of this, one solution to the GIF performance problem is to not use GIFs at all, and to replace them with autoplaying, looping, HTML5 Video.

248: AMP – ShopTalk image/svg+xml

Getting AMP’d with AMP. We’re going to talk about the #hotdrama about AMP with a couple of AMP experts.

Before listening to this episode, I was completely uninterested in AMP. After listening, I’m still uninterested. The proponents did nothing to sell it to me.

That said, I can imagine how AMP could be good for end users. For example, last night I was listening to a podcast and browsing the web on my iPhone, I had just started reading an article on Boing Boing when a video advert started playing, which in-turn muted the podcast that I was listening to. Grrr. I’m thinking that AMP could have prevented this annoyance, but then again, I’m also thinking the owners of Boing Boing could also have prevented it by not deploying obnoxious ads.


scrollMonitor image/svg+xml

A simple and fast API to monitor elements as you scroll […] The scroll monitor was designed to be very fast. On each scroll event the DOM is only touched twice, once to find the document height and again to find the viewport top. No variables are declared, nor are any objects, arrays, or strings created. Watchers are very cheap. Create them liberally.

Another scroll monitor, this one looks quite efficient. The stress test demos are a nice touch.

HTML & CSS Is Hard – A friendly web development tutorial image/svg+xml

Learning HTML and CSS is hard, but it doesn’t have to be. This 14-chapter tutorial is one of the friendliest HTML and CSS guides on the Internet. We’ll walk you through everything from selecting a good text editor (which is surprisingly important) to building full-fledged, professional-quality web pages from scratch.

This is possibly the most comprehensive guide to web development ever. OK, possibly not, but it is really rather good. The next time somebody asks me where to start, I’ll know where to point them.

Dissecting an SSL certificate image/svg+xml

Hello! In my networking zine (which everyone will be able to see soon), there is a page about TLS/SSL (basically this tweet). But as happens when you write 200 words about a thing on a page, there is a lot more interesting stuff to say. So in this post we will dissect an SSL certificates and try to understand it!

A good break down of TLS/SSL certificates and how they work.

Using HTTP/2 Responsibly: Adapting for Users image/svg+xml

A useful article that explores how best to implement HTTP/2. Includes this helpful snippet:

The specific mechanism by which you detect HTTP/2 support will depend on the back end language you use. In PHP, we can determine the protocol version of a given connection by checking the $_SERVER["SERVER_PROTOCOL"] environment variable. Below is a one-liner that stores the HTTP/2 connection status in a variable named $isHttp2:

$isHttp2 = stristr($_SERVER["SERVER_PROTOCOL"], "HTTP/2") ? true : false;

Using the stristr function, the $_SERVER["SERVER_PROTOCOL"] environment variable is checked for the presence of the substring "HTTP/2". If the substring exists, $isHttp2 is set to true.

I’ve not checked, but I wonder if the Autoptimize WordPress plugin has options for this?