1. 태그이름은 소문자로
예)
<HTML> → <html>
<BODY> → <body>
.. 속성은 괜찮은건가?
2. Empty 태그 끝에는 공백/>
<area> <base> <basefont> <br> <col> <frame> <hr> <img> <input> <param> <isindex> <link> <meta> 등등
3. img 태그에는 alt="" 를 반드시 넣자
4. 속성값은 "" 따옴표 안에 넣자.
예)
<img src="b.gif" width="84" height="18" border="0" alt=" " />
5. DOCTYPE 과 ENCODING 을 적어주자.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr" />
<title>homepage</title>
..
6. 스타일에 사용하는 숫자값에는 단위를 넣어주세요.
웹표준 준수
XHTML 1.x 나 HTML 4.x 표준에 맞춘 문서는 99% 접근성이 좋은 사이트들이다.
table 레이아웃 --> div
font, b --> CSS
html 코드는 반으로 코딩과 유지보수 효율성은 2배로~
구조/표현/동작(양식)을 분리
구조 (Structure) - HTML, XHTML
표현 (Presentation) - CSS
동작 (Behavior) - DOM, ECMAScript, 서버 측 개발
최소한의 디버깅
구조 (Structure) - HTML, XHTML - http://validator.w3.org
표현 (Presentation) - CSS - http://jigsaw.w3.org/css-validator/
동작 (Behavior) - DOM, ECMAScript - Mozilla Firefox 의 자바스크립트 디버거
효율적인 웹 개발 방법론
기획 -> 디자인 -> 개발
컨베이어 벨트에 놓인 물건 같이 완성품을 만들어가는 것이 아니라
구조, 표현, 양식을 나누어 공동으로 작업
출처 : http://cafe.naver.com/w3design.cafe
출처 : http://cafe.naver.com/w3design.cafe
