I recently blogged a 'tear down' of an award winning mobile career website. It was an eye opener at how poorly the site was constructed and how much candidate potential was being lost from the site being slow. Here is are my top 4 learnings when it comes to mobile optimisation.
Avoid Custom Fonts
Typically it is sensible to avoid custom font downloads. The font is typically large and adds times to the site download speed. The font is also present on every page, increasing the memory footprint of the site in the mobile browser. Where you do use custom fonts choose fonts that are small in file size.
Avoid Resizing Images on the Device
Many, none adaptive, mobile sites load the images designed for desktop on the mobile device and through CSS instruct the browser to resize the image. This involves an expensive download increasing the download time. It also uses more memory on the device and requires more processing time on the device.
Minify and Compress JS and CSS
Minification is an automated process which should be part of the release steps. It reduces file size of code at the cost of readability of the code, which is acceptable for release (not in development). Additionally to minify, sites should compress the code to increase download speed. Ideally the JS and CSS should be merged into two single files, this reduces the overhead involved in DNS lookup and requesting a file.