생초보를 위한, 그누보드 강제 웹표준화 접근 방식 > 그누4 팁자료실

그누4 팁자료실

그누보드4와 관련된 팁을 여러분들과 함께 공유하세요.
나누면 즐거움이 커집니다.

생초보를 위한, 그누보드 강제 웹표준화 접근 방식 정보

생초보를 위한, 그누보드 강제 웹표준화 접근 방식

본문

그누보드 DTD 버전이 아닌 일반 그누보드에서 강제로 웹표준 스킨을 만들기 위한 접근법입니다.
제대로 웹표준화를 하는 경우라면 이것보다 참고할 자료가 많다는것을 알아두세요.
이 글의 내용은 코드 구조 개선용으로만 참고해주세요.
('웹표준'은 언어로 치면 문법에 해당하는 부분이기때문에 아래 내용과는 차이가 있습니다.)

1. 양식(form) Id/Name: form name="fwrite" => form id="fwrite"
스크립트 작성: fwrite id값을 가진 폼을 선택해 fwrite name 추가
document.fwrite 선택자를 가진 스크립트 전부를 변경하지 않는 상황일 때 씀
그러나 웬만해서는 id 값에 맞춰서 새로 짜는것을 권장
* 스크립트 작성 부분은 정말 제대로 웹표준 사이트 작성하는 경우라면 써먹지 말것.

2. 양식(form) Action
onsubmit="return somefunction();"
-> action="./write_update.php" 정확하게 목표 url을 써주자.
onsubmit으로 처리되던 부분은 외부 스크립트가 처리하도록 한다.

3. input 태그 required 속성
input에 required 를 class로 준다 => input class="required"
jquery: $("#fwrite input.required").attr("required", "required");
그 외 'email'과 여러 검사 기능도 같은 방법으로 적용하도록 한다.
css: 그누보드 루트 style.css : .required { background: url(js/wrest.gif) right top; }
* itemname 속성은 title 등의 속성으로 대체해서 쓴다.

4. img border
쓰면 안되는 속성은 아니지만 거슬린다. 스타일시트에서 img { border: 0; } 으로 초기화시켜주자.

5. 대체 텍스트
img및 input type="image" 에는 alt 속성으로 대체 텍스트를 넣어준다.
예) <img src="button.gif" alt="버튼" />

6. javascript type 지정
script language="javascript" 쓰지 말자. script type="text/javascript"를 쓰자.
그리고 아래와 같이 쓰면 좋다.
<script type="text/javascript">
//<!--<![CDATA[
script code
//]]>-->
</script>

7. 스크립트 분리
스크립트 분리는 구지 안해도되지만 분리해야 하는 경우 php 코드로 작동하던 부분들이 문제가 되곤 한다.
이런 경우 아래와 같이 하면 해결책이 될 것이다.
<script type="text/javascript">
//<!--<![CDATA[
    var one = "<?php echo $one; ?>";
    var two = "<?php echo $two; ?>";
//]]>-->
</script>
<script type="text/javascript" src="somescript.js"></script>

8. 스타일 시트 문제
아쉽게도, style, link 태그가 body 안에있으면 웹표준에 다 위배된다. 이걸 그나마 해소해보자.
head.sub.php head 태그 안쪽에 추가

$path_parts = array($member_skin_path, $board_skin_path, $new_skin_path, $connect_skin_path);
for($i = 0; $i < count($path_parts); $i++) {
    if(!is_null($path_parts[$i])) {
        if(file_exists($path_parts[$i] . '/style.css')) {
            echo '<link rel="stylesheet" type="text/css" href="'.$path_parts[$i].'/style.css" />'."\n";
        }
    }
}
//(좀 더 개선해서 쓰시는걸 권장합니다.)

팁이라고하긴 뭐하지만... 찾는 분이 있으실까해서 올려봅니다.
추천
3

댓글 3개

전체 3,313 |RSS
그누4 팁자료실 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT