Do these 3 things before closing this tab:
1Fix the driver behind crashes, sound loss and screen glitches2Repair Windows errors before they cause bigger problems3Scan for outdated or missing drivers - takes under a minuteSome links on this page are affiliate links: if you buy through them we may earn a commission, at no extra cost to you.
There is no single best size for every website article thumbnail. Set dimensions and crop for the image’s actual placement—such as an article card, an in-article featured image, or a social preview—and serve responsive variants where possible. WordPress’s 150 × 150-pixel thumbnail is a platform default, not a universal recommendation.
Choose dimensions for the display slot
Start by measuring where the image will appear, rather than selecting a number from a generic size chart. An archive card, a large featured image above an article, and a social preview may use different widths, heights, and crops. A source image should be large enough for its largest intended display, but smaller placements do not need to download the original full-size file.
For each placement, note its rendered width and height, aspect ratio, crop, largest expected display, and whether the site serves a smaller responsive file. If the same image appears in several layouts, confirm that the important subject remains visible in each crop.
Keep proportions unless you intentionally crop
When scaling an image, preserve its width-to-height ratio. Stretching an image to fill a differently shaped slot distorts it; instead, use a deliberate crop if the layout requires fixed dimensions. Check the result in the actual template, because a crop that works for a card may cut off the subject in a hero image.
#1 Best Overall
WordPress image sizes: what the defaults mean
WordPress documents standard image sizes, but the files a site generates and displays depend on media settings, theme support, custom sizes, and the size requested by the template. The following values are documented defaults or maximums, not recommended dimensions for every site.
| WordPress size | Documented dimensions | How to interpret it |
|---|---|---|
| Thumbnail | 150 × 150 pixels maximum | Square default; media settings can crop to exact dimensions. |
| Medium | 300 × 300 pixels maximum | Maximum width and height, not necessarily a square output. |
| Medium Large | 768 pixels wide; no height limit | A width-based size for larger image use. |
| Large | 1024 × 1024 pixels maximum | Maximum width and height, not a universal hero-image target. |
| Full | Original uploaded image | Uses the original rather than a generated size. |
These WordPress size names do not establish what a particular theme uses for a featured image. The theme can register custom sizes and templates can request a particular size. WordPress’s Theme Handbook guidance on featured images and image sizes describes standard sizes, registering custom sizes, and featured-image output.
Configure the crop and generated sizes
In the WordPress admin, open Settings > Media to review the thumbnail width and height, the option to crop thumbnails to exact dimensions, and the maximum dimensions for medium and large images. A theme may register additional image sizes, so changing these settings alone may not change every rendered featured image. Check the theme’s template or documentation to see which size it requests.
WordPress documents add_image_size() for registering custom sizes and featured-image functions for output. When a theme changes its size requirements, existing uploads may not have files for newly requested variants; confirm the generated files are available before expecting the template to serve them.
Rank #3
Serve responsive image variants
Do not make every visitor download a large source image when a smaller file will look sharp at their viewport and display density. WordPress can generate image markup with srcset and sizes, allowing a browser to select an available candidate. WordPress Developer Resources notes that native responsive images have been supported since WordPress 4.4 through these attributes in generated markup: responsive images documentation.
The srcset attribute lists available image candidates. The sizes attribute describes the rendered width the layout expects under different conditions; it is a hint for choosing an appropriate candidate, not a replacement for the actual layout. If the theme’s sizes value does not reflect the real slot—for example, a card occupies only part of a wide page—the browser may choose a larger file than needed. WordPress documents filters for customizing responsive image output; tune the hint to match the template.
A documented WordPress example shows a 1500 × 706-pixel upload producing smaller generated sizes. That example illustrates responsive selection, not an upload-size prescription for all websites. Inspect the final page markup and network requests to verify which candidates are available and which file the browser selects.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
Keep layout stable and balance quality against file weight
Include intrinsic width and height information in image markup where appropriate. Those dimensions let the browser reserve the image’s proportions before it loads, helping prevent surrounding content from shifting. WordPress’s thumbnail function reference describes explicit image dimensions as a way to reserve space and improve cumulative layout shift (CLS).
Physical dimensions and file size are related but separate choices. A visually suitable crop can still be unnecessarily heavy if it is encoded at excessive quality or delivered at a much larger size than its slot. Compare the visual result and file weight for the intended placement; the right balance depends on the image and layout. WordPress’s image size and quality guidance discusses those considerations.
- Use a source with enough pixels for the largest intended display.
- Generate or deliver smaller variants for narrower slots and viewports.
- Preserve proportions when scaling; crop only when the layout calls for it.
- Inspect the crop, visual quality, and loaded file on the actual page.
- Include width and height so the browser can reserve the image’s space.
Handle featured images and social previews separately
A featured image inside an article is a page layout decision. An image used in structured data or as og:image is metadata for search or social sharing. The same source image can serve both roles, but its suitability and destination constraints should be checked separately. A WordPress thumbnail default does not specify a social platform’s required dimensions.
For Google search metadata, choose an image relevant to the page. Google advises against generic images such as a site logo or an image containing text in its Article structured-data guidance. This is image-selection guidance, not a universal pixel specification for every sharing destination. Check the current requirements for the specific destination and preview how it crops the image.
Inspect and implement the right size
- Identify each placement. Inspect the article page and archive or category cards. Record rendered width, height, and crop separately wherever layouts differ.
- Choose a source image. Make it large enough for the largest intended display, without treating the original as the file every visitor must download.
- Set the crop deliberately. If the slot has a fixed aspect ratio, crop for that slot and check that the important subject remains in frame.
- Configure the CMS or theme. In WordPress, review Settings > Media and confirm that the theme registers and requests the sizes the templates actually need.
- Verify responsive markup. Check the generated
srcsetandsizesagainst the layout, and confirm that suitable candidates exist. - Check delivery and metadata. Inspect the file loaded, image quality, layout stability, and each important social or search preview separately.
Common sizing problems and fixes
- The thumbnail looks blurry on a large card. The requested source may be too small for the rendered slot or a higher-density display. Provide a larger suitable candidate and verify the generated responsive sizes.
- The image looks stretched. The displayed dimensions do not preserve the source ratio. Correct the markup or styling to maintain proportions, or use a purposeful crop.
- The subject is cut off. The selected crop does not suit that placement. Adjust the crop or register a placement-specific size rather than relying on one crop everywhere.
- The page downloads an unnecessarily large image. The template may request the full-size file, or its
sizeshint may overstate the rendered width. Request an appropriate generated size and ensure the responsive hint reflects the layout. - A changed theme does not show the expected variant. The template may request a different size, or an existing upload may lack the newly needed generated file. Check the requested size and confirm the variant exists.
- The page shifts as the image loads. Add intrinsic dimensions or an equivalent reserved aspect ratio so the browser knows the image’s space in advance.
- A social preview crops or rejects the image. The metadata destination has its own constraints and rendering. Check that destination’s current guidance and preview the metadata image separately from the on-page thumbnail.
Or skip the browser setup
If you need a screenshot of a page to inspect its thumbnail layout or preview a rendered result, ScreenshotNeo provides a website screenshot API and MCP server. A single request can return PNG, JPEG, WebP, or PDF; for example, capture a page as WebP:
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com/article -o shot.webpSee the ScreenshotNeo API documentation for setup and options. Cookie banners are accepted before capture and more than 60 known consent platforms, newsletter popups, and chat widgets can be removed; each step can be turned off. Bot checks, blank pages, and failed loads are never billed, and responses identify the page verdict and billing status. An MCP server lets AI agents use screenshot tools. The free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000.
Sign up for ScreenshotNeo free to get 1,000 screenshots a month without a 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.
