This presentation has been published at WordPress.tv. You can view it here, but if you enjoy it, please comment and give it some stars over there. Thanks!
This How-To session is designed for bloggers and web admins who have very active blogs on their site and want to make sure they are getting the most out of their images. The How-To covers how to Optimize your images for size, quality, responsiveness, and search engine optimization.
Excited to present at Wordcamp Miami next month on Optimizing Your Images — a subject I’ve written on fairly often. The folks at WordCamp Miami are creating a whole new Track called the “How To Track” which requires three things:
- That Slides be self-explanatory (no stock photos with titles only)
- That there be accompanying White Paper (PDF’s)
- That the presenter hangs out immediately thereafter at the Happiness Bar to do hands-on question answering.
I really love the idea. Yes, it requires more effort on the speakers part, but that’s why they’ll be really effective. Nice work David Bisset and the whole WordCamp Miami team! Here is the outline of my presentation:
- Optimizing your Images for Size and Quality
- Optimizing your Images for Various Screen Sizes
- Optimizing your Images for Search Engines
Optimizing your Images for Size and Quality
- Introduce IrfranView (simply as a free alternative to Photoshop)
- Find the maximum width that an image would appear on your site
- Resize/Resample your image for that maximum width
- Save for the Web in order to use lossy compression
- Mention automated tools available as well, but that the manual process helps you understand what is happening, and gives you more fine-tuned control
Optimizing your Images for Various Screen Sizes
- Discuss the importance of themes that handle images well (for example the Repo requires that images never bump outside the content area if they are too wide)
- Discuss image alignment and how it can wreck your content on smaller devices
- Introduce RICG Responsive Images plugin (https://wordpress.org/
plugins/ricg-responsive- images/) — this serves up the right size image for the screen size.
Optimizing your Images for Search Engines
- Discuss Title tags versus Alt tags
- Discuss on-page SEO optimization in relation to images
- Give some examples from my blog.