Introduction

Cache, Articles Images, Site Performance, Content Optimization, Mobile Display

XT Adaptive Images is the best extension to generate responsive images. It packs Adaptive Images + HTML's new responsive image attributes (srcset and sizes) + Lazy Load + CDN in a single plugin.


By default, the basic HTML IMG tag has a single SRC attribute with the associated image file. XT Adaptive Images implements several techniques to generate and deliver the right images for each device screen.

>>> >> Breaking News - XT Adaptive Images PRO 4.0.0 << <<<<

  • NEW: Support of HTML's new responsive image attributes: srcset and sizes
  • NEW Support of Vanilla Lazy Load library, v2.0.0-beta.2
  • NEW: Compatibility with Joomla 4
  • UPDATE: jQuery Lazy Load library, v1.9.5

The plugin implements:

  • Adaptive Images, to generate images of different sizes to match the desktop and mobile resolutions.
  • HTML's new responsive image attributes, to support the latest HTML's new responsive image attributes.
  • Lazy Load, to delay the images load until it is finally required when the user visits a page.
  • CDN Integration, to deliver images from your CDN.

Benefits

  • Works on your existing site
  • Incorporates the latest HTML's new features for desktop and mobile
  • Requires no mark-up changes
  • Device agnostic
  • Mobile-first philosophy
  • Easy & powerful customisations
  • Faster Page Loads & Reduced Server Load, easy integration with a Content Delivery Network (CDN)

Adaptive Images

XT Adaptive Images PRO for Joomla! is a port of adaptive-images.com.

The Adaptive Images technique detects your visitor's screen size and automatically creates, caches, and delivers device-appropriate re-scaled versions of your web page's embedded HTML images. No mark-up changes needed. It is intended for use with Responsive Designs and to be combined with Fluid Image techniques.

HTML's new responsive image attributes, srcset and sizes

Save bandwidth and speed up your site by sending the correctly-sized images for the device with HTML’s new responsive images capabilities. This option generates all image sizes, reagardless of the device width.

The Adaptive Images is a good first answer to generate images of an adequate approximate size, based on the screen dimension. Since the browser calculates the final size of the required image, the srcset and sizes attributes has been added to the HTML standard. In this way, the browser can select and load the perfect image.

XT Adaptive Images PRO processes the defined images, with the basic attributes, by the standard content editor; and generates the new srcset and sizes attributes. No need of content definition or mark-up changes.

For more information about the new HTML's new features:

  • Responsive Images Done Right: A Guide To picture And srcset - Smashing magazine
  • Keeping srcset and sizes under control, by Matt Wilcox

Lazy Load

XT Adaptive Images PRO also includes images Lazy Load. This technique delays loading of images in long web pages. Images outside of viewport are loaded when user scrolls to them.

The plugin packs two libraries:

  • The original jQuery Lazy Load, by Mika Tuupola
  • The latest Vanilla Lazy Load (beta), with support srcset and sizes attributes, by by Mika Tuupola

Examples & Demo

The images on our site are processed with XT Adaptive Images. On a Desktop, they are delivered from our Content Delivery Network (CDN) with no modification. On Tablets, Phones, or Phablets, they are also delivered from the CDN, but images are modified to fit the screen view.

Features

  • Adaptive Images
    • Resolutions: The resolution break-points to use (screen widths, in pixels). By default: 1382,992,768,480.
    • PRO Generate srcset: Save bandwidth and speed up your site by sending the correctly-sized images for the device with HTML’s new responsive images capabilities. This option generates all image sizes, reagardless of the device width.
    • Generate srcset sizes: The associated sizes field for images.
    • File Types: Options to choose gif, jpg / jpeg, or png integration.
    • Ignore Files: A comma separated list of (part of) path/file names to ignore.
    • Enable in Inline Scripts: Enable to convert the media file URLs found in inline javascripts.
    • JPG Quality: The quality of any generated JPGs on a scale of 0 to 100.
    • Sharpen: Shrinking images can blur details, perform a sharpen on re-scaled images?
    • Detect Retina displays: You can choose to serve high DPI images to those displays.
    • PRO Cache Path: Path to the directory where resized images will be stored. By default, media/xt-adaptive-images.
  • CDN Configuration
    • Site Root: The root of your website that you have connected to your CDN server.
    • CDN Domain: The domain of your CDN Server.
    • PRO Handle HTTPS urls: Select to also handle https urls (secure urls)
  • PRO Extra CDN Sets
    • Options to configure up to 5 extra CDN Sets, available features for each CDN: Site Root, CDN Domain, Handle HTTPS urls, File Types (gif, jpg / jpeg, or png), Ignore Files, and Enable in Inline Scripts.
  • PRO Lazy Load Images
    • Enable Lazy Load Images: Lazy Load is delays loading of images in long web pages. Images outside of viewport are not loaded until user scrolls to them.
    • Image class: Class to detect images to be lazy loaded. By default, xt-lazy-img. You can define more than one, for example: img-polaroid,xt-lazy-img.
    • Lazy Load Library:
    • jQuery Lazy Load (1.9.5)
    • Vanilla Lazy Load (2.0.0-beta.2)

Acknowledgements

Right-sizing Images - Mixing Responsive and Adaptive Techniques

This extension is based on a presentation given at J and Beyond 2014, Mixing Responsive and Adaptive Techniques, by Duke Speer.

About Adaptive Images

