페이지상단으로이동

프론트엔드의 시작, HTML

    • 최유진 기자
    • |
    • 입력 2021-01-11 15:39
    • |
    • 수정 2021-01-12 16:29

HTML이란?
HTML은 웹페이지를 만드는 컴퓨터 언어이며, 사용하기 쉽고 중요한 역할을 맡고 있습니다.

웹 개발을 이끌어낸 팀 버너스리는 웹을 어떠한 저작권도 존재하지 않는 완전한 자유를 의미하는 퍼블릭 도메인으로 선언하였습니다. 이 덕분에 우리가 만든 웹 페이지를 여러 브라우저에서 똑같이 볼 수 있게 되었습니다.

HTML의 기본 문법
HTML은 TAG를 기본 문법으로 사용합니다. 이때 사용되는 TAG의 종류는 다양합니다. 또한, 열린 태그와 닫힌 태그로 구성되는 것이 일반적인데요. 그 중 대표적인 것들만 몇 가지 살펴보자면, 아래와 같습니다.

~ 은 문자를 진하게 표시하는 태그를 의미합니다.

~ 는 문자 밑에 밑줄을 표시하는 태그를 의미합니다.


은 열림 태그만 존재하며, 시각적 의미로 줄바꿈을 나타내는 태그입니다.

~

는 단락을 나누는 태그로, 단락을 의미론적으로 표현합니다. 단락은 웹페이지를 정보로써보다 가치 있게 만들기 때문에 중요합니다. 정해져 있는 여백만큼 떨어져 있기 때문에, 시각적 자유도는 조금 떨어지는 편입니다.

HTML 파일을 작성하는 데 사용한 한글이 깨지는 경우도 종종 발생할 수 있습니다. 이를 해결하기 위해서는 이라고 작성해주어야 합니다. 이는 파일을 UTF-8로 저장하고, 그걸 브라우저에 알려주는 코드입니다.

Advanced WEB Ranking

위의 사이트에 들어가보게 되면 HTML 태그에 대한 통계자료를 확인해볼 수 있습니다. 25~26개의 태그를 가진 웹페이지가 가장 많으며,

태그가 가장 많은 빈도수를 가진 태그인 점을 확인할 수 있습니다.

웹의 핵심 철학은 접근성입니다. 왜냐하면 모든 운영체제에서 동작해야 하고, 소스코드는 누구나 볼 수 있어야 하며, 저작권이 없는 순수한 공공재로써 웹을 다른 기술들과 구별되는 특별한 기술로 만드는 것이기 때문입니다.

HTML은 비즈니스적 측면에서 중요할 뿐만 아니라 휴머니즘적 측면에서도 매우 중요한 기술입니다.

HTML의 속성
는 웹 페이지에 이미지를 포함시킬 때 사용합니다. 아무것도 표시하지 않고, 태그의 이름만으로는 정보가 부족할 때가 있습니다. 와 같이 사용할 수 있습니다. 여기서 속성은 위치는 상관이 없고, 그림 사이즈를 정의할 수도 있습니다.

은 최상위 태그를 의미합니다.

~

은 웹페이지 제목을 사용자에게 명시적으로 알려줍니다.

은 utf-8로 문서를 읽으라는 지시를 합니다.

~

는 본문을 의미합니다.

~ 는 링크를 표현합니다.

최유진 기자

댓글 [ 0 ]
댓글 서비스는 로그인 이후 사용가능합니다.
댓글등록
취소
  • 최신순
닫기

뉴스레터 구독하기

세상을 바꾸고 있는 블록체인과 IT 관련 이야기를 쉽고 재미있게 만나보세요.

개인정보 수집 및 이용

뉴스레터 발송을 위한 최소한의 개인정보를 수집하고 이용합니다. 수집된 정보는 발송 외 다른 목적으로 이용되지 않으며, 서비스가 종료되거나 구독을 해지할 경우 즉시 파기됩니다.