[Extension] 크롬 확장 프로그램 - Web Developer

Web Developer는 개발자와 디자이너를 위한 크롬 확장 프로그램이다.
웹 페이지 분석, 디버그, 테스트를 할 수 있게 다양한 도구를 제공한다.

Web Developer 설치

Web Developer 사용하기
해당 링크에서 'Chome에 추가 → 확장 프로그램 추가' 버튼을 누르면 사용 가능하다.

Web Developer 사용

Web Developer의 인터페이스는 상당히 간결한 편이며, 사용 사례는 다음과 같다.

• 웹 페이지 디버깅
• 반응형 디자인 테스트
• 요소 확인 및 수정
• SEO 및 접근성 검사
• 다양한 브라우저에서의 동작 확인
  

Web Developer 주요 기능

1. CSS
   • 페이지에 적용된 CSS 활성화/비활성화
   • 특정 페이지의 CSS 속성 검사
   • 미디어 쿼리 확인
2. HTML
   • HTML 구조 표시/강조
   • 페이지의 이미지, 링크, 폼 요소 등 강조
   • HTML 유효성 검사기 연결
3. 이미지
   • 이미지 크기 및 경로 확인
   • 숨겨진 이미지 보기
   • 이미지 비활성화/회색조 표시
4. 폼
   • 모든 입력 필드에 기본값 채우기
   • 숨겨진 필드/암호 필드 표시
   • 필드 이름 또는 ID 보기
5. 도구
   • 웹 표준 테스트 (HTML/CSS 유효성 검사)
   • 페이지 속도 테스트
   • 다양한 외부 도구로 연결
6. 스크립트
   • JavaScript 활성화/비활성화
   • 쿠키 및 로컬 스토리지 확인