- This topic has 5 replies, 2 voices, and was last updated 1 year, 7 months ago by
.
-
Posts
-
SO I want to have an optimized website and one important thing is sizes of photos. So my question is when I, for example, making a grid with single photos lets say 3 of them. On the website, realistic size which I see is around 400px on longer edge but I upload 1600px longer edge. So my question is should I try to upload a photo which is closest to 400px or that doesnt matter because when I resize a photo in the grid, GP is creating new smaller size?
Customer Support
Hi there,
can you check the URL you provided as i cannot the site to open?
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/check now
I would:
1. Set up your test grid, with your 3 images ( or however many ). Get the styling right eg, grid container padding, grid gap etc.
2. Set your Responsive grid widths for Tablet and Mobile. Again adjust any container spacing, grid gap.
3. Once you’re happy with the layout – use the Web Inspector to inspect the images. You will want to inspect the size of the image in the developer tools for the various device widths: Desktop / Tablet and Mobile by reducing the browser width.Whichever device has the largest image, generally that is Tablet view if the grid columns are set to 100%, is the max image size you require.
Final thing – if you’re not too bothered about bandwidth then you can double that size to account for x2/Retina screens.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/So David if the visible size on the page of the image is lets say 800×600 thats what I should upload, because if I upload 1600×1200 (twice bigger) then I will loose the page speed? Or GP will resize it and that kind of photo will be loaded ?
If you’re happy with the quality of the 800px image then i would leave it at that.
Some users want to have retina quality, and will sacrafice performance over that … but its not necessary.Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
- You must be logged in to reply to this topic.