정보화진흥원(nia)...

박은아

정보화진흥원(NIA) 표준프레임워크센터

2013.1.15(수) 서울시 별관

서울시 웹접근성 향상을 위한 전문교육

웹호환성이란? 웹호환성은 왜 지켜야 하나? 웹호환성은 어떻게 확인할 수 있나?

Overview

What? [웹호환성이란?]

“호환성”이란 서비스 이용자

단말기의 하드웨어 및 소프트웨어 환경이

다른 경우에도 동등한 서비스를 제공하는 것

을 말한다.

전자정부서비스 호환성 준수지침 제2조(용어정의)

3

Why? [왜 지켜야하나?]

동등한 서비스를 제공

3

서비스 이용자 단말기의 하드웨어 및 소프트웨어 환경이 다른

경우에도 동등한 서비스를 제공 전자정부서비스 호환성 준수지침 제2조(용어정의)


3

다양한 환경에서 어떻게 동등한 서비스를 제공 할 것인가?

Then, How? [어떻게 지켜야 하나?]

▶ 웹을 구현하는데 있어 표준으로 사용되는 지침과 기술 방식

▶ 다양한 접속환경을 가진 인터넷 사용자들이 정보에 소외되지 않고 모두가 동등하게 정보를 이용할 수 있음 (예)

- 사실표준화기구 W3C기준 (X)HTML 표준 - 스타일시트, 특히 CSS의 W3C 권고 - ECMA스크립트 국제 표준 - 문서 객체 모델의 W3C 권고

웹표준


3

다양한 환경에서 어떻게 동등한 서비스를 제공 할 것인가?


동작호환성 레이아웃호환성 플러그인호환성

HTML CSS


사실 표준화 기구(W3C)의 문법표준을 준수하고

플러그인을 사용하지 않거나(최소한 브라우저 호환을 확보하여),

다양한 브라우저 환경에서 동등한 서비스를 제공

3

특정 웹 브라우저에서만 작동하는

플러그인 프로그램사용

국제적인 문법표준을

미준수

웹 호환성 저해

기대효과

웹 표준 적용 및 브라우저호환확보에 따른 기대 효과

보편적 서비스 제공 차원

특정 업체기술(MS, Internet Explorer)에 대한 서비스 종속성 해소

다양한 웹 브라우저(IE, Firefox, Safari, Chrome 등), 다양한 플랫폼(컴퓨터,

스마트폰, 아이패드 등)에서도 전자정부 서비스 제공 가능

전체 코드량 및 로딩시간이 줄어들어 서버 유지비용 등 절감 가능

구조와 표현, 동작영역이 각각 분리됨에 따라 리뉴얼 작업이 간단

향후 기술발전이나 고객의 다양한 요구에 대한 유연한 대응 가능

웹사이트 관리 차원

기 타

Overview

“호환성”이란 서비스 이용자 단말기의 하드웨어 및 소프트웨어 환경이 다른

경우에도 동등한 서비스를 제공하는 것을 말한다.

전자정부서비스 호환성 준수지침 제2조(용어정의)

웹 호환성은 사용자 단말기 환경에 관계없이 웹콘텐츠를 이용할수 있는 정도

▶ 특히, 다양한 웹브라우저간의 호환성 확보가 가장 중요함

태생적 관점에서 웹은 정보의 교환과 공유를 위한 표현 방법이므로

상호 배타적이지 않고 호환 가능한 공통의 표준에 기반을 두어야 함

웹호환성을 저해하는 요소는

▶ 웹페이지 작성시 국제적인 표준 문법을 준수하지 않거나,

▶ 특정 웹브라우저에서만 동작하는 플러그인 프로그램 사용이 원인

3

[참고] 웹호환성 vs 웹접근성

웹 호환성(Compatibility)과 웹 접근성(Accessbility) 비교

＊ 국제적으로 웹 접근성은 장애인 뿐만 아니라 타 브라우저 접근성을 함께 고려

