[HTML] Metadata 삽입

정은아·2022년 9월 13일
0
HTML META DATA 삽입

메타데이타란 데이터를 설명하는 데이터이다.
예를 들어 사진의 경우 찍는 장소와 시간데이터가 메타 데이터이고, 
WAV, MP3인 오디오인 경우 재생시간, 채널수가 메타 데이터이고, 
JPEG, BMP등 이미지파일의 경우 이미지 폭과 높이, 컬러 해상도 정보가 메타 데이터이다.

HTML에서도 다양한 메타데이터를 가지고 있다.
<base>, <link>, <script>, <style>, <title>, <meta> 등이 HTML페이지에
대한 메타 정보를 표현한다.

<meta> 태그는 웹페이지의 제작자, 문자 인코딩, 문서내용 등
다양한 메타 데이터를 표현하기 위해 사용된다.
메타 데이터는 name과 content의 속성 쌍으로 구성된다.

meta charset="UTF-8" 은 charset 속성으로 웹페이지에
사용된 문자의 인코딩 방식을 지정한다.

HTML5 에서는 UTP-8이 디폴트 이므로 이 meta 태그는 생략해도되지만
다양한 브라우저 환경에서 UTF-8로 처리하기 위해서는 적어두는 것이 좋다.



DL 태그 : 용어에 대한 정의목록을 만드는 형식이다.
-dt : definition term의 약자로 용어의 제목을 나타내는 태그이다. 줄바꿈기능이있다.
-dd : definition description 의 약자로 용어에 대한 설명을 나타내는 태그이다. 줄바꿈기능이있다.



TABLE 표만들기

제목 <caption>    1학기 성적
헤드 <thead>      이름        HTML    CSS
바디 <tbody>      수선화      89      86
                  백일홍      68      74
                  들국화      79      89
바닥 <tfoot>      합          445     345

<table>          표전체를 담는 컨테이너
<caption>        표 제목(반드시 table태그의 첫번째 기술)
<thead>          해당 셀 그룹
<tfoot>          바닥 셀 그룹
<tbody>          데이터 셀 그룹
<tr>             행, 여러개의 TD  TH포함
<th>             제목(head) 셀
<td>             데이터셀

<caption> <thead> <tbody> <tfoot> 태그를 사용하지 않고
<tr> <td> 태그로만 테이블표를 만드는 경우가 있는데 이는 바람직하지 않다.
검색엔진은 표의 의미(시멘틱)을 파악하기 위해 <caption> <thead> <tbody> 
<tfoot>태그를 찾기때문.

시멘틱 웹(Sementic Web)은 "의미론적인 웹" 이라는 뜻으로,
현재의 인터넷과 같은 분산환경에서 리소스(웹문서, 각종파일, 서비스 등)에 대한 
정보와 자원사이의 관계-의미정보(Sementic)를 기계(컴퓨터)가 
처리할 수 있는 온톨로지 형태로 표현하고,
이를 자동화된 기계(컴퓨터)가 처리하도록 하는 프레임워크이자 기술이다.
웹의 창시자인 팀 버너스리가 1998년 제안했고, 현재 W3C에 의해 
표준화 작업이 진행중이다

온톨로지(Ontology)는 시멘틱웹을 구현할 수 있는 도구로서 
여러 지식개념들을 의미적으로 서로 연결할 수 있는 도구이다.
웹정보검색은 웹을 통해 접근할 수있는 모든 전자자원을 대상으로 하는 
검색을 가능하게 하였다.
어떤 단어와 단어 사이의 상관관계를 보다 빠르고 편하게 검색할 수 있도록 
돕는 연구 분야를 의미한다.



table속성 : 테이블의 디자인을 바꿀 수 있는 방법은 다양한 방법이 있다.

1. border속성은 테이블의 테두리를 설정해주는 속성이다.
ex. (border="1px") 숫자가 높을수록 테두리가 두꺼워진다.

2. bordercolor는 테두리의 색상을 지정하는 속성이다.
ex. (bordercolor="blue") default 값은 검정색이다.

3. width와 height는 테이블의 크기를 결정해주는 속성이다.
ex.(width="50px" width="100%") 픽셀단위, % 단위로 크기비율을 줄 수 있다.

4. align은 테이블안에 있는 값들을 정렬시키는 기능을 한다.

5. bgcolor 속성으로 원하는 태그의 배경색을 지정해줄 수 있다.

6. colspan, rowspan은 셀을 합병(행, 열)시키는 기능을 한다.

profile
꾸준함의 가치를 믿는 개발자

0개의 댓글