웹표준에 대해 궁금한 것이 있습니다.

[냥이낙타]

안녕하세요. 요 근래 홈페이지를 만들다가 웹표준에 관심이 생겨서 여기까지 들어오게 되었네요.

다름이 아니라 나름대로 웹표준 검사를 받아가며 홈페이지를 만들었지만, 몇가지 저 혼자서는 고칠 수 없는 부분에 대해서 묻고 싶어서 이렇게 글을 올립니다.

1. doctype과 meta 태그 안의 charset, content language 지정 문제 입니다.
가장 첫 오류 메세지로 계속 이것이 나오는데요, 어떤것으로 지정해줘야 할지 모르겠습니다. 참고로 한국어로만 만들어지는 페이지입니다.

2. 원래는 테이블이나 프레임을 쓰지 않고 레이아웃을 하려고 했는데, 태터툴즈의 more- less기능을 쓸때 스크롤 바가 자동으로 늘어나지 않아서 쓸수 없게되었습니다. 해결 방법이 있나요?(=프레임을 쓰지 않고 레이아웃을 할 수 있도록 more-less 클릭시 스크롤바가 자동으로 늘어나게 하는 방법이 있나요?)

3. 프레임셋 문서에서 프레임 사이에 여백이 드러나는 문제때문에 별수없이 웹표준에 어긋나는 'FRAMESPACING' 태그(?)를 쓰는데요, FRAMESPACING를 쓰지 않고도 프레임 사이의 여백을 없애는 방법은 없나요?

4. 웹표준을 잘 지키는 방명록과 메모장 하나만 추천 부탁드립니다.(부착형이든 설치형이든)
혹시 com.ne.kr에서 제공하는 메모장 괜찮은가요?

[hiphapis]

안녕하세요. 요 근래 홈페이지를 만들다가 웹표준에 관심이 생겨서 여기까지 들어오게 되었네요.

다름이 아니라 나름대로 웹표준 검사를 받아가며 홈페이지를 만들었지만, 몇가지 저 혼자서는 고칠 수 없는 부분에 대해서 묻고 싶어서 이렇게 글을 올립니다.

1. doctype과 meta 태그 안의 charset, content language 지정 문제 입니다.
가장 첫 오류 메세지로 계속 이것이 나오는데요, 어떤것으로 지정해줘야 할지 모르겠습니다. 참고로 한국어로만 만들어지는 페이지입니다.

2. 원래는 테이블이나 프레임을 쓰지 않고 레이아웃을 하려고 했는데, 태터툴즈의 more- less기능을 쓸때 스크롤 바가 자동으로 늘어나지 않아서 쓸수 없게되었습니다. 해결 방법이 있나요?(=프레임을 쓰지 않고 레이아웃을 할 수 있도록 more-less 클릭시 스크롤바가 자동으로 늘어나게 하는 방법이 있나요?)

3. 프레임셋 문서에서 프레임 사이에 여백이 드러나는 문제때문에 별수없이 웹표준에 어긋나는 'FRAMESPACING' 태그(?)를 쓰는데요, FRAMESPACING를 쓰지 않고도 프레임 사이의 여백을 없애는 방법은 없나요?

4. 웹표준을 잘 지키는 방명록과 메모장 하나만 추천 부탁드립니다.(부착형이든 설치형이든)
혹시 com.ne.kr에서 제공하는 메모장 괜찮은가요?

많은 고수분들이 계셔서, 답변달기 부끄럽지만...
아무도 안계셔서 부족한 제가 조그마한 답변을 달겠습니다.

1번 > 정확하게 어떤 메세지인지 알려주시면 좋을것 같아요..
웹표준화에서는 UTF-8 을 표준Charset으로 정의하고 있습니다

2번 > div를 이용하시면, 가능하세요

3번 > margin:0px, padding:0px 로 설정해보세요

4번 > 이건 잘 모르겠네요..

[냥이낙타]

답변 감사합니다.
그리고 다시 질문 드립니다. 아는것이 없다보니 질문이 너무 어중간했던 듯 합니다;

1. 첫번째 doctype에 관한 질문은 w3웹표준 검사시에 [no document type declaration; implying "<DOCTYPE>".] 메시지가 나오기 때문입니다. html 4.01에서만도 doctype 3가지가 있는데, 그중 어떤 doctype을 지정해줘야지 알 수가 없네요. xhtml이라는 것도 있고요. 차이까지 설명해주시면 감사하겠지만, 최소한 어떤 doctype을 설정해줘야하는지 가르쳐 주시면 감사하겠습니다.

