A thumbnail URL is the web address of an image used to preview a page, video, or other resource. It points to the image file—not to the page or video being previewed. To use one on a web page, place its absolute image URL in the relevant metadata field, such as Open Graph’s og:image; video pages may also use a video poster, structured data, or a sitemap entry.
What a thumbnail URL points to
A thumbnail URL identifies the image resource a browser, social platform, search crawler, or application can fetch to display a preview. It is distinct from the URL of the page or video represented by that image. For example, a video watch-page address opens the video page; its thumbnail URL fetches a still image.
The exact field name and available image variants depend on the platform. Microsoft Graph’s Thumbnail resource, for example, defines its url property as the URL used to fetch thumbnail content. Open Graph uses og:image for a representative image for a page object. Microsoft Graph Thumbnail resource · Open Graph protocol
How to add a thumbnail URL to page metadata
For a page preview on services that read Open Graph tags, put an absolute, publicly fetchable image URL in an og:image tag inside the document’s <head>:
Free tools Windows power users keep installed
One-click scans. No signup required.
#1 Best Overall
<head>
<meta property="og:title" content="How to Bake Bread">
<meta property="og:type" content="article">
<meta property="og:url" content="https://example.com/bread">
<meta property="og:image" content="https://example.com/images/bread-preview.jpg">
<meta property="og:image:alt" content="A loaf of freshly baked bread">
</head>Open Graph identifies og:title, og:type, og:url, and og:image as its four basic required properties. The image description in og:image:alt is recommended. Optional image metadata can specify a secure URL, MIME type, width, and height. Use a URL that resolves directly to the image rather than to a page that displays it.
Choose an image URL that can be fetched
- Use an absolute URL, including the scheme and host, such as
https://example.com/images/preview.jpg. - Make sure the URL returns the image itself to the systems that need to display it. A login page, access restriction, or crawler block can prevent retrieval.
- Keep the image representative of the page, and supply accurate alternative text where supported.
- Do not assume that adding metadata guarantees a particular preview or search result; display decisions belong to the platform consuming the markup.
How to specify a thumbnail for a video page
There is no single video-thumbnail field that applies everywhere. Google documents several ways to declare a video thumbnail, each serving a different implementation. If you publish the thumbnail in more than one of these places, use the same URL for that video.
| Where you declare it | Field or attribute | What it does |
|---|---|---|
| HTML video element | <video poster="..."> |
Specifies the image shown as the video’s poster in the page’s video player. |
| Video sitemap | <video:thumbnail_loc> |
Declares the thumbnail location in a video sitemap entry. |
| Structured data | thumbnailUrl |
Provides a thumbnail URL in the video’s structured data. |
| Open Graph | og:video:image |
Provides a video image value in Open Graph metadata. |
These declarations have separate purposes; a poster displayed by a player is not automatically a substitute for every metadata field. Google advises keeping declarations consistent and using thumbnail, name, and description information that accurately matches the video. Structured data does not guarantee a particular Search display. See Google Search Central’s video guidance.
Rank #2
- HTML CSS Design and Build Web Sites
- Comes with secure packaging
- It can be a gift option
Keep video thumbnail URLs stable and accessible
For video indexing, Google says to use “a single unique and stable thumbnail URL for each video.” A rapidly expiring URL can interfere with successful indexing. The thumbnail should be available to Googlebot and Googlebot Images; do not block it with robots.txt or require a login. If the video’s thumbnail appears in multiple metadata sources, point those declarations to the same image URL.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
How to get a thumbnail URL from the YouTube Data API
YouTube’s Data API returns thumbnail information in a resource’s snippet.thumbnails object. A thumbnail entry can contain a url, and may contain width and height. The available keys can include default, medium, high, standard, and maxres, but not every resource has every variant. Dimensions may also be absent.
For a video resource, the API documentation gives these typical dimensions:
Rank #3
| Thumbnail key | Typical video dimensions |
|---|---|
default |
120 × 90 |
medium |
320 × 180 |
high |
480 × 360 |
standard |
640 × 480 |
maxres |
1280 × 720 |
These are typical sizes documented for YouTube video thumbnails, not guaranteed choices for every video. The API’s available variants depend on the resource and the resolution of its source image. Channel thumbnails have different dimensions; for example, a documented typical default channel thumbnail is 88 × 88. Do not treat these YouTube labels or dimensions as a universal standard. See YouTube Data API thumbnail documentation.
Read the URL from an API response
After retrieving a resource, select the variant that suits the space in your interface, then use that entry’s url. Check whether the property exists before relying on a size, and use the dimensions returned by the API rather than assuming they are present or fixed.
Quick wins for a faster PC:
Scan for outdated or missing drivers - takes under a minuteDriver Scan →Clear out junk files and repair common Windows errorsFree Scan →{
"snippet": {
"thumbnails": {
"default": {
"url": "https://example.com/video-default.jpg",
"width": 120,
"height": 90
},
"high": {
"url": "https://example.com/video-high.jpg",
"width": 480,
"height": 360
}
}
}
}The URLs above illustrate the response shape only; use the actual values returned for the resource you requested. A client can handle optional variants without assuming that maxres or any other key exists.
Rank #4
- Brand: Wiley
- Set of 2 Volumes
- A handy two-book set that uniquely combines related technologies Highly visual format and accessible language makes these books highly effective learning tools Perfect for beginning web designers and front-end developers
Thumbnail requirements depend on their purpose
For ordinary page previews and app interfaces, the relevant dimensions and format depend on the platform and layout. Google’s video-feature documentation specifies requirements for thumbnails used for Google video features: supported formats are BMP, GIF, JPEG, PNG, WebP, SVG, and AVIF; the minimum size is 60 × 30 pixels, with larger preferred; and at least 80% of pixels must have an alpha transparency value greater than 250. These are Google video-feature specifications, not universal rules for every thumbnail or service.
Choose among available variants according to intended use, image dimensions and aspect ratio, required metadata field, and whether the URL is stable and fetchable by the systems that need it. A square channel image, a landscape video preview, and a social card image may not be interchangeable.
Common thumbnail URL problems and fixes
- The preview is missing. Confirm that the metadata is in the page’s head, the URL points directly to an image, and the image can be fetched without a login. For Google video indexing, check that robots.txt does not block Googlebot or Googlebot Images.
- The wrong image appears. Check which metadata field the consuming platform uses and whether another declaration points to a different image. For a video with multiple declarations, make them consistent.
- A video thumbnail stops being indexed. Replace rapidly expiring links with a stable URL that continues to serve the same video’s thumbnail.
- A requested YouTube size is missing. The set of keys varies by resource and source-image resolution. Check the returned object and select an available variant instead of assuming every size exists.
- The dimensions are unknown. YouTube’s API may omit width and height. Handle missing values in your application and inspect or process the image when exact display sizing is needed.
- A page or player URL is being used as the thumbnail. Those URLs identify different resources. Use the image URL for the thumbnail field, and keep the watch page, player, or video file URL in the field intended for that resource.
Capture a thumbnail image from a web page
If you need a preview image of a rendered web page rather than a video thumbnail supplied by an API, a screenshot can provide the image file. A screenshot is the output; its public URL depends on where you store or serve that file. For a social preview, set og:image to the stable, publicly accessible URL where the screenshot is hosted.
For a manual capture, open the target page in a browser, set the desired viewport, and use the browser’s screenshot or capture tools; then host the resulting image at a stable URL and put that URL in the metadata field your platform expects. The image’s location is the thumbnail URL, not the original page address.
Or skip the browser setup
ScreenshotNeo can return a page screenshot with one GET request. Cookie banners are accepted and removed before capture, along with known newsletter popups and chat widgets; those cleanup steps can each be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits cost nothing, and response headers report the page verdict and whether it was billed. It also has an MCP server for AI agents, and includes 1,000 shots a month free with no card; paid plans start at $5 for 3,000 shots. See the ScreenshotNeo documentation.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com -o shot.webpScreenshotNeo is a website screenshot API and MCP server made by Yorker Media. To use a screenshot as a page thumbnail, store or serve the returned image at the stable public URL you want to place in your metadata. Learn about ScreenshotNeo, or sign up for 1,000 free screenshots a month with no card.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
