Rev. 2.73

이거 완전 대공사로군요. 아래에 지정한 표기규칙에 따라 태터툴즈를 손보았고, 기존에 입력했던 글, 댓글, 트랙백, 키워드 부분에 찾아 바꿔치기(Search and Replace) 가능한 부분은 모두 시도하였지만, <font>태그를 사용한 이녀석은 정말 문제입니다. 딱히 법칙이 있는 것도아니고, </font> 태그를 일괄처리하게 되면 난리가 예상되고 말이죠, 유효성 검사에 걸리지는 않지만 조금 찝찝 하네요. 폰트속성 변경은 수작업이 불가피하겠군요.

- 속성값은 반드시 "표로 시작해서 "표로 끝낸다.
- 속성값은 '표 보다는 "표를 사용하자
- URL에 사용되는 '&'는 모두 '&amp;'를 사용한다.
- URL에 한글이 들어있는 경우 유니코드로 표기한다.
- <img> 태그는 반드시 마지막에 "/"을 사용한다.
- <img> 태그는 반드시 alt="설명"을 사용한다. 설명이 없을 경우 ""를 쓰면된다.
- <br> 태그 또한 마지막에 /을 사용한다.(사용을 줄인다.)
예) <br />
- <a rel="tag">는 해당포스트의 태그에만 사용한다.(태그리스트 랜덤태그에 사용금지)
- <h3>로 시작되는 태그에는 굵게표시가 기본이다. font-weight:bold;를 중복으로 사용할 필요가 없다.
- <font="모양">태그를 사용하지 않는다.
- <... style> 픽셀단위로 조정되는 모든 속성에는 px를 붙여준다. 단 속성값이 0인경우 px를 생략가능
예) padding:15px 0 10px 0;
- class 속성은 중복으로 사용할 수 있다. 단 id속성은 중복으로 사용할 수 없다.
예) class="ib text", id="text"
- 리스트 항목에는 ol 또는 ul을 사용하여 작성한다.
- <div id="해더/컨텐츠/푸터"> 구조에 따른 레이아웃 구성
- <b>태그를 <strong>로 사용한다.(레이아웃에는 사용을 줄이고 스타일시트로 대체)
- <s>태그를 <del>로 사용한다.(레이아웃에는 사용을 줄이고 스타일스시로 대체)
- <u>태그를 <ins>로 사용한다.(레이아웃에는 사용을 줄이고 스타일시트로 대체)
- <center>태그를 <div align="center">로 사용한다.(레이아웃에는 사용을 줄이고 스타일시트로 대체)
- 폰트 크기 조정을 위해 <big>텍스트</big>와 <small>텍스트</small>를 사용한다.
- 미디어를 붙이기 위해 <embed> 태그보다는 <object> 태그를 사용한다.

참고 : HTML 4.01 Reference

HTML4.01 레퍼런스를 위한 태터툴즈에 수정작업 목록
- name="weblog"를 id="weblog"로 변경, 그에 따른 댓글 및 방명록 일부 스크립트 수정
- 글, 댓글, 트랙백, 키워드에 "&" 문자 입력시 "&amp;"로 저장시키기
- 글 입력 페이지 위에서 제시한 표기규칙에 어긋나는 입력도구 바꾸기
- 이미지 및 미디어 출력시 위에서 제시한 표기규칙에 어긋나는 코드 바꾸기
- 기존에 잘못 입력한 포스트의 리플레이서 만들기

Comments

