Using the picture element to load WebP images with fallback

The performance of web pages depends for a significant part on images. According to the HTTP Archive, images contribute 63% to the weight of the average web page (August 2015). Google has developed a new image format called WebP, that promises smaller file size at equivalent image quality. But not all browsers support it. Luckily,…

Create better looking underlined links with CSS3 box-shadow and text-shadow

Unstyled links are by default underlined (with the exception of Opera Mini). Browsers simply use a 1 pixel solid line in the same colour as the text. You can change the appearance of the underline. There is a specification, but not with full browser support and somewhat limited possibilities. For a long time using a…

HTML5 video autoplay on mobile

There is a follow-up to this blog post. Based on Steve Souders’ blog post on video preload, I have been telling people that autoplay does not work on mobile. Recently, the inevitable happened. I had to implement an autoplaying background video for a project. A background video did not make much sense on mobile, because…

Loading Javascript asychronously in WordPress

There are a lot of simple things you can do to improve the performance of a web site. One of those things is, using asynchronous scripts. Instead of <script src="script.js">, write <script src="script.js" async defer>. It unblocks page rendering of a browser, that regular javascript loading causes. This works in almost any browser, even in…

Changing the WordPress Maximum Upload File Size

Default settings for uploads are usually pretty low. The default maximum upload size for PHP is 2MB. In WordPress you also can set the upload size, but it cannot be larger than what server settings allow. Unfortunately there are several settings you might have to change to set your desired upload limit. Depending on how…

Back to top