226 - 'I' is for Images

‘A-Z of WordPress’ with Nathan Wrigley and David Waumsley’

Hello, This is another A-Z of WordPress where we attempt to cover all the major aspects to building and maintaining sites with WP.  Today is I for…IMAGES (we could include ICONS too)

Preamble

Nathan’s business is called Picture and Word so this topic will be attempting half of the web! We were saying the WordPress Media Library is not the easiest thing in the world to work with:

• It has some built in compression that reduces the quality of image by 10%. I was many years in to WP before I knew this.
• You have to add you own alt tags, titles and description by default.
• As mentioned on our last chat it has some server dependencies (ImagicK).
• You have a limited choice of thumbnail options and need to register a new image size with code (often put in your theme’s functions php), which is not all that user friendly.
• There is not a default way to clear old thumbnails should mistakenly start with the default.
• Images are attachment with the own pages that need to be dealt with for SEO.
• Awful WordPress image editing compared to other 3rd party software (Canva, Pixteller, Stencil etc.).
• You need a plugin to add SVGs.
• A default WordPress install puts images in to Month and Year folders.

On the other hand there has been some nice additions:

• Native lazy loading.
• Img srcset (so in theory WP serves the smallest image appropriate to the browser size).
• Jetpack gives a free image CDN (David’s had issues years back clearing it).

Tools

• Media cleaner
• Image compression:
  • ShortPixel
  • WP Smush
  • Imagify, compress jpeg & png images
• CDNs
  • CloudFlare
  • Jetpack
  • MaxCDN
  • Bunny CDN
• Happy Files

Debatable Points

• Best Formats:  jpeg, gif, pngs, webp, svg
• What is a good source of Free an Premium images
  • Unsplash
  • Depositphotos
  • Pexels
  • Librestock
• What about icons (Font Awesome is a form of type, but can convert to SVGs)?
• Is a CDN a good idea?
• How you set up crops and dimensions when building in the browser with client changing their mind?
• How to you stop clients loading huge images?
• Why does CSS does not have background image source set yet?

Conclusions:

Images are good – use them!

Seriously, the web would be so boring without images.

This is a link to the post that David created to automate the creation of alt tags, description etc. when you uplaod an image to your WordPress media library:

https://davidwaumsley.com/working-smarter-with-wp-images/