오늘은 HTML로 웹 사이트에 제목을 넣는 법을 알려드리겠습니다.
여러분들은 제목이 뭐라고 생각하시나요?
많은 사람들이 이렇게 말할겁니다. 제목은 글의 내용을 짧게 서술하는 글 이라고 생각할겁니다.
그럼 많은 사람들이 구글이나, 네이버 등 다양한 검색엔진을 통해 웹 페이지에 접근할 겁니다.
그럼 구글이나, 네이버 같은 검색엔진들은 웹 페이지의 내용을 어떻게 알 수 있을까요?
자세히는 잘 모르지만, 제목을 통해 또는 글 안에 내용을 통해 웹 페이지의 내용을 알 수 있습니다.
검색엔진에서 검색한 내용과, 제목이나, 글 안에 내용을 통해 관련있는 웹 페이지를 찾아주는 겁니다.
그러므로 웹 페이지를 만들려면 제목이 있어야지, 검색엔진이 자신의 웹 페이지를 추천 웹 페이지에 올려주겠죠?
그러므로 웹 사이트에 제목을 넣는것은 가장 중요합니다.
한 마디로 정리하자면 '사이트의 주제'를 알기 쉽게 작성해서 검색 엔진과 사용자가 정보를 제대로 알 수 있도록 제목을 작성해 주어야 합니다.
그럼 웹 사이트의 주제를 알기 쉽게 하기 위해서 제목을 작성할 수 있는 방법에 대해 알아보도록 하겠습니다.
제목은 어떻게 작성하냐면, <h1> 태그를 사용합니다.
h1 태그는 h1~h6 까지 총 6개로 구성되어 있습니다.
h1 태그에서 h6 태그로 갈 수록, 글씨의 크기가 줄어듭니다.
한 번 비교해보도록 하겠습니다.
이렇게 h1 태그에서 h6 태그로 갈 수록 글씨의 크기가 줄어듭니다.
그리고 h1~h6 태그는 한 줄을 다 차지합니다.
원래는 글을 작성하면
이렇게 한 줄로 쭉 이어져있는것을 알 수 있습니다.
안녕하세요. 오늘은 HTML을 이용하여 글을 써 보도록 하겠습니다.
Hello. Today we are going to write an article using HTML.▲ 일반 글 예시 HTML 코드
줄바꿈이 되어있는 되어도 말이죠.
신기하지 않나요? 여기서 또 태그를 알려드려야 할 것 같습니다.
HTML에서 Enter을 눌러서 줄바꿈이 되어도, 웹 브라우저에선 그렇게 표현되지 않는다는것이죠.
그렇다면 HTML에서 Enter을 누르지 않아도 줄바꿈이 되게 할 수 있는 태그를 알아보겠습니다.
이렇게 br, p, pre 태그가 있습니다.
br 태그부터 설명을 이어가도록 하겠습니다.
br 태그는 'break'의 약자로 부수다의 뜻을 가집니다.
br 태그는 HTML에서 줄 바꿈을 할 때 사용됩니다.
첫번째줄 글<br>두번째 글이 태그의 사용법은 위와 같이 글과 글 사이에 br 태그를 사용하여 줄 바꿈을 사용합니다.
여기서 신기한 걸 알 수 있습니다. 이 태그는 </br> 태그라고 이렇게 닫히는 태그가 없다고 할 수 있습니다.
그래서 간단하게 br 태그 한 번만 사용할 수 있어 간단하게 사용할 수 있습니다.
단점을 글과 글을 선택해주기 어렵다는 것입니다.
그 다음 p 태그가 있습니다. p 태그는 'paragraph'의 약자로 단락이라는 뜻을 가지고 있습니다.
p 태그는 HTML에서 문단을 표현할 때 사용합니다.
<p>첫번째 문단</p><p>두번째 문단</p>이 p 태그의 사용법은 br 태그와 다르게 열고 닫는 태그가 있습니다.
첫 번째 문단을 표시하려면 p 태그를 열고 /p 태그로 닫아주시면 됩니다.
이 태그는 열고 닫아야 되서, br 태그보단 어렵긴 하지만, 글과 글을 선택해 줄 수 있습니다.
뭐 p 태그에 글씨체를 바꿔줄 수도 있고, 나중에 배울 CSS로 효과를 줄 수 있습니다.
이 태그는 Enter 효과 줄 바꾸기가 아니라서 줄 바꿈이 필요하다면 br 태그를 사용하시기 바랍니다.
마지막으로 pre 태그가 있습니다.
pre 태그는 'preformatted'의 약자로 미리 포멧된이라는 뜻을 가지고 있습니다.
pre 태그는 HTML에서 편집할 때 사용한 Enter와 스페이스가 웹 페이지에 그대로 작성됩니다.
<pre>
안녕하세요. 오늘은 HTML을 이용하여 글을 써 보도록 하겠습니다.
Hello. Today we are going to write an article using HTML.
</pre>이 태그의 사용법은 p 태그와 같이 열고 닫는 태그가 존재합니다.
pre 태그를 열고 /pre 태그로 닫아주시면 됩니다.
p 태그와 같이 글과 글을 선택해 줄 수 있습니다.
이 태그의 장접은 Enter 효과와 스페이스 효과가 편집한 그대로 웹 페이지에 그대로 표현되기 때문입니다.
지금까지 읽어주셔서 감사합니다.
지금까지 웹 사이트에 제목 넣는 방법이였습니다.