2024.03.20 3주차 수업
HTML5 스타일은 CSS3에서 하도록 남겨줌
다양한 동적인 홈페이지로 만들 수 있게 할 수 있다.
<A 000 >
A: 태그명령어, 태그 요소 / 000: 속성(attribute)
태그 명령어는 엘리먼트(element)와 어트리뷰트(attribute)가 있음
어트리뷰트는 한개만 나올 수도 있고 여러개가 나올 수도 있음. 각 속성에 따라 다름
ex) <img src="maltese.jpg" width="150" height="160">
img src: 태그 명령어, 그 뒤의 값이 어트리뷰트
<IMG>이미지의 약자(반드시 그림이 뜨게 만들어줌)
HTML5 는 이전버전보다 모바일 웹 환경에도 맞게 적용 가능.
W3C.org 웹 페이지에 가보면 올해 추가되고 삭제된 태그명령어를 알 수 있음. 태그 명령어가 너무 많아지면 HTML6로 넘어가는 형식임.
<HTML의 등장배경 및 기술적 특징>
# HTML5의 등장배경 -> 웹 문서에서 웹 응용프로그램으로의 진화
- 웹 환경이 보편화되고 발전함에 따라 표준적인 방식으로 구현되는 웹 응용프로그램 수준을 요구하는 시대적 흐름에 의해 탄생
- 방대하게 퍼져있는 웹 문서를 의미있게 구조화하고 효율적으로 탐색, 해석 할 수 있는 웹 실현을 위한 표준
# 기술적 특징
- HTML5는 하나의 응용프로그램으로써의 면모를 갖추어 나감
- 플러그인 기술과 스크립트의 조화로 웹이 응용프로그램화 되어 왔지만 이는 표준적인 HTML 스펙을 늘어나는 기술의 복잡한 결합으로 가능
# HTML5의 필요성
- 별도의 플러그인 없이 웹에서 표준적인 방식으로 멀티미디어를 재생하고 로컬 자원을 이용하는 등의 응용프로그램 수준의 웹을 개발하기 위한 기술의 총칭
# HTML5의 주요 특징
-새로운 기술 (새로운 마크업 태그, 손쉬운 홈페이지설계 등)들에 대하여 정의함.
-부가적으로 많은 다른 새로운 기술들과 API를 나타내기 위해 사용
- 도형 등을 그리기 위한 <canvas>
- 동영상 표현을 위한 <video>
- 소리를 나타내기 위한 <audio>
-W3C를 주축으로 애플, 구글, 오페라 등 웹 브라우저 벤더가 참여하고 있는 산업 표준
단점(?)
표준이 정립되기 전까지는 두 형식에 대한 브라우저 호환성을 유지해야 하는 부담이 있다.
# 강화된 마크업 요소
- 의미를 부여 할 수 있는 구조적 마크업 요소
- 페이지 단위의 문서 구조를 표현
- 다양하고 편리한 웹 폼 입력 기능
- 편리한 사용자 인터페이스 개발을 위해 Form 기능 대폭 개선
- <input> 요소에 각종 type(date, number, color 등) 속성 추가
- 웹 미디어 기능의 강화
- 멀티미디어 및 그래픽스 관련 기능 추가
- <video> 요소와 <audio> 요소
# 시맨틱 웹(Semantic Web)
데이터의 의미를 분명히 하고 그 의미를 웹 브라우저에서 활용할 수 있도록 하자는 목적으로 만들어짐
# CSS3의 완전 지원
-스타일시트
-웹 문서의 외형 스타일을 지정하는 언어
-HTML 문서에는 일반적으로 CSS 사용
# 다양한 API 지원
-웹 애플리케이션 개발에 많은 도움을 줄 수 있는 API 제공
-자바스크립트로 구현 가능
-별도의 사양으로 분리된 API
<!DOCTYPE HTML>: 내가 HTML을 이용하여 만들겠다 하는 선언문.
head: 웹 문서상의 제목 속성을 정의하거나 할 때 사용
body: 표현하는 모든 정보들은 이 안에 넣음
# <h1> ~ <h6> 까지 있음. 숫자가 작아질수록 글씨크기는 커짐.
# 파일은 <html> 로 시작해서 </html>로 끝남.
# <IMG> 파일은 종료태그가 없음.
시작태그와 종료태그가 짝을 이뤄서 페이지를 만듬
# <p> 단락 바꿈
# 순서 상관 없음.
ex) </font> </h1> 이나 <h1> </font> 는 같은 결과가 나옴
# <br>: 줄바꿈 (<p>와는 다른 개념. p는 단락을 바꿈.)
# 위 사진들의 출처는 전응섭 교수님의 PPT를 참조했습니다.