HTML 온라인 편집기 (설치 불필요) 추천

안녕하세요. IT 전문 블로거 별동네 사진방의 여우입니다.

오늘은 설치없이 HTML을 편집할 수 있게 해주는 온라인 에디터들을 추천해 드리도록 하겠습니다.

지극히 개인적인 기준으로 선정하였음을 참고하시기 바랍니다.

 

초보를 위한 HTML 관련 용어 정리

HTML: 하이퍼텍스트 마크업 언어로 웹사이트의 뼈대를 잡는 역할을 합니다. 프로그래밍 언어가 절대로 아니므로 개발자 앞에서 HTML 프로그래밍 할 줄 안다고 하면 흔적도 없이 사라지거나 비웃음을 당할 수 있으니 꼭 기억해두세요!!

CSS: HTML과 단짝 친구로 HTML이 뼈대를 담당한다면 색상과 그림자 같은 스타일을 담당하는 코드로 HTML과 마찬가지로 프로그래밍 언어가 절대로 아닙니다.

JavaScript: 줄어서 그냥 JS라고 합니다. 웹사이트를 만들 때 알림창을 띄운다든지 화면의 레이아웃을 하는 프로그래밍 다운 작업을 하는 프로그래밍 언어 입니다.

백터 그래픽: 확대해도 깨지지 않는 선과 좌표들로 이루어진 이미지라고 생각하시면 편합니다. 복잡한 이미지는 표현이 어려우며 PNG, JPG같이 픽셀로 이루어진 이미지와는 다른점이 많습니다.

---

1. CODEPEN - 코드펜

코드팬 누리집 화면 갈무리

개발에 관심이 있으시다면 한 번 쯤은 들어보셨을 것 같습니다.

이 사이트는 무료로 제공되며 다른 사용자들에게 내가 만든 프로젝트를 공유하는 기능도 제공됩니다.

또한 블로그나 웹사이트를 운영 하신다면 내가 만든 프로젝트를 HTML로 사이트에 넣을 수도 있습니다.

URL: Codepen.io

 

2. Liveweave - 라이브위버

라이브위버 편집기 화면 갈무리

라이브위버는 제가 HTML을 연습할 때 가장 자주 사용했던 사이트 입니다.

이 사이트를 사용하면 내가 만든 HTML 문서를 클라우드에 저장하고 공유할 수 있습니다.

이 사이트의 가장 큰 장점은 제공되는 도구가 아주 많다는 것인데요.

CSS Explorer를 사용해서 간편하게 CSS를 만들어 줄 수 있습니다.

또한 Color Explorer를 통해서 HTML 컬러코드를 간편하게 찾을 수 있고 Vactor Graphics Editor를 사용하여 백터 파일을 쉽게 만들 수 있습니다.

라이브위버 CSS 익스플로러 화면 갈무리

URL: liveweave.com

---

오늘은 HTML 웹 편집기를 추천해드렸습니다.

요즘 IT 관련 직종의 인기가 높아짐에 따라서 HTML, CSS, JS를 배우시려는 분들이 많으신데요.

제 글이 도움이 되었으면 좋겠습니다.

 

방문해 주셔서 감사합니다.