Specifying image dimensions for site speed vs. responsive
-
I'm working on improving site speed from an SEO perspective, and one bit of advice I see often is to specify the dimensions of the images you're using so the browser knows the size of the image it needs to download.
However, I am wondering what impact this may have if the site is responsive? If you specify the large dimensions suited for a desktop browser, would you be forcing a mobile browser to use that sized image?
Has anyone seen dramatic improvements in site speed using the <picture>tag for responsive images?</picture>
Thanks!
Jannette
-
To be clear - specifying the image dimensions on the HTML has no effect on what size of image is downloaded from the server. It serves only to specify the space on the html page that should be reserved for the image display when it does finally load. So it gives s the impression of faster speed by keeping the page from redrawing once the image dimensions are actually known by the browser.
-
Specifying dimensions of the source image does create a faster loading time as there is no resizing done in the browser. You should then use different sized imaged for different devices.
This is a good resource
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
How to find out that none of the images on my site violates copyrights? Is there any tool that can do this without having to check manually image by image?
We plan to add several thousand images to our site and we outsourced the image search to some freelancers who had instructions to just use royalty free pictures. Is there any easy and quick way to check that in fact none of these images violates copyrights without having to check image by image? In case there are violations we are unaware of, do you think we need to be concerned about a risk of receiving Takedown Notices (DMCA) before owner giving us notification for giving us opportunity to remove the photo?
Web Design | | lcourse1 -
Changing top level navigation between site sections
We've got an internal proposal to change our top level nav depending on the section of the site. For example, on our homepage it might read: Products, Library, About with relevant links dropping down below. As we have varied products, the drop down underneath it would include the various families. When arriving on the product family page the top-level nav would change to represent more specific offerings. For example: xxx.com 1. Products; 2. Library; 3. About xxx.com/xxx 1. Product family 1; 2. Product family 2; 3. Product family 3; 4. Library; 5. About What are the SEO/UX implications of this? It seems confusing but allows more specific navigation via the main nav depending on the section of the site. Also it seems that an alternating TLN might not be too Google-friendly.
Web Design | | gwelch0 -
Can Image File Names be Masked?
If we "mask" file names for our website but they are left their original name on the server, will Google notice this? Client wants to mask them in order to name them with keywords but not change on the actual server.
Web Design | | Atlanta-SMO0 -
URL Designing and Site Architecture
Hi, 1. At the end of the URL, should we have "/" or not (for e.g. my website www.example.com/abc/) 2. What is the optimum level of site depth 3. Google crawler will go through the breadcrumb or url (If a page is at 6th level through breadcrumb and at 4th level through URL, at which level will google crawler recognize this.
Web Design | | adiez12340 -
Joomla! Site Returning 12000+ Duplicate Content Errors! W Image
(I do award "Good Answer" and "thumbs up" to responses as earned) I have tried to ask this question previously (maybe not correctly). I have a client that I am doing the on and offsite optimization and the MOZ report is kicking back major errors. I have examples below. They all seem to relate directly to rokecwid and ECWID. Is there ANY solution to fix this? Is this hurting the rankings Since I didn't build the site, I am having to tell the website company what to do when I need changes made to code, etc... I am also not very proficient with Joomla! and my web engineer is one of those closet coders (the best kind to have) and doesn't communicate in a way that a "layman" could understand. He pointed out several issues with the HTML but I don't think that is related to this below. Can anyone tell me what to tell the web company that built this site to get rid of these errors? A very small sample of the urls w errors:
Web Design | | Atlanta-SMO
http://www.metroboltmi.com/shop-spareparts?
Itemid=218&option=com_rokecwid&view=ecwid&ecwid_category_id=3560097
1 14 1 http://www.metroboltmi.com/shop-spareparts?
Itemid=218&option=com_rokecwid&view=ecwid&ecwid_category_id=3560098
1 1 0 http://www.metroboltmi.com/shop-spareparts?
Itemid=218&option=com_rokecwid&view=ecwid&ecwid_category_id=3560099
1 14 1 http://www.metroboltmi.com/shop-spareparts?
Itemid=218&option=com_rokecwid&view=ecwid&ecwid_category_id=3560100
1 14 1 SEOMOZErrors_zps3a1ce2a2.png0 -
Best Way To Have HD Videos On Site That Will Work On Mobile Devices
Hi, I hope someone can help me with this. I am working on a site for a client who works at a video production company. They want to have a fair few HD videos on there site but also for the site and videos to be viewable on mobile devices. I have got a responsive wordpress theme and the site is beginning to take shape. I am wondering however how I can best get the videos to display on mobile devices while maintaining a good load speed. Until now I have been using amazon S3 which stores and feeds the videos and I use Easyvideoplayer to embed the videos. The problem is they do not appear to show up from mobile devices when using wordpress. can anyone suggest the best way for me to still feed the videos from S3 but get them to display on mobile devices. oh, they are private videos so they cannot be placed on youtube.
Web Design | | jensonseo0 -
Thoughts on how to speed up my site? (Other site ideas.)
I was wondering if someone had a few minutes to talk a look at our site and see how to speed it up. I've ran some of the speed tests and I get different results, so I'm not sure if my site would be considered "slow" or not. Also if there any other things that jump out at you (usability, side bar, things I should change / add / take away to make a users experience better, etc.) please let me know. Any feedback is good feedback to me. 🙂 I'm using WP Super Cache as well. Thanks!
Web Design | | NoahsDad1 -
Best way to set up a site with multiple brick and mortor locations across Canada
I have a client who is expanding his business locations from 2 cities to 3, and working towards having 10+ locations across Canada. Right now we're building location based landing pages for each city, as well as keyword targeted landing pages for each city. For example, landing pages for "Vancouver whatever clinic" and "Calgary whatever clinic" as well as for "Vancouver specific service", and "Calgary specific service". This means a lot of landing pages will need to be created to target each of 10 or so desirable "service" keywords for each city's location. I've no issue with this, however I was wondering how other companies go about this? What's the best way to be relevant for certain "service" based keyword searches in each city? Many of the "service" keywords are 'localized' meaning they will show Google Places results for local brick and mortar businesses for each location. I'm quite good at optimizing locally for this type of thing. However, many of the "service" keywords are not yet 'localized' by Google, I'd want to have my client webpages show well in the SERP's. for these 'non-localized' "service keywords" as well. the new site will be built in WordPress
Web Design | | AndyKuiper0