Title, Link, Style & Script

title 태그

<title>김버그의 버그없는 HTML과 CSS</title>

• title 태그 : 브라우저 탭에 보여지는 html 문서의 대제목
• 검색 최적화에 굉장히 지대한 영향을 미친다.
• title 잘 쓰는 방법 : 키워드 단순 나열은 비추 / 페이지마다 그에 맞게 변경 / 무엇에 관한 내용인지 센스있게~

---

link 태그

<link rel="stylesheet" href="./styles.css">

• link 태그 : CSS 스타일시트를 첨부하는 태그이다.
  • link:css + Tab 키 누르면 자동으로 완성이 된다!!

---

style 태그

	<style>
        h1 {
            color: red;
        }
    </style>

• style 태그 : HTML 문서 내에 CSS 코드를 작성할 때 사용한다.
  • 하지만 사용하는 걸 굉장히 비추한다고 하신다!!

---

script 태그

<h1>kimbug</h1>
<script src="./app.js"></script>
<script>
        var h1 = document.querySelector('h1');
        h1.addEventListener('click', function(event) {
            this.textContent = 'hi';
        })
    </script>

• script 태그 : HTML 문서 내에 JavaScript 파일을 첨부할 때 사용한다.
  • body 안에 작성하는 이유 : 다 로드될 때까지 기다리기 때문에 굉장히 비효율적인 렌더링이 되버린다. 따라서 body 태그 내에서도 마지막에 작성하는 게 좋다.