Got something to add? You can just leave a comment.

  • 유용한 정보네요. 이거 어디다가 저장해 놓고 글 올릴떄 마다 참고하면서 글을 써야 겠네요.

    reply edit

  • 파이어준 파이어준

    감사합니다. 태터툴즈 수정로그입니다. 많은분들이 고쳐쓰실수 있도록 메뉴얼을 작성 중입니다. ^^;

    reply edit

  • 궁금한 게 있습니다. 드림위버에서도 태그 끝에 꼭 / 를 붙이던데... 붙이나 안붙이나 브라우저에서 차이는 없는거 같은데 이걸 왜 붙이는 건가요?

    reply edit

  • 태그가 시작되면 태그를 끝맞춰 주어야 하는데 <br> 같은 태그는 </br> 식의 end tag 이 없기때문에 <br /> 식으로 시작과 끝 태그를 정의 하죠.
    아.. 뭐 <br></br> 식으로 쓸 수도 있지만, <br /> 이렇게 쓰는게 더 간편하죠 ㅎㅎ

    reply edit

  • JWC님께서 말씀하신것처럼 태그형식이 열리고 닫히는 형식이 아닌 태그에는 모두 /를 사용하도록 권고하고 있습니다. 왜 붙이는 지는 저도 잘 모르겠어요;

    reply edit

  • XHTML은 XML 문법을 계승하고 있기 때문입니다. HTML에 비해서 문법이 엄격하지요.
    HTML 4.01을 쓸 경우엔 굳이 self-closing을 할 필요는 없습니다.

    reply edit

  • 그렇다면 /로 닫아줄 것을 권장하는 이유는 XHTML로 넘어가기 위한 중간 단계 정도로 이해하면 되겠군요.

    reply edit

  • 지나가다 노파심에 남깁니다.
    기계적으로 Validation 통과 시키는 일은 아무 의미가 없습니다.
    예를 들어, <s>대신 <del>을 사용하는 것 같은 것은 그저 "통과"를 위한 "통과"일 뿐입니다.
    물론 validation은 최소한으로 지켜져야 하는 부분입니다만, 그보다는 왜 유효성 검사를 해야 하는지를 살펴보시는 것이 필요할 듯 합니다.

    reply edit

  • 왜 유효성 검사를 해야하는 지를 살펴볼 필요가 있을까요. 말씀하셨듯이 최소한으로 지켜야 하는 부분이기에 실행에 옮겼습니다. 그리고 저는 코딩을 매우 즐기는 편입니다. 끝으로 자신의 블로그가 다른곳에서 이상하게 보이지 않길 바라는 마음은 어느 블로거라도 같을 것입니다.

    reply edit

  • 음...회사일이든 개인일이든 코딩을 많이 하게 되는데...
    표준은 점차 익숙해지자고 하나씩 사용을 늘려나가는 수준입니다.
    익숙하지 않은 것을 억지로 시간 낭비해가며 작업하거나 표현상 다르지도 않은 예전 문서나 프로그램까지 고치기는 곤란한 면도 있어서요. 어차피 남들도 대부분 표준은 못지키고 있고, IE가 대세인 이상 별로 문제도 없고..;; 코더로서의 욕심과 현실상의 타협..;;

    강제력이 없는 표준은 권고사항일 뿐이죠....( '-')먼산...

    reply edit

  • 그렇지요. 절대적인 것은 아니지요.

    reply edit

  • img, br뿐만 아니라 End tag가 없는 단일 태그에는 모두 /를 뒤에 붙여줘야 하죠.
    input, hr, link, base(xhtml 표준에서 떨어져나갔지만요).. 뭐 몇가지 없네요^^; 도 뭐가 더 있으려나..

    reply edit

  • 네, 찾아보니 렌더링 속도에 영향을 미치기도 한다는 군요.

    reply edit

  • 음, 웹표준을 조금 알기는 하지만 막상 스킨을 만들거나 하다보면 테이블을 슉슉 만들어 대고
    img 태그에 alt 나 / 를 넣지 않은게 절대 다수이고;;
    알긴하면서 실천은 하지 않게되니, 아아, 이 귀차니즘을 어찌합니까아~

    reply edit

  • 억지로 하실 필요는 없는 것 같습니다. 아는 것부터 조금씩 조금씩 고쳐 나가면 웹표준은 자연스럽게 다가오지 않을까요?

    reply edit

  • 파이어폭스 확장 중에서 Html Validator 라는 확장이 있습니다.
    웹 페이지를 불러올 때 마다 현재 페이지의 소스를 검사해서 오류가 있으면 지적해 주는 확장기능인데 이 검사기능이 w3c를 기반으로 하고 있기 때문에 표준 검사를 하는데 상당한 도움이 되고 있습니다.

    w3c 검사기를 계속 돌리면 번거롭고 트래픽도 많이 발생하지만 이 확장기능은 웹 사이트를 서핑하면서 하나하나 진단해 주니깐 매우 편리하더군요.

    파이어준님도 한번 사용해 보세요.

    reply edit

  • 좋은 정보 감사합니다. 벌써부터 사용하고 있는걸요~ ^^; 사실 w3.org의 오류 지적은 당췌 알아 볼수도 없더라구요. 표준검사 뿐만아니라 w3c처럼 html 버전별로 코드 수정을 도와주는 불여우 플러그인은 어디 없을까요... XHTML은 어디서부터 시작해야하는지 감도 잡히지 않아요;;

    reply edit

Your Reaction Time!

captcha

avatar