Responsive Checker For Viewport, Screenshots, Comparison

Description

Frank Responsive Checker is a complete tool for testing site layouts. It works directly inside your WordPress dashboard. By simulating over 50 specific device viewports, including the latest mobile screens, tablets, and desktop displays, this tool streamlines the front-end debugging process for developers, designers, and website owners. This simplifies design audits for all website owners.

The built-in accessibility checker helps ensure compliance with WCAG standards by scanning for color contrast ratios, missing alternative text, keyboard navigation flow patterns, and simulated screen reader structure. Additionally, you can conduct side-by-side layout comparisons with synchronized scrolling, capture high-fidelity page screenshots to generate PDF reports, and create temporary, secure preview links to share live responsive mockups with clients or team members without requiring WordPress dashboard access.

How this plugin works: Check Docs

What Admin Can do on his site with Frank Responsive Checker

• Launch the responsive checker utility from any frontend page or backend dashboard screen with a single click.
• Review layouts across a comprehensive selection of modern smartphones, tablets, laptops, and desktop viewports.
• Toggle between portrait and landscape orientations to verify rendering across screen rotations.
• Build, save, and manage customized device dimensions for personalized testing requirements.
• Perform accessibility scans to evaluate WCAG color contrast, pinpoint missing alt tags on images, display keyboard focus maps, and simulate screen-reader reads.
• Load multiple device frames side-by-side with synchronized scroll capabilities to examine layout uniformity.
• Create temporary, secure preview links with custom expiration settings to share mobile layout designs with clients or team members.
• Snaps instant screenshots of individual layouts or capture all configured viewports simultaneously.
• Simulate touch screen behaviors, swipes, and custom user-agent headers to verify responsive logic.

Viewport testing and site analyze features

This plugin shows how your pages look on popular mobile screens, tablets, and desktops.

• Use the device preview to see mobile views instantly.
• Test both portrait and landscape views with one click.
• Enter custom width and height values to test any viewport size.
• Save your custom device profiles for quick access later.

Accessibility audits and site optimization

Check your website pages for common accessibility issues. This helps make your site user-friendly.

• Run a WCAG contrast check to read text clearly.
• Find images that are missing alt text tags.
• Show the keyboard focus order with numbered badges on screen.
• Simulate a screen reader to hear how the page is read.

Viewport comparison and layouts screenshots

Take snapshots of your pages to keep track of layout changes.

• Save screenshots of any viewport layout with one click.
• Compare two or three device viewports side by side.
• Scroll all viewports at the same time to check layout alignment.
• Compare new pages against baseline snapshots to find pixel differences.