herb miller

WordPress plugin specialist

  • Home
  • About
    • Online CV
    • Contact
    • Find me
  • Shop
    • Seriously Bonkers – softback book
    • Seriously Bonkers – signed book
    • Seriously Bonkers – PDF
  • Dev env
    • Local development
    • WordPress plugins
    • Server environments
    • Development hardware
    • WAMP configuration
    • Tools and languages
    • What’s not in my development environment?
    • Anything else in your development toolkit?
  • Sites
WebP for my iPad

WebP for my iPad

OK. so I’ve demonstrated that my iPad can’t display WebP format images, so I’ll have to try the picture tag method as a polyfill.

<picture>
  <source srcset="img/awesomeWebPImage.webp" type="image/webp">
  <source srcset="img/creakyOldJPEG.jpg" type="image/jpeg">
  <img src="img/creakyOldJPEG.jpg" alt="Alt Text!">
</picture>

This is the sample HTML copied from CSS Tricks: Using WebP Images.

So let’s try displaying oik-types-banner-772x250.webp to browsers that support it and the JPEG version for those that don’t.

GIMP 45% - 21KB
<picture>
<source srcset="https://herbmiller.me/wp-content/uploads/2021/02/oik-types-banner-772x250-45.webp" type="image/webp">
<source srcset="https://herbmiller.me/wp-content/uploads/2021/02/oik-types-banner-772x250-45-1.jpg"  type="image/jpeg">
<img src="https://herbmiller.me/wp-content/uploads/2021/02/oik-types-banner-772x250-45-1.jpg" alt="GIMP 45% - 21KB">
</picture>

Categories: WordPress

Published: February 6, 2021 | Last updated: February 6, 2021

Products

  • Seriously Bonkers - signed book £8.99 £5.99
  • Seriously Bonkers - PDF £1.00
  • Seriously Bonkers - softback book £8.99 £4.99

Recent Posts

  • Slog-bloat – server performance testing
  • WebP for my iPad
  • Image size reduction by quality
  • Localization of Full Site Editing themes
  • Fizzie – an experimental Full Site Editing theme

Recent Comments

  • Aprende gutenberg #49 - Aprende gutenberg on SB Children block – my first Single Block plugin
  • Richard Cagle on Installing Imagick for PHP 7 on Windows 10
  • WordCamp Birmingham on bucket list – WordCamp Birmingham UK 2015 (#wcbrum)
  • mick on WordPress capabilities: How to restrict Add New while allowing Edit
  • mick on WooCommerce 2.2.4 – Dynamic API Reference

Archives

Categories

WordPress 5.6.1. PHP: 7.3.27

WordPress version: 5.6.1

Gutenberg version: 9.9.3

Tide times from tidetimes.co.uk

Tide Times & Heights for Northney onMonday, 01 March 2021
High Tide:00:52 ( 5.00m )
Low Tide:06:06 ( 0.10m )
High Tide:13:03 ( 5.00m )
Low Tide:18:28 ( -0.10m )

Tide times from tidetimes.org.uk

Tide Times & Heights for Northney on 1st March 2021
00:52 - High Tide ( 5.00m )
06:06 - Low Tide ( 0.07m )
13:03 - High Tide ( 4.98m )
18:28 - Low Tide ( -0.12m )

Follow me

  • Home
  • About
  • Blog
  • Contact
  • Find me
  • Privacy notice
  • Sitemap

Site:  herbmiller.me
© Copyright herb miller 2012-2021. All rights reserved.


Website designed and developed by Herb Miller of Bobbing Wide
Proudly powered by WordPress