How to Create a PDF Portfolio of Website Page Screenshots for a Client
Capture website pages consistently, assemble them into a clear client-ready PDF, and check every page before delivery.
To create a client-ready PDF portfolio of website screenshots, agree on the pages and purpose, capture each page at a consistent viewport and state, record its URL and capture date, arrange the selected images in a document or PDF editor, then export and inspect the finished PDF. Use full-page screenshots when visual appearance matters; choose a direct web-page-to-PDF conversion when the client needs a text-focused, printable document.
1. Define the portfolio’s purpose and scope
Before capturing anything, agree with the client on which pages belong in the portfolio and what the document should help them review. Common purposes include design feedback, content review, competitor references, QA records, or before-and-after evidence.
Confirm that you have permission to capture and share each page, especially if it is private, unpublished, or client-owned. Decide whether the deliverable should show the page as it appeared in a browser or present its content in a more document-like format. Those goals point to different workflows:
- Visual record: capture screenshots and place them in a PDF. This retains the rendered appearance, including layout and imagery.
- Readable document: convert the web page directly to PDF. The result may reflow or paginate like a document rather than preserve the exact browser view.
Adobe documents converting web pages to PDFs in Acrobat; you can also use another suitable PDF editor. For a portfolio assembled from individual screenshots, use a document editor or PDF tool that lets you place images, add labels, and export a combined file. See Adobe’s web-page-to-PDF guidance.
2. Standardize each capture
Consistency makes pages easier to compare and the portfolio easier to reproduce. For pages that will be compared, use the same browser, viewport width, zoom level, and device mode. Capture desktop and mobile separately if responsive layout is part of the review.
Keep a capture log with at least the following information:
- Page title and actual URL
- Capture date
- Viewport dimensions or device preset
- Relevant page state, such as an open accordion, selected pricing tab, or dismissed dialog
- Any special capture choice, such as a section-only image instead of the whole page
This is practical workflow guidance rather than a requirement imposed by browser tools. It gives the client context for what each image represents and helps you repeat the capture later.
3. Capture full-page screenshots in Chrome
A regular viewport screenshot only records what is currently visible. To document content below the fold, use Chrome DevTools’ full-page screenshot workflow. Chrome’s DevTools documentation describes full-page capture and node screenshots that can include content below the viewport; interface details may change between Chrome versions. See Chrome DevTools screenshot guidance and the Chrome 89 DevTools release notes.
- Open the page in Chrome and wait for its content and images to load.
- Open DevTools, then open the Command Menu.
- Search for the full-size screenshot command and select it to capture the page.
- For one large page element, inspect and select its node, then use the DevTools node screenshot command where available.
- Open the resulting image and confirm that the intended top, bottom, and sections are present.
DevTools commands and menus can move. If the command name or workflow differs in your installed Chrome version, consult the current Chrome DevTools documentation. Lazy-loaded images may only appear after scrolling through the page; scroll through once, wait for them to load, then capture.
When a single tall image is a poor fit
A full-page screenshot preserves continuity, but a long page squeezed onto one standard PDF page may make text too small to read. For long pages, use a multi-page image layout, capture selected sections, or use direct page-to-PDF conversion if text readability matters more than matching the rendered screen. Always inspect where the PDF editor places page breaks.
Very long captures may also hit browser canvas limits. FullPage Capture states that its product can split captures when Chrome canvas limits are exceeded and cites a limit of 28,800 pixels per side or roughly 259 million pixels of area. Treat that as the vendor’s stated product limitation, not a universal threshold for every browser or capture tool. See its capture help and FAQ.
4. Assemble and export the PDF
Use a short, predictable structure so a client can navigate the file without needing an explanation from you:
- Cover: client or project name, review purpose, preparer, and preparation date.
- Contents or page index: page titles and URLs, grouped into sections if useful.
- Capture pages: one screenshot per page or section, in an order that supports the review.
- Annotations: concise notes about what to review. Label observations and recommendations clearly.
- Closing summary: key findings or next actions when they are part of the engagement.
Place each image into a document or PDF editor, choose a consistent fit and margin, add its page label and capture context, then export one PDF. Pick page shapes that suit the images and how the client will use them. Standard paper sizes such as Letter or A4 can be convenient for printing; landscape pages or larger formats may suit wide layouts. A single long PDF page can preserve continuity, but may be awkward to read, print, or share.
FullPage Capture describes its own screenshot-based PDF export, including long-page and standard-paper output and smart page breaks. Those are vendor feature descriptions, not independent comparative test results. Confirm the available formats and pagination behavior in whichever editor or exporter you choose. See FullPage Capture’s PDF export page.
5. Review the finished portfolio before delivery
Open the exported PDF on a typical laptop screen and inspect every page at a useful reading size. Check that:
- The screenshot includes the intended page top and bottom, or clearly identified section boundaries.
- Text is readable at normal viewing size, especially when an image has been fitted to a standard sheet.
- Sticky headers, chat bubbles, cookie banners, or other overlays do not obscure the subject or appear in confusing positions.
- Page breaks do not cut through important content, tables, or images.
- The page order, contents list, labels, URLs, and capture dates match.
- The file does not reveal unrelated browser tabs, account details, or personal information.
- The PDF opens and has the expected page count.
If confidentiality matters, deliver the file through a client-approved sharing channel. Revisit the capture or layout if important content is missing, text is too small, or a very long capture has been split or clipped.
Choosing between screenshots and direct PDF conversion
| Need | Suitable approach | Check before delivery |
|---|---|---|
| Keep the page’s rendered visual appearance | Capture screenshots and assemble them into a PDF | Viewport, page state, image scale, and legibility |
| Read or print long-form page content | Convert the web page to PDF | Reflow, missing assets, and pagination |
| Compare responsive layouts | Capture separate desktop and mobile views | Label each device or viewport clearly |
| Show only a relevant part of a long page | Capture selected sections or a specific element | Make section boundaries and context clear |
Adobe documents web-page conversion, while screenshot-based exporters describe ways to retain rendered page appearance. The choice depends on the deliverable; neither format is automatically right for every client. No independent tool benchmark or hands-on comparison is available in the research for this guide.
Or skip the browser setup
ScreenshotNeo is a website screenshot API and MCP server for developers. Its API can return a screenshot or PDF from one GET request. The following cURL example saves a WebP screenshot:
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp
See the ScreenshotNeo API documentation for options such as full-page capture, viewport and device settings, PDF paper size and margins, and selecting page ranges. Cookie banners, newsletter popups, and chat widgets are removed before the shot; each cleanup step can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits are not billed, and response headers report the page verdict and billing status. Its MCP server gives AI agents tools for screenshots, page information, and PDF capture.
ScreenshotNeo includes 1,000 screenshots per month free with no card. Paid plans start at $5 for 3,000 shots; every feature is available on every plan. Sign up for the free plan and get 1,000 screenshots a month with no card.
Troubleshooting
| Symptom | Likely cause | What to do |
|---|---|---|
| The screenshot stops at the visible viewport | A viewport capture was used instead of full-page capture | Use DevTools’ full-page screenshot workflow and confirm the output reaches the page bottom. |
| Images or sections are missing | Lazy-loaded content had not loaded, or the page was still rendering | Scroll through the page, wait for content to appear, then capture again. Check the source page in the same state. |
| A very long capture is cut off or split | The capture may exceed a browser or tool’s canvas limits | Capture sections separately, reduce unnecessary page height, or use a tool whose documented workflow handles long captures. Review the source tool’s limits. |
| Text is unreadable in the PDF | A tall screenshot was scaled down to fit a standard sheet | Use multiple pages, larger or landscape pages, or section captures. Consider direct PDF conversion for text-heavy content. |
| A banner or chat widget covers important content | An overlay was present when the page was captured | Record the page state and dismiss or otherwise handle the overlay when appropriate and permitted. For automated API captures, ScreenshotNeo can remove known consent platforms, newsletter popups, and chat widgets. |
| The PDF order or page labels are wrong | Images were assembled without a final ordering check | Compare the exported page sequence with the contents list and capture log, then export again. |
| The page looks different from the client’s reference | Viewport, zoom, device mode, selected tab, or capture date differs | Match and record those conditions. Dynamic content can also change between visits, so include the capture date. |
Performance, reliability, and cost
For a small, one-off portfolio, manual browser capture and PDF assembly avoid adding an API to the workflow. The main time costs are opening pages, waiting for content, reviewing captures, and arranging the document. For repeated portfolios or many URLs, automation can reduce repetitive capture work, but you still need a review step because pages can change, load slowly, or show unexpected states.
Full-page capture transfers and stores more image data than a viewport capture. Long images can be unwieldy to open, lay out, print, or send. Use section captures or a document-style PDF when a single tall image would compromise readability. Keep source images and the capture log until the client has approved the deliverable if later corrections may be needed.
ScreenshotNeo pricing is $0 for 1,000 shots per month, $5 for 3,000, $15 for 15,000, $39 for 60,000, $99 for 250,000, and $249 for 1,000,000; yearly billing gives two months free. Each response identifies the page verdict and whether it was billed. Choose a plan based on expected successful captures and verify the current options in the documentation.
FAQ
Should every screenshot get its own PDF page?
Not necessarily. Give each capture enough space to remain readable. A long page may need multiple pages or section captures, while a short view may fit alongside a concise note.
Should I include the URL and date in the PDF?
Yes, when the portfolio is intended as a review record. Include the URL and capture date, and add viewport or device context when layout differences matter.
Can I make the portfolio from mobile screenshots only?
Yes, if the client needs to review the mobile experience. Label the device or viewport and capture desktop separately when the responsive comparison is in scope.
Is a screenshot PDF searchable?
A PDF made from raster screenshots usually presents the page as images, so its text may not be searchable. If searchable text is a requirement, use a document-oriented conversion or an appropriate text-recognition workflow and review the result.