2. 역시 첫번째 질문에서 charset에 관한 질문은 웹표준 검사시에 [No Character Encoding Found!] 라는 메시지가 나오기 때문입니다. 한국어로 작성된 문서의 경우 charset을 무엇으로 지정해줘야 하나요?

3. 3번 질문의 답변이었던 [margin:0px, padding:0px 로 설정]은 어디다 해줘야 하나요;;

4. 새로운 질문 추가합니다. 홈페이지를 제작하면서 저해상도 모니터를 위해 width의 크기를 대부분 %로 지정해줬는데요, 잘한일인가요? 혹시 px단위로 입력해주는 쪽이 더 웹표준에 가까운가요?

그럼 좋은 하루 되세요.

[빛알갱이]

1. 첫번째 doctype에 관한 질문은 w3웹표준 검사시에 [no document type declaration; implying "<DOCTYPE>".] 메시지가 나오기 때문입니다. html 4.01에서만도 doctype 3가지가 있는데, 그중 어떤 doctype을 지정해줘야지 알 수가 없네요. xhtml이라는 것도 있고요. 차이까지 설명해주시면 감사하겠지만, 최소한 어떤 doctype을 설정해줘야하는지 가르쳐 주시면 감사하겠습니다.

자신의 문서에서 사용한 HTML에 해당하는 것을 지정해 주면 됩니다. HTML 4.0x에 엄격하게 부합하는 문서를 만들고자 한다면 strict에 해당하는 DOCTYPE을 지정하고, 그렇게까지 표준을 엄격하게 지킬 자신이 없다면 (혹은 strict를 쓰지 못 할 다른 사정이 있다면) transitional을 쓰면 됩니다. 별로 권장할만하지 않지만, frame을 쓴 기존 문서를 최소한의 노력만으로 표준에 부합하게 하려면 frameset을 쓰면 되고요.

2. 역시 첫번째 질문에서 charset에 관한 질문은 웹표준 검사시에 [No Character Encoding Found!] 라는 메시지가 나오기 때문입니다. 한국어로 작성된 문서의 경우 charset을 무엇으로 지정해줘야 하나요?

이 문제 역시 정답이 있는 게 아닙니다. 자신의 문서가 실제로 사용한 인코딩 이름을 지정해 주면 됩니다. IETF의 문자 인코딩 등록처에 등록된 이름 가운데 preferred MIME name을 쓰는 게 좋습니다. 결국 EUC-KR이나 UTF-8을 쓰는 게 좋은데, 한국어를 NCR을 쓰지 않고서도 제대로 표현하기 위한 인코딩은 UTF-8입니다. 요새 나온 편집기들 대부분은 UTF-8로 문서를 저장하는 옵션이 있으니 몇 년 전과 달리 UTF-8을 쓰는 게 어렵지 않을 것입니다. UTF-8 대신 UTF-16(LE|BE)를 쓰는 수도 있지만 (Windows notepad 등에서 Unicode라고 부르는 것은 실제로 UTF-16LE입니다), UTF-8에 비해 그다지 큰 이점은 없습니다.

3. 3번 질문의 답변이었던 [margin:0px, padding:0px 로 설정]은 어디다 해줘야 하나요;;

중앙 정렬을 하기 원하는 html element에 대해 inline style로 지정하는 수도 있고, 문서의 선두에 <style> 블럭을 두고, 그 안에서 해당 요소에 대한 스타일로 지정하는 수도 있습니다. 또, 외부 스타일시트에서 지정하는 수도 있고요. 금년 초에 나온 웹 표준 제작 가이드를 (이 게시판에 공지 사항으로 걸려 있는) 참고하시면 CSS에 대해 알기 쉽게 설명해 놓았으니 다운로드하셔서 읽어 보시기 바랍니다.

4. 새로운 질문 추가합니다. 홈페이지를 제작하면서 저해상도 모니터를 위해 width의 크기를 대부분 %로 지정해줬는데요, 잘한일인가요? 혹시 px단위로 입력해주는 쪽이 더 웹표준에 가까운가요?

웹 문서 문법 표준에 부합하는 정도는 어느 쪽이나 같습니다. 다만, 좀더 범용성 있는 웹 페이지를 만들고자 한다면 %가 더 낫다고 원론적으로 얘기할 수 있습니다. 실제 적용 과정에서는 여러 가지 제약이 있어서 쉽지 않을 수 있습니다.

