HTML 에디터로 무엇을 할 수 있나요?
HTML 에디터는 웹 문서의 코드를 직접 쓰면서 결과를 곧바로 확인하는 도구입니다. 블로그 글의 표나 인용구를 다듬을 때, 쇼핑몰 상세페이지의 HTML 을 손볼 때, 메일 본문에 넣을 서식을 만들 때처럼 결과를 눈으로 확인하며 코드를 고쳐야 하는 일에 씁니다. 편집한 내용은 브라우저 안에서만 처리하고 서버로 보내지 않습니다.
결과를 보면서 고칩니다
왼쪽에 코드를 쓰면 오른쪽 미리보기가 곧바로 따라갑니다. 저장하고 새로고침해서 확인하는 과정을 거치지 않아도 됩니다.
코드 형태로도 봅니다
하이라이팅을 켜면 렌더링 결과 대신 색이 입혀진 코드가 보입니다. 태그가 제대로 닫혔는지 확인할 때 씁니다.
들여쓰기를 정리합니다
여기저기서 복사해 와 엉킨 HTML 도 코드 정렬 한 번으로 중첩에 맞게 정돈됩니다. 공백이 의미를 갖는 pre 와 textarea 안쪽은 건드리지 않습니다.
작업하던 내용이 남습니다
입력을 멈추면 브라우저에 자동 저장되어 새로고침하거나 창을 닫아도 이어서 쓸 수 있습니다. 서버에는 보내지 않습니다.
사용 방법
- 편집창에 HTML 을 입력합니다 - 직접 입력하거나 다른 곳에서 복사한 HTML 을 붙여 넣습니다. 오른쪽 미리보기가 입력과 동시에 갱신됩니다.
- 도구 모음으로 서식을 넣습니다 - 텍스트를 선택한 뒤 굵게·제목·목록 같은 버튼을 누르면 선택한 부분에 태그가 감싸집니다.
- 결과를 확인합니다 - 미리보기에서 렌더링 결과를, 하이라이팅 버튼으로 코드 형태를 확인합니다. 새 탭 버튼으로 실제 문서 상태도 볼 수 있습니다.
- 완성한 코드를 복사합니다 - 상태 줄의 복사 버튼으로 전체 코드를 클립보드에 담아 원하는 곳에 붙여 넣습니다.
자주 묻는 질문
HTML 에디터는 무료인가요? 회원가입이 필요한가요?
회원가입도 설치도 없이 무료로 쓸 수 있습니다. 브라우저에서 바로 열어 HTML 을 편집하고 결과를 확인할 수 있습니다. 사용 횟수나 글자 수 제한도 없습니다.
작성한 내용이 서버에 저장되나요?
저장되지 않습니다. 편집한 HTML 은 브라우저 안에서만 처리되며 서버로 전송하지 않습니다. 자동 저장은 브라우저의 로컬 저장소에 보관하므로 같은 기기·같은 브라우저에서만 복원됩니다.
새로고침하면 작성한 내용이 사라지나요?
사라지지 않습니다. 입력을 멈추고 3초가 지나면 브라우저에 자동 저장되어 새로고침하거나 창을 닫았다 열어도 이어서 작업할 수 있습니다. 다만 시크릿 모드이거나 브라우저 저장소를 비우면 복원되지 않습니다.
이미지는 어떻게 넣나요?
이미지 주소를 넣는 방법과 파일을 직접 올리는 방법 두 가지가 있습니다. 파일은 편집창에 끌어다 놓거나 올리기 버튼으로 선택하면 Base64 로 변환되어 HTML 안에 포함됩니다. 파일 한 장은 최대 2MB 까지 넣을 수 있습니다.
Base64 이미지를 여러 장 넣어도 되나요?
권장하지 않습니다. Base64 는 이미지가 HTML 본문에 통째로 들어가는 방식이라 용량이 약 1.33배로 늘어납니다. 브라우저 저장소 한도(보통 5MB)를 넘으면 자동 저장이 멈추고 안내가 표시됩니다. 여러 장을 쓸 때는 이미지 주소 방식을 쓰세요.
코드 하이라이팅은 무엇인가요?
작성한 HTML 을 렌더링된 결과 대신 색이 입혀진 코드로 보여 주는 기능입니다. 미리보기 오른쪽 위의 하이라이팅 버튼으로 결과 보기와 코드 보기를 오갈 수 있습니다.
코드 정렬을 누르면 무엇이 바뀌나요?
태그의 중첩 단계에 맞춰 들여쓰기를 다시 매깁니다. 공백이 의미를 갖는 pre 와 textarea 안쪽은 원문 그대로 보존하므로 정렬 때문에 내용이 바뀌지 않습니다.
작성한 HTML 을 실제 화면으로 확인할 수 있나요?
미리보기 오른쪽 위의 새 탭 버튼을 누르면 작성한 HTML 만으로 이루어진 문서를 새 탭에서 엽니다. 이 페이지의 스타일이 섞이지 않은 상태로 확인할 수 있습니다.