HTML - HyperText Markup Language
HTML은 무엇인가.
=> Language의 개념. 결론부터 말하자면 웹페이지를 구성하기 위해서 작성하는 컴퓨터 언어이다. 쉽게 말해 개발자가 의도하는 대로 웹브라우저가 읽어들여 웹페이지를 구성할 수 있도록 하는 일종의 명령어인셈이다. 따라서 웹페이지를 만들기 위해서는 필수적으로 알아야 한다. HTML는 1980년대쯤? 처음 만들어졌다고 하는데 일반인들에게는 1990년대에 공개된 것으로 알고 있다. 자세한 history는 모르니까 ->위키피디아 참고. (https://ko.wikipedia.org/wiki/HTML)
그래서 HTML은 무엇이 중요할까.
바로 'Information(정보)'이다. 웹 페이지에서 HTML이 가지고 있는 것은 바로 정보이다. 그리고 그 정보들을 user(사용자)들이 보기 쉽게 나타내는 것이 또 다른 언어인 CSS이다. (CSS는 추후 다시 정리)
그러니 우리는 HTML 코드를 작성할 때 웹페이지에 담고 싶은 정보에 초점을 맞추어 어떻게 하면 이 정보를 잘 전달할 수 있는지에 대해 고민하면 되는 것이다.
HTML의 개발도구는
현재 Visual Studio Code와 Chrome을 사용한다. 처음에는 메모장 키고 연습하다가 vscode로 넘어가니까 세상 편함을 느낀다..개발자로서 코드, 업무의 효율성을 높이기 위해서 적절한 개발도구를 익히고 사용할 필요가 있다고 들었다. 다른 편리한 개발도구도 차츰 익혀나가자.
처음 배운 것은, TAG(태그)
<a>, <p>, <meta>, <div>, <li>, <nav>... 등 꺾은 괄호로 묶어서 사용하는 태그.
HTML에서 태그가 가장 중요하다고 들었는데, 모두 암기할 필요는 없다. 지식은 언제나 변하고 시간이 지나면 사용하지 않는 태그들도 나타나기 때문에 꼭 필요한 태그들은 알아두고 모르는 게 나오면 그때 그때 검색해서 사용하기.
태그(tag)
[간단 정리]
tr : table row
rowspan : 행병합 / colspan : 열병합
form : 폼을 이용해 데이터를 전송하면 거의 백프로 post 방식으로 데이터 전송
( cf. get은 url을 통해 데이터 전송 )
radio button : 단일선택, 이름이 같은 것끼리 그룹핑 해줌
check box : 다중선택
input : 데이터 입력받기
meta : 웹 페이지의 내용은 아니지만 웹 페이지에 대해 부가적으로 설명하는 역할을 한다.
e.g.) <meta charset="utf-8">
웹 페이지가 정보로서 더 가치 있도록 만들어 주는 역할을 한다.
semantic : 실질적으로 정보를 담는 것이 아니라 의미론적으로만 기능한다.
즉, html의 정보들이 정보로서 가치있게 의미만을 가진다. header(상단부), footer(하단부), article(본문), section(그 이외의 것들) html의 정보들을 세분화하여 구분하는 느낌이다.
속성 (attribute)
태그의 불충분한 기능을 보완해주는 역할을 한다. 태그마다 속성을 여럿 할당할 수 있다.
'Engineering > etc.' 카테고리의 다른 글
프론트엔드 테스트 Mock 목 활용하기 (0) | 2024.10.23 |
---|---|
px, em, rem 차이를 알아보자 (2) | 2022.12.18 |
0316_Web page를 꾸미는 역할, CSS (0) | 2020.03.16 |