웹 표준을 처음 접하는 분들이라면 누구나 이런 질문을 하실 거라 생각하는데, 제 경험을 바탕으로 정리해보겠습니다.
Step 1. 웹페이지 디자인에 DW나 다른 도구만 사용하지 말고, (X)HTML 언어와 CSS 언어에 익숙해지세요.
웹 표준은 코드 요구 사항을 향상시켰기 때문에 xhtml 코드에 대한 특정 이해 없이는 검사를 통과하는 것이 불가능합니다. DW 도구를 사용할 수도 있지만 웹 페이지를 작성하려면 코드를 봐야 합니다.
첫 번째는 xhtml 코드인데 코드가 많지 않고 사용법과 올바르게 작성하는 방법을 알고 태그를 닫는 것을 기억합니다. 예를 들어 <img/><br/>. 일부 html 참조 매뉴얼을 읽어보는 것이 좋습니다. 결국 xhtml은 html에서 업그레이드되었으며 많은 태그가 여전히 사용되고 있습니다.
Step 2. 표준화된 선언문(DOCTYPE) 수립 및 머리
예전에는 웹페이지, 심지어 대형포털에도 선언문이 없었고 <html>만 있었습니다. 이제 웹페이지에 선언문을 추가하고, 헤드 영역을 표준화하고, 검색엔진을 여러분처럼 만들어 주면 됩니다. 웹사이트.
추천 작성 방법
<!--(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="Content-Type" content="text/html; charset=GB2312" />
<meta http-equiv="Content-Language" content="zh-CN" />
<!--검색 엔진을 위해 준비된 콘텐츠-->
<!--검색 로봇이 사이트의 모든 링크를 검색하도록 허용합니다. 특정 페이지를 검색하지 않으려면 robots.txt 방식을 사용하는 것이 좋습니다 -->
<meta content="all" name="로봇" />
<!--사이트 작성자 정보 설정-->
<meta name="author" content="이메일,이름" />
<!--사이트 저작권 정보 설정-->
<meta name="Copyright" content="웹사이트 저작권 설명" />
<!--사이트에 대한 간략한 소개(권장)-->
<meta name="description" content="새로운 웹 디자이너. 중국의 웹 표준 적용을 홍보하는 웹 표준 튜토리얼 사이트" />
<!--사이트 키워드(권장)-->
<meta content="디자인, with, 웹, 표준, xhtml, css, 그래픽, 디자인, 레이아웃, 유용성, 접근성, w3c, w3, w3cn, ajie" name="keywords" />
<!--즐겨찾는 아이콘-->
<link rel="icon" href="/favicon.ico" type="image/x-icon" />
<link rel="단축 아이콘" href="/favicon.ico" type="image/x-icon" />
<title>웹페이지 제목</title>
<!--스타일 시트 연결-->
<link rel="stylesheet" rev="stylesheet" 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.*.com/feed.asp" />
<!--JS-->
<script src="js/common.js" type="text/javascript" 언어="javascript" "></script>
</head>
<본문>
</body>
</html>
3단계. 웹페이지 레이아웃을 위해 CSS와 함께 div를 사용하는 방법 알아보기
표를 사용하는 대신 CSS와 함께 <div>를 사용하면 이러한 기사와 예제가 많이 있습니다. div 레이아웃의 몇 가지 이점은 다음과 같습니다.
1. 코드 중복이 적고 웹페이지가 빠르게 열립니다.
2. 구조와 성능이 분리됩니다. CSS를 통해서만 레이아웃을 변경할 수 있으며 정보는 변경되지 않습니다. 이를 통해 유지 관리 및 업그레이드 비용이 절감됩니다.
Step 4. 웹 표준 이론, 의미론, CSS, 구조와 표현의 분리 아이디어를 학습합니다.
웹 표준은 실제로 태그의 의미, 구조와 성능의 분리, 웹 사이트 현지화에서 국제화로의 전환, 이전 버전과의 호환성 및 장치 독립성을 달성하여 웹 페이지가 인터넷에서 원활하게 실행될 수 있도록 제안되었습니다.
이 단계에서는 이미 CSS를 사용하여 웹 페이지를 레이아웃하고 W3C 검사를 통과할 수 있는 웹 페이지를 만들 수 있습니다. 웹 표준이 무엇인지, 웹 표준의 프레임워크와 기능, 구조와 성능 분리의 아이디어와 장점을 이해할 수 있습니다. , 그리고 CSS에 대한 더 깊은 지식을 바탕으로 레이어 이론, xhtml 태그의 의미론, 선호도 이론 및 크로스 플랫폼 기능을 통해 웹 페이지를 여러 브라우저 및 장치에 적합하게 만듭니다.
Step 5. 웹 표준을 적용하여 웹 페이지를 제작하고, 자신만의 웹 표준 코드 사양을 수립하여 개발 효율성을 높입니다.
웹 표준은 여전히 추진되고 있으며 성숙한 모델은 없습니다. 결국 손으로 작성한 코드가 필요합니다. 이때 일반적으로 사용되는 코드 조각을 언급하면 개발 효율성을 향상시킬 수 있는 몇 가지 방법을 제안할 수 있습니다. 및 사용자 정의 CSS. 및 일부 재사용 가능한 기능 모듈이 코드 클립으로 만들어져 코드의 재사용성을 향상시킵니다!