Uploaded image for project: 'Hippo CMS'
  1. Hippo CMS
  2. CMS-13035

Responsive Gallery Manager plugin

    XMLWordPrintable

Details

    Description

      I'm asking to implement a new Gallery Manager plugin to better serve responsive images and to not have collisions with existing project setups that are using the existing plugin.

      Story:
      In a responsive website for displaying images now you have the widely supported srcset and sizes img attributes.

      More information:
      https://bitsofco.de/the-srcset-and-sizes-attributes/

      Browser support:
      http://caniuse.com/#feat=srcset

      Now to effectively use this great feature, the plugin should work in this way:
      1. Be able to define a responsive image set - nothing special here
      2. Be able to add image variants based on the placeholder size of the image on the site.
      (in the documentation you are referring to small, medium, large ...etc 1..N)
      This placeholder size should be the smallest or the largest size that is supported by the website(mobile-first or desktop-first approach) Could also be an optional parameter and then the uploaded image size gives the minimum or maximum placeholder size based on the scale image up or down property
      3. After you have the placeholder size give the possibility to define 1...N pixel density for those image variants.
      4. Generate the new images:
      Placeholder size X pixel density[1...n]
      Store 2 properties:
      -pixel density
      -width in "w" format

      Example structure:
      Responsive image set [image set]

      • full screen image [image variant]
        (smallest-size-width:400px, smallest-size-height: 500px)
        -pixel-density[list]
        -pixel-density[0]
        (density: 1.15)
        -pixel-density[1]
        (density: 1.30)
        -pixel-density[2]
        (density: 1.45)
        -half width image [image variant]
        (smallest-size-width:200px, smallest-size-height: 500px)
        -pixel-density[list]
        -pixel-density[0]
        (density: 2)
        -pixel-density[1]
        (density: 2.5)
        -pixel-density[2]
        (density: 3)

      The other options and capabilities like keeping the aspect ratio are also applying here for this plugin from the original plugin.

      Attachments

        Activity

          People

            Unassigned Unassigned
            gangeld David Gangel
            Votes:
            0 Vote for this issue
            Watchers:
            5 Start watching this issue

            Dates

              Created:
              Updated:
              Resolved: