Images Responsiver tries to help developers make it easy for content authors to tackle responsive images needs.

• Why does this project exist?
• One repository, multiple projects
  • A Node.js package to ease responsive images: images-responsiver
  • A plugin for Eleventy: eleventy-plugin-images-responsiver
• Sources and documentations
• Contributing
  • Contribution guidelines
  • Tools and automations
• License
• Authors

As Steve Jobs once said:

You've got to start with the customer experience and run backwards to the technology.

Responsive images are one of the most difficult topics nowadays for front end developers and content authors, they involve multiple features and syntaxes, but they are required to provide a good performance to Web users.

Most content authors should not have to learn the complex responsive images HTML syntax, how and it is used by browsers to load the right image for current viewing context.

Multiple projects are managed inside this shared monorepo.

Images Responsiver transforms plain, simple <img src="…"> HTML tags into better responsive images syntax with srcset and sizes attributes.

Knowing that <picture> is only required for rare advanced usages, Images Responsiver should be enough for most use cases, where the need is known as Resolution Switching.

Read this article on Cloudfour's blog to know more of the theory.

Images Responsiver is also available as a plugin for Eleventy, an awesome Static Site Generator.

It allows authors to use the simple and standard Markdown syntax for images — ![alt text](image.jpg) — and yet get responsive images in the generated HTML.

First, thank you for considering contributing to images-responsiver! It's people like you that make the open source community such a great community! 😊

There are many ways to contribute to this project.

Get started here.

• This monorepo is managed with Lerna.
• Tests are run by jest and written in the __tests__ folder for each package.
• Pull Requests are checked with tests run on GitHub Actions (see configuration)
• Dependencies updates are automated with dependabot (see configuration)
• Pull Requests are rebased as necessary, and merged automatically by Kodiak if there is an automerge 🤞 label (set by dependabot for example) and GitHub Actions CI check is OK (see configuration)
• The documentation is written as Markdown files in the docs/ folder, and transformed into HTML by Jekyll powered GitHub Pages: https://nhoizey.github.io/images-responsiver/

This project is licensed under the MIT License.

• Nicolas Hoizey: Idea and initial work, maintainer

See also the list of contributors who participated in this project.