| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | ||||
| 4 | 5 | 6 | 7 | 8 | 9 | 10 |
| 11 | 12 | 13 | 14 | 15 | 16 | 17 |
| 18 | 19 | 20 | 21 | 22 | 23 | 24 |
| 25 | 26 | 27 | 28 | 29 | 30 | 31 |
xHTML 사용을 생활화 합시다.. -_-;;
지금은 HTML 에서 XML 로 전환중인 단계입니다..
이 HTML 과 XML 중간이 xHTML 이지요..
xHTML 에 대해 간략히 소개해보고자 합니다..
xHTML 은 모든 브라우져에서 지원합니다... 표준이지요..
계속 인터넷익스플로러(이하 IE 라 함) 전용속성에 따라가다보면
현재 진행중인 MS 의 PC시장 독점 전략을 도와주는 꼴이 되지요..
서문이 길었네요.. 시작합니다..
닫는 태그가 없는 경우..
img, embed 같은것들요..
모두 /> 로 닫습니다..
<img src="a.gif" />
혹은..
<img src="a.gif"></img>
이런식으루요..
따옴표 역시 빼먹어서는 안되구요..
혹시 제로보드에서 소스 봤을때.. <br /> 이란 태그 본 적 있으신지요..^^
br 은 문단의 흐름을 깨기때문에.. 표준이긴 하지만 w3c 에서 비추천 하더군요..
또.... 값을 제외한 모든건 소문자로 해주세요...
모든건.. p 와.. div.. 그리고 작은 한 속성을 지정할땐 span 에 id 주고.. css 에서...
아무튼.. 속성은 모두 css 에서 처리하는게 좋습니다.
즉.. img 에서의 width, height 같은건 상관없지만..
border="0" 을 써놓고 검사해봤더니 그곳에서 걸리더군요..
검사하는건 조금 있다가.. ^^
보통.. <style> 이런식으루 쓰시는데..
<style type="text/css">
이렇게 사용하셔야 합니다. 이게 표준이지요..
자바스크립트 사용하실때도..
<script> 로 그냥 쓰시면.. 이게 기본적으로 VBScript 로 되어있는 경우
자바스크립트를 인식하지 못하고 에러를 냅니다..
이땐..
<script type="text/javascript"> 이런식으로 사용하시는게 좋아요..
닫는태그는 [항상] 있어야 합니다.
없어도 된다는건 옛말이구요.. 이게 표준입니다.. -_-;
자세한건 www.w3.org / www.w3c.org 의 표준권고안을 살펴보세요..
자바스크립트에서도요..
<img src="a.gif" id="img1" />
이때.. 자바스크립트에서 이 객체에 접근..
이때 그냥
img1.src = "b.gif";
이런식으로 사용이 가능한데. 이건 IE 에서만 됩니다.
다른브라우저 사용시 아무것도 처리되지 않고 오류가 나지요..
이럴땐 변수를 하나 만들어놓고 그 안에 객체를 담거나 직접 사용하시면 됩니다..
두가지 예가 있겠네요..
obj = document.getElementById("img1");
obj.src = "b.gif";
이렇게 사용하는방법과..
document.getElementById("img1").src = "b.gif";
이런방법... 편한대로 하시면 됩니다..
그리고 이건 주제와 어긋난 얘기인데..
window.close();
window.open();
이런함수들 있죠? window 객체명 생략 가능합니다.
그냥 close(); 나 open(); 이런식으루.. 사용하시면 되죠..
document.location.href 이것도 그냥 location 이라고 사용하시면 됩니다..
window 객체 바로 하위에 location 객체가 있구요.. 뒤의 href 는 생략해도 무방합니다..
새로운 기능을 봤을때.. 이것이 표준인지
아니면 MS 의 비표준 확장인지 의심해보는것도 좋은 습관입니다.. -_-;;
꼭 IE 에서만 되는 기능을 구현하고 싶을때.. 이럴땐 아래의 if 문 안에 구현해주세요..
if(document.all) 로 검사하셔서.. 이게 참이 나오면 IE 고.. 아니면 이외의 브라우져..
document.all 은 MS 의 비표준 확장 객체이기 때문에 검사해보면 거짓이 나옵니다..
이 대신 document.getElementById() 를 쓰면되죠..
모든 내용은 body 태그 안으로 들어가야 하며,
이 외의 script 나 style 등은 head, body 둘 중 하나로 들어가야 합니다.
html 태그 하위에는 head 와 body 혹은 frame 태그만 올 수 있고요...
테이블은 가급적 사용하지 않는게 좋습니다.
모든건 div 로 사용가능합니다.
또한 웹에디터는 개념이 없습니다. 쓸데없는것들이 난무합니다..
직접. 작성하시는걸 추천하구요.. 이것도 하다보면 익숙해지겠지요..
나모웹에디터는 정말 개념이 없습니다.. 그나마 드림위버는 table -> div 변환기능이 있죠..
자신의 홈페이지가 xhtml 표준에 맞는지 검사하고 싶으시다면.. 한번 검사해보세요..
https://validator.w3.org/ 이곳에서 URL 입력하시면 됩니다..
검사하시면.. 거기서 여기저기 태클을 많이 걸겁니다-_-;..
나오는대로 하나씩 수정하시면 되지요..
확인해서.. 모든게 표준이면.. 그곳에서 마크를 부여하지요..ㅋ
https://canelia.net/
뭐 내용은 없지만.. 저도 달았습니다..-_-;;
그리고.. 기본소스 모양을 고칠 필요가 있습니다.
그건 https://canelia.net 의 소스를 참고하시구요..
간단히.. 기본소스만 적어놨습니다.
제일 상단에 이렇게 써주시는것..
<?xml version="1.0" encoding="euc-kr"?>
이걸썼더니.. 제대로 처리되지 않는경우..
이걸 php 로 인식해서 그런경우가 발생하는데
<?= "<?xml version=\"1.0\" encoding=\"euc-kr\"?>" ?>
이렇게 쓰시면 해결되지요...
여기까지 다 보셨나요?
헤헴.. 감사합니다..
https://www.w3c.org 한번 방문해보세요..
테이블 없이 저런 디자인이 가능하다는것..
css 덕분이죠.. 뭐 테이블을 사용하면 안된다는건 아닙니다.. 필요할땐 써야죠.
지금은 HTML 에서 XML 로 전환중인 단계입니다..
이 HTML 과 XML 중간이 xHTML 이지요..
xHTML 에 대해 간략히 소개해보고자 합니다..
xHTML 은 모든 브라우져에서 지원합니다... 표준이지요..
계속 인터넷익스플로러(이하 IE 라 함) 전용속성에 따라가다보면
현재 진행중인 MS 의 PC시장 독점 전략을 도와주는 꼴이 되지요..
서문이 길었네요.. 시작합니다..
닫는 태그가 없는 경우..
img, embed 같은것들요..
모두 /> 로 닫습니다..
<img src="a.gif" />
혹은..
<img src="a.gif"></img>
이런식으루요..
따옴표 역시 빼먹어서는 안되구요..
혹시 제로보드에서 소스 봤을때.. <br /> 이란 태그 본 적 있으신지요..^^
br 은 문단의 흐름을 깨기때문에.. 표준이긴 하지만 w3c 에서 비추천 하더군요..
또.... 값을 제외한 모든건 소문자로 해주세요...
모든건.. p 와.. div.. 그리고 작은 한 속성을 지정할땐 span 에 id 주고.. css 에서...
아무튼.. 속성은 모두 css 에서 처리하는게 좋습니다.
즉.. img 에서의 width, height 같은건 상관없지만..
border="0" 을 써놓고 검사해봤더니 그곳에서 걸리더군요..
검사하는건 조금 있다가.. ^^
보통.. <style> 이런식으루 쓰시는데..
<style type="text/css">
이렇게 사용하셔야 합니다. 이게 표준이지요..
자바스크립트 사용하실때도..
<script> 로 그냥 쓰시면.. 이게 기본적으로 VBScript 로 되어있는 경우
자바스크립트를 인식하지 못하고 에러를 냅니다..
이땐..
<script type="text/javascript"> 이런식으로 사용하시는게 좋아요..
닫는태그는 [항상] 있어야 합니다.
없어도 된다는건 옛말이구요.. 이게 표준입니다.. -_-;
자세한건 www.w3.org / www.w3c.org 의 표준권고안을 살펴보세요..
자바스크립트에서도요..
<img src="a.gif" id="img1" />
이때.. 자바스크립트에서 이 객체에 접근..
이때 그냥
img1.src = "b.gif";
이런식으로 사용이 가능한데. 이건 IE 에서만 됩니다.
다른브라우저 사용시 아무것도 처리되지 않고 오류가 나지요..
이럴땐 변수를 하나 만들어놓고 그 안에 객체를 담거나 직접 사용하시면 됩니다..
두가지 예가 있겠네요..
obj = document.getElementById("img1");
obj.src = "b.gif";
이렇게 사용하는방법과..
document.getElementById("img1").src = "b.gif";
이런방법... 편한대로 하시면 됩니다..
그리고 이건 주제와 어긋난 얘기인데..
window.close();
window.open();
이런함수들 있죠? window 객체명 생략 가능합니다.
그냥 close(); 나 open(); 이런식으루.. 사용하시면 되죠..
document.location.href 이것도 그냥 location 이라고 사용하시면 됩니다..
window 객체 바로 하위에 location 객체가 있구요.. 뒤의 href 는 생략해도 무방합니다..
새로운 기능을 봤을때.. 이것이 표준인지
아니면 MS 의 비표준 확장인지 의심해보는것도 좋은 습관입니다.. -_-;;
꼭 IE 에서만 되는 기능을 구현하고 싶을때.. 이럴땐 아래의 if 문 안에 구현해주세요..
if(document.all) 로 검사하셔서.. 이게 참이 나오면 IE 고.. 아니면 이외의 브라우져..
document.all 은 MS 의 비표준 확장 객체이기 때문에 검사해보면 거짓이 나옵니다..
이 대신 document.getElementById() 를 쓰면되죠..
모든 내용은 body 태그 안으로 들어가야 하며,
이 외의 script 나 style 등은 head, body 둘 중 하나로 들어가야 합니다.
html 태그 하위에는 head 와 body 혹은 frame 태그만 올 수 있고요...
테이블은 가급적 사용하지 않는게 좋습니다.
모든건 div 로 사용가능합니다.
또한 웹에디터는 개념이 없습니다. 쓸데없는것들이 난무합니다..
직접. 작성하시는걸 추천하구요.. 이것도 하다보면 익숙해지겠지요..
나모웹에디터는 정말 개념이 없습니다.. 그나마 드림위버는 table -> div 변환기능이 있죠..
자신의 홈페이지가 xhtml 표준에 맞는지 검사하고 싶으시다면.. 한번 검사해보세요..
https://validator.w3.org/ 이곳에서 URL 입력하시면 됩니다..
검사하시면.. 거기서 여기저기 태클을 많이 걸겁니다-_-;..
나오는대로 하나씩 수정하시면 되지요..
확인해서.. 모든게 표준이면.. 그곳에서 마크를 부여하지요..ㅋ
https://canelia.net/
뭐 내용은 없지만.. 저도 달았습니다..-_-;;
그리고.. 기본소스 모양을 고칠 필요가 있습니다.
그건 https://canelia.net 의 소스를 참고하시구요..
간단히.. 기본소스만 적어놨습니다.
제일 상단에 이렇게 써주시는것..
<?xml version="1.0" encoding="euc-kr"?>
이걸썼더니.. 제대로 처리되지 않는경우..
이걸 php 로 인식해서 그런경우가 발생하는데
<?= "<?xml version=\"1.0\" encoding=\"euc-kr\"?>" ?>
이렇게 쓰시면 해결되지요...
여기까지 다 보셨나요?
헤헴.. 감사합니다..
https://www.w3c.org 한번 방문해보세요..
테이블 없이 저런 디자인이 가능하다는것..
css 덕분이죠.. 뭐 테이블을 사용하면 안된다는건 아닙니다.. 필요할땐 써야죠.