Adaptive Images by Matt Wilcox is licensed under a Creative Commons Attribution 3.0 Unported License. This Joomla! extension would not be possible without this amazing piece of code. Thank you Matt!

About Lazy Load

Lazy Load Plugin for jQuery is inspired by YUI ImageLoader Utility by Matt Mlinac. All code licensed under the MIT License. In other words you are basically free to do whatever you want. Just don't remove my name from the source.

Changelog

Date: 15 June 2020

  • NEW: Support of Lazy Load LazySizes
  • Enhancement: Firefox - Compatibility review
  • Update: XT Platform 2.8.1
  • Usability improvements, optimizations and code styling
Functionality
Does what it says
Ease of use
Plugin configuration is really easy
Support
Support is outstanding (at least if you buy thr PRO version).
Documentation
Not really necessary.
Value for money
Very good.
I used this to: automatically resize all my site images and provide a better user experience
AutoTweet NG
Free

AutoTweet NG

By Extly Tech
Social Share
✔ Social Autoposting. The social media content management tool. Simply, AutoTweet NG auto posts your content to social networks. AutoTweet NG solves social networks integration in Joomla with minimum effort in an efficient way. === NEW: Joomla! Custom Fields are supported in the Content (Articles) plugin - NEW Support of Twitter's 280 Limit and Facebook's Domain Verification === ✔ AutoTw...
AutoTweet NG Pro
Paid download

AutoTweet NG Pro

By Extly Tech
Social Share
✔ Social Auto-posting. The social media content management tool. Simply, AutoTweet NG PRO auto posts your content to social networks. AutoTweet NG PRO solves the integration of social networks with an extensive feature set to empower the ecosystem of Joomla! extensions. === NEW: Joomla! Custom Fields are supported in the Content (Articles) plugin - NEW Support of Twitter's 280 Limit and Fa...
XTDir for SobiPro
Paid download

XTDir for SobiPro

By Extly Tech
SobiPro Extensions
A Unique Solution to empower SobiPro! XTDir is a new extension to manage and extend SobiPro as never before! "Built on your feedback and our experience developing SobiPro extensions" It's a single component, with a set of modules and plugins, to add the most frequently requested SobiPro features. All configuration and management tasks are performed in a single administrative center. XTDir, mo...
XT Link Item for K2
Paid download

XT Link Item for K2

By Extly Tech
K2 extensions
"XT Link Item for K2" allows to define relations between specific K2 item(s)" ** As currently, K2 does not offer control of its related items. The extension offers full control over what items and the order of the related items selected for each K2 item *** --- A K2 Related Items Solution --- When user creates or modifies a K2 article, links to related K2 articles can be defined as new attribut...
Joocial
Paid download

Joocial

By Extly Tech
Social Share
✔ Social Autopublish. The social media content management tool. Simply, Joocial auto posts your content to social networks. Joocial is the next stage of auto-posting evolution, beyond simply auto-publishing content to a social network. === NEW: Joomla! Custom Fields are supported in the Content (Articles) plugin - NEW Support of Twitter's 280 Limit and Facebook's Domain Verification === Jo...
XT Adaptive Images
Free

XT Adaptive Images

By Extly Tech
Images
XT Adaptive Images is the best extension to generate responsive images. It packs several techniques to generate and deliver the right images for each device screen. By default, the basic HTML IMG tag has a single SRC attribute with the associated image file. XT Adaptive Images implements several techniques to generate and deliver the right images for each device screen. >>> >> Breaking News - XT...
Composer App integration for Joocial
Paid download

Composer App integration for Joocial

By Extly Tech
Social Share
Our social mobile app is the next stage of channel management for Joomla!. Ready to provide new advanced features for communities, powered by mobile added-value services. From Joomla! extensions, content items can be directly published via mobile sharing to social networks like Facebook, Twitter, Google+, Instagram, Pinterest, WhatsApp (or any on other application). This plugin integrates AutoTwe...
XT YouTube Optimizer
Paid download

XT YouTube Optimizer

By Extly Tech
Multimedia Players
XT YouTube Video Optimizer detects all Youtube players in a page and replaces them with the default video image, that can be clicked to play the original video player. XT YouTube Optimizer for Joomla! is a port of "A Better Method for Embedding YouTube Videos on your Website" (Amit Agarwal). XT YouTube Video Optimizer detects all Youtube players in a page and replaces them with the default vide...
XT Search for Algolia
Paid download

XT Search for Algolia

By Extly Tech
Site Search
✔ Instant Search and Autocompletion for Your Site, powered by Algolia XT Search for Algolia integrates your site and Algolia. Algolia is the smartest way to improve search on your site. Autocomplete and Instant Search are included, along with full control over the look, feel and relevance. >>> >> Breaking News - XT Search for Algolia 4.0.0...
XT Perfect SEO Pagination
Paid download

XT Perfect SEO Pagination

By Extly Tech
SEO & Metadata
An essential solution to improve the SEO navigation of your site. The basic page navigation of a Joomla site works perfectly fine for a small site. Once a site reaches a big number of published pages, Google crawling budget must be managed to focus the effort on the critical pages. XT Perfect SEO Pagination helps to properly describe the pagination to the search engine. Enhance Page Title with...

XT Adaptive Images PRO

Version:
6.2.0
Developer:
Extly Tech
Last updated:
Jun 16 2020
Date added:
Feb 25 2016
License:
GPLv2 or later
Type:
Paid download
Includes:
p
Compatibility:
J3 J4 Alpha
Download

Uses Joomla! Update System

Score:


Write a review