Dear friends,
I have several blocks which are made up one single image, which fills up several columns (up to 6). In the Narrow layout, these images appear truncated, or they mess up the whole layout because the corresponding blocks can't be resized (as opposed to a block made up of a title and some text). Basically, I think I'm pointing out the problem of Images in Omega. I have the feeling that Omega is ideal for Websites mainly containing text, but what about graphic Websites containing a lot of photos ? How do Web designers organize their Narrow, Normal and Wide layouts when they have photos spread accross the whole page? Is it possible to hide blocks/regions according to the layout (for instance hide image blocks in the Narrow layout so as to leave only resizable blocks?) Many thanks for your help and ideas on this subject.
Comments
Resizing field-images you can
Resizing field-images you can try
Client-side adaptive image (in order to serve images based on device window size)
http://drupal.org/project/cs_adaptive_image
Show/hide blocks based on device size take a look at this ...
http://groups.drupal.org/node/204813#comment-674558
--
http://jmolivas.com/
@jmolivas
Hi, Have you got a link so we
Hi,
Have you got a link so we can take a peek at the problem?
This is only my opinion but I believe you have to design for mobile first, then add styles as the width increases. You can hide blocks with .block-name {display: none} or use the method jmolivas outlines.
This might help: http://www.uxbooth.com/blog/how-to-design-a-mobile-responsive-website/
There are style considerations and you may have to alter your design to cater for as many users as you can. Full width photo galleries and stuff will work fine, the images will resize and keep in the grid. Personally, I am quite happy to sacrifice design for usability.
Check out: http://www.westminster-abbey.org/ for a good example of how they handle things.
http://tympanus.net/Tutorials/ResponsiveImageGallery/ - galleries
http://css-tricks.com/ is a great example of responsive design
I hope this helps a bit and gives you a few ideas.
Sam.
Thanks for these tips
Thank you very much Jesus Manual and Sam for your help on this subject. I begin to think more clearly now. Your tips on rescaling images and hiding/showing blocks were very helpful. The westminster-abbey site is a good example of what I'm trying to reproduce and I understand now better how responsive design works. Thank again !