FUNNEL NARROW-WIDTH AND ZOOM WORKSHEET
Companion: Check your funnel at narrow widths and browser zoom

Purpose: record a reproducible layout check for one page version and visitor task.
This is not accessibility certification, complete conformance, product admission
or proof that a CFAI page has been built, tested or published. Fictional examples
below are assumptions. All actual executions are NOT RUN.

1. DEFINE THE TASK AND SAFE STOPPING POINT

Project / intended product:
Exact URL / page version / environment:
Visitor task:
Content and controls required for that task:
Relevant states (menu open/closed, correction message, other):
Safe stopping point:
Does any proposed action submit, send, buy or change a record?:
Permission/environment/effects confirmed by:
Unperformed actions and reason:
Reviewer / date/time/timezone:

2. CONFIGURATION PLAN — RECORD EACH SEPARATELY

V01 — Desktop baseline at 100% browser zoom
Starting content viewport width/height in CSS pixels: TO RECORD
Actual page/version/state: TO RECORD
Execution result: NOT RUN

V02 — 390 CSS-pixel narrow viewport at 100% browser zoom
Actual viewport width/height and production method: TO RECORD
This is additional narrow coverage; it does not substitute for V03.
Execution result: NOT RUN

V03 — 320 CSS-pixel narrow viewport at 100% browser zoom
Actual viewport width/height and production method: TO RECORD
Execution result: NOT RUN

V04 — Start with 1280 CSS-pixel content viewport, then 400% browser page zoom
Starting measured width/height: TO RECORD
Resulting measured width/height: TO RECORD
Zoom method: TO RECORD (do not substitute pinch zoom without recording it)
Execution result: NOT RUN

Use browser content dimensions, not the monitor's physical size or outer window.
The guide scopes the criterion to ordinary vertical-scrolling content. Confirm
measurements; if a configuration is unavailable, mark it BLOCKED with a reason.

3. ACTUAL CONFIGURATION RECORD — COPY FOR EACH RUN

Configuration ID:
Browser and version / operating system:
Physical device, responsive-mode simulation or resized window:
Page URL and exact version:
Starting page state / content needed:
Starting viewport in CSS pixels (width x height):
Browser zoom setting / method:
Resulting measured viewport in CSS pixels (width x height):
Measurement method / any uncertainty:
Date/time/timezone:
Steps actually taken:
What could be read/reached/used?:
What was lost, obscured or required sideways reading?:
Which region moved (page / table / other)?:
Evidence reference:
Result: NOT RUN / BLOCKED / OBSERVED AS EXPECTED / ISSUE OBSERVED
Reason / remaining coverage:

4. FOUR FICTIONAL CASES — GARDEN-CARE ENQUIRY PAGE VERSION A

R01 — Long reference expands ordinary copy at V03
Assumption: A long reference makes the enquiry panel too wide; nearby explanation
needs sideways movement to finish each line.
Record: Exact reference, affected copy and page state.
Expected correction outcome: Full information remains available; ordinary copy
is readable in the intended area and the nearby action remains usable.
Recheck: Same V03 state, then other configurations affected by the change.
Actual execution: NOT RUN

R02 — Banner covers action at V04
Assumption: Fixed invitation banner continues covering the enquiry action after
scrolling to it at the specified browser zoom.
Record: Banner, action, actual resulting width/height, zoom and recovery steps.
Expected correction outcome: Full action label/control can be reached and used.
Recheck: Same V04 steps on the new page version; include necessary context.
Actual execution: NOT RUN

R03 — Two-dimensional comparison table
Assumption: Table relationships need sideways inspection; adjacent paragraphs fit.
Record: Which region scrolls, accessible cells, row/option context and surrounding
content. A scrollbar alone does not classify the page.
Expected review outcome: Required information remains reachable and meaningful.
Keyboard operation remains a separate check; do not infer it from a scrollbar.
Recheck: Every option and exclusion after any table/layout change.
Actual execution: NOT RUN

R04 — Missing service-details route
Assumption: Desktop service-details link disappears in narrow layout with no
equivalent route, while enquiry action remains visible.
Record: The route, its task relevance and any alternative navigation inspected.
Expected correction outcome: A usable route to the necessary details remains.
Recheck: Open relevant navigation when safe, then follow its actual destination.
Actual execution: NOT RUN

5. EXCEPTION AND CONTENT RECORD

Section requiring two dimensions, if any:
Why that layout is necessary for meaning/use:
Exact source/implementation owner supporting that decision:
Individual cells or ordinary surrounding text still needing review:
Evidence all necessary content is reachable:
Missing information/function, if observed:
Unresolved exception question / owner:

Do not mark every scrollbar a failure, or every wide table automatically fine.
Do not hide an option/exclusion or disable zoom merely to remove overflow.

6. ISSUE AND TARGETED RECHECK

Issue ID / configuration / affected task:
Original page version / exact starting state:
Reproduction steps:
Observed symptom (do not invent the technical cause):
Expected readable/reachable/usable outcome:
Evidence and recovery steps:
Assigned implementation owner:
Proposed correction, clearly separate from observation:
Changed version:
Original steps repeated at original configuration?:
Additional affected configurations/states:
Actual recheck result: NOT RUN
Evidence / reviewer / date/time:
Decision: OPEN / RESOLVED FOR THIS CASE / BLOCKED
Remaining untested coverage:

7. BEFORE HANDOFF

[ ] Exact page, version and task identified.
[ ] Configuration measurements and zoom method recorded rather than guessed.
[ ] All necessary information and routes included in the content inventory.
[ ] Ordinary content and any two-dimensional exception considered separately.
[ ] Assumed examples kept distinct from actual observations.
[ ] State/interaction not seen or attempted remains NOT RUN or BLOCKED.
[ ] Original narrow/zoom case is repeated after an authorized change.
[ ] No saved-record, email-delivery, booking or conformance conclusion inferred.
[ ] Product access, public gates and intentional CF2 routes remain unchanged.

Primary references:
https://www.w3.org/WAI/WCAG22/Understanding/reflow.html
https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/CSSOM_view/Viewport_concepts