Image Height/Width attributes, how important are they and should a best practice site include this as std
-
Hi
How important are the image height/width attributes and would you expect a best practice site to have them included ?
I hear not having them can slow down a page load time is that correct ?
Any other issues from not having them ?
I know some re social sharing (i know bufferapp prefers images with h/w attributes to draw into their selection of image options when you post)
Most importantly though would you expect them to be intrinsic to sites that have been designed according to best practice guidelines ?
Thanks
-
Thanks for confirming that Paul !
Ive also noticed that when using services like Buffer etc, to post socially, that the articles image is not being displayed as an option in the images to choose from, to display as the image in the post, Instead its only showing options like the site logo etc which we don't want. I asked Buffer tech support and they said that if the images had height/width attributes then they should then be presented as image options to accompany the post
All Best
Dan
-
Image h x w attributes don't affect the actual speed of your page load much, Dan. They do strongly affect the perceived speed to the user.
If the size attributes are included, the browser can leave a correctly-sized space for each image as the page gets rendered, even if the images haven't started to download yet. Then the rest of the page content flows in around the image "placeholders". (Images are always slower than text.)
If no image size attributes are present, the browser essentially ignores the placing of the images until the image files actually download, then redraws the whole page to add the space back in for the images.
This redrawing for the images means that text and other elements will move around on the page until all the images have downloaded and it has finished rendering. This gives the user an impression of a much slower page, since they can't start to read the content until it has stopped moving around. Done properly, the visitor can start reading the top of the page even while all the images lower on the page are still downloading.
So yes, obviously including height and width attributes for images is standard best practice for designing an effective on-page user experience.
Hope that helps?
Paul
P.S. As proof, Google thinks they're such a standard requirement that they have included a check for them as part of the scoring algorithm of their Google Page Speed tool.
-
"How important are the image height/width attributes and would you expect a best practice site to have them included ?"
This is not the most important SEO thing in the world BUT according to your 2nd question
"I hear not having them can slow down a page load time is that correct ?"
That`s the point! The question related to this issue is how relevant the whole thing might be?
Modern browsers and broadband connections seem to make this insignificant but just in case there are some visitors which are not using the right settings they might get pictures unscaled and your whole site will be shown non-responsive... by the way, use responsive designs if you can to avoid that...
I
ve always been told to use these parameters . even if you don
t need it it ensures that your code is a little bit more perfect
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
-
What is SEO best practice to implement a site logo as an SVG?
What is SEO best practice to implement a site logo as an SVG?
Technical SEO | | twisme
Since it is possible to implement a description for SVGs it seems that it would be possible to use that for the site name. <desc>sitename</desc>
{{ STUFF }} There is also a title tag for SVGs. I’ve read in a thread from 2015 that sometimes it gets confused with the title tag in the header (at least by Moz crawler) which might cause trouble. What is state of the art here? Any experiences and/or case studies with using either method? <title>sitename</title>
{{ STUFF }} However, to me it seems either way that best practice in terms of search engines being able to crawl is to load the SVG and implement a proper alt tag: What is your opinion about this? Thanks in advance.1 -
What is the best way to correct GWT telling me I have mobile usability errors in Image directories
In GWT, I wish to remove / resolve the following errors Mobile Usability > Viewport not configured Mobile Usability > Small font size Mobile Usability > Touch elements too close The domain www.sandpiperbeacon.com is responsive, and passes the mobile usability test. A new issue I noticed, is that GWT is reporting 200+ errors just for image index pages such as http://www.sandpiperbeacon.com/images/special-events/ for example. Website users cannot access these pages (without editing the URL manually) so I don't consider these usability issues. BUT, I hate to see 200+ errors, especially when Google itself says "Websites with mobile usability issues will be demoted in mobile search results." I could set the image directories to dissalow in Robots.txt, but I do not want the images to stop appearing in image search, so this seems like a flawed solution. I cannot be the only person experiencing this, but I have been unable to find any suggestions online.
Technical SEO | | RobertoGusto0 -
Is it important to include image files in your sitemap?
I run an ecommerce business that has over 4000 product pages which, as you can imagine, branches off into thousands of image files. Is it necessary to include those in my sitemap for faster indexing? Thanks for you help! -Reed
Technical SEO | | IceIcebaby0 -
Best practices for migrating an html sitemap? Or just get rid of it all together?
We are migrating a very large site to a new CMS and I'm trying to determine the best way to handle all the links (~15k) in our html sitemap. The developers don't see the purpose of using an html sitemap anymore and I have yet to come up with a good reason why we should migrate rather than just get rid of the sitemap since it is not very useful to users. The html sitemap was created about 6 years ago when page rank sculpting was a high priority. Currently, since we already have an XML sitemap, I'm not sure that there's really a need for a html sitemap, other than to maintain all the internal links. How valuable are the internal links found in an html sitemap? And will it be a problem if we remove these from our link profile? 15,000 links sounds significant, but they only account for less than .5% of our internal links. What do all you think?
Technical SEO | | BostonWright0 -
What's the best way to solve this sites duplicate content issues?
Hi, The site is www.expressgolf.co.uk and is an e-commerce website with lots of categories and brands. I'm trying to achieve one single unique URL for each category / brand page to avoid duplicate content and to get the correct URL's indexed. Currently it looks like this... Main URL http://www.expressgolf.co.uk/shop/clothing/galvin-green Different Versions http://www.expressgolf.co.uk/shop/clothing/galvin-green/ http://www.expressgolf.co.uk/shop/clothing/galvin-green/1 http://www.expressgolf.co.uk/shop/clothing/galvin-green/2 http://www.expressgolf.co.uk/shop/clothing/galvin-green/3 http://www.expressgolf.co.uk/shop/clothing/galvin-green/4 http://www.expressgolf.co.uk/shop/clothing/galvin-green/all http://www.expressgolf.co.uk/shop/clothing/galvin-green/1/ http://www.expressgolf.co.uk/shop/clothing/galvin-green/2/ http://www.expressgolf.co.uk/shop/clothing/galvin-green/3/ http://www.expressgolf.co.uk/shop/clothing/galvin-green/4/ http://www.expressgolf.co.uk/shop/clothing/galvin-green/all/ Firstly, what is the best course of action to make all versions point to the main URL and keep them from being indexed - Canonical Tag, NOINDEX or block them in robots? Secondly, do I just need to 301 the (/) from all URL's to the non (/) URL's ? I'm sure this question has been answered but I was having trouble coming to a solution for this one site. Cheers, Paul
Technical SEO | | paulmalin0 -
Breadcrumbs how important are they
Hi, i am working on a joomla template site and i am just wondering how important the breadcrumbs are. I have one installed at the moment but what i have noticed is, what is showing on the main menu is showing on the breadcrumbs so i am not sure if i really need the breadcrumbs module. any help and advice would be great
Technical SEO | | ClaireH-1848860 -
Is there SEO value in having images referenced on other sites?
We use Amazon to host our assets (images, videos, PDFs, etc). These assets can be used across multiple sites we own and we reference them appropriately via our CMS. example asset URL: https://s3.amazonaws.com/lawgical/assets/data/539/original.png We have an infographic we recently distributed that is hosted on Amazon. Obviously we want any link value to go back to our primary URL where we laid out the infographic, however some of the infographic sites are just referencing the above source image URL. Are we losing SEO / link value by not have the infographic hosted on our domain? Do search engines count these image references as a "link"? For your reference... Infographic post: http://www.serve-now.com/articles/841/process-server-vs-sheriff-infographic Example infographic site usage: http://www.infographicsposters.com/law-infographics/which-is-better-process-server-or-sheriff
Technical SEO | | trentc0 -
Best practices for temporary articles
Hello, I would like to have expert inputs about the best way to manage temporary content? In my case, I've a page (ex : mydomain.com/agenda) where I have listing of temporary article, with a lifetime of 1 month to 6 months for some of them. My articles also have a specific url like for ex : mydomain.com/agenda/12-02-2011/thenameofmyarticle/ As you can guess, I got hundreds of 404 😞 I'm already using canonical tag, should I use a in the listing page? I'm a bit lost here..
Technical SEO | | Alexandre_0