Media
5 items
Description
Validate W3C HTML/CSS, test WCAG Accessibility, and check Responsive Design on web pages and any nested iframe. Page & IFrame Analyzer is a comprehensive developer tool designed to validate HTML, CSS, Accessibility (WCAG), and Responsive Design for both top-level web pages and deeply nested iframes. While standard web validators only scan the main URL, this extension allows you to isolate and test specific iframes, third-party widgets, or dynamic components. It extracts the currently rendered DOM, providing accurate validation for modern, JavaScript-heavy web applications. Designed for Front-End Developers, QA Engineers, and UI/UX Specialists. KEY FEATURES IFrame Tree & Highlighter • Instantly scans the page and builds a visual tree of all nested frames. • Displays iframe attributes (ID, name, URL). • Visually highlights the selected iframe directly on the page using a DevTools-style box model overlay (showing content, padding, border, and margin areas). HTML & CSS Validation • Extracts the active, dynamically generated DOM. • Gathers inline styles and fetches external stylesheets (resolving cross-origin resources natively via background processes). • Forwards the compiled code to the public W3C Validation Services in a new tab. Accessibility (WCAG) Testing • Runs deep local accessibility checks powered by the open-source axe-core engine. • Performs custom ARIA validation (detects focusable elements with aria-hidden, empty aria-labels, interactive roles missing tabindex, etc.). • Calculates an overall Accessibility Score (0-100). Responsive & Mobile Testing • Emulates a mobile viewport internally to test responsive behaviors. • Detects horizontal overflows and layout-breaking structural containers. • Flags unreadable text (font-size < 11px) and unresponsive tables. • Checks for critical touch targets (flags unusable buttons < 24px and sub-optimal links < 44px). • Calculates a Responsive Score (0-100). Detailed Reporting • View top issues directly within the extension popup. • Click "Copy Report" to generate a neatly formatted text report containing all violations, affected HTML snippets, CSS selectors, and fixing suggestions. • "Full Report" button runs HTML, CSS, and Accessibility/Responsive checks together and opens the combined results in a dedicated new browser tab. Privacy & Transparency This extension runs entirely locally in your browser. It does not track your browsing history, does not collect personal data, and only inspects the active tab upon explicit user interaction. Disclaimer This extension is an independent developer tool. It is not affiliated with, endorsed by, or sponsored by the W3C (World Wide Web Consortium). It acts as a convenient bridge to compile local markup and send it to their public validation services.