Images That Can't Be Read by Java
Google Images best practices
Google Images is a style to visually discover data on the spider web. Users can apace explore information with more context around images with new features, such as image captions, prominent badges, and AMP results.
By adding more context around images, results tin get much more useful, which can lead to higher quality traffic to your site. You can aid in the discovery process past making sure that your images and your site are optimized for Google Images. Follow our guidelines to increase the likelihood that your content will appear in Google Images search results.
Create a neat user experience
To boost your content's visibility in Google Images, focus on the user past providing a keen user experience: make pages primarily for users, non for search engines. Here are some tips:
- Provide good context: Brand certain that your visual content is relevant to the topic of the page. Nosotros suggest that you display images just where they add original value to the page. We specially discourage pages where neither the images or the text are original content.
- Optimize placement: Whenever possible, place images near relevant text. When it makes sense, consider placing the most important image near the top of the page.
- Don't embed important text inside images: Avert embedding text in images, especially important text elements similar folio headings and menu items, because not all users can access them (and folio translation tools won't work on images). To ensure maximum accessibility of your content, keep text in HTML, provide alt text for images.
- Create informative and high quality sites: Adept content on your webpage is just as important as visual content for Google Images - information technology provides context and makes the result more actionable. Page content may be used to generate a text snippet for the image, and Google considers the page content quality when ranking images.
- Create device-friendly sites: Users search on Google Images more from mobile than on desktop. For this reason, information technology is important that you design your site for all device types and sizes. Use the Mobile-Friendly Examination to test how well your pages work on mobile devices, and get feedback on what needs to be fixed.
- Create good URL construction for your images: Google uses the URL path as well every bit the file name to assistance information technology understand your images. Consider organizing your image content and then that URLs are constructed logically.
Check your folio title and description
Google Images automatically generates a title and snippet to best explain each upshot and how it relates to the user query. This helps users decide whether or not to click on a result.
We utilize a number of different sources for this information, including descriptive information in the title, and meta tags for each page.
You can help us improve the quality of the championship and snippet displayed for your pages past post-obit Google's championship and snippet guidelines.
Add together structured data
If you include structured data, Google Images tin can display your images equally rich results, including a prominent badge, which give users relevant information about your page and tin drive meliorate targeted traffic to your site. Google Images supports structured data for the following types:
- Production
- Video
- Recipe
Follow the general structured information guidelines as well equally whatever guidelines specific to your structured information type; otherwise your structured data might be ineligible for rich result display in Google Images. In each of these structured information types, the image aspect is a required field to be eligible for badge and rich effect in Google Images.
Optimize for speed
Images are often the largest contributor to overall page size, which can make pages slow and expensive to load. Brand sure to apply the latest image optimization and responsive image techniques to provide a loftier quality and fast user experience.
On Google Images, the AMP logo 
Analyze your site speed with PageSpeed Insights and visit our Spider web Fundamentals page to learn nearly best practices and techniques to improve website operation.
Add expert quality photos
High-quality photos appeal to users more than blurry, unclear images. As well, abrupt images are more appealing to users in the event thumbnail and increase the likelihood of getting traffic from users.
Include descriptive titles, captions, filenames, and text for images
Google extracts data near the subject matter of the image from the content of the page, including captions and image titles. Wherever possible, make sure images are placed near relevant text and on pages that are relevant to the image subject affair.
Likewise, the filename can give Google clues about the discipline matter of the image. For instance, my-new-black-kitten.jpg is amend than IMG00023.JPG. If you localize your images, make sure y'all translate the filenames, too.
Use descriptive alt text
Alt text (text that describes an paradigm) improves accessibility for people who can't see images on web pages, including users who apply screen readers or accept low-bandwidth connections.
Google uses alt text along with computer vision algorithms and the contents of the page to empathize the subject thing of the image. Also, alt text in images is useful equally anchor text if you decide to use an image as a link.
When choosing alt text, focus on creating useful, data-rich content that uses keywords accordingly and is in context of the content of the page. Avert filling alt attributes with keywords (keyword stuffing) every bit information technology results in a negative user feel and may cause your site to exist seen as spam. Also consider the accessibility of your alt text, and add the alt attribute as necessary, per W3 guidelines.
- Bad (missing alt text):
<img src="puppy.jpg"/> - Bad (keyword stuffing):
<img src="puppy.jpg" alt="puppy dog baby domestic dog pup pups puppies doggies pups litter puppies dog retriever labrador wolfhound setter pointer puppy jack russell terrier puppies dog food cheap dogfood puppy nutrient"/> - Improve:
<img src="puppy.jpg" alt="puppy"/> - All-time:
<img src="puppy.jpg" alt="Dalmatian puppy playing fetch"/>
Nosotros recommend testing your content by auditing for accessibility and using a tedious network connection emulator.
Assistance united states of america discover all your images
Use semantic markup for images
Google parses the HTML of your pages to index images, just does non index CSS images.
- Good:
<img src="puppy.jpg" alt="A golden retriever puppy" /> - Bad:
<div fashion="background-prototype:url(puppy.jpg)">A aureate retriever puppy</div>
Employ an image sitemap
Images are an important source of data about the content on your site. You lot tin can give Google boosted details about your images, and provide the URL of images we might non have otherwise detect by calculation information to an paradigm sitemap.
Prototype sitemaps can contain URLs from other domains, unlike regular sitemaps, which enforce cross-domain restrictions. This allows you to use CDNs (content delivery networks) to host images. Nosotros encourage you to verify the CDN's domain name in Search Console then that nosotros tin inform y'all of whatsoever crawl errors that we may find.
Supported image formats
Google Images supports images in the following formats: BMP, GIF, JPEG, PNG, WebP, and SVG.
You lot tin also inline images as Data URIs. Data URIs provide a manner to include a file, such as an image, inline by setting the src of an img element as a Base64 encoded string using the post-obit format:
<img src="data:image/svg+xml;base64,[data]">
While inlining images tin can reduce HTTP requests, carefully gauge when to utilize them since information technology tin considerably increase the size of the page. For more than on this, refer to the section on pros and cons of inlining images on our Spider web Fundamentals folio.
Responsive images
Designing responsive web pages leads to better user experience, since users utilize them across a plethora of device types. Refer to our Web Fundamentals on Images to acquire about the best practices for handling images on your website.
Webpages utilise <img srcset> attribute or <picture> element to specify responsive images. However, some browsers and crawlers do not understand these attributes. Nosotros recommend that you lot e'er specify a fallback URL via the img src attribute.
The srcset attribute allows specifying different versions of the same image, specifically for different screen sizes.
Example: <img srcset>
<img srcset="example-320w.jpg 320w, example-480w.jpg 480w, example-800w.jpg 800w" sizes="(max-width: 320px) 280px, (max-width: 480px) 440px, 800px" src="example-800w.jpg" alt="responsive spider web">
The <pic> element is a container that is used to group different <source> versions of the same paradigm. It offers a fallback approach so the browser can choose the right image depending on device capabilities, similar pixel density and screen size. The picture element too comes in handy for using new prototype formats with congenital-in graceful degradation for clients that may not yet back up the new formats.
We recommend that you ever provide an img chemical element every bit a fallback with a src attribute when using the picture tag using the following format:
Example: <pic>
<motion-picture show> <source type="paradigm/svg+xml" srcset="pyramid.svg"> <source type="image/webp" srcset="pyramid.webp"> <img src="pyramid.png" alt="big PNG paradigm..."> </moving picture>
Optimize for SafeSearch
SafeSearch is a setting in Google user accounts that specifies whether to bear witness or block explicit images, videos, and websites in Google Search results. Make sure Google understands the nature of your site and so that Google can apply SafeSearch filters to your site if appropriate. Learn more virtually labeling SafeSearch pages.
And finally...
Delight read our SEO Starter Guide which contains lots of useful information to rank amend. If y'all have more than questions, post them in the Google Search Fundamental Assist Community.
Images That Can't Be Read by Java
Source: https://developers.google.com/search/docs/advanced/guidelines/google-images