For the first article on my site, I'd like to give some feedback on the creation of a site presenting cabinetmaking furniture: cb-atelier-ebeniste.fr.
The aim of the site being to present furniture, the most appropriate medium is images. The images must therefore be well displayed and the site must be adaptable in order to reach the widest possible audience.
If we take the problems separately:
- An adaptive site: easy, get an adaptive theme and you're done.
- Well-presented images, with slideshows, etc. : easy, there are plenty of modules allowing it
Taken together: an adaptive site with well-fronted images: well it's not so obvious...
Objectives:
- A slideshow on the home page.
- A pleasant and adaptive navigation throughout the site
- On the furniture details page, see all the images of a piece of furniture.
- Access a popin to see full-size images.
Constraints:
- No custom code (except a bit of CSS), only configuration of existing modules so that site maintenance is easy.
- No declensions like: one terminal, one theme adapted to the resolution of that terminal. Maintenance has to be easy, I've already given once with this strategy and I don't think it's a strategy for the future for several reasons:
- there are already loads (and this will only increase) of different terminals accessing the web,
- the completion time is only going to increase with a feeling of doing and redoing the same thing X times,
- the complexity of maintenance is increased tenfold,
- (I don't like mobiles, I think you can feel it :D ),
- ...
Modules used:
- Theme : Corolla.
- Adaptive image to make images... adaptive.
- Colorbox for popin.
- Flexslider for the slideshow.
- Views fluid grid for displaying furniture categories on the homepage.
Modules tested then rejected:
- Dynamic display block.
- Gallery layout for a piece of furniture.
- View slideshow.
Gallery Formatter, Dynamic Display Block and Views Slideshow
The problem with these 3 modules is that they use fixed sizes for their display and above all this size is set not in CSS, but directly in the HTML rendered by the modules. This kills adaptability.
This is a shame, because for sites "for computers" (we'll say desktop), these modules give very good and beautiful renderings.
Gallery formatter provides a fairly configurable field formatter that pairs very well with Colorbox, so for a desktop site it's a very good choice.
Dynamic Display Block has clean, customisable templates, so it can meet a wide range of needs, but again only for desktop.
Image adaptability
Making images adaptive took me a step closer to understanding how to use the Adaptive Image module. I report on this learning in the following tutorial: Adaptive Image tutorial.
The home page
The slideshow
I used to use the Views Slideshow module for slideshows, but Flexslider turned out to be just as functional (or even more functional) and above all allowing adaptability. Very clean and beautifully rendered.
Furniture categories
At first gone on using a Grid rendering of a view with a lot of CSS customisation behind it, I tested the Views Fluid Grid module. And in fact, this module is great, because it allows me to do with a click what I was planning to do with difficulty (or at least it would have taken a long time) in CSS in order to make the list adaptive.
The detail of a piece of furniture
For the detail of a piece of furniture, I needed a connection with Colorbox so that the original photos could be viewed. Incidentally, I was pleasantly surprised to find that the colorbox popins are adaptive out of the box.
In chronological order, for the furniture image trainer :
- Gallery Formatter: good rendering, integrates with Colorbox, not adaptive => rejected
- Flexslider: renders well, adaptive, doesn't support colorbox => rejected
- Colorbox : good rendering, adaptive, allows Colorbox to be used of course => accepted
I slightly regret the fact that the Colorbox image field formatter doesn't allow you to display a single image and that in the popin, you have access to the other images. But at the same time, it allows the visitor to see that there are other images. I've tried using Display Suite to limit the number of images displayed, it does limit the number, but it also limits the number of images in the popin.
Conclusion
I think it's a shame, because of development for mobiles, tablets, etc. we have to do without modules that render well on desktop.
I hope you have enjoyed this feedback and that it has been of benefit to you.
See part 2 of this feedback, devoted to hosting.