이 게시글에서는 무료 온라인 HTML 편집기를 추천해 주고 사용하는 법을 알아봅니다.
- 온라인 HTML 편집기의 필요성
- 무료 온라인 HTML 편집기 사용으로 손쉽게 HTML 편집하기
온라인 HTML 편집기의 필요성
구글 블로거에서는 새 글 작성에 편집 기능이 좋지 못합니다.
때로는 이미지에 링크도 추가해야 하고 이미지 배치도 하고 싶은데 HTML을 편집해서 하기가 너무 어렵습니다.
또한, 구그 블로거에서 새 글 작성 후 HTML 편집기로 가보면 모든 태그들이 줄 바꿈 없이 다닥다닥 붙어있습니다.
이때에는 다른 HTML 편집기가 꼭 필요합니다. 조건은 다음과 같아야 합니다.
- 무료 편집기여야 한다.
- 온라인에서 사용 가능 해야 한다.
- 가입이 필요 없어야 한다.
- 구글 블로그 글 하나의 편집 정도가 가능해야 한다.
이글에서는 이전에 작성한 블로그 글 하나를 가지고 편집을 해보려고 합니다.
오늘 수정할 블로그 게시글은,
제가 최초 네이버 블로그에 작성한 내용으로
구글 블로거로 이사를 오게된 글입니다.
처음에 네이버에 작성 하였으나, 블로거가 더 맘에 들어서 본격적으로 블로거에서 작업하기 위해 네이버 블로그의 글을 비공개로 전환하고 구글 블로거로 이사를 하였습니다. 그런데 이사할 때 복사 붙여넣기를 하다 보니 화면 구성이나 배치가 적절하지 않게 옮겨졌습니다.
이것을 고치려면 HTML을 편집해야 하는데 HTML을 잘 모르는 상태에서 하나하나 배워 가면서 이 많은 내용을 파악하면서 수정하기란 거의 불가능에 가까워 보였습니다.
또한, 네이버 블로그에서 가져왔더니 이상한 HTML 태그가 잔뜩 붙어있어서 보기도 어려웠습니다.
그 외에도 이렇게 HTML 태그가 지저분하게 붙어 있는 경우에는 구글 검색엔진 최적화에도 좋지 못하다고 합니다. 그러니, 정리가 필요합니다.
무료 온라인 HTML 편집기 사용으로 손쉽게 HTML 편집하기
검색을 통해서 사용해 본 것으로 가장 쉽게 사용할 수 있는 온라인 편집기는 다음과 같습니다.
그럼 위에서 언급한 페이지를 수정해 보도록 하겠습니다.
먼저 블로거에서 해당 글 수정으로 들어가서 HTML 편집 모드로 들어갑니다. 제일 왼쪽 상단에 연필 모양을 눌러서 <> 모양으로 변경하면 HTML 편집 모드가 됩니다.
그러면 내가 작성한 글이 HTML 모드로 전환됩니다.
이렇게 붙여넣기를 하고나면 우측 화면에 있는 편집기에는 해당 HTML을 웹에서 보는 화면과 유사하게 표현해 줍니다. 이 우측에 있는 편집기가 HTML 편집기라고 생각하시면 됩니다.
이 우측 화면에서 내가 원하는대로 편집후 왼쪽의 HTML을 복사하여 다시 구글 블로거의 HTML 모드에 붙여넣기를 하는 방법으로 쉽게 구글 블로거의 HTML 편집을 할 수 있습니다.
네이버 블로그에서 가져온 글의 HTML이 너무 지저분합니다.
그런데, 이번에 사용한 온라인 무료 HTML 편집기에는 HTML 입력창 하단에 Clear라는 버튼이 확인되었습니다.
그래서, 이 버튼을 눌러보았습니다.
놀랍게도 지저분한 HTML 태그가 정리되고 화면도 깔끔해 졌습니다. 이 상태에서 제가 원하는 편집후 다시 가져오면 될 것 같습니다.
위 사진은 Clean 버튼 적용 후의 모습입니다.
왼쪽 화면을 보시면 HTML 태그가 줄바꿈이 적절히 적용되어 매우 깔끔한 모습을 보실 수 있습니다.
이 HTML을 그대로 가져와서 구글 블로거의 HTML 편집기(<>)를 선택하여 해당 HTML에 붙여 넣습니다.
.png)
