HTML 소스 표시
URL에서 페이지의 HTML 소스를 줄 번호 붙여 표시
특징
URL만으로 소스 표시
페이지의 HTML을 가공하지 않고 줄 번호 붙여 표시
스마트폰에서도 소스 확인
소스 표시 기능이 없는 스마트폰의 브라우저에서도 확인 가능
취득 결과의 개요도 목록
상태·최종 URL·문자 코드·문자 수·줄 수
정렬·복사·저장
원탭 정렬과 복사, .html 파일 저장에 대응
사용 방법
조사하려는 URL을 입력
소스를 보고 싶은 페이지의 URL을 입력란에 1개 입력(https://는 생략 가능)
확인 버튼으로 취득
「확인」 또는 Enter 키로 서버가 페이지를 취득하여 소스 표시
개요와 소스 확인
상태·최종 URL·문자 코드를 확인하고, 읽기 어려우면 「정렬하기」로 들여쓰기
복사 또는 저장
소스 열 우측 상단의 버튼으로 복사하거나 .html 파일로 다운로드
사용 사례
참고 사이트 구성 조사
제목이나 meta 정보, 로드하는 CSS·JavaScript의 구성 확인
설치 태그의 출력 확인
측정 태그·OGP·구조화된 데이터가 자신의 사이트의 HTML에 실제로 출력되고 있는지 확인
문자 깨짐 원인 조사
문자가 깨지고 있는 페이지의 문자 코드와 선언 내용 확인
페이지 내 링크 추출
페이지에서 걸린 링크 대상을 목록으로 확인하고 복사
기초 지식
HTML 소스 코드란
HTML 소스 코드는 웹 페이지의 제목·본문·이미지의 위치 등을 h1(제목)이나 p(단락) 같은 태그로 기술한 텍스트이며, 브라우저는 이를 읽어 페이지를 렌더링합니다.
- head 요소：head 요소에는 페이지의 제목(title), 검색 결과나 SNS에서 사용되는 설명 텍스트(meta), 로드할 CSS나 JavaScript의 지정이 기술됩니다.
- 문자 코드 선언：문자 코드는 meta 태그의 charset 속성(예: charset="UTF-8")으로 선언되며, 선언과 실제 문자 코드가 맞지 않으면 페이지가 깨집니다.
브라우저에서 페이지의 소스를 표시하는 방법
PC의 Chrome이나 Edge에서는 페이지 위에서 우클릭하여 「페이지 소스 표시」를 선택하거나, Windows는 「Ctrl+U」, Mac은 「Command+Option+U」를 누르면 소스를 표시할 수 있습니다.
- 스마트폰의 경우：스마트폰의 브라우저에는 「페이지 소스 표시」 메뉴가 없는 경우가 많으므로, URL을 입력하여 소스를 취득하는 웹 도구를 사용하는 것이 편합니다.
소스와 검증 도구의 HTML 차이
「페이지 소스」는 서버가 처음 반환한 HTML이며, 브라우저의 검증 도구(개발자 도구)에 표시되는 HTML은 JavaScript 실행 후 다시 쓰인 상태입니다.
- 표시되지 않는 요소：JavaScript로 나중에 추가되는 광고나 목록 등은 서버가 반환한 HTML에 포함되지 않으므로, 소스를 표시해도 찾을 수 없을 수 있습니다.
안전성과 개인정보
서버 처리
입력 내용은 서버에서 처리되며, 전송되는 정보는 조회에 필요한 정보만입니다.
임시 처리만
페이지 소스 취득를 위해 서버에서 임시 처리한 후 결과 반환 후 삭제됩니다.
통신은 HTTPS로 암호화
송수신 데이터는 모두 TLS로 암호화되어 제3자가 읽을 수 없습니다.
제3자로의 전송 없음
광고 네트워크나 트래커 등 외부 서비스로 입력 내용을 전송하지 않습니다.
입력한 URL의 페이지만 취득
취득한 소스는 화면에 텍스트로 표시할 뿐 스크립트는 실행하지 않으며, 사내용 등 비공개 URL은 취득하지 않습니다
Google 검색에서 RAKKOTOOLS 팔로우하기
203개의 편리한 도구를 Google 검색·AI 검색에서 더 쉽게 찾을 수 있습니다!
- 검색에서 발견
- AI 검색에서도 표시
- 새 도구도 발견
업데이트 정보
- update #376
URL에서 페이지의 HTML 소스를 줄 번호와 함께 표시할 수 있는 새로운 도구 추가
주목할 도구
RAKKOTOOLS는자유롭게 이용하실 수 있습니다!
개인·법인을 불문하고, 상용·비상용을 불문하고 무료로 이용하실 수 있습니다.사전 허가나 이용 신청도 필요하지 않습니다. 다양한 상황에서 자유롭게 활용해 주세요.
배포·동영상에서의 이용
추첨이나 추점 등 다양한 도구를 라이브 배포·동영상 내에서 이용할 수 있습니다.
학교·업무·이벤트에서의 이용
수업, 팀 구성, 사내 업무, 이벤트 등 다양한 상황에서 활용할 수 있습니다.
웹·서적·SNS에서의 소개
편리한 도구로서 웹 미디어·서적·SNS 등에서 자유롭게 소개할 수 있습니다.
상용 이용
조사·계산·가공·변환 등 업무나 제작 등 상용 목적으로도 이용하실 수 있습니다.
소개해 주시면 도구를 만드는 힘이 나옵니다!
배포·동영상에서 이용하시는 경우
개요란 등에 RAKKOTOOLS 링크 게재, 또는 배포·동영상 내에서 「RAKKOTOOLS」를 사용하고 있음을 언급·표시를 부탁드립니다.
개요란에 붙일 수 있는 크레딧 예시
이용상의 부탁일반적인 이용이라면 자유롭게 사용하실 수 있습니다. 다만, 법령을 위반하는 목적으로의 이용, 제3자의 권리를 침해하는 이용, 서비스에 현저한 부하를 주는 이용, 부정 접근 및 기타 서비스 운영을 방해하는 행위는 금지됩니다.
각 도구에서 얻을 수 있는 정보·계산 결과 등에 대해 정확성·완전성을 보증하지 않습니다.
본 안내는 일본어 원문을 번역한 것입니다. 번역과 원문의 내용이 다를 경우 일본어 원문이 우선됩니다.