HTML 5 CSS 3 :) HTML 5/ CSS 3란? 웹브라우저와 기초편

HTML 이란 무엇일까요?

 

인터넷을 무척 손쉽게 접하는 우리나라에서 한 번은 들어봤을 법한 확장자고, 저도 오래전부터 관심을 두고 있다가 한번 공부해 보기로 결심을 했습니다!

 

HTML이란 Hyper text markup language의 줄임말로 "하이퍼 텍스트" 즉 웹사이트 링크를 클릭해 다른 문서로 이동을 하고 "마크 업"이란 태그를 이용해서 내용과 제목들을 표시하는 것을 의미합니다.

 

웹 문서를 구현하는 언어가 바로 HTML입니다.

 

아마, 간단하게 개인용 웹 페이지나 어플리케이션을 만들어 보고 싶으신 분들이 현재 나와있는 HTML5를 검색하고 계실 것 이라 생각됩니다.

 

기존의 HTML은 기능들이 부족해서 어플리케이션 개발자들에게는 사용되지 않았고, 웹페이지들을 만들 때에만 사용되는 경우가 많았는데, 현재는 어찌 되었든 스마트폰이나 태블릿 등 에서 표시를 하는 창들은 HTML로 만들어지고 있고, HTML5에선 보다 다양한 기능들이 들어가 있어서 개발자들도 많이 공부하고, 저처럼 취미로 공부를 해 보는 사람도 많이 늘고 있다고 합니다!

 

---

 

웹 브라우저의 종류

 

크롬, 파이어폭스, 익스플로러, 사파리, 엣지

구글 크롬

최근 한국에서도 많이 사용되고 있고, 외국에서는 검색=구글 이라는 표현이 있을 정도로 웹 브라우저의 대명사입니다. HTML5에 대해서도 가장 발 빠르게 대응하고 있고 저도 크롬으로 공부를 하고 있습니다.

 

모질라 파이어폭스

일반 사용자보다는 저눔ㄴ 개발자들이 사용하는 편이며, 개발도구들 등이 더 좋다고 합니다.

 

마이크로소프트 익스플로러

한국에서 가장 많이 사용되고 있고, 저도 가장 많이 사용해 왔습니다. HTML5에 대한 지원은 빈약한 편 같습니다.

 

마이크로소프트 엣지

마이크로소프트에서 새로 만든 웹 브라우저로 HTML5를 지원하는 차세대 브라우저입니다.

 

---

웹 편집기

 

여기서부터 본론인 것 같습니다.

웹 편집기부터 무언가 개발을 한다(HTML수준은 개발이라고 표현하기 어렵다고 합니다)는 느낌을 받을 수 있고, 초심자의 경우 무언가 해 보고 있다 라는 느낌을 받을 수 있습니다.(저도 그랬습니다)

 

예전에는 메모장을 가지고 웹 문서를 작성했다고 합니다...

메모장으로 작업한다는 말은 처음부터 끝까지 모든 작업을 하나하나 직접 타이핑한다는 말인데, 저로썬 엄두도 못 낼 행위인 듯합니다.

 

 

 

 

비쥬얼 스튜디오 코드

제가 현재 사용하고 있는 웹 편집기는 상단에 표기한 비주얼 스튜디오 코드입니다.

무료이며, 윈도우와 맥에서 모두 사용이 가능하고 나름 접근성이 용이한 것 같습니다.

(다른 툴들은 못써봤습니다 유료인 것도 있고, 제가 공부한 책이 해당 프로그램을 기반으로 해서요)

 

사용하며 느낀 점은 태그나 속성에 대한 간단한 설명도 나오고, 주요 플랫폼에서(윈도우, 맥, 리눅스)에서 사용 가능하다는 부분인 것 같습니다.

 

다른 편집기는 모르겠습니다만, 편집 시작 시 자동으로 태그가 입력되는 부분도 편했습니다.

 

비주얼 스튜디오 코드 링크

code.visualstudio.com/ 

Visual Studio Code - Code Editing. Redefined

 

비쥬얼 스튜디오 코드의 기본 세팅은 따로 정리하도록 하겠습니다!