HTML Lens

by seaalgae.0•Developer Tools

Add to Chrome

Real-time Analytics

Metrics and performance data for HTML Lens

Timeframe:

Advanced Analytics

Monthly Growth

Percentage change in user base over the last 30 days compared to previous period

Category Ranking

Current position ranking within the extension category compared to competitors

Install Velocity

Average number of new installations per week based on recent growth trends

Performance Score

Composite score based on rating, review engagement, and user adoption metrics

Version Analytics

Update frequency pattern and time since last version release

Performance Trends

Analytics data over time for HTML Lens

Loading analytics data...

About This Extension

HTML 구조, 스타일, 접근성을 시각화하는 브라우저 확장 프로그램 HTML Lens는 웹 퍼블리셔와 프론트엔드 개발자를 위한 브라우저 확장 프로그램입니다. 이 확장 프로그램은 웹 페이지의 HTML 요소를 시각적으로 탐색하고, 각 요소의 마진, 패딩, 콘텐츠 영역을 오버레이로 표시해줍니다. 또한, aria- 속성, role, tabindex 등 접근성과 관련된 속성들을 분석하고 표시하여, 웹 접근성 진단에 도움을 줍니다. 사용자는 원하는 요소를 마우스로 선택하여 해당 요소의 구조와 접근성 관련 정보, 클래스, ID, 스타일 정보를 직관적으로 확인할 수 있습니다. 🔍 주요 기능: 마우스 오버로 요소의 박스 모델(마진/패딩/콘텐츠) 시각화 aria-, role, tabindex 등 접근성 속성 탐색 선택된 요소에 대한 포커스, 관계 엘리먼트 추적 기능 (업데이트 예정) UI : 다크/라이트 모드 전환 드래그 가능한 인터페이스 및 투명도 조절 👤 누가 사용하면 좋을까요? 웹 접근성을 고려해야 하는 퍼블리셔, 디자이너, 개발자 HTML/CSS 구조를 빠르게 분석하고 싶은 사람 실제 페이지 구조와 사용자 경험(UI/UX)의 일관성을 테스트하려는 QA 담당자 💡 이 확장 프로그램은 기존의 DevTools와는 다른 관점에서, 실무 퍼블리셔가 원하는 핵심 정보만을 빠르게 확인할 수 있도록 설계되었습니다.