웹 표준을 배우는 방법
클래식 포럼의 웹 표준화 버전의 많은 포럼 회원들이 이 질문을 합니다. 웹 표준을 처음 접하는 모든 사람들이 이 질문을 할 것이라고 생각합니다.
Step 1. 웹페이지 디자인에 DW나 다른 도구만 사용하지 말고, (X)HTML 언어와 CSS 언어에 익숙해지세요.
웹 표준은 코드 요구 사항을 향상시켰기 때문에 xhtml 코드에 대한 특정 이해 없이는 검사를 통과하는 것이 불가능합니다. DW 도구를 사용할 수도 있지만 웹 페이지를 작성하려면 코드를 봐야 합니다.
첫 번째는 xhtml 코드인데 코드가 많지 않고 사용법과 올바르게 작성하는 방법을 알고 태그를 닫는 것을 기억합니다. 예를 들어 <img/><br/>. 일부 html 참조 매뉴얼을 읽어보는 것이 좋습니다. 결국 xhtml은 html에서 업그레이드되었으며 많은 태그가 여전히 사용되고 있습니다.
2단계. 표준화된 선언(DOCTYPE) 생성 및 헤드
<!–(1) 과도기(Transitional)–>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!–(2) 엄격 –>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!–(3)프레임셋–>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 프레임셋//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<!–네임스페이스 설정(Namespace) lang=”zh-CN”/–>
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”zh-CN”>
<머리>
<!–인코딩 언어 선언: GB2312/UTF-8/Unicode/ISO-8859-1–>
<meta http-equiv=”콘텐츠 유형” 콘텐츠=”text/html=GB2312″ />
<meta http-equiv=”Content-Language” content=”zh-CN” />
<!–검색엔진을 위해 준비된 콘텐츠–>
<!–검색 로봇이 사이트의 모든 링크를 검색하도록 허용합니다. 특정 페이지를 검색하지 않으려면 robots.txt 방식을 사용하는 것이 좋습니다.–>
<메타 콘텐츠=”모든” 이름=”로봇” />
<!–사이트 작성자 정보 설정–>
<메타 이름=”작성자” 콘텐츠=”[email protected] ,阿杰” />
<!–사이트 저작권 정보 설정–>
<메타 이름=”저작권” 내용=”www.w3cn.org, 무료 저작권, 모든 복제” />
<!–사이트에 대한 간략한 소개(권장)–>
<meta name="description" content="새로운 웹 디자이너. 중국의 웹 표준 적용을 홍보하는 웹 표준 튜토리얼 사이트" />
<!–사이트의 키워드(권장)–>
<메타 콘텐츠=”디자인, 웹, 표준, xhtml, CSS, 그래픽, 디자인, 레이아웃, 유용성, 접근성, w3c, w3, w3cn, ajie” 이름=”키워드” />
<!–즐겨찾는 아이콘–>
<link rel=”icon” href=”/favicon.ico” type=”image/x-icon” />
<link rel=”단축 아이콘” href=”/favicon.ico” type=”image/x-icon” />
<title>웹페이지 제목</title>
<!–연결 스타일 시트–>
<link rel=”스타일시트” rev=”스타일시트” href=”css/style.css” type=”text/css” media=”all” />
<style type=”text/css” media=”all”>@import url( css/style01.css );</style>
<!–RSS–>
<link rel=”alternate” type=”application/rss+xml” title=”greengnn의 공간” href=”http://www.jluvip.com/blog/feed.asp” />
<!–JS–>
<script src=”js/common.js” type=”text/javascript” 언어=”javascript” "></script>
</head>
<몸></몸>
</html>
3단계. 웹페이지 레이아웃을 위해 CSS와 함께 div를 사용하는 방법 알아보기
표를 사용하는 대신 CSS와 함께 <div>를 사용하면 이러한 기사와 예제가 많이 있습니다. div 레이아웃의 몇 가지 이점은 다음과 같습니다.
1. 코드의 중복성이 거의 없으며 웹페이지가 빠르게 열립니다.
2. 구조와 성능이 분리됩니다. CSS를 통해서만 레이아웃을 변경할 수 있으며 정보는 변경되지 않습니다. 이를 통해 유지 관리 및 업그레이드 비용이 절감됩니다.
Step 4. 웹 표준 이론, 의미론, CSS, 구조와 표현의 분리 아이디어를 학습합니다.
웹 표준은 실제로 태그의 의미, 구조와 성능의 분리, 웹 사이트 현지화에서 국제화로의 전환, 이전 버전과의 호환성 및 장치 독립성을 달성하여 웹 페이지가 인터넷에서 원활하게 실행될 수 있도록 제안되었습니다.
이 단계에서는 이미 CSS를 사용하여 웹 페이지를 레이아웃하고 W3C 검사를 통과할 수 있는 웹 페이지를 만들 수 있습니다. 웹 표준이 무엇인지, 웹 표준의 프레임워크와 기능, 구조와 성능 분리의 아이디어와 장점을 이해할 수 있습니다. , 그리고 CSS에 대한 더 깊은 지식을 바탕으로 레이어 이론, xhtml 태그의 의미론, 선호도 이론 및 크로스 플랫폼 기능을 통해 웹 페이지를 여러 브라우저 및 장치에 적합하게 만듭니다.
Step 5. 웹 표준을 적용하여 웹 페이지를 제작하고, 자신만의 웹 표준 코드 사양을 수립하여 개발 효율성을 높입니다.