본문 바로가기

제로베이스_정리

메타데이터의 역할 <head>

metadata

-데이터를 설명하는 데이터 (데이터를 위한 데이터)

-ex. 책 앞부분에 저자, 발행일, 출판사와 같은 정보들. 책이란 데이터를 설명하는 책 앞부분 데이터 

-html 데이터를 설명하는 데이터를 뜻함, 걔네가 head로 들어감 


<title> 문서 제목 요소 

-브라우저의 제목 표시줄이나 페이지 탭에 보이는 문서 제목을 정의 

-1 head 에 1 title

<title>에 Document 로 되어 있어 위에 Document 라고 뜨게 됨 

수정도 가능 ㅎㅎㅎㅎㅎ

즐겨찾기를 해도 그 이름에 <title>에 쓰여진 이름이 들어감 

타이틀을 지을 때에 이 페이지인지 식별 가능하게 해주는것이 좋음! 

 

나와 비슷한 페이지가 있더라도 타이틀을 잘 짓는 웹페이지가 상위 노출 됨.

명사로만 니열하지 읺는 것이 좋음- 검색엔진이 설명하지 않고 광고 페이지로 인식을 하는 경우가 많음.

 


<meta> 문서 레벨 메타데이터요소 

<meta charset="UTF-8">

 

문자 인코딩 UTF-8 

이 웹 페이지를 전 세계 모든 언어를 수용 할 수있도록 해줌. 

 

뷰 포트

 <meta name="viewport" content="width=device-width, initial-scale=1.0">

 

보여지는 화면 / PC 와 휴대폰에 보여지는 것이 다름 

 

*width=device-width : 접속하는 기기의 가로 너비를 맞춰라 (width를 작성하면 height가 따라오는 경우가 많기 떄문에 굳이 작성 안해도 됨. )

*initial-scale : 접속하는 기기의 너비와 뷰포트 너비의 비율을 정의 

*user-scalable : yes 일 경우에는 확대를 할 수 있고 no 는 확대를 하지 못함. 

  -maximum-scale: 가능한 최대 확대 비율

  -minimum-sclale: 가능한 최소 축소 비율 


<link> 외부 리소스 연결 요소 

현재 문서와 외부 리소스의 관계를 명시 

-css와 연결 할때 제일 많이 사용 

-사이트아이콘 (파비콘) 연결 

 

 

<link rel="icon" href="favicon.ico" />

      파비콘 연결 


MIME 타입 

비디오나 오디오를 link 태그를 통해 불러 들어올 때 어떤 타입의 형태인지 명시해주는것 (ex. type="text/css")

찾아 쓰는 경우가 많음  mime type mdn 

 

 


<style> 스타일 정보 요소 

css 문법을 사용해서 스타일을 적용하기 위함

 

- <style> 요소는 문서의 <head> 안에 위치해야 한다. 

- 일반적으로 스타일은 외부 스타일 시트에 작성하고 <link> 요소로 연결하는 것이 좋다. 


<script> 스크립트 요소 

-css처럼 인라인으로 스크립트 작성할수 있게끔, 또는 외부의 스크립트 파일을 불러올 수도 있음 

-보통 Javascrip 코드와 함께 씀

-<body>의 가장 마지막에 쓰는것을 권장 

 

<script src="javascript.js"></script>

외부의 스크립트를 불러옴

 

<script>
  alert("Hello World!");
</script>

<script> 요소 내부에 인라인 스크립트를 작성 

'제로베이스_정리' 카테고리의 다른 글

CSS ( Cascading Style Sheets)  (0) 2024.04.14
전역속성  (0) 2024.04.12
Form 관련 요소  (0) 2024.04.09
임베디드요소  (0) 2024.03.19
목록과 표  (0) 2024.03.19