| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | ||||||
| 2 | 3 | 4 | 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 16 | 17 | 18 | 19 | 20 | 21 | 22 |
| 23 | 24 | 25 | 26 | 27 | 28 |
- 크롬마우스우클릭 #크롬마우스우클릭해제 #마우스우클릭해제 #마우스우클릭확장프로그램 #크롬확장프로그램 #마우스우클릭허용 #크롬사진퍼가기
- float의문제점
- 폰트어썸 #fontawesome #폰트어썸사용법 #폰트어썸사용하기
- 취업성공패키지 #취업성공패키지웹디자인 #취업성공패키지웹퍼블리셔 #웹퍼블리셔 #웹디자인 #국비지원웹디자인 #국비지원웹퍼블리셔
- 웹디자인기능사 #웹디자인기능사실기 #웹디자인기능사실기후기 #웹디자인기능사공부 #웹디자인기능사실기공부
- 웹디자인기능사 #웹디자인기능사실기 #웹디자인기능사3회 #웹디자인기능사합격 #웹디자인기능사후기 #웹디자인기능사실기후기 #웹디자인기능사실기합격 #디자인자격증 #국가자격증
- 유튜브핀마이크 #핀마이크 #스마트폰마이크 #핀마이크추천 #PM100 #가성비핀마이크
- 웹디자인기능사 #웹디자인기능사실기 #웹디자인기능사실기공부
- 소개팅어플
- css속성 #float속성 #clear속성
- 웹디자인기능사 #웹디자인기능사공부#웹디자인기능사실기
- css선택자 #css #선택자 #selector
- 포트폴리오사이트 #포트폴리오 #웹디자인포트폴리오
- 앤커마우스 #버티컬마우스 #앤커버티컬마우스
- 무선마우스 #앤커무선마우스 #A7852
- css그라데이션 #css
- css텍스트스타일 #text-transform
- 미디어커리 #뷰포트
- css포지션 #포지션속성 #cssposition
- vertical-align #css표스타일
- 내컴퓨터아이피 #내컴퓨터아이피확인 #아이피확인 #컴퓨터아이피 #아이피주소확인
- 인터넷익스플로러버전확인 #인터넷버전확인#인터넷버전검색#인터넷익스버전검색
- css배경 #css백그라운드
- 연봉
- 어도비XD #프로토타입 #햄버거메뉴 #슬라이딩메뉴
- 웹디자인기능사#웹디자인기능사실기#웹디자인기능사실기공부
- 직장인애환
- overflow속성
- css속성 #display속성
- 프리미어 #프리미어자동으로늘어나는글자 #프리미어글자 #프리미어자막 #프리미어자동자막 #프리미어자막넣기
- Today
- Total
블로그
코딩공부)HTML_웹표준 6일차-웹표준화 본문
웹표준화
웹표준 - 만드는 방법을 통일하자(방법론적)
웹 접근성 - 한명이라도 많은 사람들한테 동등한 정보를 얻을 수 있어야 한다(의미론적)
*웹 표준화
- 제작 방법의 통일
- 기존 제작 방식은 웹피이지 개발자마다 상이
*웹 접근성
-정보의 공유
-같은 페이지를 보고 있는 사용자들에게 같은 정보를 전달
*웹 표준화와 웹 접근성은 상당 부분 일치
*구조,표현,동작의 분리
- 구조(structure) : HTML(내용),XHTML
- 표현(presentation) : CSS
- 동작(behavior) : JAVASCRIPT
*의미 있는 콘텐츠 구성
-콘텐츠의 구조화
*콘텐츠의 논리적 구성
기존 마크업 형식
<a href="#"[html] style=""[css] onclick=""[javascript]>
l l l
html css javascript
분리되었다.
*HTML
1."<와>" 사이에 필요한 명령어(tag,element)작성
2.시작태그와 종료태그로 구성
3.종료태그가 없거나 생략 가능한 태그
-종료태그 생략 가능한 태그 : 주석,p,option....
-종료태그가 없는 태그 : br,img,meta,hr,input...
********************XHTML************************************
3.반드시 종료 선언
-종료태그가 없는 태그 : 태그 뒤에 "/"표기
ex) <br> ----------------------------------> <br />
<img src="">-------------------------> <img src="" />
-종료태그 생략 가능한 태그 : 반드시 종료태그 작성
****************************************************************
--XHTML이 호환성이좋다(이전버전이랑 같이 사용할 수 있다)
4.디버깅을 하지 않음
--디버깅 : 오류 수정,컴퓨터 프로그램의 잘못을 찾아내고 고치는 작업
5.대소문자 구분 없음
********************XHTML************************************
5.반드시 대소문자 구분
- 모든 태그와 속성은 소문자로만 작성
6.문서 상단에 반드시 DOCTYPE 선언(+) -->기본규칙
****************************************************************
XHTML = XML +HTML
*태그의 특징
<태그 속성=속성값1 속성값2 속성="속성값"....>
<tag property="value" property="value"...
<element attribute="value" attribute="value"..
1.하나의 태그에는 여러 개의 속성을 사용할 수 있지만 같은 속성을 두 번 이상 사용할 수 없음
2.하나의 속성에는 하나의 값만 사용
3.속성값에는 한글을 사용할 수 없지만 원래 이름이 한글인 경우에는 사용 가능
4.속성값에 ""생략 가능
********************XHTML************************************
4.속성값에는 ""바느시 사용
5.값이 없는 속성 사용 불가
6.표현에 관련된 요소나 속성 사용 불가
--분리
****************************************************************
--<input type="radio" name="" value="" checked="checked">
checked에 값을 넣어준다.(자기를 값으로 작성)
html4,5 : <input type="radio" checked>
xhtml1 : <input type="radio" checked="checked" /> [/앞 한칸 여백]
*표준화 페이지 기본 형식
<!DOCTYPE ~>
<html lang="ko">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>문서 제목</title>
</head>
<body>
</body>
</html>
*필수속성* 순서도 중요
DOCTYPE
lang="ko" <- 이 페이지는 한국어로 되어있음/언어의 종류
charset=utf-8 <- 글자의종류/글자를 조합하는 방법 저장도 utf-8로,ANSI로 저장 -> 깨짐
<title>문서 제목</title> <- 페이지의 제목 사이트이름,브랜드이름
가장 처음 리딩되는 콘텐츠 그 페이지의 가장 핵심이되는 키워드
서브페이지는 메뉴이름써주는게 가장좋고
메인페이지는 사이트이름을 쓰는게 좋다
'HTML' 카테고리의 다른 글
| 코딩공부)HTML_웹표준 8일차 (0) | 2019.01.06 |
|---|---|
| 코딩공부)HTML_웹표준 7일차 (0) | 2018.12.30 |
| 코딩공부)HTML_웹표준 5일차-form태그 (0) | 2018.12.23 |
| 코딩공부)HTML_웹표준 4일차 (0) | 2018.12.15 |
| 코딩공부)HTML_웹표준 3일차 (0) | 2018.12.15 |
