Responsive resize image logo update#

For example, HiSRC has you put higher resolution images as data-attributes: Many of the techniques require you to use special HTML. This is really a sub-question of the above. If you have a small project, a brand new project, or a project with legacy content that you are able go back and update, you are also able to choose a technique which does require special markup, so also read on. If that’s the case, read on to discover those other techniques. Perhaps the vast majority of traffic to your site is for newer content in which you can make markup changes and thus take advantage of other techniques. It works by routing requests for images through a PHP file which intelligently serves (and creates if need be) images of the appropriate size for the screen width.Īnother question to ask yourself is if you care about legacy content. The only technique I know of that works with absolutely no markup changes is Adaptive Images.

Responsive resize image logo update#

Yeahhhh… I’m not going to go back and update every on the site, so I need a technique that will allow me to leave those alone. Which really means… do I have legacy content that is impractical to update? For instance, I have thousands of pages of content on CSS-Tricks and a writing staff of one. Many of the questions may apply to your project, so you’ll have to sort out which techniques fit what scenarios and find the overlap. To choose which technique is right for you and your project these questions may help as a guide. The spreadsheet has the data, but let’s digest it through thinking about it through the lens of practical questions. To keep track, Christopher Schmitt and I have created this spreadsheet of techniques. That is, solutions to help us serve the right image for the occasion (e.g.

There are a bunch of techniques going around for dealing with responsive images lately.