웹 크롤링을 하려면 html 태그를 알고 있어야 한다.
html은 예전에 분명히 살짝 공부해봤는데
몇년 동안 상관없이 살았더니 거의 다 까먹었다.
이번 주말동안 아주 기초적인 수준이지만
그래 이 태그가 이런 뜻이었지!! 하며 되짚어보았다.
다음에 또 까먹지 않도록 정리!!
멘토님이 올려주신 생활코딩 영상을 보고 공부했다.
https://www.youtube.com/watch?v=tZooW6PritE&list=PLuHgQVnccGMDZP7FJ_ZsUrdCGH68ppvPb
일단 이 재생목록 15번까지 보면서 HTML부분을 학습했다.
이 분 동영상은 코딩공부하면서 공부법 꿀팁까지 얻어가는 거 같아서 재밌게 보고 구독때렸다.
생활코딩 HTML 정리
코딩 공부 웹사이트를 만드는 것으로 배워보는 HTML.
강의에서 HTML 에디터는 ATOM을 사용했다.
좋은 에디터를 찾는 꿀팁은 구글에 "best 000(코딩언어) Editor 2022" 요렇게 검색하는 것!
파일 확장자는.html이다.
HTML 태그
https://www.advancedwebranking.com/seo/html-study/
HTML Study
Overview This HTML usage data comes from 11.3 million index pages gathered from top twenty Google results, for about 30 million keywords - chosen by keyword volume. To learn more about this data, visit the FAQ section. Total 11,264,652 pages Doctype The
www.advancedwebranking.com
출처에 의하면, 대부분의 웹페이지는 평균 26~27개의 태그로 구성된다.
전체 html태그는 약 150개정도라고 하는데,
그 중 자주 사용되는 것만 알아도, 실제 웹페이지 구현이 충분히 가능하다.
가장 자주 사용되는 태그 32개는 아래와 같다.
가장 자주 사용 되는 HTML태그
순서는 강의에서 나온 순
| tag | 설명 |
| <strong> | 볼드체 |
| <h1><h2>... <h6> | 제목 (크기별로 1~6까지 설정가능) |
| <br> | 줄 바꿈 |
| <p> | 문단 (단락) <br>태그 대신에 <p>태그를 이용해야 하는 이유는? 텍스트에 이것이 한 문단이오 라는 정보를 부여한다. |
| <img> | 이미지 <img src = "주소">의 형태로 사용 |
| <li> | 리스트(목차) <li>와 <ol>,<ul>은 자식-부모 태그로 함께 다닌다. 리스트의 어디부터 어디까지가 한 카테고리인지 <ol>,<ul> 태그로 나타내 줄 수 있다. |
<ol> |
숫자를 붙인 목차(ordered list) |
| <ul> | 순서 상관없는 목차(unordered list) |
| <title> | 웹페이지의 제목 검색 엔진에 노출되는 이름으로 중요도가 높다 |
| <head> | 모든 html문서에 무조건 들어가는 태그 3인방으로 아래와 같이 쓰인다. 다른 모든 태그가 <head>나 <body>안에 포함된다 <html> <head> </head> <body> </body> </html> |
| <body> | |
| <html> | |
| <meta> | <meta charset = "utf-8"> 문서의 정보를 담는 태그로 utf-8이라는 형식을 사용하고 있다는 뜻이다. |
| *<a> | anchor의 a로, 가장 중요한 태그!! 링크 기능을 이용할 수있다. <a href = "">내용</a>의 형태로 사용된다. |
강의에선 안다뤘지만 자주 보여서 궁금했던 코드들
HTML <div> 태그 - ofcourse
개요 태그는 Division의 약자로, 레이아웃을 나누는데 주로 쓰입니다. 다른 태그와 다르게 특별한 기능을 갖고 있지는 않고, 가상의 레이아웃을 설계하는데 쓰이며, 주로 CSS와 연동하여 쓰입니다.
ofcourse.kr
HTML <span> 태그 - ofcourse
개요 태그는 태그처럼 특별한 기능을 갖고있지 않고, CSS와 함께 쓰입니다. 태그와의 차이점은 display속성이 block이 아닌, inline이라는 점인데, 이는 CSS display 항목에서 세부 정보를 알 수 있습니다.
ofcourse.kr
<div>와 <span>은 어떤 기능이 있다기 보다는 웹페이지의 일정한 구역, 영역을 잡아서 CSS 태그를 써서 꾸며줄때 쓰는 코드라고 이해했다.
참고한 사이트에 의하면 <div>는 줄 바꿈이 되지만, <span>은 줄 바꿈이 되지 않는다고 한다.
태그안에 [class = "~" style = "~"]은 무엇인가?
태그의 속성이다.
속성을 쓰는 순서는 영향을 미치지 않는다.
https://ofcourse.kr/html-course/태그의-속성#id-class-속성
HTML 태그의 속성 - ofcourse
개요 태그는, 태그 내부에 값을 넣을 수 있을 뿐만 아니라, 태그마다 속성을 부여할 수 있습니다. 태그의 속성은 <태그 속성="값"> 의 형태로 사용하며, 태그마다 여러 속성을 부여 할 수도 있습니
ofcourse.kr
html을 안다고 생각했는데 정리하다보니 아직도 모르는게 많다. 역시 나는 코딩의 신생아였다.
코린이도 아니다....
바닥부터 쌓아올라가봐야지 아자!
