The Houston International Quilt Show presents a classic web design problem – many gorgeous images but of various sizes and orientations [about equal number of landscape and portrait shots]. Because the images are from various sources extensive captioning is also required particularly for the winning quilts. Finally, the quilting audience is quite broad so the design of the gallery and slider should be responsive so smartphone and tablet users can see the quilt photos with minimum distortion and highest fidelity.
The above is the default WordPress gallery option which displays the various sized quilts but in fairly ragged thumbnails [click on any thumbnail to see the much better original in a Lightbox]. There are captions and a responsive grid layout but no slider option. This is an okay gallery show made much better by using the free Responsive Lightbox plugin which displays the original images in Lightbox fashion and allows extensive customization including choice of four photo display engines – FancyBox, Nivo Lightbox, SwipeBox, and PrettyPhoto. The Responsive Design plugin makes WordPress Galleries work much better. However, users looking for a slider interface the gallery is wanting. Hence some of the following alternatives.
[iframe src=”http://picsofcanada.com/splash/refinehq.html” width=”100%” height=”520″] Alex Dunphy’s Refine Slide also provides a rich set of slide transitions and much stronger on image captioning. But the responsiveness applies only to the slide image and not the full page image [Try it by collapsing this page in your browser]. However, like the Page Transitions slider, this slider handles portrait and landscape plus variable image sizes with comparative ease. But centering the image on the slide page requires some carefull CSS coding.
Book Block Slider.
[iframe src=”http://picsofcanada.com/splash/bookblock/booker.html” width=”100%” height=”480″] Book Block Slider requires users to create images that are of the same dimensions and captioning is quite limited. But in return users get a folding book slider that is perfect for small card like sliders which are perfect for banner ads. One can dispense with the prev and next controls and go with keyboard or touchscreen swipe interactions. This works well for small area banner ads and shows.