-
<link>와 <script>에 대해서프론트엔드/HTML 2024. 4. 5. 00:39728x90
<link>와 <script>에 대해서
HTML에서 <link>와 <script> 태그는 각각 외부 스타일 시트와 외부 자바스크립트 파일을 HTML 문서에 연결하는 데 사용됩니다. 이 두 요소를 HTML 문서의 <head> 섹션에 선언하는 것이 일반적인 관례입니다.
1. <link> 태그: 이 태그는 HTML 문서에 외부 스타일 시트를 포함시킵니다. 스타일 시트는 웹 페이지의 레이아웃, 디자인 및 스타일을 정의하는 데 사용됩니다. 따라서 이를 가능한 빨리 로드하는 것이 중요합니다. <link> 태그를 <head> 섹션에 배치하면 브라우저가 스타일 시트를 먼저 로드하고, 그 다음에 문서의 콘텐츠를 표시하여 사용자가 페이지를 더 빨리 볼 수 있게 됩니다.
2. <script> 태그: 이 태그는 HTML 문서에 자바스크립트 코드를 포함시킵니다. 자바스크립트는 웹 페이지의 동적인 기능을 담당하므로, 이 또한 빨리 로드하는 것이 중요합니다. 보통은 <script> 태그를 <head> 섹션에 배치하지만, 대부분의 경우 자바스크립트가 페이지의 내용을 변경하거나 조작하기 때문에, 페이지의 콘텐츠가 렌더링되기 전에 스크립트가 실행되어야 합니다. 이에 따라 사용자 경험을 향상시키기 위해, 일반적으로 외부 자바스크립트 파일은 페이지의 가장 아래에 <body> 요소의 직전에 배치됩니다. 이렇게 하면 페이지의 콘텐츠가 먼저 로드되고, 자바스크립트가 그 위에 동작하여 사용자가 빠르게 페이지를 볼 수 있습니다.
따라서, 외부 스타일 시트와 자바스크립트 파일을 가능한 빨리 로드하고 실행하기 위해 <link> 태그는 주로 <head> 섹션에, <script> 태그는 주로 <body> 섹션의 가장 아래에 배치됩니다.728x90'프론트엔드 > HTML' 카테고리의 다른 글
HTML - autocomplete (1) 2024.10.29 <pre>태그에 대해서, <pre>태그 줄바꿈 (0) 2024.04.15