identify-page-structure

Analyze webpage screenshots and HTML to identify section boundaries and content sequences.

Updated Mar 27, 2025
One-click install
npx skills add https://github.com/jfoxx/residentportal --skill identify-page-structure-jfoxx
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: identify-page-structure
Source: https://github.com/jfoxx/residentportal/tree/main/.skills/identify-page-structure
Command: npx skills add https://github.com/jfoxx/residentportal --skill identify-page-structure-jfoxx

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill helps to understand the structural layout of a webpage, breaking it down into logical sections and identifying the sequence of content within each section, which is crucial for importing content into AEM Edge Delivery Services.

Core Features & Use Cases

  • Section Identification: Detects visual and thematic boundaries between sections on a webpage.
  • Content Sequence Analysis: Breaks down each section into a series of content elements or potential blocks.
  • Block Survey: Catalogs available AEM blocks for informed content mapping.
  • Use Case: When migrating a website to AEM, this skill analyzes the existing page structure to inform how content should be organized and mapped to AEM components.

Quick Start

Analyze the provided webpage screenshot and HTML to identify its sections and content sequences.

Frequently Asked Questions about identify-page-structure

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I identify page sections and content flow for AEM migration?

To identify page sections for AEM migration, you analyze scraped webpage content using visual screenshot analysis and parsed HTML to detect distinct section boundaries and sequence content elements into available AEM blocks.

What is the best way to map webpage content to AEM blocks?

Mapping webpage content to AEM blocks requires surveying available AEM blocks and parsing cleaned HTML to determine section styles, which facilitates structured content import into AEM Edge Delivery Services.

How do I parse HTML to detect logical section boundaries on a webpage?

Parsing HTML to detect section boundaries involves analyzing cleaned HTML alongside visual screenshots to identify thematic and visual breaks, breaking the page into logical sections for content import.

Do I need screenshots to analyze webpage structure for AEM Edge Delivery Services?

Screenshots are required to analyze webpage structure for AEM Edge Delivery Services, because visual analysis is needed alongside HTML parsing to accurately determine section styles and distinct thematic boundaries.

Can I use web scraping content to catalog available AEM blocks for component mapping?

You can use web scraping content to catalog available AEM blocks by surveying the blocks and mapping the scraped content sequence to them, which informs how content should be organized during import.