How to Capture Mobile Website Screenshots with Apify
Configure Apify’s Website Screenshot Generator for phone-sized captures, choose viewport and output settings, and troubleshoot common issues.
To capture a mobile-style website screenshot with Apify, run its Website Screenshot Generator with mobile viewport enabled, set a phone-sized viewport such as 390 × 844, choose a device scale factor, and select PNG, JPEG, or PDF. For a first above-the-fold capture, use viewport mode, PNG, 390 × 844, and scale factor 2. These are demonstrated settings, not a universal phone standard or a guarantee of identical rendering on every device.
This workflow renders a page at configured browser dimensions; the cited example does not require an actual phone. Use full-page mode if you need the scrollable page rather than just the visible screen.
1. Configure the Apify Actor
- Open Apify’s Website Screenshot Generator Actor and enter the public page URL you want to capture. The documented workflow does not establish that the Actor can bypass logins or access controls.
- Choose viewport for the initial visible screen, or full page for the full scrollable document.
- Enable the mobile viewport option and set the viewport width and height. The example uses 390 × 844 pixels.
- Set the device scale factor. A value of 2 is a practical starting example; another Apify example uses 3. Higher density produces a larger pixel output, but the cited sources do not establish one ideal value for every use.
- Select an output format supported by the Actor: PNG, JPEG, or PDF. PNG is used in the mobile landing-page example.
- Choose the page-load wait behavior and, if needed, an additional delay. The example uses a page-load wait plus 1,000 milliseconds; that delay is not necessary for every page.
- Start the run. Inspect the screenshot output and the run dataset for fields such as URL, final URL, status, title, screenshot key or URL, dimensions, format, capture time, and any error.
Apify’s Actor listing also describes optional element selection, integrations, and output storage. Use an element selector when the deliverable is a specific component rather than the entire viewport.
2. Choose dimensions, capture scope, and format
| Setting | Choose it for | Consideration |
|---|---|---|
| Viewport | A phone-like initial screen or above-the-fold review | Content below the visible viewport is omitted. |
| Full page | A page review or archive that includes scrollable content | Very long pages may take longer to render and create larger files. |
| 390 × 844 viewport | A documented starting configuration for a mobile-style capture | It is an example, not a claim that all phones use these dimensions. |
| Scale factor 2 or 3 | Higher-density output, as shown in Apify examples | More output pixels can increase file size and processing needs. |
| PNG | Lossless screenshots and visual review | May produce larger files than a lossy image format. |
| JPEG | When a smaller lossy image is acceptable | Fine edges and text can show compression artifacts. |
| A document-style deliverable when supported by the Actor | Check the rendered pages and pagination for the intended use. |
Do not confuse viewport dimensions with the final image dimensions: the device scale factor affects output density. A viewport of 390 × 844 at 2x may yield an image with more pixels than the CSS viewport. Verify the dimensions in the run metadata.
3. Handle responsive pages and delayed content
Responsive layouts can change at breakpoints, so use dimensions that exercise the layout you need to inspect. If the page is still showing a loader or skeleton, adjust its wait setting or add a modest delay. A delay can help with client-rendered content, but it also adds run time and cannot fix a page that fails to load.
Lazy-loaded images may not appear in an initial viewport capture if they have not entered the rendered area. For a whole-page review, use full-page capture and inspect the result. The provided source examples do not guarantee that every lazy-loading pattern will be triggered.
Run separate captures for mobile and desktop when comparing responsive behavior. Apify’s documentation example demonstrates 390 × 844 mobile settings alongside desktop capture settings; dimensions should be recorded with each image so reviewers know what they are seeing.
4. Read the run output
Use the image output for visual inspection and the dataset metadata to identify what was captured. Check the final URL as well as the submitted URL because redirects can change the page. Check status and error fields before treating a missing or unexpected image as a design result. Keep dimensions, format, and capture time with the artifact when you use screenshots in a review workflow.
5. Troubleshooting
| Symptom | Likely cause | What to do |
|---|---|---|
| Screenshot is blank or mostly empty | The page did not finish loading, the URL redirected, or the page returned an error. | Inspect status, final URL, and error metadata. Confirm the URL is publicly reachable, then adjust the wait behavior and rerun. |
| Mobile layout looks like desktop | Mobile viewport mode was not enabled, or the configured dimensions do not cross the page’s responsive breakpoint. | Confirm the mobile option and width/height inputs, then try dimensions that match the layout you need to review. |
| Text or images look soft | The output density may be too low for the intended display size. | Try a higher device scale factor such as the documented 3x example, then compare output dimensions and file size. |
| Image is unexpectedly large | Full-page capture, high scale factor, or PNG output can increase pixel count or file size. | Use viewport capture if the full document is unnecessary; choose a suitable scale factor or JPEG when lossy output is acceptable. |
| Page is captured before content appears | Client-side rendering, fonts, or delayed requests have not completed. | Use the Actor’s page wait option and add a short extra delay where needed. Check whether the target page itself is returning the content. |
| Some below-the-fold images are missing | Lazy loading may depend on scrolling or element visibility. | Use full-page capture and inspect the output. The cited configuration examples do not promise support for every lazy-loading implementation. |
| Output cannot be found in the expected location | The screenshot may be stored as an Actor output while the dataset contains metadata and references. | Inspect both the run’s stored output and dataset fields, including screenshot key or URL. |
| A protected page cannot be captured | The documented example covers public page capture and does not establish login or access-control bypass. | Use a page you are authorized to access and consult the Actor’s current input options for supported authentication workflows. |
6. Performance, reliability, and cost considerations
Capture time depends on the page’s loading behavior, selected wait settings, full-page scope, and output density. A fixed extra delay makes every run slower, so use it only when the page needs it. Higher scale factors and full-page captures create more image data to store or transfer.
For repeatable reviews, record the URL, viewport dimensions, scale factor, format, and capture time alongside each result. Check run status and error metadata before relying on a capture. The research materials describe Actor configuration and output fields, but do not provide performance benchmarks, a fidelity guarantee, or pricing figures; check Apify’s current Actor and platform pages for those details.
Or skip the browser setup
ScreenshotNeo is a website screenshot API and MCP server from Yorker Media. A single request can return an image or PDF; set the viewport dimensions for a mobile-style capture. Its cookie/consent banner handling accepts the banner like a visitor and removes 60+ known consent platforms, newsletter popups, and chat widgets before capture. Each step can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits cost nothing, and responses identify the page verdict and billing status in headers. Its MCP server gives Claude, Cursor, and other MCP clients the tools take_screenshot, get_page_info, and capture_pdf.
cURL:
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webpPython:
import requests
r = requests.get(
"https://api.screenshotneo.com/v1/shot",
params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"},
timeout=90,
)
open("shot.webp", "wb").write(r.content)Node.js:
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
const bytes = new Uint8Array(await res.arrayBuffer());
await import('node:fs/promises').then(fs => fs.writeFile('shot.webp', bytes));For mobile output, add the viewport parameters documented for the API and replace the example target URL with your own. See the ScreenshotNeo API documentation for parameter names and configuration. The API also supports full-page capture, device presets, custom viewport sizes, retina scale, output formats, waits, element capture, and other capture controls.
ScreenshotNeo includes 1,000 screenshots a month free with no card; paid plans start at $5 for 3,000 screenshots. Every feature is on every plan. Sign up for 1,000 free screenshots a month, no card required.
FAQ
Does a mobile screenshot require a physical phone?
The documented Apify workflow configures browser viewport dimensions; it does not identify a physical phone as a requirement.
Is 390 × 844 the right size for every phone?
No. It is the configuration shown in an Apify example. Choose dimensions for the responsive state you want to inspect.
Should I use 2x or 3x?
Both appear in Apify examples. Choose based on the output density you need, then check the resulting dimensions and file size.
Can the Actor guarantee the screenshot matches every real mobile browser?
The cited material documents settings, not guaranteed fidelity across phones, browsers, or responsive breakpoints.
Can I capture just one component?
The Actor listing describes an optional selector for capturing a specific page element. Use it when you need a component rather than the entire viewport.
