ai svg pattern

Faster Websites with Better Techniques

It’s no secret that Google has favoured faster-loading websites with either faster hosting or fewer resources. If you’re using WordPress, Drupal or Joomla, then you’re going to have a headache in general just trying to get it to operate at a decent speed, and you’ll need to do more than just increase the memory allocation in wp-config to 256mb; you’re going to need to utilise CSS, SVG (scalable vector graphics) and Image Compression Plugins to make a decent running website.

css3The basic idea behind CSS is to separate the structure of a document from the presentation of the document. HTML is meant for structure. It was never intended for anything else. CSS is just amazing, and you can pretty much recycle code and drastically improve SEO on a website by using correct CSS rules. It’s not just used for basic styling though! You can use CSS background gradients and these can drastically improve load times. If you’re using WordPress, just manually add the CSS coding into the template’s designated custom CSS field, and add the necessary class where you need it.

Scalable Vector Graphics are XML-style markup driven vector graphics. It’s relatively new and is slowly being adopted by web developers. You need Illustrator to export a vector graphic as an SVG. The benefits are a tiny file size for unlimited sizing and since we’re entering the times of 4K screens, it’ll be standard practice from PNG image formats soon enough. It’s unlikely to be used by most developers though as an SVG XML document of any complexity looks relatively archaic, complicated and seemingly isn’t nearly as easy as just using an image.

Image compression is absolutely necessary to make websites usable these days. Whatever framework you’re using, use a Thumbnail Regenerator plugin to resize multiple image sizes to make your website more resolution independent. If the visitor is using a mobile phone with a resolution of 768 pixels, you don’t want them loading 2000 pixel images only to be resized by the browser.
Always use server-side caching if it’s a hand-written website on a Bootstrap framework, and this can be added using the .htaccess file (using Apache).
If you’re using WordPress, Drupal or Joomla, then use Gzip compression or Wordfence for WordPress which utilises a fantastic caching tool for quick loading.

Ultimately, your goal should be to reduce a website’s load time to less than 1.5 seconds, with no more than 70 server requests maximum.