우리나라는 정책 주관부처, 목적 및 대상, 정책 우선순위 등의 차이로 인해

장애인 웹 접근성 개선은 ’05년, 웹 호환성 개선은 ’07년부터 추진

▶ 웹 접근성 개선 : 정보격차해소 목적으로 구 정보통신부에서 추진

▶ 웹 호환성 개선 : 대민서비스 개선 목적으로 구 행정자치부에서 추진

태생적 관점에서 웹은 정보의 공유, 교환 활성화를 위한 표현 방법이므로

상호 배타적이지 않고 호환 가능한 공통의 표준에 기반을 두어야 함

▶ 특히, 대민서비스를 제공하는 전자정부는 보편성 확보가 반드시 필요

▶ 웹 표준 준수를 통해 웹 접근성과 웹 호환성을 동시에 개선 가능

※ 다만, 웹 접근성은 사용자 환경, 소프트웨어 등 다양한 변수 추가 고려 필요

＊ 우리나라의 웹 접근성은 장애인, 노인 등을 위한 분야로 한정(웹호환성 별도)

문제제기

IE에서만 서비스를 제공하는 정부기관을 대상으로 시민단체 소송 제기

’07년 시민단체(오픈웹)에서 정부기관을 대상으로 소송 제기

※ (요지) IE 사용자에게만 온라인 서비스를 제공하는 것은 관련 법률 위반임

(대법원 판결) 부당한 소비자 불이익을 초래하지 않는다는 이유로 기각(’10.9)

▶ 단말기와 소프트웨어에 독립적인 차세대 웹서비스 도입 필요성 제기

“모든 국민에게 보편적으로 제공되어야 할 전자정부서비스가

특정 웹 브라우저 (MS社 Internet Explorer) 에서만

정상 서비스” 되는 문제 인식

다양해진 웹브라우저 환경(세계)

※출처: http://gs.statcounter.com/#browser-ww-monthly-200807-201211

【세계 웹브라우저 시장점유율 변동 추이 : 2008.7~2012.11】

다양해진 웹브라우저 환경(국내)

※출처: http://gs.statcounter.com/#browser-KR-monthly-200807-201211

【국내 웹브라우저 시장점유율 변동 추이 : 2008.7~2012.11】

전자정부서비스 호환성 준수지침 변천

전자정부서비스 호환성 준수지침 개정

전자정부서비스 호환성준수지침 (2012.10 개정)

주요 개정사항

전자정부 서비스 호환성 지침(‘12.10.10 개정, 행정안전부 고시 제2010-40호)

W3C 등 국제기구의 개방형 인터넷 표준을 준용한 행정업무용 표준

제4조 (웹사이트 호환성 확보)

▶ 기술적 제약이 없는 경우 상이한 3종 이상의 브라우저에서 동일한 서비스 제공

※ 3종 이상의 브라우저는 해당 전자정부 서비스를 구축ㆍ관리하는 행정기관에서 결정

제5조 (웹페이지 표준)

▶ 구조와 동작, 표현을 각각 분리하고 W3C, ECMA 등의 국제공통표준 준용

※ 구조(Html, xHtml 등), 표현(CSS 2.1), 동작(DOM 또는 ECMAscript)

▶ 웹페이지에서 문자를 부호화하는 방식은 UTF-8 방식으로 구현

※ EUC-KR 지양

제6조 (모바일 서비스 호환성 확보) ’12년 개편예정

▶ 모바일 전자정부 서비스는 모바일 웹 방식으로 제공하도록 노력

▶ 다양한 모바일 기기의 화면크기, OS 등과 무관하게 동등한 서비스를 제공하도록 노력

8

웹 호환성진단(진단지표 및 배점)

전자정부서비스 웹호환성 진단표 준용

▶ 지침: <심각>,<위험>,<보통> 차등감점


진단지표 진단기준 진단방법

1. 표준 (x)HTML

문법 준수

여부