[kiryu]

4. 웹표준을 잘 지키는 방명록과 메모장 하나만 추천 부탁드립니다.(부착형이든 설치형이든)
혹시 com.ne.kr에서 제공하는 메모장 괜찮은가요?

웹표준에 맞는 설치형 게시판이라면 GR Board 가 있습니다.
실제로 사용은 안 해 봤지만요;
http://sirini.net/v18/grboard.php 로 가시면 자세한 정보를 얻으실 수 있을 듯 합니다.

[마잇]

답변 감사합니다.
그리고 다시 질문 드립니다. 아는것이 없다보니 질문이 너무 어중간했던 듯 합니다;

1. 첫번째 doctype에 관한 질문은 w3웹표준 검사시에 [no document type declaration; implying "<DOCTYPE>".] 메시지가 나오기 때문입니다. html 4.01에서만도 doctype 3가지가 있는데, 그중 어떤 doctype을 지정해줘야지 알 수가 없네요. xhtml이라는 것도 있고요. 차이까지 설명해주시면 감사하겠지만, 최소한 어떤 doctype을 설정해줘야하는지 가르쳐 주시면 감사하겠습니다.

2. 역시 첫번째 질문에서 charset에 관한 질문은 웹표준 검사시에 [No Character Encoding Found!] 라는 메시지가 나오기 때문입니다. 한국어로 작성된 문서의 경우 charset을 무엇으로 지정해줘야 하나요?

http://www.w3schools.com/tags/tag_doctype.asp

이 곳에 DTD 종류와 간략한 차이가 나옵니다.
Strict는 '표현'에 해당하는 요소는 배제하고 '구조'를 다루는 태그만을 사용하고 표현은 CSS로
Transitional은 '표현'에 해당하는 태그도 어느정도 허용하는 것 같습니다.
Frameset은 Transitional + Frame 태그 정도 인것 같습니다.

<b>와 <strong> 이런 건가요?

CSS를 지원하지 못하는 브라우저를 지원해야 할 때 Transitional을 사용해라 라고 나오는데 전 개발경험이 전무 하기 때문에 더 이상의 의견은 접겠습니다 -_-

별다른 이유가 없으시다면 XHTML DTD중에서 선택하시면 될 것 같습니다. 역시 개발 경험 전무하므로 적당히 흘려들으시구요.
http://www.w3schools.com/xhtml/xhtml_why.asp


2번 질문은 사용자의 입장으로 골치 아픈 경험을 많이 했었기 때문에(최근에는 많이 줄었습니다.) 개발 경험은 전무하지만 한말씀 드리면,

빛알갱이님 말씀대로 그때그때 다릅니다. 보여줘야 할 데이터가 어떤 '인코딩'으로 되어 있는지 아시고 그에 맞추어서 설정해 주셔야 합니다.

정적인 페이지라면 에디터로 저장하실 때 UTF-8 혹은 EUC-KR로 저장하시면서 이에 맞는 Charset을 넣어주시면 되지만 보통은 DB쪽에서 데이터를 얻어다가 뿌려주는 경우가 많습니다.
DB에 데이터가 어떤 인코딩인지 확인하시고 이에 맞는 Charset을 지정해 주시면 됩니다.
보통은 EUC-KR 혹은 UTF-8 둘중에 하나가 될 것 같습니다.

어쨌든, DTD도 선언하신 DTD에 맞는 코딩을 하시고 Charset도 지정하신 인코딩에 맞는 데이터를 뿌려주시는게 제일 중요한 것 같습니다.

[냥이낙타]

정말 많은 답변에 다시 한번 감사드립니다(_ _)
그리고.. 또다시 질문 드립니다(죄송;)

1. heaven님의 답변에서 3번 [margin:0px, padding:0px 로 설정해보세요] 및 빛알갱이님 답변에서 3번 [중앙 정렬을 하기 원하는 ~] 에 대하여
제 질문은 IE에서 지원하는 'frameset'의 속성 [framespacing] 태그를 어디에 삽입하느냐 하는 것입니다. 그리고 만약 [margin:0px, padding:0px] 태그를 쓴다면, 이 태그를 frame페이지에 혹은 frame 안에 띄우는 개별 문서에 사용하는지를 묻는 것입니다.

