• 아티클

Utility SpotlightInternet Explorer Developer Toolbar

Lance Whitney

직접 웹 콘텐츠를 제작하거나 동료 웹마스터를 지원하는 사용자의 작업을 돕는 Microsoft 유틸리티가 출시되었습니다. Internet Explorer Developer Toolbar를 사용하면 이상 작동하는 웹 페이지의 내부를 살펴봄으로써 문제를 해결할 수 있습니다. Toolbar는 텍스트, 테이블, 이미지 및 다른 HTML 콘텐츠의 모든 태그와 스타일을 보여 줍니다. 스타일 규칙을 보거나 페이지의 특정 요소를 강조할 수 있으며, HTML 및 CSS의 유효성을 검사할 수도 있습니다.

IEDevToolBarSetup.msi 파일을 다운로드하여 Internet Explorer Developer Toolbar를 설치할 수 있습니다. 설치한 후에 Internet Explorer를 다시 열면 IE Developer Toolbar라는 새로운 단추를 명령 모음에서 볼 수 있습니다. 단추를 클릭하면 브라우저 창 아래쪽에 세 개의 창으로 분리된 Toolbar가 열립니다(스크린샷 참조). 첫 번째 창에는 모든 웹 페이지 요소의 트리가 표시됩니다. 여기에서 아무 요소나 클릭하면 다른 두 개의 창에 요소의 특성과 스타일이 표시됩니다.

풀다운 메뉴를 사용하여 요소를 선택하거나 검색하여 화면의 특정 요소를 강조할 수 있습니다. 예를 들어 모든 h3 태그를 검색하면 트리 보기에 하나씩 표시됩니다. 그리고 태그를 선택하면 페이지의 해당 요소를 간략하게 보여 줍니다. div 태그, 테이블, 이미지, 절대나 상대 위치 지정으로 배치된 개체와 같은 특정 범주를 선택하여 요소를 찾을 수도 있습니다.

\\msdnmagtst\MTPS\TechNet\issues\en\2008\11\Whitney - Utility\layout\FIGURES\fig01_L.gif

웹 페이지의 내부

Toolbar는 스타일 규칙을 사용하는 경우에 특히 유용합니다. 페이지에서 ID나 클래스 스타일로 형식을 지정한 모든 항목을 강조하여 표시할 수 있으며 스타일시트의 모든 규칙에 대한 보고서를 생성하여 스타일 규칙이 어디에서 왜 적용되었는지 확인할 수 있습니다. 모든 CSS를 비활성화하여 페이지 요소가 어떤 영향을 받는지도 확인할 수 있습니다.

Toolbar를 사용하여 그래픽 개체를 관리하기 위해 이미지를 활성화 및 비활성화하고 해상도, 크기, 경로 및 각 그림의 alt 태그를 표시할 수 있습니다. Toolbar는 또는 모든 그래픽에 대한 핵심 세부 사항을 표시하는 읽기 쉬운 이미지 보고서를 생성합니다.

Toolbar를 사용하면 브라우저 페이지의 크기를 800x600 및 1280x1024 또는 사용자 지정 크기로 변경할 수 있습니다. 화면 눈금자를 사용하면 요소 크기를 픽셀 단위로 측정할 수 있으며 색 선택 도구를 사용하면 스포이트로 개체를 선택하여 개체의 색을 RGB 및 16진수로 볼 수 있습니다.

웹 페이지 문제 해결을 지원하기 위해 Toolbar는 JavaScript 및 쿠키와 같은 특정한 요소를 비활성화할 수 있습니다. 전체 페이지나 선택된 개체에 해당하는 콘텐츠의 HTML 소스를 볼 수 있습니다. 게다가 소스 화면에서는 형식이 지정과 색 구분을 지원하므로 콘텐츠와 태그를 구분하기가 쉽습니다. 트리 보기에서 렌더링된 페이지에서 스타일 및 다른 특성을 추가 및 제거하여 어떤 영향이 있는지 확인할 수 있습니다. 마지막으로 Toolbar는 사용자의 페이지를 W3C(World Wide Web Consortium) 유효성 검사 서비스로 파이핑하여 콘텐츠가 XHTML 유효성 검사를 통과하며 손상된 링크 및 내게 필요한 옵션이 있는지 확인할 수 있습니다.

Internet Explorer Developer Toolbar는 Windows XP, Windows Vista 및 Windows Server 2003에서 Internet Explorer 6 및 7과 호환됩니다. Toolbar에 대한 자세한 내용과 다운로드할 수 있는 링크는 go.microsoft.com/fwlink/?LinkId=125120을 참조하십시오.

Lance Whitney는 IT 컨설턴트이며 웹 개발자이자 테크니컬 라이터로, Windows 워크스테이션과 서버를 분석하는 데 많은 시간을 할애하고 있습니다. 원래 저널리스트였던 그는 15년 전 IT 업계에 발을 들여 놓았습니다.