इन चरणों को काम की checklist की तरह इस्तेमाल करें और इन्हें परियोजना के साक्ष्य, दायरे और सीमाओं के अनुसार ढालें।
व्यावहारिक चरण
- जिस page की जाँच करनी है, उसे और browser developer console खोलें। Mobile overflow checker के लिए पहले responsive mode इस्तेमाल करें।
- Code की समीक्षा करें, पूरा snippet console में paste करें और Enter दबाएँ। यह मौजूदा page पढ़ता है; केवल sitemap metadata tool और same-origin checkers सीमित requests भेजते हैं।
- Console output या डाउनलोड की गई CSV/JSON देखें। Browser policies, authentication और unsupported server methods के कारण कुछ जाँचें निर्णायक नतीजा नहीं दे सकतीं।
(() => {
const width = document.documentElement.clientWidth || innerWidth;
const MAX_SCAN = 8000;
const MAX_RESULTS = 80;
const candidates = [];
const walker = document.createTreeWalker(document.body, NodeFilter.SHOW_ELEMENT);
let scanCapped = false;
while (walker.nextNode()) {
if (candidates.length === MAX_SCAN) {
scanCapped = true;
break;
}
candidates.push(walker.currentNode);
}
const overflowRows = candidates.map((el) => {
const rect = el.getBoundingClientRect();
const style = getComputedStyle(el);
return { element: el, selector: el.tagName.toLowerCase() + (el.id ? '#' + CSS.escape(el.id) : '') + [...el.classList].slice(0, 2).map((name) => '.' + CSS.escape(name)).join(''), left: Math.round(rect.left), right: Math.round(rect.right), width: Math.round(rect.width), position: style.position, overflow: rect.left < -2 || rect.right > width + 2 };
}).filter((row) => row.overflow && row.width > 0).sort((a, b) => Math.max(b.right - width, -b.left) - Math.max(a.right - width, -a.left));
const rows = overflowRows.slice(0, MAX_RESULTS);
console.table(rows.map(({ element, ...row }) => row));
console.info('Viewport width:', width, '· document width:', document.documentElement.scrollWidth, '· out-of-viewport elements:', overflowRows.length, '· shown:', rows.length, '· scanned elements:', candidates.length);
if (overflowRows.length > MAX_RESULTS) console.warn('Showing the ' + MAX_RESULTS + ' largest candidates out of ' + overflowRows.length + ' overflowing elements.');
if (scanCapped) console.warn('Scan stopped at ' + MAX_SCAN + ' elements; additional elements were not checked.');
if (document.documentElement.scrollWidth > width) console.warn('The document is wider than the current viewport. Run again at the target mobile width.');
console.info('This reports geometry only; fixed headers, intentional carousels, transforms, and browser zoom may produce false positives.');
})();चलाने से पहले review करें। यह मौजूदा page पढ़ती है; केवल sitemap और link audits सीमित same-origin requests भेजते हैं। Requests में cookies शामिल नहीं होते; script site content नहीं बदलती।