#1
  1. No Profile Picture
    Contributing User
    SEO Chat Explorer (0 - 99 posts)

    Join Date
    Jan 2018
    Posts
    53
    Rep Power
    1

    Responsive sites


    Does anyone know if you can post larger images on a responsive web design?

    The template I am using is saying my images need to be 2000 width.. that is much larger than the normal 900 for usual blog posts... This is a responsive site and if I go smaller then the images start to look pixilated..

    Anyone know?? Thanks
  2. #2
  3. No Profile Picture
    Moderator
    SEO Chat Super Hero (2500 - 2999 posts)

    Join Date
    Sep 2016
    Location
    USA
    Posts
    2,574
    Rep Power
    3213
    It's a trade of between performance and quality. Since you make your living with your photos, then I would lean to better quality.
  4. #3
  5. Moderator
    SEO Chat Good Citizen (1000 - 1499 posts)

    Join Date
    Sep 2016
    Location
    United Kingdom
    Posts
    1,314
    Rep Power
    1205
    I'm slightly confused, KOS seems to have understood so it's probably me being an idiot, I'm intrigued though so please could you explain?

    The template I am using is saying my images need to be 2000 width.. that is much larger than the normal 900 for usual blog posts...
    Here it sounds to me like you don't want them that big

    This is a responsive site and if I go smaller then the images start to look pixilated..
    Then here it sounds like they're too small


    Or, are you saying you don't like your pictures on smaller screens? Sorry (It's 3am for me, that's my only excuse)



    Sorry... re-read the post. Yes, use

    Code:
     max-width: xx%  max-height: xx%
    to style your images... you can make them as big as you want and still remain responsive
    Last edited by matt1966; Jan 28th, 2018 at 10:30 PM.
  6. #4
  7. No Profile Picture
    Moderator
    SEO Chat Super Hero (2500 - 2999 posts)

    Join Date
    Sep 2016
    Location
    USA
    Posts
    2,574
    Rep Power
    3213
    One way of dealing with this issues is to actually make 3 copies of the image, 1 for desktop, 1 for tablets, 1 for phones. So you would in effect have three images. Some sites use this method. It is a lot of work to go in and edit each file 3 times.

    Me I break some rules, I choose an image size that looks good at all resolutions, then I use % values to resize the image. Now this kicks up an error, using the % in the html code to size the image. I have not seen any adverse SEO effects using this method. Most browsers accept it. ( the browsers I am concerned with anyway )

    I keep one copy of the image on the server this way.
  8. #5
  9. Moderator
    SEO Chat Good Citizen (1000 - 1499 posts)

    Join Date
    Sep 2016
    Location
    United Kingdom
    Posts
    1,314
    Rep Power
    1205
    I think both
    Code:
     img-responsive
    and
    Code:
     img-fluid
    use 100% width and
    Code:
    auto;
    height with bootstrap, and as just about 90% of the internet use BS, all should be fine. I didn't actually know it was bad practice tbh
    Last edited by matt1966; Jan 28th, 2018 at 10:57 PM.
  10. #6
  11. No Profile Picture
    Contributing User
    SEO Chat Explorer (0 - 99 posts)

    Join Date
    Jan 2018
    Posts
    53
    Rep Power
    1
    I am happy with how the images look on all screens - and have them sized at 2000 wide as the template suggested - prophoto 6 -

    my main concern is how this affects SEO and my site loading time as images are larger.

    Thankyou to everyone
  12. #7
  13. Moderator
    SEO Chat Good Citizen (1000 - 1499 posts)

    Join Date
    Sep 2016
    Location
    United Kingdom
    Posts
    1,314
    Rep Power
    1205
    If you don't want to compress, make sure you at least scale your images.

    Should still be ok, as long as your site isn't an absolute slug
  14. #8
  15. No Profile Picture
    Contributing User
    SEO Chat Explorer (0 - 99 posts)

    Join Date
    Jan 2018
    Posts
    53
    Rep Power
    1
    Originally Posted by matt1966
    If you don't want to compress, make sure you at least scale your images.

    Should still be ok, as long as your site isn't an absolute slug
    Thanks for helping - how do I make sure it’s not an absolute slug?!?! LOL?!?!
  16. #9
  17. Digital Marketing
    SEO Chat Mastermind (5000+ posts)

    Join Date
    Aug 2008
    Location
    Florida
    Posts
    7,849
    Rep Power
    5653
    tools.pingdom.com is your friend

    You can post lower quality images with a button that says click here to view full size image?
  18. #10
  19. Moderator
    SEO Chat Good Citizen (1000 - 1499 posts)

    Join Date
    Sep 2016
    Location
    United Kingdom
    Posts
    1,314
    Rep Power
    1205
    You could test with gtmetrixs, pingdom, just make sure every other aspect of your site is optimised for speed. Wordpress is good in this respect, a couple of plugins can basically do most of it for you
    Last edited by matt1966; Jan 29th, 2018 at 12:35 PM.

Similar Threads

  1. Does the whole domainname need to be responsive?
    By TomDarche in forum New User SEO Questions and Answers
    Replies: 1
    Last Post: Jun 22nd, 2017, 12:59 PM
  2. Mobile Or Responsive
    By Glenn Kilpatric in forum Google Optimization
    Replies: 4
    Last Post: Sep 9th, 2015, 09:06 PM
  3. SERPS more responsive since caffeine?
    By WhiteHatSEOMktg in forum Google Optimization
    Replies: 7
    Last Post: Jun 22nd, 2010, 04:43 AM
  4. CasinoCoins Non Responsive - Anyone else?
    By dirtdog1960 in forum Affiliate Marketing
    Replies: 0
    Last Post: Mar 26th, 2006, 02:24 PM

IMN logo majestic logo threadwatch logo seochat tools logo