Skip to content

RESOURCES / BLOG / Responsive Images

Results for Tag ‘Responsive Images’

How I used Cloudinary to solve responsive image needs in my Jekyll website, and shared the magic in a plugin

Topics Guest Post, HTML, Responsive Images
Read Time

This is a guest post by Nicolas Hoizey, co-founder of Clever Age and creator of the Jekyll Cloudinary plugin. Nicolas’ plugin leverages Cloudinary’s image storage, optimization, resizing, and delivery infrastructures to automate responsive images in Jekyll-generated static sites. We think it’s the bee’s knees, and invited Nicolas…

How to Scale an Image Automatically with Client Hints

Topics DotNet, HTML, Image Transformation, Java, Javascript, Node, PHP, Responsive, Responsive Images, Ruby on Rails
Read Time

I’ll start by giving it to you straight: As part of the recent “auto–everything” launch, we introduced two new transformation parameters – dpr_auto and w_auto, which pair the DPR and Width Client Hints with Cloudinary’s existing image resizing and delivery infrastructure, in order to serve up simple,…

Automatically art-directed responsive images with Cloudinary

Topics Guest Post, HTML5, Image Transformation, Responsive, Responsive Images
Read Time

Previously, we saw how to mark up performant, adaptable <img>s using srcset and sizes in conjunction with Cloudinary’s image transformations. How far can we push that notion of “adaptability”? Last time, we learned how to offer up an image at a range of different resolutions. This allowed us to…

Introducing Intelligent Responsive Breakpoints Solutions

Topics HTML5, Image Transformation, Responsive Images
Read Time

The number of different devices available and their potential screen resolutions keep increasing, and to support this wide range of resolutions and devices, responsive website design is now the standard. A website’s markup must adapt itself to look perfect on all the different devices and in various resolutions, pixel densities…

Responsive images with 'srcset', 'sizes' and Cloudinary

Topics HTML5, Responsive Images
Read Time

The “responsive images” problem Five years ago, Ethan Marcotte coined the term “responsive web design” and gave it three defining ingredients: fluid grids, flexible media, and media queries. An essential part of this flexible media is the use of the srcset attribute in HTML, which plays a crucial role…

How to automatically create images for Responsive design

Topics Django, DotNet, Image Transformation, Java, jQuery, Node, PHP, Responsive Images, Ruby on Rails
Read Time

Responsive web design is a method of designing websites to provide an optimal viewing experience to users, irrespective of the device, window size, orientation, or resolution used to view the website. A site designed responsively adapts its layout to the viewing environment, resizing and moving elements dynamically and based…

Start Using Cloudinary

Sign up for our free plan and start creating stunning visual experiences in minutes.

Sign Up for Free