Image in RWD

Questions related to the Responsive Web Design tools of WYSIWYG Web Builder.
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/respon ... esign.html
Please read this first before posting any questions! Also check out the example project to get an idea how the RWD concept works.

Responsive Web Design FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
Post Reply
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Image in RWD

Post by petejos »

Hi there,

What is the best suggestion to insert images for a RWD web pages and make they are able to display properly across all major devices? Much appreciated if I could get help? Thanks.
User avatar
crispy68
 
 
Posts: 2737
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Image in RWD

Post by crispy68 »

In regards to images themselves, here are a couple of my suggestions:

1. Only insert an image as big as it is needed in your largest breakpoint. In other words, if the image is not going to be larger than 600px wide, then make sure the image you use is around 600px wide. Dont insert the image at 1920px as this will be larger than needed and slow down load times.

2. Optimize the photo. Even if you insert the image at optimal size (height/width), you need to make sure the image is compressed as much as possible so that it loads quickly. Many programs can do this (photoshop) but there are free places online that will do the same.
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: Image in RWD

Post by petejos »

Do I need to use layout grid when inserting image?
User avatar
Pablo
 
Posts: 21577
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Image in RWD

Post by Pablo »

Do I need to use layout grid when inserting image?
Yes, if you want to the image to be flexible.
But images can also have different (absolute) size in breakpoints.
Post Reply