정미나닷컴

웹 표준 항목 본문

programming

웹 표준 항목

정미나 2010. 3. 9. 21:35
반응형

* 웹 표준을 지킨다는 것은 W3C의 권고안을 지킨다는 것을 의미하며 이것의 목적은 Cross Browsing, Forward Compativility, 장애인 접근성 향상 등이다.
 
˚ 기본 web browser - Internet Explorer 6.0
˚ 문자 포맷 - 유니코드 & UTF-8
˚ 모니터 해상도 - 1024 * 768 (스크롤 영역 제외:1000*600) / 16bit color
˚ Frame(iframe 포함) 사용 지양 - 단일 Frame
- Page 구성 : 따로 include 파일 작성 (Min 4영역)
- Top : 로고, 사이트 메뉴, 언어 메뉴, Depth 1~2
- Left : Depth 1~3
- Right : Quick menu
- Bottom : Copyright 정보 및 개인정보보호 정책 등, 기타 Site menu
˚ 세로 스크롤은 허용 (최대 1800px) / 가로 스크롤은 X
˚ 중요도 순서로 좌->우 / 상->하
˚ 모든 이미지 파일은 gif, 사진만 jpg
˚ 모든 font와 table은 css 규정
˚ user가 disable로 되어있는 항목을 선택했을 경우 -> alert창!!
˚ user가 파손 가능성이 있는 행동을 했을 경우 -> confirm창!!
˚ user가 취한 행동에 대한 피드백 -> alert창!!
˚ sitemap 제공
˚ system이 2초 이상의 작업 수행시 모래시계나 loading창 제공
- loading창은 자동으로 꺼져야 한다.
˚ 빈번한 작업 - 1초 미만
  일반적인 작업 - 2초
  복잡한 작업 - Max 12초
˚ error mesage - 긍정적이고 위협적이지 않은 단어로.. 유머를 섞는것도 안됨! error 항목에 대해 졸 구체적으로..!!
˚ text 주위에 충분한(25% 이상) 여백
  text를 display 하는 경우 50% 정도 여백
˚ default 배경 색상 - white, gray / 전경 색상 - black, dark blue
- 밝은 색상 남발 주의!!
˚ 같은 dialog 안에서 여러 font 사용 자제
˚ loading시에는 중요한 메뉴만 display
- 자잘한 메뉴는 drop down이나 dialog 상자로..
˚ link시 url에 특수문자 제한, 주소창에 url 안보이게..
˚ 모든 image - height & width, alt, title 속성 지정
˚ popup - 모니터의 정중앙에 배치, title은 header의 좌측에 배치, 닫기 버튼은 중앙 하단에 배치
- toolbar=no / menubar=no / scrollbar=no (yes 가능) / statusbar=no
˚ text field - 최대 길이와 size 반드시 설정, 여백은 2~3px
˚ combobox - 이동 버튼 배치 (클릭시 자동 이동 X)
- 필수항목 : default값 세팅 / 선택항목 : All or Select 세팅
˚ radio button - default로 1개 항목 선택
˚ table - lable과 data 모두 좌측 정렬 (단, grid table은 중앙 정렬)
˚ grid - 한 page에 불러올 기본 조회 건수 : 15건
- '신청' 등의 기능이 필요한 경우 우측 끝 컬럼에 할당
- 화면 전체나 grid 전체를 control하는 버튼 : 상단 왼쪽
  (grid 아닌 화면 : 오른쪽 하단)
˚ tab 사용 자제 (각 tab에 있는 data가 메모리에 상주)
- tab의 index 개수는 4개 이하
˚ 조건 검색 영역 table - 8px padding, 4px border / 컬럼 height : 24px
˚ 버튼 사이 간격 - 3px
˚ header 부분을 제외한 item들의 간격 - 10px
˚ 문서의 제목 : H1~H6
  문단 : p
  표 : table
  순서 있는 리스트 : ol
  순서 없는 리스트 : ul
  정의 리스트 : dl
  인용 : blockquote, q
  하이퍼링크 : a
  강조구문 : strong, em
˚ 명시적인 labeling (시각장애우들이 음성으로 들을 경우 대비)
˚ 모든 HTML 요소와 속성은 소문자
- XML이 대소문자를 구별하므로 필수적!!

반응형

'programming' 카테고리의 다른 글

유니코드 변환기  (0) 2010.03.09
웹 접근성 지침 체크 항목  (0) 2010.03.09
NATE ON 방화벽 뚫기  (1) 2010.03.09
[Oracle] 오라클 Lock 찾아서 Kill 하기  (0) 2010.03.09
FCKeditor 폼 체크  (0) 2010.03.09