2. 첫번째 글 2번 질문의 재탕입니다. 제가 처음 홈페이지를 만들때는 iframe을 사용하여 만들면서 스크롤바가 iframe이 아니라 iframe의 본 문서에 만들어지는 태그를 사용하였습니다. 근데 태터툴즈의 more-less 기능을 사용할 경우 스크롤바가 확장해주지 않아서 내용이 짤리는 버그가 일어나는 바람에 다시 frame문서로 제작하였습니다. 지금도 가능하다면 iframe을 사용하는 문서로 돌아가고 싶은데요, 위에 쓴 버그의 해결방법이 있나요?

3. 여러분들의 도움을 얻어 DOCTYPE은 HTML 4.01 Frameset과 transitional을, charset은 utf-8을 지정해주었습니다.
문제는 doctype을 쓸 경우, 프레임안에 뜨는 문서에서 가로 스크롤바가 생깁니다. 해상도를 높여주면 없어지고요. 이 스크롤 바를 없애려면 <body> 태그를 삽입하면 되나요?

그럼 좋은하루 되세요.^^

[eouia]

3번의 경우에는 다음을 참조.
http://hyeonseok.com/pmwiki/index.php/Markup/Frame

[eouia]

2.의 경우에는 코드를 보지 않고는 뭐라 말씀드리기 어렵군요.
태터에서 쓰는 HTML코드 및 javascript가 표준에 딱 들어맞지는 않기 때문에 바로 쓰는 것은 문제가 있습니다.
코드를 잘 정리해서 코드와 함께 다시 질문해주시면 답변해주시는 분들이 있을 겁니다.
원론적으로 말씀드리자면, 원하시는 기능은 frame 또는 iframe을 사용하지 않고서도 얼마든지 구현가능합니다.

1.의 경우 frame이든 iframe이든 접근성에 제약을 주기 때문에 권장하지는 않습니다.
어쨌든 간데,
frame 태그의 attribute중에, frameborder속성 및 marginheight, marginwidth 속성을 제어하시면 원하시는 게 되지 않나 싶네요.
물론 frame을 쓸 때의 DTD는 맞춰주셔야겠지요.

[냥이낙타]

답변은 잘 보았습니다.

일단 3번 문제는 일단 해결했습니다.
그런데 conditional comment라는 것을 잘 모르겠네요. 반드시 삽입해줘야 합니까? 일단 css파일에 html 부분만 삽입해서 쓰고 있긴 한데;

2번의 경우 여태까지 한일을 다시 하자니 끔찍해서.. 포기하고 그냥 frame을 쓸 것 같네요. 다음에 다시 의욕이 생기면 도전해볼까 합니다. 답변 주셨는데 죄송합니다.

첫번째 문제의 경우, 일단 framespacing속성은 프레임 문서 사이의 간격을 조정할 수 있습니다. 저는 이 값을 0으로 주어서 프레임 문서들을 완전히 붙일 생각이고요. 하지만 marginheight, marginwidth 값은 1 이상으로만 주어야 한다고 http://trio.co.kr/webrefer/html/present/frames.html (html 4.01규격 한글화 사이트) 에서 말하네요.
예시로 제 홈페이지를 올리겠습니다.
framespacing태그를 사용한 홈페이지 http://nihal.woweb.net/exam/index1.htm
framespacing태그를 사용하지 않은 홈페이지 http://nihal.woweb.net/exam/index.htm

[hyeonseok]

첫번째 문제의 경우, 일단 framespacing속성은 프레임 문서 사이의 간격을 조정할 수 있습니다. 저는 이 값을 0으로 주어서 프레임 문서들을 완전히 붙일 생각이고요.

스펙대로라면 <frame frameborder="0"> 을 사용하면 프레임간의 간격이 없어야 하지만 IE, FF둘다 그렇게 구현되어 있지 않습니다.
validation은 안되지만 <frameset border="0">을 사용할 수 밖에 없습니다.

[냥이낙타]

홈페이지를 만들며 생겼던 문제는 여러분들의 도움으로 많이 해결되었습니다.

쏟아지는 질문에 관심 가져주신 모든 분들께 감사의 말씀을 드립니다(_ _)

특히 답글 달아주신 hiphapis님, 빛알갱이님, kiryu님, 마잇님, eouia님, hyeonseok님께(답글 달아주신 순서대로) 감사드려요!

그럼 좋은 하로 되세요.