(배점 30점)

o 자동진단도구를 통해 해당 웹페이지에서 발견된 오류

를 분석하여 아래와 같이 감점 처리

▸심각 : 1개 이상 발생시 전체감점

▸위험 : 1개 발생시마다 3점 감점

▸보통 : 1개 발생시마다 1점 감점

※ ‘심각’ : 웹문서 전체를 해석하는데

심각한 오류가 발생할 수 있는 경우

‘위험’ : 웹문서 일부 요소와 속성을

해석하는데 오류가 발생할 수 있는 경우

‘보통’ : 문법적으로 오류지만 웹문서의

정상적인 해석이 가능한 경우

자동진단도구

(W3C Markup

Validator)

2. 표준 CSS

문법 준수

여부

(배점 20점)

자동진단도구

(W3C CSS

Validator)


진단지표 진단기준

3. 동작 호환성

확보 여부

(배점 20점)

o 3종 웹브라우저를 통해 해당 웹페이지에서 사용된 스크립트 오류 및 정상 동작

여부를 점검하여 아래와 같이 감점

▸스크립트 오류, DOM 경고 : 1개 발생시 마다 4점 감점

▸비정상 동작 : 전체 점수를 감점 처리

4. 레이아웃

호환성

확보 여부

(배점 20점)

o 3종 웹브라우저에서 해당 웹페이지가 동등한 레이아웃을 제공하는지를 점검

▸동등한 수준의 레이아웃이 구현되지 않은 경우 전체 점수를 감점 처리

단, 웹브라우저별 특성에 의한 차이 (폰트, 픽셀 등)는 예외 처리

5. 플러그인

호환성

확보 여부

(배점 10점)

o 사용자 화면 및 동작에 영향을 미치는 플러그인에 한하여 3종 웹브라우저에

서 정상 동작하는지 점검

▸3종 브라우저에서 정상 동작하지 않을 경우 전체 점수를 감점 처리

단, 브라우저별 대체 수단을 제공할 경우에는 예외 처리

웹 호환성 진단(브라우저)

브라우저 선정기준

▶ 지침: “기술적 제약이 없는 경우 상이한 3종 이상의 브라우저에서 동일한 서비스 제공”

※ 3종 이상의 브라우저는 해당 전자정부 서비스를 구축ㆍ관리하는 행정기관에서 결정

웹 호환성 진단(평가페이지)

선정 기준 유 형 페이지 수

메인 페이지 - 진단대상 웹사이트의 메인페이지 1

목록 페이지

- DB의 목록 및 내용을 조회하는 페이지

(공지사항 목록 및 내용, 게시판 목록 및 내용, 자료실 등)

※첨부파일이 있을 경우 다운로드 가능 및 작동 여부까지 확인

3

서브 페이지

- 목록페이지를 제외한 메인페이지의 1~2단계하위 페이지

(기관소개/안내 페이지, 정보/서비스 제공 페이지, 기타 콘텐츠

제공 페이지 등)

4

부가기능 제공

페이지

- 멀티미디어(동영상 등) 제공 페이지

- 기타 플러그인 동작 페이지 2

페이지 대상

▶ 지침: 모든 페이지

▶ 진단: 진단대상 웹사이트 내에서 평가대상 카테고리별 페이지(10개) 임의 선정

웹 호환성진단(세부진단기준)

페이지 대상

▶ 지침: 모든 페이지

▶ 진단: 진단대상 웹사이트 내에서 평가대상 카테고리별 페이지(10개) 임의 선정

진단도구(화면 구성-시작화면)

진단도구(프로젝트 설정)

화면 구성 -프로젝트 설정

수집설정

웹 소스 수집방법 설정


평가항목

웹 표준 평가 항목 설정


포함 URL


제외 URL

진단결과(예시)

진단 보고서(예시)

진단결과(예시)

진단 보고서(예시)

Q&A

감사합니다.

정보화진흥원(nia)...

Documents