Design and Implementation of OASIS Considering Web Accessibility*

웹 접근성을 고려한 전통의학정보포털 설계 및 구현

  • cc icon
  • ABSTRACT

    This study shows evaluation of how much OASIS meets “the korean web content accessibility guidelines” and analysis of some of the accessibility problems and their solutions in OASIS(Oriental Medicine Advanced Searching Integrated System) which is the only web site that offers papers and project information related to Traditional Medicine in Korea. The evaluation criteria to determine if OASIS is accessible is classified into four sub items; Perceivable - if information and user interface components is presentable to users in ways they can perceive, Operable - if user interface components and navigation are operable, Understandable - if information and the operation of user interface are understandable, Robust - if content is robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies. Based on the measured results, OASIS has just been redesigned and implemented in more accessible and effective way. OASIS that improves web accessibility for the disabled is expected to help them study oriental medicine more easily and conveniently by providing equal access and equal opportunity to use the web.


    본 논문에서는 국내에서 유일하게 한의학 학술논문 및 한의학 연구정보를 제공하는 오아시스(Oriental Medicine Advanced Searching Integrated System)를 대상으로 국가에서 정한 [웹 접근성 국가표준]을 어느 정도 반영하고 있는지 평가해 보고, 웹 접근 취약성을 분석하여 해결방법을 모색하였다.

    웹 접근성 평가항목으로는 웹 콘텐츠를 쉽게 인식할 수 있는 정도를 평가하는 인식의 용이성(Perceivable), 웹 콘텐츠를 누구나 쉽게 사용할 수 있는지를 평가하는 운용의 용이성(Operable), 콘텐츠 구성에 대해 쉽게 이해할 수 있도록 제어하고 있는지를 평가요소로 하는 이해의 용이성(Understandable),웹브라우저의 종류나 버전에 관계없이 정상적으로 동작하는지를 평가하는 기술의 진보성(Robust)으로 구분하여 평가하였다.

    평가된 결과를 기준으로 문제점을 분석하고 이를 토대로 장애인의 웹 접근성을 고려한 오아시스를 설계하고 구현하였다. 웹 취약성을 수정하여 재구축한 오아시스는 한의학 연구를 하는 청각, 시각 장애인들에게 일반인들과 동등한 웹 접근 기회를 부여해 줌으로써 장애인들의 한의학 지식습득에 많은 도움을 줄 것으로 기대된다.

  • KEYWORD

    Oriental Medicine Advanced Searching Integrated System , Web Accessibility , OASIS

  • 1. 서론

    다양한 웹 구현 도구의 발전으로 기존의 단조로운 텍스트와 이미지만으로 구성되었던 웹사이트들이 더욱 화려해지고 동적으로 변화하고 있다. 이러한 웹 구축 기법의 발전은 일반 사용자들에게는 다양한 콘텐츠를 사용할 수 있는 이점이 있지만, 음성 및 문자인식 보조기구를 사용해야만 웹사이트 접근이 가능한 장애인들에게는 자유로운 웹 사용을 방해하는요소가 되고 있다.

    시각 장애인들이 웹사이트를 이용하기 위해서는 웹사이트의 내용을 읽어 주는 문자인식 장치를 사용해야 하는데, 이 장치가 문자를 인식하기 위해서는 웹 페이지 자체에 캡션을 표준 규칙에 맞게 코딩되어 있어야 한다. 또한, 청각장애인에게는 영상에 대한 문자변환 프로그램이나 음악에 대한 자막변환 인식장치에 호환될 수 있는 웹 구축이 필요하다. 하지만, 이러한 작업은 웹 개발자에게는 불필요한 일이나 번거로운 일로 생각되기 십상이었다.

    2009년 4월 11일부터「장애인차별금지 및 권리구제에 관한 법률」이 시행되어 우리나라에서도 웹사이트에 장애인들에 대한 차별금지에 대한 법률이 발효되면서 정부 및 공공기관을 시작으로 인터넷 웹 콘텐츠의 접근성에 대한 표준화 준수와 접근성 향상을 위한 노력이 확산되고 있다(행정안전부 2008, 5).

    행정안전부에서는 제정한 「웹 접근성 향상을 위한 국가표준 기술 가이드라인」을 제정하여 “인터넷 웹 접근성 지침”을 기반으로 웹사이트 콘텐츠에 접근하려는 장애인 등이 비장애인 등과 동등하게 웹 콘텐츠에 접근하여 자유롭게 이용하도록 웹사이트 설계자 및 운영자, 웹 콘텐츠 개발자들이 웹사이트를 구축하고 운영할 때 국가 표준에 따른 기술 구현방법 등을 준수해야 한다고 규정하였다(행정안전부2009, 1).

    국외에서는 웹사이트 구축 시 장애인을 배려한 구축 가이드라인을 이미 제정하여 운용하고 있다. 미국은 2001년 6월에 웹 접근성을 위해 「재활법 508조(Section 508 of the Rehabilitation Act)」에 의거, 연방정부 및 소속기관에서 제공하는 모든 웹사이트에 웹 접근성 준수를 의무화하였으며 W3C(국제표준화기구)의 지침을 기초로 16개 항목에 대한웹 접근성 지침 제정하였다. 영국은 1995년에 제정된 「장애인차별금지법 (Disability Discrimination Act)」의거, 2004년 10월부터 웹사이트 이용에 웹 접근성 준수를 의무화하였다. 이를 위해 W3C의 ‘웹 콘텐츠 접근성 지침 1.0’을 활용, 「PAS(Publicly Available Specification)78」이라는 웹 접근지침 해설, 평가방법을 포함한 가이드라인 마련(‘06년)하여 배포하였다(허준호, 최두진 2003).

    위 사례에서 보듯이 많은 나라들은 일찍이 웹 접근성 준수 의무를 규정하고 가이드라인을 만들어 장애인뿐만 아니라 모든 사람이 정보통신기기나 서비스를 손쉽게 활용할 수 있도록 노력하고 있는 상황이다.

    그리하여 본 논문은 웹사이트 구축 시 이러한 국?내외 움직임을 고려하여 한국한의학연구원에서 운영하고 있는 전통의학 정보포털인 오아시스에 대해 “장애인 차별금지법”과 “웹접근성 향상을 위한 국가표준 기술 가이드라인”에서 요구하는 기준을 어느 정도 준수하고 있는지 평가하였다. 그리고 평가의 결과에 의거하여 웹 접근성의 미반영 내용과 접근 취약성을 분석하여 웹 표준을 준수하도록 코드를수정하고 1차에서 평가한 웹 표준 평가 기준을 적용하여 2차 평가를 실시하였다.

    2. 연구방법

       2.1 연구대상

    한의학연구원을 비롯하여 11개 학의과 대학 및 부설연구소, 대한한의학회 및 분과학회에서 발행하는 총 44종 학술지를 구축하여 논문서비스를 하고 있는 오아시스를 웹 접근성 평가 대상으로 선정하였다.

    오아시스(OASIS)는 한의학학술논문에 대하여 기본검색, 주제별 검색, 통계자료 등을 제공하고 있으며 논문에 대한 서지, 초록 및 원문 PDF파일을 제공하고 있어 한의학연구자들에게 다양한 한의학 관련 서비스를 제공하고 있는 시스템이다(오아시스 홈페이지).

    그러므로 전통의학정보포털은 우리나라 최대의 한의학술논문을 서비스하고 있는 사이트로 웹 접근성 준수에 대한 중요성이 크다.

       2.2 선행연구

    본 연구를 위하여 다른 곳에서는 웹 접근성 향상을 위해 어떤 방법을 제시하고 연구하는지 조사하였다.

    정덕길 등(2008)은 “웹 접근성 지침에 의한 교육용 홈페이지의 적용방안 및 비교분석”이라는 논문을 통해 웹 접근성 평가도구인 KADO-WAH를 활용하여 교육관련 홈페이지를 평가하는 방법을 제시하였다. 또한, 평가결과에 나타난 오류와 경고 항목을 평가보고서에서 요구하는 방향으로 수정하여 웹 접근성을 향상 시키는 방안을 제시하였다.

    Marie-Luise leitner과 Christine Strauss(2008)는 “Exploratory Case Study Research on Web Accessibility”에서 웹 접근성 평가에 대한 다양한 기술적 방법에 대해 설명하고 웹 접근에 대한 사회적 책임, 법적요구, 경제적 혜택으로 나누어 설명하였다. 웹 접근성을 위해 새로운 디자인을 위해 사례연구를하여 비즈니스 웹 사이트의 Embedded 웹 사이트 구조를 제안하였다.

    Michael G. Paciello의 “Web Accessibility for People with disabilities”에서는 웹을 사용하는 일반인과 장애인들에 대해 설명하고 증가되는 장애인들에 대해 설명하였다. 웹에 접근할 권리는 장애인에게도 동등하다고 주장하며 법적요구와 정책적 표준을 설명하였다. 또한, 각 나라들의 웹 접근성 가이드라인에 대해 정리하였다.

    조윤희(2009)는 “시각장애인을 위한 공공도서관의 웹 접근성 제고방안”에서 일반인과 장애인의 정보제공 서비스에 대한 격차를 분석하고 공공도서관의 웹 접근성에 대해 4가지 항목에 대한 평가결과를 기준으로 개선해야 할 부분을 정리하였다.

    박주현과 류한영(2008)은 “웹 접근성 향상을 위한 시각장애인과 일반인의 감성 비교”에서 시각장애인의 감성적 특성을 분석하여 웹 접근성 지침에 반영하기 위해 동일한 청각자극에 대한 시각장애인과 일반인의 감성반응을 비교하고 그 차이점을 비교하였다. 이를 위해 음악과 음향효과를 이용한 15개의 청각자극과 긍정 및 부정 감성어휘를 이용한 11개의 감성평가척도를 선정하여 웹 설문시스템을 이용, 31명의 시각장애인과 53명의 일반인을 대상으로 감성반응을 측정하였다. 그 결과 장애인과 일반인의 감성욕구가 다르지 않음을 보였고 웹 접근성에 대한 연구에서 장애인의 감성적 욕구에 대한 고려가 반드시 필요하다고 하였다.

    위에서 보는 바와 같이 웹 접근성에 대한 웹

    사이트 분석 및 감성 비교를 통한 장애인에 대한 고려 등 다양한 연구가 있었음을 파악하였다.

    3. 웹 접근성 평가

       3.1 웹 접근성 평가항목

    웹 접근성에 대한 평가항목은 행정자치부에서 정한 가이드를 기준으로 오아시스의 모든 웹페이지에 적용하였다.

    웹 접근성을 평가해야 할 항목으로는 크게 인식의 용이성(perceivable), 운용의 용이성(operable), 이해의 용이성(understandable), 기술의 진보성(robust)으로 분류하고 각 항목별로 세부항목을 선정하였으며 각 항목에 대한 상세한 내용은 다음과 같다(행정안전부2008; 웹 접근성 연구소 홈페이지).

    3.1.1 인식의 용이성

    인식의 용이성은 웹사이트에서 서비스하고있는 모든 콘텐츠에 대해서 누구든지 쉽게 인식할 수 있는 정도를 평가하는 요소로 세부 내용은 <표 1>과 같다.

    3.1.2 운용의 용이성

    운용의 용이성은 웹 콘텐츠에 포함된 모든 요소들의 기능을 누구나 쉽게 사용할 수 있도록 구성하였는지에 대한 평가요소로 세부 내용은 <표 2>와 같다.

    3.1.3 이해의 용이성

    이해의 용이성은 사용자들이 콘텐츠의 구성에 대해 쉽게 이해할 수 있도록 제어하고 있는

    지를 평가하는 요소로 세부 내용은 <표 3>과 같다.

    3.1.4 기술의 진보성

    기술의 진보성은 구성한 콘텐츠가 웹브라우저의 종류나 버전에 관계없이 정상적으로 사용 가능한지와 웹 콘텐츠 저작도구의 종류에 관계없이 작동되는지에 대한 평가요소로 세부 내용은 <표 4>와 같다.

       3.2 웹 접근성 평가방법

    웹 접근성을 평가하는 방법에는 <표 5>와 같이 장애인, 고령자들이 해당사이트를 직접 접속하여 사용하며 평가하는 사용자 평가와 웹 접근성 전문가들로 구성된 전문가들에 의한 전문가 평가, 그리고 접근성을 평가하기 위한 소프트웨어를 이용하는 자동 평가 방법으로 나눌 수 있다. 각 평가방법에는 장?단점이있으며, 특히 사용자 평가는 가장 정확한 결과를 얻을 수 있는 반면, 실험자를 구하기 힘든 단점이 있다. 더욱이, 일반 포털사이트가 아닌 한의학이라는 특수한 분야이기 때문에 실험대상이 되기 위해서는 한의학적 지식도 필요하다. 각 평가방법에 대한 내용은 다음 <표 5>와 같다.

    전문가 평가에서는 웹 접근성의 모든 지표에 대한 평가와 웹페이지 프로그램 코드 레벨수준에서의 평가를 할 수 있지만 장애인의 시각에서 평가하기에는 한계가 있다.

    자동 평가는 S/W에 의한 평가로, 국가에서 정한 웹 표준을 단순히 분석하는 방법으로 평가시간이 짧아 이용하기 편하지만, 예외사항

    에 대한 대처가 느리고 프로그램 되어 있는 부분만 분석하기 때문에 같은 동작을 하더라도 프로그램 코드에 따라 결과가 다르게 나타날수 있는 단점이 있다.

    그리하여 본 논문에서는 평가를 위한 여러 방법 중 테스트 환경이 비교적 간편한 자동 평가와 소스레벨까지 분석이 가능한 전문가 평가를 실시하였다. 또한, 평가의 정확성을 위해 1차는 자동 평가로, 2차는 전문가 평가로 나누어 실시하였다.

    전문가 평가는 웹 프로그램 분석이 가능하고 소프트웨어에 대한 지식을 보유한 컴퓨터 공학 박사학위 취득자 5인을 선정하였으며, 자동 평가는 웹 접근성 평가 소프트웨어인 KADO-WAH 2.0을 이용하였다(행정안전부2008; 한국정보화진흥원 홈페이지).

       3.3 웹 접근성 평가결과

    3.3.1 인식의 용이성

    인식의 용이성에 대한 평가항목 중에서 A2(배경이미지 대체콘텐츠 제공 여부), A3(멀티미디어 콘텐츠 인식을 위한 대체 수단 제공 여부)에 대해서는 오아시스의 서비스에서 제공하지 않고 있어 평가결과에 “해당 없음”으로 표시하고 평균준수율에 반영하지 않았다. 인식의 용이성에 대한 각 항목에 대한 평가결과와 자동 평가, 전문가 평가의 준수율은 <표6>과 같은 결과를 볼 수 있다.

    3.3.2 운용의 용이성

    운용의 용이성에 대한 7개 평가항목에 대한 평가결과는 <표 7>과 같다. B1(이미지맵을 제공할 경우 대체콘텐츠 제공)은 오아시스에서

    사용한 콘텐츠가 없으므로 해당사항이 없었으며, B2(프레임을 제공할 경우 적절한 타이틀 제공)는 대체적으로 준수한 것으로 나타났으나 1차 평가인 자동 평가에서는 평가대상이 4로 측정하였다. 하지만 전문가 평가에서는 평가대상이 820개로 나타났으며 약 94건이 가이드라인을 지키지 못한 것으로 나타나, 자동평가의 결과와 상당한 차이를 보였다.

    B5~B7은 자동 평가로는 분석자체가 불가능하였으나 전문가 평가를 통한 결과를 확인할 수 있었다.

    3.3.3 이해의 용이성

    이해의 용이성에 대한 C1(테이블에 대한 정보제공 여부)과 C2(테이블 제목과 내용 셀 구분 여부)는 검사항목에 대한 개수 차이가 있었으나, 자동 평가와 전문가 평가 모두에서 준수하지 못한 것으로 나타났다. C3~C5는 자동평가에서 분석되지 않았으나 2차 전문가 평가에서는 분석해야 할 항목이 있는 것으로 나타났으며 결과는 아래 <표 8>과 같다.

    3.3.4 기술의 진보성

    기술의 진보성에 대한 D1(애플릿, 플러그인 자체접근성 여부)은 오아시스 서비스에서

    플러그인을 사용하지 않아 “해당 없음”으로 표기하였으며 자동 평가의 D2(마크업 언어로 구현 가능한 기능 자바스크립트로 구현 가능했는지 여부)는 체크가 불가능하였다. 하지만 전문가들의 평가에서는 준수율이 미흡했지만 평가결과를 얻을 수 있었다(<표 9> 참조).

    3.3.5 웹 접근성 준수 평가

    오아시스에 대한 웹 접근성 준수 여부에 대해 KADO-WAH 2.0으로 자동 평가 한 결과와 2차로 전문가 집단으로 구성된 전문가 평가를 실시한 결과를 기술하였다. 그 결과 자동평가와 전문가 평가에는 많은 차이점을 보였다. 자동 평가에서는 각 항목에 대해 평가를 하지 못한 것들이 많았다. 이는 웹을 구축하는 방법이 다양하고 프로그램 소스까지 확인이 가능한 전문가들과는 달리 정해진 규칙만을 평가하는 자동방식의 특성 때문으로 파악된다. 전문가 평가와 자동 평가의 결과가 같게 나온 인식의 용이성에 대한 항목을 제외하고는 전문가 평가에서 자동 평가보다 준수율이 높은 것으로 나타났지만, 이는 자동 평가가 코드에 대한 인식률이 떨어졌기 때문이다. 이해의 용이성은 전문가 평가와 자동 평가의 점수차이는 크지 않지만 전반적인 준수율이 낮아 우선적으로 보강해야 할 것으로 판단되었다.

    기술의 진보성에 대한 결과는 2개의 항목

    중 1개의 항목만 평가 대상에 포함되었으며 전문가 평가에서는 34%의 준수율을 보였다. 하지만 자동 평가로는 판단이 불가능하여 평가가 불가능하였다.

    <그림 1>은 각 항목에 대한 전문가 평가와 자동 평가를 비교한 그래프로 웹 접근성에 대한오아시스의 준수율은 평균 46%를 보였다. 웹접근성 준수율이 낮게 나온 것은 오아시스를 구축한 당시의 웹 구축의 유행에 따라 구축되었을뿐만 아니라, 웹 접근성이나 웹 표준을 고려하지 않고 구축하였기 때문인 것으로 파악되었다.

    4. 전통의학정보포털 설계 및 구현

    오아시스에 대한 평가결과 웹 접근성에 대해 전반적으로 낮은 준수율을 보였다. 이는 전통의학정보포털을 구축할 당시에는 장애인에 대한 배려나 구축 가이드라인이 없었기 때문으로 판단된다. 또한, 새로운 웹 콘텐츠 구축기법들이 나오면서 더욱 화려하게 만들려고만한 결과이다. 이는 웹에 접근하는 사용자의 이목을 잡기에만 목적을 두었고 사용에 대한 편리성은 뒷전으로 미루게 된 결과이다. 이를 극복하기 위한 방법으로는 장애인이 사용하는 보조기구의 특성을 파악하고 보조기구가 인식할 수 있는 웹 구축 가이드를 참조한 표준 코드를 사용해야 한다. 그리하여 웹 구축에 대한 각 항목별 고려사항을 제안하고 표준 웹 코드로 사용할 수 있도록 수정하였다.

       4.1 웹 접근성을 고려한 코드 설계

    4.1.1 인식의 용이성

    인식의 용이성을 증가시키기 위해서는 오아시스를 사용하는 사용자들에게 올바른 정보를 인식할 수 있도록 해야 한다. 그러므로 글자리 더기가 인식하기 쉬운 형태의 문자를 제공해야 한다.

    1) 오아시스에서 사용하는 모든 이미지와 아이콘에 의미를 파악할 수 있도록 텍스트를 제공하였다. 이는 웹 인식 보조 도구를 사용하는 장애인에게는 필수적인 내용이다. 그리하여, 기존에 이미지 설명이 없었던 파일을 모드텍스트 상당 어구(alt=“”이나 title=“”, longdesc=“문자”)를 제공하도록 하였다. 이는 텍스트는 음성 합성기(speech synthesizers)로 읽어 들일 수 있으며, 점자 표시로 출력이 가능하고 컴퓨터 모니터와 종이에 다양한 크기와 스타일로 표현될 수 있다.

    2) 조직도 및 검색 순위를 이미지로 제공하는 부분은 이를 보조할 수 있는 설명 텍스트를 병기하거나 텍스트로 대체해야 한다. 이는 시각장애인의 경우 정확한 색상 판단이 어려워 혼동을 일으킬 수 있기 때문이다. 그리하여 각 그래프마다 그래프 값을 입력한다든가, 색상이 아닌 빗금 등으로 구분하여 처리해야 하였다.

    3) 멀티미디어로 제공되는 서비스는 음성을 제공하던지 아니면 영상파일에 자막을 추가하여 텍스트를 인지할 수 있도록 대체 수단을 추가하였다. 시간 기준의 멀티미디어 트랙과 캡션 또는 청각적 설명이 동기화되도록 하였다. 동기화된 텍스트 자막은 청각장애인과 시각장애인의 시청각 자료로 접근할 수 있도록 해준다. , 요소의 src 속성값이 다음 확장명으로 끝난 파일에 대한 멀티미디어 콘텐츠가 사용된 경우 소리가 정보를 전달하도록 하였다.

    4) 통계 등에 사용하는 그래프의 경우 색상만으로 구분이 가능하도록 명료하게 제공해야 한다. 그리하여 이미지가 정보를 전달하기 위해 색상을 사용했다면 그 정보는 색상이외의 다른 방법으로 표현되어야 하였다. 색상만으로 구분이 어려울 경우에는 그래프에 색상이외에 배경 무늬를 넣어서 사용하였다.

    4.1.2 운용의 용이성

    장애인이 사용하는 화면 낭독프로그램 및 마우스를 사용할 수 없는 사용자를 위해 다음과 같은 기준을 준수해야 한다.

    1) 키보드만으로 웹페이지의 정보에 접근할 수 있도록 Javascript에서 마우스 이벤트로 처리하는 프로그램을 키보드 이벤트로 수정해야 한다. 이벤트 처리기를 “onfocus”, “onblur” 및 “onselect”와 같은 장치 독립적인 처리기로 제한할 것을 고려하고, 장치 독립적인 특성을 사용해야 하는 경우 키보드 방식을 제공해야 한다. 예를 들어, “onmousedown”의 경우 “onkeydown”도 지정하고, 마우스좌표에 의존하는 이벤트 처리기는 장치가 독립적이지 않으므로 사용할 수 없다. 그리하여 아래와 같이 마우스 이벤트 처리기를 키보드 이벤트 처리기로 수정하였다.

    2) 현재 사용하고 있는 “iframe”은 페이지의 제목은 고정되어 있으나 내용을 계속 변경하기 때문에 각 페이지에 대한 내용 파악이 정확히 되지 않는다. 그러므로 명료한 제목을 제공하기 위해 각 프레임에 대한 제목을 제공해야 한다. 그리하여 프레임 셋을 사용하는 경우, 각 프레임에 title=“”을 입력하여 해당페이지의 제목을 정확히 전달하도록 처리하였다.

    image

    3) 새 창을 사용하는 회원가입이나 오아시스 소개화면은 사용자에게 사전에 새 창이 작동함을 알릴 수 있는 레퍼런스를 제공해야 하며 사용자가 의도하지 않은 브라우저 창의 크기 변경 및 위치 이동 등이 발생하지 않도록 해야 한다.

    4.1.3 이해의 용이성

    장애인들의 웹페이지에 대한 이해력을 높이기 위한 방법으로는 테이블 구조로 보여주던 검색결과의 변경이 필요하다.

    1) 데이터테이블의 내용을 이해할 수 있도록 테이블에 Summary 속성이나 Caption 태그를 사용하고 layout table을 사용한 코드는 다른 코드로 대체해야 한다.

    2) 논문검색 목록 페이지에서 각 칼럼에 태그를 사용하여 제목과 내용을 명확히구분해야 한다.

    image

    3) 각 페이지에 적절한 제목을 제공하기 위해서 고정된 frame을 사용하는 경우 제목이 고정되기 때문에 사용자들에게 정확한 정보를 제공하지 못하므로 고정 frame을 피해야 한다.

    이를 방지하기 위해 프레임 셋 내에 를 사용하였다. 이렇게 하면 브라우저가 프레임을 지원하지 않는 경우 대체 콘텐츠가 제공된다. 하지만 각 프레임 셋은 프레임을 지원하지 않는 브라우저에서도 문서에 계속 접근이 가능하도록 보장하기 위해 유효한 noframes섹션을 포함해야 한다.</p> <div class="clickview"> <a href="#none"><img src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_e003.jpg" alt="image"></a> </div> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_58">4) 회원가입이나 논문 검색 화면은 주로 table로제공하는 경우가 많아 CTL키를 이용하는 경우 논리적 순서를 벗어나는 경우가 있었다. 그러므로 키보드 사용에 논리적인 순서를제공하기 위해서는 온라인 서식은 label을 사용하여 처리하여야 한다.</p> <div class="clickview"> <a href="#none"><img src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_e004.jpg" alt="image"></a> </div> <p class="pragraph" style="margin-bottom:20px;"> <span>4.1.4 기술의 진보성</span> </p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_59">오아시스에서는 RIA(Rich Internet Application)를 사용하지 않고 있지만 이를 회피하는 것은 기술의 진보성에 대한 해결 대상이 아니다. 새로운 웹 기술이 발전하고 있고 기존의동기식 통신에서 Ajax, flash 및 Flex를 저작도구로 이용하고 있어 이에 대한 대비가 필요하다(김석일 외 2008).</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_60">1) 오아시스의 새로운 기능을 추가하기 위해서는 반드시 필요한 기능들이므로 애플릿이나플러그인을 사용해 웹 접근성을 위한 대체 콘텐츠를 병행 제공해야 한다. 웹 콘텐츠 제작자들은 스크립트(Script) 시작 및 종료 태그 사이에 담긴 정보를 모든 웹 방문자들이 접근할 수있도록 보장하기 위해서 스크립트에 대한 텍스트 상당 어구를 제공해야 한다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_61">만약 슬라이드 쇼 동영상에서 패널을 진행시키기 위해서 자바스크립트(JavaScript) 같은 스크립팅 언어가 사용되거나 문서 속에 데이터를 삽입하기 위해 스크립트가 사용된다면noscript를 제공해야 하고 noscript 요소는클라이언트의 브라우저가 스크립트를 지원하지 않더라도 그 정보에 여전히 접근할 수 있도록 보장해야 한다. 그리하여, 오아시스에서는순수한 HTML코드와 Flex코드 위주로 구현하였으며 최소한의 Script만 사용하였다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_62">2) Client 기반의 Script Language가 발전하면서 많은 기능들은 스크립트에 의존하고 있다. 하지만 HTML로 구현이 가능한 부분은스크립트 언어로 구현해서는 안 된다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_63">이를 위해서는 자바스크립트의 독립적인 폼을 이용하거나, 보조적인 역할로만 이용해야한다. 스크립트의 submit 기능 대신에 form의 submit 기능을 이용하도록 수정해야 한다.</p> </div> <p class="pragraph" style="margin-bottom:20px;"> <span> <h3> <a href="javascript:artBodyCont(2,'results_101');" style="text-align: left; color: #0069AE; text-decoration: none;"> &nbsp;&nbsp; 4.2 웹 접근성을 고려한 시스템 구현 </a> </h3> </span> </p> <div name="Mainresults_101" id="Mainresults_101" style='display:block;' > <p class="pragraph" style="margin-bottom:20px;"> <span>4.2.1 인터페이스 구현</span> </p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_64">웹 접근성의 확보에 대한 혜택은 장애인이다. 하지만, 웹 접근성을 위해 사용된 코딩기법을 보면 시력이 좋지 않은 고령자나 웹 사용에 익숙하지 않은 사람들에게도 사용에 편리성을 제공해준다. 5.1에서 제시한 웹 접근을위한 코딩기법을 사용하여 기존의 한의학술시스템을 개편하여 전통의학정보포털로 구현하</p> <div class="clickviewa" id="pragraphfig2" style="display: block;"> <p class="mgb_10"> <a name="fig 2" style="text-align: left; color: #555555; text-decoration: none;">[fig 2] 전통의학정보포털 인터페이스 화면 </a> </p> <!-- div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgfig2')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgfig2" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgfig2')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('fig2')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div --> <div class="figurebox"> <img id="imgfig2" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f002.jpg" alt="label"> </div> </div> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_65">였다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_66">프레임 셋으로 구현되어 인식의 용이성과이해의 용이성에 상당한 위배를 보였던 사용자 인터페이스를 <<strong><a class='fig' href='javascript:;' value='66_F002' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f002.jpg" width="323"; height="207"px; />' title='[fig 2] 전통의학정보포털 인터페이스 화면'>그림 2</a></strong>>와 같이 수정하였다. 기존의 HTML코드를 Flash기반코드로 변환하면서 기술의 진보성에 위배될 우려가 있었으나, 최소한의 Script language를 사용하고 각 콘텐츠에 대체텍스트를 제공하였다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_67">또한, 회원가입 화면과 <strong><a class='fig' href='javascript:;' value='67_F003' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f003.jpg" width="546"; height="410"px; />' title='[Fig 3] 논문검색 결과화면'><그림 3></a></strong>과 같은 논문검색 결과화면처럼 온라인 서식과 검색에 대한 결과를 보여주기 위해 많이 사용되는 테이블 형태의 포맷은 기존의 <table>, <tr>, <td> 태그 대신에 <Lalel>, <th>, <col> 등으로 처리하였으며 키보드 스크립트 사용에 편리성을 추가하였다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_68">또한 각 이미지 및 테이블에 Caption을 추가하여 최대한 웹 접근성을 고려하였다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_69">또한, 오아시스는 구현 Tag뿐만 아니라 기존의 단순한 한의학술논문검색 시스템에서 분석 및 통계 기능과 동향정보 제공까지 서비스하는 포털 형태로 개편되었다. 그리하여 하나의 웹에서 여러 기능을 제공하기 위해서는 각 서비스 환경을 통합해야 할 필요성이 있다. 그래픽이 많은 분석기능을 추가하기 위해서는</p> <div class="clickviewa" id="pragraphFig3" style="display: block;"> <p class="mgb_10"> <a name="Fig 3" style="text-align: left; color: #555555; text-decoration: none;">[Fig 3] 논문검색 결과화면 </a> </p> <!-- div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgFig3')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgFig3" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgFig3')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Fig3')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div --> <div class="figurebox"> <img id="imgFig3" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f003.jpg" alt="label"> </div> </div> <div class="clickviewa" id="pragraphFig4" style="display: block;"> <p class="mgb_10"> <a name="Fig 4" style="text-align: left; color: #555555; text-decoration: none;">[Fig 4] 운용의 용이성을 고려한 그래프 </a> </p> <!-- div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgFig4')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgFig4" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgFig4')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Fig4')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div --> <div class="figurebox"> <img id="imgFig4" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f004.jpg" alt="label"> </div> </div> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_70">frame Tag를 사용할 수밖에 없어 운용의 용이성에 위배될 소지가 있었으나, 내용의 명료성을 이해 각 프레임에 대한 제목 및 설명을 제공하여 정확히 전달하도록 하였다. <strong><a class='fig' href='javascript:;' value='70_F004' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f004.jpg" width="620"; height="359"px; />' title='[Fig 4] 운용의 용이성을 고려한 그래프'><그림 4></a></strong>는 프로젝트 분석에서 사용된 그래프로 그래프 차트에 계열들의 색상과 값에 대한 모양을 주어 제공한 예시이다.</p> <p class="pragraph" style="margin-bottom:20px;"> <span>4.2.2 개편된 사이트 웹 접근성 평가 결과</span> </p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_71">이 장에서는 웹 접근성 향상을 위한 코드를 이용하여 개편된 오아시스에 대한 접근성 평가를 하였다. 평가방법은 “3. 웹 접근성 평가”에서 제시한 방법과 동일하게 실시하였다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_72"><strong><a class='fig' href='javascript:;' value='72_F005' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f005.jpg" width="640"; height="513"px; />' title='[Fig 5] 개편 후 웹 접근성 준수율(자동 평가)'><그림 5></a></strong>는 기존의 오아시스와 웹 표준을 적용하여 재구축한 오아시스에 대해 자동 평가 방법에 의한 웹 접근성 준수율을 비교한 그래프이다. 웹 접근성을 추가하면서 기존의 웹 페이지를 수정하기보다는 신규로 개발하였다. 그리하여 기존에는 비교대상에 포함되지 않았던 항목이 포함되었거나, 기존에 포함되었던 항목이 빠진 경우가 있다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_73">그래프의 결과 값에서 0%로 표기된 것은</p> <div class="clickviewa" id="pragraphFig5" style="display: block;"> <p class="mgb_10"> <a name="Fig 5" style="text-align: left; color: #555555; text-decoration: none;">[Fig 5] 개편 후 웹 접근성 준수율(자동 평가) </a> </p> <!-- div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgFig5')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgFig5" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgFig5')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Fig5')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div --> <div class="figurebox"> <img id="imgFig5" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f005.jpg" alt="label"> </div> </div> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_74">웹 접근성 준수를 전혀 하지 않은 것이고 그래프와 결과 값이 전혀 없는 항목은 구축에 사용되지 않아 평가 대상이 되지 않은 것이다. 자동 평가의 결과, 평균 89%의 결과로 개편 전 준수율 32%보다 향상된 것을 알 수 있었다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_75"><strong><a class='fig' href='javascript:;' value='75_F006' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f006.jpg" width="640"; height="513"px; />' title='[Fig 6] 개편 후 웹 접근성 준수율(전문가 평가)'><그림 6></a></strong>은 전문가 평가에 의한 결과이다. 이전에는 55%의 준수율을 보였으나 재구축 후 98%의 준수율을 보여 웹 접근성 준수를 충족한 것으로 판단하였다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_76">자동 평가와 같이 이전과 재구축 후에 대해 비교한 그래프로 자동 평가보다 더 높은 준수율을 나타내었다. KADO-WAH 2.0을 사용한 자동 평가보다 전문가 평가가 준수율이 높게 나타난 이유는 프로그램으로 정의되어 있</p> <div class="clickviewa" id="pragraphFig6" style="display: block;"> <p class="mgb_10"> <a name="Fig 6" style="text-align: left; color: #555555; text-decoration: none;">[Fig 6] 개편 후 웹 접근성 준수율(전문가 평가) </a> </p> <!-- div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgFig6')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgFig6" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgFig6')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Fig6')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div --> <div class="figurebox"> <img id="imgFig6" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f006.jpg" alt="label"> </div> </div> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_77">는 범위를 벗어난 코드를 인식하지 못한 결과로 파악된다. 전문가들은 소스레벨과 프로그램 흐름을 파악할 수 있지만, 자동 평가는 그렇지 못하기 때문이다.</p> </div> <p class="pragraph" style="margin-bottom:20px;"> <span> <h3> <a href="javascript:artBodyContMain(0,'conclusions_123');" style="text-align: left; color: #0069AE; text-decoration: none;"> 5. 결론 </a> </h3> </span> </p> <div name="Mainconclusions_123" id="Mainconclusions_123" style='display:block;' > <p class="pragraph" style="margin-bottom:20px;" id="pragraph_78">정보기술의 발전으로 기존의 텍스트 방식의 서비스에서 벗어나 웹사이트들은 화려해지고 동적인 페이지로 변화하고 있다. 시각적으로 화려함을 주기 위해 적용된 많은 기술들은 오히려 장애인들의 웹 접근성을 방해하는 요소가 되었다. 그렇다고 이를 해소하는 방식으로 많은 웹 어플리케이션 기술들을 지양하는 것은 옳지 않은 방법이다. 뿐만 아니라, 웹 접근성 향상을 위해 많은 저작기법을 포기하고 순수한 HTML로만 웹을 구축하는 것은 웹의 기술진보측면에서 옳지 않다(행정안전부 2009;WAI 홈페이지). 이를 극복하기 위한 방법으로 보조기구에서 인식할 수 있는 형식으로 문자를 사용해야 한다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_79">그리하여 본 논문에서는 정부에서 제정한 가이드라인을 기준으로 웹 접근성에 대한 평가항목을 선정하고 소프트웨어에 의한 자동 평가와 전문가 그룹에 의한 전문가 평가로 나누어 실시하였다. 그에 대한 결과를 개선하기 위해 표준 가이드라인 코드를 준수하여 새로운 오아시스 웹사이트를 구축하였다. 또한, 구축된 웹사이트에 대해 기존의 평가방법을 그대로 적용하고 어느 정도 개선이 되었는지 평가하여 웹 접근성 준수율이 기존의 46%에서 98%의 준수율을 얻었다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_80">웹 접근성이 확보되면 장애인뿐만 아니라 고령자 등 웹을 통한 정보제공에서 소외되었던 사람들에게 웹사이트를 효과적으로 이용할 수 있는 기회를 제공할 수 있어 오아시스의 사용 대상을 확대시킬 수 있을 것으로 기대된다.</p> <p class="pragraph" style="margin-bottom:20px;" id="pragraph_81">더 나아가 웹의 진보와 사회적 약자인 장애인들을 보호하기 위해서는 장애인들이 사용하는 보조기술의 개발과 웹사이트 제작자들에게 웹 접근성을 이해시키고 새로운 기술의 개발에 표준을 제시할 수 있을 것으로 판단된다.</p> </div> </li> </ul> </div> <div id="tabs-3" class="content_text"> <ul class="list_view"> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 1. 김 석일, 신 인철 2008 『웹 접근성을 고려한 신기술 콘텐츠 제작기법 -JavaScript FlexFlash를 중심으로-』 <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=『웹 접근성을 고려한 신기술 콘텐츠 제작기법 -JavaScript FlexFlash를 중심으로-』&pbx=1&oq=『웹 접근성을 고려한 신기술 콘텐츠 제작기법 -JavaScript FlexFlash를 중심으로-』&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 2. 남 재우, 김 성희 2009 기록정보서비스를 위한Web 2.0 적용에 관한 연구 [한국문헌정보학회지] Vol.43 P.123-146 <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=기록정보서비스를 위한Web 2.0 적용에 관한 연구&pbx=1&oq=기록정보서비스를 위한Web 2.0 적용에 관한 연구&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 3. 박 주현, 류 한영 2008 웹 접근성 향상을 위한시각장애인과 일반인의 감성비교 [감성과학] Vol.11 P.589-598 <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=웹 접근성 향상을 위한시각장애인과 일반인의 감성비교&pbx=1&oq=웹 접근성 향상을 위한시각장애인과 일반인의 감성비교&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 4. 정 덕길, 이 종훈, 노 영욱 2008 웹 접근성 지침에 의한 교육용 홈페이지의 적용 방안 및 비교분석 [한국해양정보통신학회논문지] Vol.12 P.1142-1147 <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=웹 접근성 지침에 의한 교육용 홈페이지의 적용 방안 및 비교분석&pbx=1&oq=웹 접근성 지침에 의한 교육용 홈페이지의 적용 방안 및 비교분석&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 5. 조 윤희 2009 시각장애인을 위한 공공도서관의웹 접근성 제고 방안 [한국문헌정보과학회지] Vol.43 P.335-354 <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=시각장애인을 위한 공공도서관의웹 접근성 제고 방안&pbx=1&oq=시각장애인을 위한 공공도서관의웹 접근성 제고 방안&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 6. 2008 『장애인 고령자 등을위한 웹 접근성 안내』 P.5 <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=『장애인 고령자 등을위한 웹 접근성 안내』&pbx=1&oq=『장애인 고령자 등을위한 웹 접근성 안내』&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 7. 2009 『웹 접근성 향상을 위한국가표준 기술 가이드라인』 P.1 <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=『웹 접근성 향상을 위한국가표준 기술 가이드라인』&pbx=1&oq=『웹 접근성 향상을 위한국가표준 기술 가이드라인』&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 8. 허 준호, 최 두진 2003 웹 접근성 관련 해외 정책동향 및 우리의 대응방안 [디지털정책연구] Vol.1 P.129-145 <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=웹 접근성 관련 해외 정책동향 및 우리의 대응방안&pbx=1&oq=웹 접근성 관련 해외 정책동향 및 우리의 대응방안&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 9. Leitner Marie-Luise, Strauss Christine 2008 『Exploratory Case Study Researchon Web Accessibility』 [LNCS] Vol.5105 P.490-497 <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=『Exploratory Case Study Researchon Web Accessibility』&pbx=1&oq=『Exploratory Case Study Researchon Web Accessibility』&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> <a href="http://dx.doi.org/10.1007/978-3-540-70540-6_70" target="_blank"> <img src="/central/images/new/title/btn_cross.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" height="17" width="53" alt="doi"> </a> </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 10. </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 11. </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 12. </div> </li> <li> <div class="board_text"> <!-- AUTHORS Year TITLE Source Links --> 13. </div> </li> </ul> </div> <div id="tabs-4" class="content_text"> <ul class="list_view"> <li> <h4><a href=""></a></h4> <div> <div id="chart_div"></div> </div> </li> </ul> </div> <div id="tabs-5" class="content_text"> <ul class="list_view"> <li> <div class="board_text"> <div id="imgListnum1"> <div data-label="Table 1">[Table 1]&nbsp;인식의 용이성에 대한 평가항목</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_t001.jpg" style="max-width:100%;" alt="인식의 용이성에 대한 평가항목"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum2"> <div data-label="Table 2">[Table 2]&nbsp;운용의 용이성에 대한 평가항목</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_t002.jpg" style="max-width:100%;" alt="운용의 용이성에 대한 평가항목"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum3"> <div data-label="Table 3">[Table 3]&nbsp;이해의 용이성에 대한 평가항목</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_t003.jpg" style="max-width:100%;" alt="이해의 용이성에 대한 평가항목"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum4"> <div data-label="Table 4">[Table 4]&nbsp;기술의 진보성에 대한 평가항목</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_t004.jpg" style="max-width:100%;" alt="기술의 진보성에 대한 평가항목"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum5"> <div data-label="Table 5">[Table 5]&nbsp;웹 접근성 평가방법</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_t005.jpg" style="max-width:100%;" alt="웹 접근성 평가방법"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum6"> <div data-label="Table 6">[Table 6]&nbsp;인식의 용이성에 대한 평가결과</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_t006.jpg" style="max-width:100%;" alt="인식의 용이성에 대한 평가결과"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum7"> <div data-label="Table 7">[Table 7]&nbsp;운용의 용이성에 대한 평가결과</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_t007.jpg" style="max-width:100%;" alt="운용의 용이성에 대한 평가결과"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum8"> <div data-label="Table 8">[Table 8]&nbsp;이해의 용이성에 대한 평가결과</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_t008.jpg" style="max-width:100%;" alt="이해의 용이성에 대한 평가결과"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum9"> <div data-label="Table 9">[Table 9]&nbsp;기술의 진보성에 대한 평가결과</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_t009.jpg" style="max-width:100%;" alt="기술의 진보성에 대한 평가결과"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum10"> <div data-label="Fig 1">[Fig 1]&nbsp;각 항목별 평가방법에 따른 결과</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_f001.jpg" style="max-width:100%;" alt="각 항목별 평가방법에 따른 결과"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum11"> <div data-label="fig 2">[fig 2]&nbsp;전통의학정보포털 인터페이스 화면</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_f002.jpg" style="max-width:100%;" alt="전통의학정보포털 인터페이스 화면"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum12"> <div data-label="Fig 3">[Fig 3]&nbsp;논문검색 결과화면</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_f003.jpg" style="max-width:100%;" alt="논문검색 결과화면"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum13"> <div data-label="Fig 4">[Fig 4]&nbsp;운용의 용이성을 고려한 그래프</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_f004.jpg" style="max-width:100%;" alt="운용의 용이성을 고려한 그래프"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum14"> <div data-label="Fig 5">[Fig 5]&nbsp;개편 후 웹 접근성 준수율(자동 평가)</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_f005.jpg" style="max-width:100%;" alt="개편 후 웹 접근성 준수율(자동 평가)"/> </div> </div> </div> </li> <li> <div class="board_text"> <div id="imgListnum15"> <div data-label="Fig 6">[Fig 6]&nbsp;개편 후 웹 접근성 준수율(전문가 평가)</div> <div> <img src="http://oak.go.kr/repository/journal/10499/GGJBCP_2010_v41n4_187_f006.jpg" style="max-width:100%;" alt="개편 후 웹 접근성 준수율(전문가 평가)"/> </div> </div> </div> </li> </ul> </div> </div> </div> <div class="board_text"> </div> </div> </div> </div> </div> </div> <script language="javascript" type="text/javascript"> // var keywords = ''; // if (keywords != '') { // //문장내 단어 변경 스크립트 // for(var num=0; num<=4; num++) { // artBT = document.getElementById("tran_area"+num).innerHTML; // artBT = artBT.replace(/keywords/gi,"<span class='main_texton'>"+keywords+"</span>"); // document.getElementById("tran_area"+num).innerHTML=artBT; // } // } function activeArtTAB2(id) { activeArtTAB(id); artBodyContTog(12, 'f'); artBCTogAll(id); } function artBCTogAll(id) { artBodyContTogAll(id); artBodyContLeftAll(); if(id == 2) artBodyContTogAll('ex'); } // ppt download - jhpark function DownPPT() { var aDown = confirm("Do you want to download this article images?"); if (aDown === true) { var form = $('#fInfo'); form.submit(); } return; } </script> <!-- <form id="fInfo" name="fInfo" method="post" target="extPPT" action="/central/journallist/extractPPT.do"> <input name="enJourTitle" type="hidden" value="Journal of Information Management"> <input name="enTitle" type="hidden" value="Design and Implementation of OASIS Considering Web Accessibility&lt;xref ref-type=&#034;corresp&#034; rid=&#034;cor1&#034;&gt;*&lt;/xref&gt;"> <input name="krTitle" type="hidden" value="웹 접근성을 고려한 전통의학정보포털 설계 및 구현"> <input name="volInfo" type="hidden" value="Volume 41, Issue4, p187~204, 30 Oct"> <input name="enAuthor" type="hidden" value="Han Jeong-Min, Jang Hyun-Chul, Kim Jin-Hyun, Yea Sang-Jun, Kim Sang-Kyun, Kim Chul, Song Mi-Young"> <input name="enOrgan" type="hidden" value="Han Jeong-Min; Jang Hyun-Chul; Kim Jin-Hyun; Yea Sang-Jun; Kim Sang-Kyun; Kim Chul; Song Mi-Young"> <input name="doi" type="hidden" value=""> <input name="pyear" type="hidden" value="2010"> <input name="aArticleSeq" type="hidden" value="10499"> <input name="aTabName" type="hidden" value="mainText"> </form> <iframe name="extPPT" width="0" height="0" style="displaey: none;" title="extPPTDown"></iframe> <div id="oakcen_conwrap"> <div id="oakcen_contents"> <div class="s_contentws pdb0"> <div class="or_line"> <div id="s_contents"> <div class="rounds_out mgb_20"> <div class="rounds_in"> <div class="boxCon"> <div class="rightarea" id="tran_area0"> <table border="0"> <tbody><tr> <td width="600"> <span class="tit" style="color: rgb(0, 105, 174); font-weight: bold;"> Design and Implementation of OASIS Considering Web Accessibility<xref ref-type="corresp" rid="cor1">*</xref> <br />웹 접근성을 고려한 전통의학정보포털 설계 및 구현 </span> <p class="txt" style="color: rgb(51, 51, 51);"> Han Jeong-Min, Jang Hyun-Chul, Kim Jin-Hyun, Yea Sang-Jun, Kim Sang-Kyun, Kim Chul, Song Mi-Young<br> <font size="2"> Han Jeong-Min; Jang Hyun-Chul; Kim Jin-Hyun; Yea Sang-Jun; Kim Sang-Kyun; Kim Chul; Song Mi-Young </font><br> Journal of Information Management Volume 41, Issue4, p187~204, 30 Oct 2010 </p> </td> </tr> </tbody></table> </div> <div class="sharing"> <a class="button01" style="margin-bottom: 1px;" href="/central/journallist/articlepdf.do?url=/repository/journal/10499/GGJBCP_2010_v41n4_187.pdf&article_seq=10499" target="_blank"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;PDF&nbsp;&nbsp;&nbsp;&nbsp;</span></a> <a class="button01" style="margin-bottom: 2px;" href="javascript:addTomyLib();"><span>Add to my library</span></a> <span class="addshare"> <a class="buladd" href="http://www.addthis.com/bookmark.php" target="_blank">share <img class="vam" alt="facebook 공유하기" src="/central/images/new/sub/iconface.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1"> <img class="vam" alt="twitter 공유하기" src="/central/images/new/sub/icontwitter.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1"> <img class="vam" alt="email 공유하기" src="/central/images/new/sub/iconemail.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1"> </a> </span> <div id="addtomylib" style="margin-top: 0px; margin-left: -120px; display: none; position: fixed; z-index: 10;"> <iframe src="/central/common/addmylibary.jsp;jsessionid=33F352C7D0FA573493AEB7E35A8881C1?idq=no&article_seq=10499&sekeywords=10499$$$Design and Implementation of OASIS Considering Web Accessibility&lt;xref ref-type=&#034;corresp&#034; rid=&#034;cor1&#034;&gt;*&lt;/xref&gt;$$$Han Jeong-Min, Jang Hyun-Chul, Kim Jin-Hyun, Yea Sang-Jun, Kim Sang-Kyun, Kim Chul, Song Mi-Young$$$Journal of Information Management$$$Volume 41, Issue4, p187~204, 30 Oct$$$2010" id="libarybody2" frameborder="0" width="300" height="170" marginwidth="0" marginheight="0" scrolling="no" title="연관 논문"></iframe> </div> </div> </div> </div> </div> <div class="containor"> <div class="sub_left"> <div class="search_tabW"> <ul class="search_tab"> <li class="on" id="articleMe01"><a href="javascript:activeArtTAB(1)">Abstract</a></li> <li class="li" id="articleMe02"><a href="javascript:activeArtTAB2(2);">Main Text</a></li> <li class="li" id="articleMe03"><a href="javascript:activeArtTAB(3);">References</a></li> <li class="li" id="articleMe04"><a href="javascript:activeArtTAB(4);">Metrics</a></li> <li class="li" id="articleMe06"><a href="javascript:activeArtTAB(6);">Related Articles</a></li> </ul> </div> <div class="dashline mgb_20 nbg clear" id="tran_area1"> <p class="pragraph"> <span style="text-align: left; color: rgb(0, 105, 174); text-decoration: none;">ABSTRACT</span> </p> <p class="pragraph"> <p>This study shows evaluation of how much OASIS meets “the korean web content accessibility guidelines” and analysis of some of the accessibility problems and their solutions in OASIS(Oriental Medicine Advanced Searching Integrated System) which is the only web site that offers papers and project information related to Traditional Medicine in Korea. The evaluation criteria to determine if OASIS is accessible is classified into four sub items; Perceivable - if information and user interface components is presentable to users in ways they can perceive, Operable - if user interface components and navigation are operable, Understandable - if information and the operation of user interface are understandable, Robust - if content is robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies. Based on the measured results, OASIS has just been redesigned and implemented in more accessible and effective way. OASIS that improves web accessibility for the disabled is expected to help them study oriental medicine more easily and conveniently by providing equal access and equal opportunity to use the web.</p><br> <p>본 논문에서는 국내에서 유일하게 한의학 학술논문 및 한의학 연구정보를 제공하는 오아시스(Oriental Medicine Advanced Searching Integrated System)를 대상으로 국가에서 정한 [웹 접근성 국가표준]을 어느 정도 반영하고 있는지 평가해 보고, 웹 접근 취약성을 분석하여 해결방법을 모색하였다.</p> <p>웹 접근성 평가항목으로는 웹 콘텐츠를 쉽게 인식할 수 있는 정도를 평가하는 인식의 용이성(Perceivable), 웹 콘텐츠를 누구나 쉽게 사용할 수 있는지를 평가하는 운용의 용이성(Operable), 콘텐츠 구성에 대해 쉽게 이해할 수 있도록 제어하고 있는지를 평가요소로 하는 이해의 용이성(Understandable),웹브라우저의 종류나 버전에 관계없이 정상적으로 동작하는지를 평가하는 기술의 진보성(Robust)으로 구분하여 평가하였다.</p> <p>평가된 결과를 기준으로 문제점을 분석하고 이를 토대로 장애인의 웹 접근성을 고려한 오아시스를 설계하고 구현하였다. 웹 취약성을 수정하여 재구축한 오아시스는 한의학 연구를 하는 청각, 시각 장애인들에게 일반인들과 동등한 웹 접근 기회를 부여해 줌으로써 장애인들의 한의학 지식습득에 많은 도움을 줄 것으로 기대된다.</p> </p> <p class="pragraph"> <span style="text-align: left; color: rgb(0, 105, 174); text-decoration: none;">KEYWORD</span> </p> <p class="pragraph"> Oriental Medicine Advanced Searching Integrated System , Web Accessibility , OASIS </p> <div> &nbsp;&nbsp;&nbsp;<a class="button01" href="javascript:history.back()" height="30"><span>&lt;&lt; Back &nbsp;&nbsp;</span></a> </div> </div> <div class="dashline mgb_20 nbg clear" id="tran_area2" style="display: none;"> <div class="popbdmaintext_rcs"> <p align="right" class="pragraph"> <a class="button01" href="javascript:artBCTogAll('ex')"><span>▽ Expand all</span></a> <a class="button01" href="javascript:artBCTogAll('co')"><span>△ Collapse all</span></a> &nbsp;&nbsp;&nbsp;&nbsp; </p> <p class="pragraph"> <span> <a href="javascript:artBodyContMain(0,'intro_1');" style="text-align: left; color: #0069AE; text-decoration: none;"> 1. 서론 </a> </span> </P> <div name="Mainintro_1" id="Mainintro_1" style='display:none;' > <p class="pragraph" id="pragraph_1">다양한 웹 구현 도구의 발전으로 기존의 단조로운 텍스트와 이미지만으로 구성되었던 웹사이트들이 더욱 화려해지고 동적으로 변화하고 있다. 이러한 웹 구축 기법의 발전은 일반 사용자들에게는 다양한 콘텐츠를 사용할 수 있는 이점이 있지만, 음성 및 문자인식 보조기구를 사용해야만 웹사이트 접근이 가능한 장애인들에게는 자유로운 웹 사용을 방해하는요소가 되고 있다.</p> <p class="pragraph" id="pragraph_2">시각 장애인들이 웹사이트를 이용하기 위해서는 웹사이트의 내용을 읽어 주는 문자인식 장치를 사용해야 하는데, 이 장치가 문자를 인식하기 위해서는 웹 페이지 자체에 캡션을 표준 규칙에 맞게 코딩되어 있어야 한다. 또한, 청각장애인에게는 영상에 대한 문자변환 프로그램이나 음악에 대한 자막변환 인식장치에 호환될 수 있는 웹 구축이 필요하다. 하지만, 이러한 작업은 웹 개발자에게는 불필요한 일이나 번거로운 일로 생각되기 십상이었다.</p> <p class="pragraph" id="pragraph_3">2009년 4월 11일부터「장애인차별금지 및 권리구제에 관한 법률」이 시행되어 우리나라에서도 웹사이트에 장애인들에 대한 차별금지에 대한 법률이 발효되면서 정부 및 공공기관을 시작으로 인터넷 웹 콘텐츠의 접근성에 대한 표준화 준수와 접근성 향상을 위한 노력이 확산되고 있다(행정안전부 2008, 5).</p> <p class="pragraph" id="pragraph_4">행정안전부에서는 제정한 「웹 접근성 향상을 위한 국가표준 기술 가이드라인」을 제정하여 “인터넷 웹 접근성 지침”을 기반으로 웹사이트 콘텐츠에 접근하려는 장애인 등이 비장애인 등과 동등하게 웹 콘텐츠에 접근하여 자유롭게 이용하도록 웹사이트 설계자 및 운영자, 웹 콘텐츠 개발자들이 웹사이트를 구축하고 운영할 때 국가 표준에 따른 기술 구현방법 등을 준수해야 한다고 규정하였다(행정안전부2009, 1).</p> <p class="pragraph" id="pragraph_5">국외에서는 웹사이트 구축 시 장애인을 배려한 구축 가이드라인을 이미 제정하여 운용하고 있다. 미국은 2001년 6월에 웹 접근성을 위해 「재활법 508조(Section 508 of the Rehabilitation Act)」에 의거, 연방정부 및 소속기관에서 제공하는 모든 웹사이트에 웹 접근성 준수를 의무화하였으며 W3C(국제표준화기구)의 지침을 기초로 16개 항목에 대한웹 접근성 지침 제정하였다. 영국은 1995년에 제정된 「장애인차별금지법 (Disability Discrimination Act)」의거, 2004년 10월부터 웹사이트 이용에 웹 접근성 준수를 의무화하였다. 이를 위해 W3C의 ‘웹 콘텐츠 접근성 지침 1.0’을 활용, 「PAS(Publicly Available Specification)78」이라는 웹 접근지침 해설, 평가방법을 포함한 가이드라인 마련(‘06년)하여 배포하였다(허준호, 최두진 2003).</p> <p class="pragraph" id="pragraph_6">위 사례에서 보듯이 많은 나라들은 일찍이 웹 접근성 준수 의무를 규정하고 가이드라인을 만들어 장애인뿐만 아니라 모든 사람이 정보통신기기나 서비스를 손쉽게 활용할 수 있도록 노력하고 있는 상황이다.</p> <p class="pragraph" id="pragraph_7">그리하여 본 논문은 웹사이트 구축 시 이러한 국?내외 움직임을 고려하여 한국한의학연구원에서 운영하고 있는 전통의학 정보포털인 오아시스에 대해 “장애인 차별금지법”과 “웹접근성 향상을 위한 국가표준 기술 가이드라인”에서 요구하는 기준을 어느 정도 준수하고 있는지 평가하였다. 그리고 평가의 결과에 의거하여 웹 접근성의 미반영 내용과 접근 취약성을 분석하여 웹 표준을 준수하도록 코드를수정하고 1차에서 평가한 웹 표준 평가 기준을 적용하여 2차 평가를 실시하였다.</p> </div> <p class="pragraph"> <span> <a href="javascript:artBodyContMain(0,'methods_9');" style="text-align: left; color: #0069AE; text-decoration: none;"> 2. 연구방법 </a> </span> </P> <div name="Mainmethods_9" id="Mainmethods_9" style='display:none;' > </div> <p class="pragraph"> <span> <a href="javascript:artBodyCont(1,'methods_10');" style="text-align: left; color: #0069AE; text-decoration: none;"> &nbsp;&nbsp; 2.1 연구대상 </a> </span> </P> <div name="Mainmethods_10" id="Mainmethods_10" style='display:none;' > <p class="pragraph" id="pragraph_8">한의학연구원을 비롯하여 11개 학의과 대학 및 부설연구소, 대한한의학회 및 분과학회에서 발행하는 총 44종 학술지를 구축하여 논문서비스를 하고 있는 오아시스를 웹 접근성 평가 대상으로 선정하였다.</p> <p class="pragraph" id="pragraph_9">오아시스(OASIS)는 한의학학술논문에 대하여 기본검색, 주제별 검색, 통계자료 등을 제공하고 있으며 논문에 대한 서지, 초록 및 원문 PDF파일을 제공하고 있어 한의학연구자들에게 다양한 한의학 관련 서비스를 제공하고 있는 시스템이다(오아시스 홈페이지).</p> <p class="pragraph" id="pragraph_10">그러므로 전통의학정보포털은 우리나라 최대의 한의학술논문을 서비스하고 있는 사이트로 웹 접근성 준수에 대한 중요성이 크다.</p> </div> <p class="pragraph"> <span> <a href="javascript:artBodyCont(2,'methods_14');" style="text-align: left; color: #0069AE; text-decoration: none;"> &nbsp;&nbsp; 2.2 선행연구 </a> </span> </P> <div name="Mainmethods_14" id="Mainmethods_14" style='display:none;' > <p class="pragraph" id="pragraph_11">본 연구를 위하여 다른 곳에서는 웹 접근성 향상을 위해 어떤 방법을 제시하고 연구하는지 조사하였다.</p> <p class="pragraph" id="pragraph_12">정덕길 등(2008)은 “웹 접근성 지침에 의한 교육용 홈페이지의 적용방안 및 비교분석”이라는 논문을 통해 웹 접근성 평가도구인 KADO-WAH를 활용하여 교육관련 홈페이지를 평가하는 방법을 제시하였다. 또한, 평가결과에 나타난 오류와 경고 항목을 평가보고서에서 요구하는 방향으로 수정하여 웹 접근성을 향상 시키는 방안을 제시하였다.</p> <p class="pragraph" id="pragraph_13">Marie-Luise leitner과 Christine Strauss(2008)는 “Exploratory Case Study Research on Web Accessibility”에서 웹 접근성 평가에 대한 다양한 기술적 방법에 대해 설명하고 웹 접근에 대한 사회적 책임, 법적요구, 경제적 혜택으로 나누어 설명하였다. 웹 접근성을 위해 새로운 디자인을 위해 사례연구를하여 비즈니스 웹 사이트의 Embedded 웹 사이트 구조를 제안하였다.</p> <p class="pragraph" id="pragraph_14">Michael G. Paciello의 “Web Accessibility for People with disabilities”에서는 웹을 사용하는 일반인과 장애인들에 대해 설명하고 증가되는 장애인들에 대해 설명하였다. 웹에 접근할 권리는 장애인에게도 동등하다고 주장하며 법적요구와 정책적 표준을 설명하였다. 또한, 각 나라들의 웹 접근성 가이드라인에 대해 정리하였다.</p> <p class="pragraph" id="pragraph_15">조윤희(2009)는 “시각장애인을 위한 공공도서관의 웹 접근성 제고방안”에서 일반인과 장애인의 정보제공 서비스에 대한 격차를 분석하고 공공도서관의 웹 접근성에 대해 4가지 항목에 대한 평가결과를 기준으로 개선해야 할 부분을 정리하였다.</p> <p class="pragraph" id="pragraph_16">박주현과 류한영(2008)은 “웹 접근성 향상을 위한 시각장애인과 일반인의 감성 비교”에서 시각장애인의 감성적 특성을 분석하여 웹 접근성 지침에 반영하기 위해 동일한 청각자극에 대한 시각장애인과 일반인의 감성반응을 비교하고 그 차이점을 비교하였다. 이를 위해 음악과 음향효과를 이용한 15개의 청각자극과 긍정 및 부정 감성어휘를 이용한 11개의 감성평가척도를 선정하여 웹 설문시스템을 이용, 31명의 시각장애인과 53명의 일반인을 대상으로 감성반응을 측정하였다. 그 결과 장애인과 일반인의 감성욕구가 다르지 않음을 보였고 웹 접근성에 대한 연구에서 장애인의 감성적 욕구에 대한 고려가 반드시 필요하다고 하였다.</p> <p class="pragraph" id="pragraph_17">위에서 보는 바와 같이 웹 접근성에 대한 웹</p> <div class="clickviewa" id="pragraphTable1" style="display: none;"> <p class="mgb_10"> <a name="Table 1" style="text-align: left; color: #555555; text-decoration: none;">[Table 1] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgTable1')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgTable1" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgTable1')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Table1')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgTable1" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t001.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <p class="pragraph" id="pragraph_18">사이트 분석 및 감성 비교를 통한 장애인에 대한 고려 등 다양한 연구가 있었음을 파악하였다.</p> </div> <p class="pragraph"> <span> <a href="javascript:artBodyContMain(0,'discussion_24');" style="text-align: left; color: #0069AE; text-decoration: none;"> 3. 웹 접근성 평가 </a> </span> </P> <div name="Maindiscussion_24" id="Maindiscussion_24" style='display:none;' > </div> <p class="pragraph"> <span> <a href="javascript:artBodyCont(1,'discussion_25');" style="text-align: left; color: #0069AE; text-decoration: none;"> &nbsp;&nbsp; 3.1 웹 접근성 평가항목 </a> </span> </P> <div name="Maindiscussion_25" id="Maindiscussion_25" style='display:none;' > <p class="pragraph" id="pragraph_19">웹 접근성에 대한 평가항목은 행정자치부에서 정한 가이드를 기준으로 오아시스의 모든 웹페이지에 적용하였다.</p> <p class="pragraph" id="pragraph_20">웹 접근성을 평가해야 할 항목으로는 크게 인식의 용이성(perceivable), 운용의 용이성(operable), 이해의 용이성(understandable), 기술의 진보성(robust)으로 분류하고 각 항목별로 세부항목을 선정하였으며 각 항목에 대한 상세한 내용은 다음과 같다(행정안전부2008; 웹 접근성 연구소 홈페이지).</p> <p class="pragraph"> <span>3.1.1 인식의 용이성</span> </p> <p class="pragraph" id="pragraph_21">인식의 용이성은 웹사이트에서 서비스하고있는 모든 콘텐츠에 대해서 누구든지 쉽게 인식할 수 있는 정도를 평가하는 요소로 세부 내용은 <strong><a class='fig' href='javascript:;' value='21_T001' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t001.jpg" width="633"; height="176"px; />' title='[Table 1] 인식의 용이성에 대한 평가항목'><표 1></a></strong>과 같다.</p> <p class="pragraph"> <span>3.1.2 운용의 용이성</span> </p> <p class="pragraph" id="pragraph_22">운용의 용이성은 웹 콘텐츠에 포함된 모든 요소들의 기능을 누구나 쉽게 사용할 수 있도록 구성하였는지에 대한 평가요소로 세부 내용은 <strong><a class='fig' href='javascript:;' value='22_T002' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t002.jpg" width="630"; height="255"px; />' title='[Table 2] 운용의 용이성에 대한 평가항목'><표 2></a></strong>와 같다.</p> <p class="pragraph"> <span>3.1.3 이해의 용이성</span> </p> <p class="pragraph" id="pragraph_23">이해의 용이성은 사용자들이 콘텐츠의 구성에 대해 쉽게 이해할 수 있도록 제어하고 있는</p> <div class="clickviewa" id="pragraphTable2" style="display: none;"> <p class="mgb_10"> <a name="Table 2" style="text-align: left; color: #555555; text-decoration: none;">[Table 2] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgTable2')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgTable2" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgTable2')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Table2')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgTable2" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t002.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <div class="clickviewa" id="pragraphTable3" style="display: none;"> <p class="mgb_10"> <a name="Table 3" style="text-align: left; color: #555555; text-decoration: none;">[Table 3] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgTable3')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgTable3" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgTable3')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Table3')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgTable3" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t003.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <div class="clickviewa" id="pragraphTable4" style="display: none;"> <p class="mgb_10"> <a name="Table 4" style="text-align: left; color: #555555; text-decoration: none;">[Table 4] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgTable4')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgTable4" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgTable4')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Table4')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgTable4" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t004.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <p class="pragraph" id="pragraph_24">지를 평가하는 요소로 세부 내용은 <strong><a class='fig' href='javascript:;' value='24_T003' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t003.jpg" width="632"; height="197"px; />' title='[Table 3] 이해의 용이성에 대한 평가항목'><표 3></a></strong>과 같다.</p> <p class="pragraph"> <span>3.1.4 기술의 진보성</span> </p> <p class="pragraph" id="pragraph_25">기술의 진보성은 구성한 콘텐츠가 웹브라우저의 종류나 버전에 관계없이 정상적으로 사용 가능한지와 웹 콘텐츠 저작도구의 종류에 관계없이 작동되는지에 대한 평가요소로 세부 내용은 <strong><a class='fig' href='javascript:;' value='25_T004' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t004.jpg" width="632"; height="160"px; />' title='[Table 4] 기술의 진보성에 대한 평가항목'><표 4></a></strong>와 같다.</p> </div> <p class="pragraph"> <span> <a href="javascript:artBodyCont(2,'discussion_40');" style="text-align: left; color: #0069AE; text-decoration: none;"> &nbsp;&nbsp; 3.2 웹 접근성 평가방법 </a> </span> </P> <div name="Maindiscussion_40" id="Maindiscussion_40" style='display:none;' > <p class="pragraph" id="pragraph_26">웹 접근성을 평가하는 방법에는 <strong><a class='fig' href='javascript:;' value='26_T005' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t005.jpg" width="630"; height="194"px; />' title='[Table 5] 웹 접근성 평가방법'><표 5></a></strong>와 같이 장애인, 고령자들이 해당사이트를 직접 접속하여 사용하며 평가하는 사용자 평가와 웹 접근성 전문가들로 구성된 전문가들에 의한 전문가 평가, 그리고 접근성을 평가하기 위한 소프트웨어를 이용하는 자동 평가 방법으로 나눌 수 있다. 각 평가방법에는 장?단점이있으며, 특히 사용자 평가는 가장 정확한 결과를 얻을 수 있는 반면, 실험자를 구하기 힘든 단점이 있다. 더욱이, 일반 포털사이트가 아닌 한의학이라는 특수한 분야이기 때문에 실험대상이 되기 위해서는 한의학적 지식도 필요하다. 각 평가방법에 대한 내용은 다음 <strong><a class='fig' href='javascript:;' value='26_T005' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t005.jpg" width="630"; height="194"px; />' title='[Table 5] 웹 접근성 평가방법'><표 5></a></strong>와 같다.</p> <p class="pragraph" id="pragraph_27">전문가 평가에서는 웹 접근성의 모든 지표에 대한 평가와 웹페이지 프로그램 코드 레벨수준에서의 평가를 할 수 있지만 장애인의 시각에서 평가하기에는 한계가 있다.</p> <p class="pragraph" id="pragraph_28">자동 평가는 S/W에 의한 평가로, 국가에서 정한 웹 표준을 단순히 분석하는 방법으로 평가시간이 짧아 이용하기 편하지만, 예외사항</p> <div class="clickviewa" id="pragraphTable5" style="display: none;"> <p class="mgb_10"> <a name="Table 5" style="text-align: left; color: #555555; text-decoration: none;">[Table 5] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgTable5')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgTable5" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgTable5')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Table5')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgTable5" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t005.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <p class="pragraph" id="pragraph_29">에 대한 대처가 느리고 프로그램 되어 있는 부분만 분석하기 때문에 같은 동작을 하더라도 프로그램 코드에 따라 결과가 다르게 나타날수 있는 단점이 있다.</p> <p class="pragraph" id="pragraph_30">그리하여 본 논문에서는 평가를 위한 여러 방법 중 테스트 환경이 비교적 간편한 자동 평가와 소스레벨까지 분석이 가능한 전문가 평가를 실시하였다. 또한, 평가의 정확성을 위해 1차는 자동 평가로, 2차는 전문가 평가로 나누어 실시하였다.</p> <p class="pragraph" id="pragraph_31">전문가 평가는 웹 프로그램 분석이 가능하고 소프트웨어에 대한 지식을 보유한 컴퓨터 공학 박사학위 취득자 5인을 선정하였으며, 자동 평가는 웹 접근성 평가 소프트웨어인 KADO-WAH 2.0을 이용하였다(행정안전부2008; 한국정보화진흥원 홈페이지).</p> </div> <p class="pragraph"> <span> <a href="javascript:artBodyCont(3,'discussion_48');" style="text-align: left; color: #0069AE; text-decoration: none;"> &nbsp;&nbsp; 3.3 웹 접근성 평가결과 </a> </span> </P> <div name="Maindiscussion_48" id="Maindiscussion_48" style='display:none;' > <p class="pragraph"> <span>3.3.1 인식의 용이성</span> </p> <p class="pragraph" id="pragraph_32">인식의 용이성에 대한 평가항목 중에서 A2(배경이미지 대체콘텐츠 제공 여부), A3(멀티미디어 콘텐츠 인식을 위한 대체 수단 제공 여부)에 대해서는 오아시스의 서비스에서 제공하지 않고 있어 평가결과에 “해당 없음”으로 표시하고 평균준수율에 반영하지 않았다. 인식의 용이성에 대한 각 항목에 대한 평가결과와 자동 평가, 전문가 평가의 준수율은 <strong><a class='fig' href='javascript:;' value='32_T006' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t006.jpg" width="639"; height="239"px; />' title='[Table 6] 인식의 용이성에 대한 평가결과'><표6></a></strong>과 같은 결과를 볼 수 있다.</p> <p class="pragraph"> <span>3.3.2 운용의 용이성</span> </p> <p class="pragraph" id="pragraph_33">운용의 용이성에 대한 7개 평가항목에 대한 평가결과는 <strong><a class='fig' href='javascript:;' value='33_T007' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t007.jpg" width="639"; height="331"px; />' title='[Table 7] 운용의 용이성에 대한 평가결과'><표 7></a></strong>과 같다. B1(이미지맵을 제공할 경우 대체콘텐츠 제공)은 오아시스에서</p> <div class="clickviewa" id="pragraphTable6" style="display: none;"> <p class="mgb_10"> <a name="Table 6" style="text-align: left; color: #555555; text-decoration: none;">[Table 6] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgTable6')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgTable6" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgTable6')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Table6')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgTable6" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t006.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <div class="clickviewa" id="pragraphTable7" style="display: none;"> <p class="mgb_10"> <a name="Table 7" style="text-align: left; color: #555555; text-decoration: none;">[Table 7] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgTable7')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgTable7" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgTable7')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Table7')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgTable7" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t007.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <p class="pragraph" id="pragraph_34">사용한 콘텐츠가 없으므로 해당사항이 없었으며, B2(프레임을 제공할 경우 적절한 타이틀 제공)는 대체적으로 준수한 것으로 나타났으나 1차 평가인 자동 평가에서는 평가대상이 4로 측정하였다. 하지만 전문가 평가에서는 평가대상이 820개로 나타났으며 약 94건이 가이드라인을 지키지 못한 것으로 나타나, 자동평가의 결과와 상당한 차이를 보였다.</p> <p class="pragraph" id="pragraph_35">B5~B7은 자동 평가로는 분석자체가 불가능하였으나 전문가 평가를 통한 결과를 확인할 수 있었다.</p> <p class="pragraph"> <span>3.3.3 이해의 용이성</span> </p> <p class="pragraph" id="pragraph_36">이해의 용이성에 대한 C1(테이블에 대한 정보제공 여부)과 C2(테이블 제목과 내용 셀 구분 여부)는 검사항목에 대한 개수 차이가 있었으나, 자동 평가와 전문가 평가 모두에서 준수하지 못한 것으로 나타났다. C3~C5는 자동평가에서 분석되지 않았으나 2차 전문가 평가에서는 분석해야 할 항목이 있는 것으로 나타났으며 결과는 아래 <strong><a class='fig' href='javascript:;' value='36_T008' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t008.jpg" width="634"; height="279"px; />' title='[Table 8] 이해의 용이성에 대한 평가결과'><표 8></a></strong>과 같다.</p> <p class="pragraph"> <span>3.3.4 기술의 진보성</span> </p> <p class="pragraph" id="pragraph_37">기술의 진보성에 대한 D1(애플릿, 플러그인 자체접근성 여부)은 오아시스 서비스에서</p> <div class="clickviewa" id="pragraphTable8" style="display: none;"> <p class="mgb_10"> <a name="Table 8" style="text-align: left; color: #555555; text-decoration: none;">[Table 8] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgTable8')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgTable8" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgTable8')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Table8')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgTable8" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t008.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <div class="clickviewa" id="pragraphTable9" style="display: none;"> <p class="mgb_10"> <a name="Table 9" style="text-align: left; color: #555555; text-decoration: none;">[Table 9] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgTable9')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgTable9" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgTable9')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Table9')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgTable9" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t009.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <p class="pragraph" id="pragraph_38">플러그인을 사용하지 않아 “해당 없음”으로 표기하였으며 자동 평가의 D2(마크업 언어로 구현 가능한 기능 자바스크립트로 구현 가능했는지 여부)는 체크가 불가능하였다. 하지만 전문가들의 평가에서는 준수율이 미흡했지만 평가결과를 얻을 수 있었다(<strong><a class='fig' href='javascript:;' value='38_T009' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_t009.jpg" width="634"; height="197"px; />' title='[Table 9] 기술의 진보성에 대한 평가결과'><표 9></a></strong> 참조).</p> <p class="pragraph"> <span>3.3.5 웹 접근성 준수 평가</span> </p> <p class="pragraph" id="pragraph_39">오아시스에 대한 웹 접근성 준수 여부에 대해 KADO-WAH 2.0으로 자동 평가 한 결과와 2차로 전문가 집단으로 구성된 전문가 평가를 실시한 결과를 기술하였다. 그 결과 자동평가와 전문가 평가에는 많은 차이점을 보였다. 자동 평가에서는 각 항목에 대해 평가를 하지 못한 것들이 많았다. 이는 웹을 구축하는 방법이 다양하고 프로그램 소스까지 확인이 가능한 전문가들과는 달리 정해진 규칙만을 평가하는 자동방식의 특성 때문으로 파악된다. 전문가 평가와 자동 평가의 결과가 같게 나온 인식의 용이성에 대한 항목을 제외하고는 전문가 평가에서 자동 평가보다 준수율이 높은 것으로 나타났지만, 이는 자동 평가가 코드에 대한 인식률이 떨어졌기 때문이다. 이해의 용이성은 전문가 평가와 자동 평가의 점수차이는 크지 않지만 전반적인 준수율이 낮아 우선적으로 보강해야 할 것으로 판단되었다.</p> <p class="pragraph" id="pragraph_40">기술의 진보성에 대한 결과는 2개의 항목</p> <div class="clickviewa" id="pragraphFig1" style="display: none;"> <p class="mgb_10"> <a name="Fig 1" style="text-align: left; color: #555555; text-decoration: none;">[Fig 1] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgFig1')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgFig1" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgFig1')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Fig1')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgFig1" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f001.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <p class="pragraph" id="pragraph_41">중 1개의 항목만 평가 대상에 포함되었으며 전문가 평가에서는 34%의 준수율을 보였다. 하지만 자동 평가로는 판단이 불가능하여 평가가 불가능하였다.</p> <p class="pragraph" id="pragraph_42"><strong><a class='fig' href='javascript:;' value='42_F001' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f001.jpg" width="640"; height="556"px; />' title='[Fig 1] 각 항목별 평가방법에 따른 결과'><그림 1></a></strong>은 각 항목에 대한 전문가 평가와 자동 평가를 비교한 그래프로 웹 접근성에 대한오아시스의 준수율은 평균 46%를 보였다. 웹접근성 준수율이 낮게 나온 것은 오아시스를 구축한 당시의 웹 구축의 유행에 따라 구축되었을뿐만 아니라, 웹 접근성이나 웹 표준을 고려하지 않고 구축하였기 때문인 것으로 파악되었다.</p> </div> <p class="pragraph"> <span> <a href="javascript:artBodyContMain(0,'results_70');" style="text-align: left; color: #0069AE; text-decoration: none;"> 4. 전통의학정보포털 설계 및 구현 </a> </span> </P> <div name="Mainresults_70" id="Mainresults_70" style='display:none;' > <p class="pragraph" id="pragraph_43">오아시스에 대한 평가결과 웹 접근성에 대해 전반적으로 낮은 준수율을 보였다. 이는 전통의학정보포털을 구축할 당시에는 장애인에 대한 배려나 구축 가이드라인이 없었기 때문으로 판단된다. 또한, 새로운 웹 콘텐츠 구축기법들이 나오면서 더욱 화려하게 만들려고만한 결과이다. 이는 웹에 접근하는 사용자의 이목을 잡기에만 목적을 두었고 사용에 대한 편리성은 뒷전으로 미루게 된 결과이다. 이를 극복하기 위한 방법으로는 장애인이 사용하는 보조기구의 특성을 파악하고 보조기구가 인식할 수 있는 웹 구축 가이드를 참조한 표준 코드를 사용해야 한다. 그리하여 웹 구축에 대한 각 항목별 고려사항을 제안하고 표준 웹 코드로 사용할 수 있도록 수정하였다.</p> </div> <p class="pragraph"> <span> <a href="javascript:artBodyCont(1,'results_72');" style="text-align: left; color: #0069AE; text-decoration: none;"> &nbsp;&nbsp; 4.1 웹 접근성을 고려한 코드 설계 </a> </span> </P> <div name="Mainresults_72" id="Mainresults_72" style='display:none;' > <p class="pragraph"> <span>4.1.1 인식의 용이성</span> </p> <p class="pragraph" id="pragraph_44">인식의 용이성을 증가시키기 위해서는 오아시스를 사용하는 사용자들에게 올바른 정보를 인식할 수 있도록 해야 한다. 그러므로 글자리 더기가 인식하기 쉬운 형태의 문자를 제공해야 한다.</p> <p class="pragraph" id="pragraph_45">1) 오아시스에서 사용하는 모든 이미지와 아이콘에 의미를 파악할 수 있도록 텍스트를 제공하였다. 이는 웹 인식 보조 도구를 사용하는 장애인에게는 필수적인 내용이다. 그리하여, 기존에 이미지 설명이 없었던 파일을 모드텍스트 상당 어구(alt=“”이나 title=“”, longdesc=“문자”)를 제공하도록 하였다. 이는 텍스트는 음성 합성기(speech synthesizers)로 읽어 들일 수 있으며, 점자 표시로 출력이 가능하고 컴퓨터 모니터와 종이에 다양한 크기와 스타일로 표현될 수 있다.</p> <p class="pragraph" id="pragraph_46">2) 조직도 및 검색 순위를 이미지로 제공하는 부분은 이를 보조할 수 있는 설명 텍스트를 병기하거나 텍스트로 대체해야 한다. 이는 시각장애인의 경우 정확한 색상 판단이 어려워 혼동을 일으킬 수 있기 때문이다. 그리하여 각 그래프마다 그래프 값을 입력한다든가, 색상이 아닌 빗금 등으로 구분하여 처리해야 하였다.</p> <p class="pragraph" id="pragraph_47">3) 멀티미디어로 제공되는 서비스는 음성을 제공하던지 아니면 영상파일에 자막을 추가하여 텍스트를 인지할 수 있도록 대체 수단을 추가하였다. 시간 기준의 멀티미디어 트랙과 캡션 또는 청각적 설명이 동기화되도록 하였다. 동기화된 텍스트 자막은 청각장애인과 시각장애인의 시청각 자료로 접근할 수 있도록 해준다. <img>, <input> 요소의 src 속성값이 다음 확장명으로 끝난 파일에 대한 멀티미디어 콘텐츠가 사용된 경우 소리가 정보를 전달하도록 하였다.</p> <p class="pragraph" id="pragraph_48">4) 통계 등에 사용하는 그래프의 경우 색상만으로 구분이 가능하도록 명료하게 제공해야 한다. 그리하여 이미지가 정보를 전달하기 위해 색상을 사용했다면 그 정보는 색상이외의 다른 방법으로 표현되어야 하였다. 색상만으로 구분이 어려울 경우에는 그래프에 색상이외에 배경 무늬를 넣어서 사용하였다.</p> <p class="pragraph"> <span>4.1.2 운용의 용이성</span> </p> <p class="pragraph" id="pragraph_49">장애인이 사용하는 화면 낭독프로그램 및 마우스를 사용할 수 없는 사용자를 위해 다음과 같은 기준을 준수해야 한다.</p> <p class="pragraph" id="pragraph_50">1) 키보드만으로 웹페이지의 정보에 접근할 수 있도록 Javascript에서 마우스 이벤트로 처리하는 프로그램을 키보드 이벤트로 수정해야 한다. 이벤트 처리기를 “onfocus”, “onblur” 및 “onselect”와 같은 장치 독립적인 처리기로 제한할 것을 고려하고, 장치 독립적인 특성을 사용해야 하는 경우 키보드 방식을 제공해야 한다. 예를 들어, “onmousedown”의 경우 “onkeydown”도 지정하고, 마우스좌표에 의존하는 이벤트 처리기는 장치가 독립적이지 않으므로 사용할 수 없다. 그리하여 아래와 같이 마우스 이벤트 처리기를 키보드 이벤트 처리기로 수정하였다.</p> <p class="pragraph" id="pragraph_51">2) 현재 사용하고 있는 “iframe”은 페이지의 제목은 고정되어 있으나 내용을 계속 변경하기 때문에 각 페이지에 대한 내용 파악이 정확히 되지 않는다. 그러므로 명료한 제목을 제공하기 위해 각 프레임에 대한 제목을 제공해야 한다. 그리하여 프레임 셋을 사용하는 경우, 각 프레임에 title=“”을 입력하여 해당페이지의 제목을 정확히 전달하도록 처리하였다.</p> <div class="clickview"> <a href="#none"><img src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_e001.jpg" alt="image"></a> </div> <p class="pragraph" id="pragraph_52">3) 새 창을 사용하는 회원가입이나 오아시스 소개화면은 사용자에게 사전에 새 창이 작동함을 알릴 수 있는 레퍼런스를 제공해야 하며 사용자가 의도하지 않은 브라우저 창의 크기 변경 및 위치 이동 등이 발생하지 않도록 해야 한다.</p> <p class="pragraph"> <span>4.1.3 이해의 용이성</span> </p> <p class="pragraph" id="pragraph_53">장애인들의 웹페이지에 대한 이해력을 높이기 위한 방법으로는 테이블 구조로 보여주던 검색결과의 변경이 필요하다.</p> <p class="pragraph" id="pragraph_54">1) 데이터테이블의 내용을 이해할 수 있도록 테이블에 Summary 속성이나 Caption 태그를 사용하고 layout table을 사용한 코드는 다른 코드로 대체해야 한다.</p> <p class="pragraph" id="pragraph_55">2) 논문검색 목록 페이지에서 각 칼럼에 <th>태그를 사용하여 제목과 내용을 명확히구분해야 한다.</p> <div class="clickview"> <a href="#none"><img src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_e002.jpg" alt="image"></a> </div> <p class="pragraph" id="pragraph_56">3) 각 페이지에 적절한 제목을 제공하기 위해서 고정된 frame을 사용하는 경우 제목이 고정되기 때문에 사용자들에게 정확한 정보를 제공하지 못하므로 고정 frame을 피해야 한다.</p> <p class="pragraph" id="pragraph_57">이를 방지하기 위해 프레임 셋 내에 <noframes>를 사용하였다. 이렇게 하면 브라우저가 프레임을 지원하지 않는 경우 대체 콘텐츠가 제공된다. 하지만 각 프레임 셋은 프레임을 지원하지 않는 브라우저에서도 문서에 계속 접근이 가능하도록 보장하기 위해 유효한 noframes섹션을 포함해야 한다.</p> <div class="clickview"> <a href="#none"><img src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_e003.jpg" alt="image"></a> </div> <p class="pragraph" id="pragraph_58">4) 회원가입이나 논문 검색 화면은 주로 table로제공하는 경우가 많아 CTL키를 이용하는 경우 논리적 순서를 벗어나는 경우가 있었다. 그러므로 키보드 사용에 논리적인 순서를제공하기 위해서는 온라인 서식은 label을 사용하여 처리하여야 한다.</p> <div class="clickview"> <a href="#none"><img src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_e004.jpg" alt="image"></a> </div> <p class="pragraph"> <span>4.1.4 기술의 진보성</span> </p> <p class="pragraph" id="pragraph_59">오아시스에서는 RIA(Rich Internet Application)를 사용하지 않고 있지만 이를 회피하는 것은 기술의 진보성에 대한 해결 대상이 아니다. 새로운 웹 기술이 발전하고 있고 기존의동기식 통신에서 Ajax, flash 및 Flex를 저작도구로 이용하고 있어 이에 대한 대비가 필요하다(김석일 외 2008).</p> <p class="pragraph" id="pragraph_60">1) 오아시스의 새로운 기능을 추가하기 위해서는 반드시 필요한 기능들이므로 애플릿이나플러그인을 사용해 웹 접근성을 위한 대체 콘텐츠를 병행 제공해야 한다. 웹 콘텐츠 제작자들은 스크립트(Script) 시작 및 종료 태그 사이에 담긴 정보를 모든 웹 방문자들이 접근할 수있도록 보장하기 위해서 스크립트에 대한 텍스트 상당 어구를 제공해야 한다.</p> <p class="pragraph" id="pragraph_61">만약 슬라이드 쇼 동영상에서 패널을 진행시키기 위해서 자바스크립트(JavaScript) 같은 스크립팅 언어가 사용되거나 문서 속에 데이터를 삽입하기 위해 스크립트가 사용된다면noscript를 제공해야 하고 noscript 요소는클라이언트의 브라우저가 스크립트를 지원하지 않더라도 그 정보에 여전히 접근할 수 있도록 보장해야 한다. 그리하여, 오아시스에서는순수한 HTML코드와 Flex코드 위주로 구현하였으며 최소한의 Script만 사용하였다.</p> <p class="pragraph" id="pragraph_62">2) Client 기반의 Script Language가 발전하면서 많은 기능들은 스크립트에 의존하고 있다. 하지만 HTML로 구현이 가능한 부분은스크립트 언어로 구현해서는 안 된다.</p> <p class="pragraph" id="pragraph_63">이를 위해서는 자바스크립트의 독립적인 폼을 이용하거나, 보조적인 역할로만 이용해야한다. 스크립트의 submit 기능 대신에 form의 submit 기능을 이용하도록 수정해야 한다.</p> </div> <p class="pragraph"> <span> <a href="javascript:artBodyCont(2,'results_101');" style="text-align: left; color: #0069AE; text-decoration: none;"> &nbsp;&nbsp; 4.2 웹 접근성을 고려한 시스템 구현 </a> </span> </P> <div name="Mainresults_101" id="Mainresults_101" style='display:none;' > <p class="pragraph"> <span>4.2.1 인터페이스 구현</span> </p> <p class="pragraph" id="pragraph_64">웹 접근성의 확보에 대한 혜택은 장애인이다. 하지만, 웹 접근성을 위해 사용된 코딩기법을 보면 시력이 좋지 않은 고령자나 웹 사용에 익숙하지 않은 사람들에게도 사용에 편리성을 제공해준다. 5.1에서 제시한 웹 접근을위한 코딩기법을 사용하여 기존의 한의학술시스템을 개편하여 전통의학정보포털로 구현하</p> <div class="clickviewa" id="pragraphfig2" style="display: none;"> <p class="mgb_10"> <a name="fig 2" style="text-align: left; color: #555555; text-decoration: none;">[fig 2] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgfig2')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgfig2" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgfig2')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('fig2')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgfig2" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f002.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <p class="pragraph" id="pragraph_65">였다.</p> <p class="pragraph" id="pragraph_66">프레임 셋으로 구현되어 인식의 용이성과이해의 용이성에 상당한 위배를 보였던 사용자 인터페이스를 <<strong><a class='fig' href='javascript:;' value='66_F002' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f002.jpg" width="323"; height="207"px; />' title='[fig 2] 전통의학정보포털 인터페이스 화면'>그림 2</a></strong>>와 같이 수정하였다. 기존의 HTML코드를 Flash기반코드로 변환하면서 기술의 진보성에 위배될 우려가 있었으나, 최소한의 Script language를 사용하고 각 콘텐츠에 대체텍스트를 제공하였다.</p> <p class="pragraph" id="pragraph_67">또한, 회원가입 화면과 <strong><a class='fig' href='javascript:;' value='67_F003' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f003.jpg" width="546"; height="410"px; />' title='[Fig 3] 논문검색 결과화면'><그림 3></a></strong>과 같은 논문검색 결과화면처럼 온라인 서식과 검색에 대한 결과를 보여주기 위해 많이 사용되는 테이블 형태의 포맷은 기존의 <table>, <tr>, <td> 태그 대신에 <Lalel>, <th>, <col> 등으로 처리하였으며 키보드 스크립트 사용에 편리성을 추가하였다.</p> <p class="pragraph" id="pragraph_68">또한 각 이미지 및 테이블에 Caption을 추가하여 최대한 웹 접근성을 고려하였다.</p> <p class="pragraph" id="pragraph_69">또한, 오아시스는 구현 Tag뿐만 아니라 기존의 단순한 한의학술논문검색 시스템에서 분석 및 통계 기능과 동향정보 제공까지 서비스하는 포털 형태로 개편되었다. 그리하여 하나의 웹에서 여러 기능을 제공하기 위해서는 각 서비스 환경을 통합해야 할 필요성이 있다. 그래픽이 많은 분석기능을 추가하기 위해서는</p> <div class="clickviewa" id="pragraphFig3" style="display: none;"> <p class="mgb_10"> <a name="Fig 3" style="text-align: left; color: #555555; text-decoration: none;">[Fig 3] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgFig3')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgFig3" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgFig3')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Fig3')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgFig3" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f003.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <div class="clickviewa" id="pragraphFig4" style="display: none;"> <p class="mgb_10"> <a name="Fig 4" style="text-align: left; color: #555555; text-decoration: none;">[Fig 4] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgFig4')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgFig4" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgFig4')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Fig4')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgFig4" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f004.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <p class="pragraph" id="pragraph_70">frame Tag를 사용할 수밖에 없어 운용의 용이성에 위배될 소지가 있었으나, 내용의 명료성을 이해 각 프레임에 대한 제목 및 설명을 제공하여 정확히 전달하도록 하였다. <strong><a class='fig' href='javascript:;' value='70_F004' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f004.jpg" width="620"; height="359"px; />' title='[Fig 4] 운용의 용이성을 고려한 그래프'><그림 4></a></strong>는 프로젝트 분석에서 사용된 그래프로 그래프 차트에 계열들의 색상과 값에 대한 모양을 주어 제공한 예시이다.</p> <p class="pragraph"> <span>4.2.2 개편된 사이트 웹 접근성 평가 결과</span> </p> <p class="pragraph" id="pragraph_71">이 장에서는 웹 접근성 향상을 위한 코드를 이용하여 개편된 오아시스에 대한 접근성 평가를 하였다. 평가방법은 “3. 웹 접근성 평가”에서 제시한 방법과 동일하게 실시하였다.</p> <p class="pragraph" id="pragraph_72"><strong><a class='fig' href='javascript:;' value='72_F005' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f005.jpg" width="640"; height="513"px; />' title='[Fig 5] 개편 후 웹 접근성 준수율(자동 평가)'><그림 5></a></strong>는 기존의 오아시스와 웹 표준을 적용하여 재구축한 오아시스에 대해 자동 평가 방법에 의한 웹 접근성 준수율을 비교한 그래프이다. 웹 접근성을 추가하면서 기존의 웹 페이지를 수정하기보다는 신규로 개발하였다. 그리하여 기존에는 비교대상에 포함되지 않았던 항목이 포함되었거나, 기존에 포함되었던 항목이 빠진 경우가 있다.</p> <p class="pragraph" id="pragraph_73">그래프의 결과 값에서 0%로 표기된 것은</p> <div class="clickviewa" id="pragraphFig5" style="display: none;"> <p class="mgb_10"> <a name="Fig 5" style="text-align: left; color: #555555; text-decoration: none;">[Fig 5] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgFig5')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgFig5" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgFig5')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Fig5')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgFig5" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f005.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <p class="pragraph" id="pragraph_74">웹 접근성 준수를 전혀 하지 않은 것이고 그래프와 결과 값이 전혀 없는 항목은 구축에 사용되지 않아 평가 대상이 되지 않은 것이다. 자동 평가의 결과, 평균 89%의 결과로 개편 전 준수율 32%보다 향상된 것을 알 수 있었다.</p> <p class="pragraph" id="pragraph_75"><strong><a class='fig' href='javascript:;' value='75_F006' rel='<img src="http://central.oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f006.jpg" width="640"; height="513"px; />' title='[Fig 6] 개편 후 웹 접근성 준수율(전문가 평가)'><그림 6></a></strong>은 전문가 평가에 의한 결과이다. 이전에는 55%의 준수율을 보였으나 재구축 후 98%의 준수율을 보여 웹 접근성 준수를 충족한 것으로 판단하였다.</p> <p class="pragraph" id="pragraph_76">자동 평가와 같이 이전과 재구축 후에 대해 비교한 그래프로 자동 평가보다 더 높은 준수율을 나타내었다. KADO-WAH 2.0을 사용한 자동 평가보다 전문가 평가가 준수율이 높게 나타난 이유는 프로그램으로 정의되어 있</p> <div class="clickviewa" id="pragraphFig6" style="display: none;"> <p class="mgb_10"> <a name="Fig 6" style="text-align: left; color: #555555; text-decoration: none;">[Fig 6] </a> </p> <div class="figurewrap01"> <div class="bg_owrap"> <a href="javascript:maintextImgl('imgFig6')" class="minusbtn"><img src="/central/images/new/button/btn_minus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="minus"></a> <div class="bg_orangebarw"></div> <div class="bg_graybar" id="graybarsimgFig6" style="width: 63.5px;"></div> <a href="javascript:maintextImgg('imgFig6')" class="plusbtn"><img src="/central/images/new/button/btn_plus.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="plus"></a> </div> <a href="javascript:maintextImgClose('Fig6')" class="closeright"><img src="/central/images/new/button/btn_close03.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="close"></a> </div> <div class="figurebox"> <img id="imgFig6" src="http://oak.go.kr//repository/journal/10499/GGJBCP_2010_v41n4_187_f006.jpg" style="border: 1px solid #fbae41;" alt="label"> </div> </div> <p class="pragraph" id="pragraph_77">는 범위를 벗어난 코드를 인식하지 못한 결과로 파악된다. 전문가들은 소스레벨과 프로그램 흐름을 파악할 수 있지만, 자동 평가는 그렇지 못하기 때문이다.</p> </div> <p class="pragraph"> <span> <a href="javascript:artBodyContMain(0,'conclusions_123');" style="text-align: left; color: #0069AE; text-decoration: none;"> 5. 결론 </a> </span> </P> <div name="Mainconclusions_123" id="Mainconclusions_123" style='display:none;' > <p class="pragraph" id="pragraph_78">정보기술의 발전으로 기존의 텍스트 방식의 서비스에서 벗어나 웹사이트들은 화려해지고 동적인 페이지로 변화하고 있다. 시각적으로 화려함을 주기 위해 적용된 많은 기술들은 오히려 장애인들의 웹 접근성을 방해하는 요소가 되었다. 그렇다고 이를 해소하는 방식으로 많은 웹 어플리케이션 기술들을 지양하는 것은 옳지 않은 방법이다. 뿐만 아니라, 웹 접근성 향상을 위해 많은 저작기법을 포기하고 순수한 HTML로만 웹을 구축하는 것은 웹의 기술진보측면에서 옳지 않다(행정안전부 2009;WAI 홈페이지). 이를 극복하기 위한 방법으로 보조기구에서 인식할 수 있는 형식으로 문자를 사용해야 한다.</p> <p class="pragraph" id="pragraph_79">그리하여 본 논문에서는 정부에서 제정한 가이드라인을 기준으로 웹 접근성에 대한 평가항목을 선정하고 소프트웨어에 의한 자동 평가와 전문가 그룹에 의한 전문가 평가로 나누어 실시하였다. 그에 대한 결과를 개선하기 위해 표준 가이드라인 코드를 준수하여 새로운 오아시스 웹사이트를 구축하였다. 또한, 구축된 웹사이트에 대해 기존의 평가방법을 그대로 적용하고 어느 정도 개선이 되었는지 평가하여 웹 접근성 준수율이 기존의 46%에서 98%의 준수율을 얻었다.</p> <p class="pragraph" id="pragraph_80">웹 접근성이 확보되면 장애인뿐만 아니라 고령자 등 웹을 통한 정보제공에서 소외되었던 사람들에게 웹사이트를 효과적으로 이용할 수 있는 기회를 제공할 수 있어 오아시스의 사용 대상을 확대시킬 수 있을 것으로 기대된다.</p> <p class="pragraph" id="pragraph_81">더 나아가 웹의 진보와 사회적 약자인 장애인들을 보호하기 위해서는 장애인들이 사용하는 보조기술의 개발과 웹사이트 제작자들에게 웹 접근성을 이해시키고 새로운 기술의 개발에 표준을 제시할 수 있을 것으로 판단된다.</p> </div> <p class="pragraph" align="right"> <a class="button01" href="javascript:artBCTogAll('ex')"><span>Expand all</span></a> <a class="button01" href="javascript:artBCTogAll('co')"><span>Collapse all</span></a> &nbsp;&nbsp;&nbsp;&nbsp; </P> <div> &nbsp;&nbsp;&nbsp;<a class="button01" href="javascript:history.back()" height="30"><span>&lt;&lt; Back &nbsp;&nbsp;</span></a> </div> </div> </div> <div class="dashline mgb_20 nbg clear" id="tran_area3" style="display: none;"> <p class="pragraph"> <span style="text-align: left; color: rgb(0, 105, 174); text-decoration: none;">REFERENCES</span> </p> <div class="centb_type01 mgb_10"> <table summary="AUTHORS,Year,TITLE,Source,Links" style="width: 100%;"> <caption>search result</caption> <colgroup> <col width="5%"> <col width="14%"> <col width="7%"> <col width="41%"> <col width="13%"> <col width="20%"> </colgroup> <thead> <tr> <th>No</th> <th>AUTHORS</th> <th>Year</th> <th>TITLE</th> <th>Source</th> <th class="end">Links</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>김 석일, 신 인철</td> <td class="cen">2008</td> <td>『웹 접근성을 고려한 신기술 콘텐츠 제작기법 -JavaScript FlexFlash를 중심으로-』 </td> <td> </td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=『웹 접근성을 고려한 신기술 콘텐츠 제작기법 -JavaScript FlexFlash를 중심으로-』&pbx=1&oq=『웹 접근성을 고려한 신기술 콘텐츠 제작기법 -JavaScript FlexFlash를 중심으로-』&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </td> </tr> <tr> <td>2</td> <td>남 재우, 김 성희</td> <td class="cen">2009</td> <td>기록정보서비스를 위한Web 2.0 적용에 관한 연구 [한국문헌정보학회지] </td> <td>Vol.43 P.123-146</td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=기록정보서비스를 위한Web 2.0 적용에 관한 연구&pbx=1&oq=기록정보서비스를 위한Web 2.0 적용에 관한 연구&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </td> </tr> <tr> <td>3</td> <td>박 주현, 류 한영</td> <td class="cen">2008</td> <td>웹 접근성 향상을 위한시각장애인과 일반인의 감성비교 [감성과학] </td> <td>Vol.11 P.589-598</td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=웹 접근성 향상을 위한시각장애인과 일반인의 감성비교&pbx=1&oq=웹 접근성 향상을 위한시각장애인과 일반인의 감성비교&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </td> </tr> <tr> <td>4</td> <td>정 덕길, 이 종훈, 노 영욱</td> <td class="cen">2008</td> <td>웹 접근성 지침에 의한 교육용 홈페이지의 적용 방안 및 비교분석 [한국해양정보통신학회논문지] </td> <td>Vol.12 P.1142-1147</td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=웹 접근성 지침에 의한 교육용 홈페이지의 적용 방안 및 비교분석&pbx=1&oq=웹 접근성 지침에 의한 교육용 홈페이지의 적용 방안 및 비교분석&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </td> </tr> <tr> <td>5</td> <td>조 윤희</td> <td class="cen">2009</td> <td>시각장애인을 위한 공공도서관의웹 접근성 제고 방안 [한국문헌정보과학회지] </td> <td>Vol.43 P.335-354</td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=시각장애인을 위한 공공도서관의웹 접근성 제고 방안&pbx=1&oq=시각장애인을 위한 공공도서관의웹 접근성 제고 방안&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </td> </tr> <tr> <td>6</td> <td></td> <td class="cen">2008</td> <td>『장애인 고령자 등을위한 웹 접근성 안내』 </td> <td> P.5</td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=『장애인 고령자 등을위한 웹 접근성 안내』&pbx=1&oq=『장애인 고령자 등을위한 웹 접근성 안내』&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </td> </tr> <tr> <td>7</td> <td></td> <td class="cen">2009</td> <td>『웹 접근성 향상을 위한국가표준 기술 가이드라인』 </td> <td> P.1</td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=『웹 접근성 향상을 위한국가표준 기술 가이드라인』&pbx=1&oq=『웹 접근성 향상을 위한국가표준 기술 가이드라인』&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </td> </tr> <tr> <td>8</td> <td>허 준호, 최 두진</td> <td class="cen">2003</td> <td>웹 접근성 관련 해외 정책동향 및 우리의 대응방안 [디지털정책연구] </td> <td>Vol.1 P.129-145</td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=웹 접근성 관련 해외 정책동향 및 우리의 대응방안&pbx=1&oq=웹 접근성 관련 해외 정책동향 및 우리의 대응방안&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> </td> </tr> <tr> <td>9</td> <td>Leitner Marie-Luise, Strauss Christine</td> <td class="cen">2008</td> <td>『Exploratory Case Study Researchon Web Accessibility』 [LNCS] </td> <td>Vol.5105 P.490-497</td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> <a href="http://www.google.co.kr/#sclient=psy-ab&hl=ko&newwindow=1&site=&source=hp&q=『Exploratory Case Study Researchon Web Accessibility』&pbx=1&oq=『Exploratory Case Study Researchon Web Accessibility』&aq=f&aqi=&aql=&gs_sm=s&gs_upl=11949l11949l0l14934l1l0l0l0l0l0l0l0ll0l0&bav=on.2,or.r_gc.r_pw.&fp=fa27b5cc150cea15&biw=1755&bih=874" target="_blank"> <img src="/central/images/new/sub/google.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" alt="google" class="vam"> </a> <a href="http://dx.doi.org/10.1007/978-3-540-70540-6_70" target="_blank"> <img src="/central/images/new/title/btn_cross.gif;jsessionid=33F352C7D0FA573493AEB7E35A8881C1" height="17" width="53" alt="doi"> </a> </td> </tr> <tr> <td>10</td> <td></td> <td class="cen"></td> <td> </td> <td> </td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> </td> </tr> <tr> <td>11</td> <td></td> <td class="cen"></td> <td> </td> <td> </td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> </td> </tr> <tr> <td>12</td> <td></td> <td class="cen"></td> <td> </td> <td> </td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> </td> </tr> <tr> <td>13</td> <td></td> <td class="cen"></td> <td> </td> <td> </td> <td class="bdr_no" style="padding-left: 20px; vertical-align: middle;"> </td> </tr> </tbody> </table> </div> <div> &nbsp;&nbsp;&nbsp;<a class="button01" href="javascript:history.back()" height="30"><span>&lt;&lt; Back &nbsp;&nbsp;</span></a> </div> </div> <div class="dashline mgb_20 nbg clear" id="tran_area4" style="display: none;"> <span style="text-align: left; color: #0069AE; text-decoration: none;">METRICS</span> <p class="pragraph">&nbsp;</p> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("visualization", "1", {packages:["corechart"]}); google.setOnLoadCallback(drawChart); function drawChart() { var data = new google.visualization.DataTable(); data.addColumn('string', 'View Count'); data.addColumn('number', 'view'); data.addColumn('number', 'Download'); data.addRows(1); data.setValue(0, 0, 'View Count'); data.setValue(0, 1, 653); data.setValue(0, 2, 21); var chart = new google.visualization.ColumnChart(document.getElementById('chart_div')); chart.draw(data, {width: 550, height: 300, title: '', hAxis: {title: '', titleTextStyle: {color: 'red'}} }); } </script> <div id="chart_div"></div> <div> &nbsp;&nbsp;&nbsp;<a class="button01" href="javascript:history.back()" height="30"><span>&lt;&lt; Back &nbsp;&nbsp;</span></a> </div> </div> <div class="dashline mgb_20 nbg clear" id="tran_area5" style="display: none;"></div> <div class="dashline mgb_20 nbg clear" id="tran_area6" style="display: none;"> <ul id="anal" class="accordion"> <li> <h3 class="article">Related Articles</h3> <div class="panel loading"> <ul> </ul> </div> </li> <li id="anal11"> <h3 class="meta">Intro & Result in Related Article</h3> <div class="panel loading"> <ul> <iframe id="ArticleView" src="/central/common/analizeViewArticle.jsp;jsessionid=33F352C7D0FA573493AEB7E35A8881C1?admNo=0" width="100%" height="454px;" frameborder="0" title="viewArticle"> <script type="text/javascript"> parent.activeArtTAB2('2'); </script> </iframe> </ul> </div> </li> </ul> </div> </div> <div class="sub_right"> <div class="search_tabWb"> <ul class="search_taba"> <li id="articleMe05" class="li"><a href="javascript:activeArtTABFTM(5, 1, 't');javascript:artBCTogAll('ex');">Fig./Tab.</a></li> </ul> </div> <div class="sub_right"> <div class="rightLine"> <div class="popbdimg"> <div class="popbdimg_rc"> <div class="popbdimg_rcs"> <dl class="poopbdimg_rccon"> <dd class="poopbdimg_rccon on" id="FTmethods_1"> <div id="FTIDmethods_10" style="display: block"> <div id="imgListnum1"> <span>[Table 1]인식의 용이성에 대한 평가항목</span> <a href="#Table 1"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_t001.jpg" width="180" alt="인식의 용이성에 대한 평가항목" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'methods', '1');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTdiscussion_2"> <div id="FTIDdiscussion_20" style="display: block"> <div id="imgListnum2"> <span>[Table 2]운용의 용이성에 대한 평가항목</span> <a href="#Table 2"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_t002.jpg" width="180" alt="운용의 용이성에 대한 평가항목" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'discussion', '2');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTdiscussion_3"> <div id="FTIDdiscussion_31" style="display: block"> <div id="imgListnum3"> <span>[Table 3]이해의 용이성에 대한 평가항목</span> <a href="#Table 3"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_t003.jpg" width="180" alt="이해의 용이성에 대한 평가항목" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'discussion', '3');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTdiscussion_4"> <div id="FTIDdiscussion_42" style="display: block"> <div id="imgListnum4"> <span>[Table 4]기술의 진보성에 대한 평가항목</span> <a href="#Table 4"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_t004.jpg" width="180" alt="기술의 진보성에 대한 평가항목" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'discussion', '4');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTdiscussion_5"> <div id="FTIDdiscussion_53" style="display: block"> <div id="imgListnum5"> <span>[Table 5]웹 접근성 평가방법</span> <a href="#Table 5"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_t005.jpg" width="180" alt="웹 접근성 평가방법" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'discussion', '5');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTdiscussion_6"> <div id="FTIDdiscussion_64" style="display: block"> <div id="imgListnum6"> <span>[Table 6]인식의 용이성에 대한 평가결과</span> <a href="#Table 6"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_t006.jpg" width="180" alt="인식의 용이성에 대한 평가결과" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'discussion', '6');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTdiscussion_7"> <div id="FTIDdiscussion_75" style="display: block"> <div id="imgListnum7"> <span>[Table 7]운용의 용이성에 대한 평가결과</span> <a href="#Table 7"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_t007.jpg" width="180" alt="운용의 용이성에 대한 평가결과" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'discussion', '7');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTdiscussion_8"> <div id="FTIDdiscussion_86" style="display: block"> <div id="imgListnum8"> <span>[Table 8]이해의 용이성에 대한 평가결과</span> <a href="#Table 8"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_t008.jpg" width="180" alt="이해의 용이성에 대한 평가결과" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'discussion', '8');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTdiscussion_9"> <div id="FTIDdiscussion_97" style="display: block"> <div id="imgListnum9"> <span>[Table 9]기술의 진보성에 대한 평가결과</span> <a href="#Table 9"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_t009.jpg" width="180" alt="기술의 진보성에 대한 평가결과" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'discussion', '9');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTdiscussion_10"> <div id="FTIDdiscussion_108" style="display: block"> <div id="imgListnum10"> <span>[Fig 1]각 항목별 평가방법에 따른 결과</span> <a href="#Fig 1"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_f001.jpg" width="180" alt="각 항목별 평가방법에 따른 결과" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'discussion', '10');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTresults_11"> <div id="FTIDresults_110" style="display: block"> <div id="imgListnum11"> <span>[fig 2]전통의학정보포털 인터페이스 화면</span> <a href="#fig 2"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_f002.jpg" width="180" alt="전통의학정보포털 인터페이스 화면" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'results', '11');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTresults_12"> <div id="FTIDresults_121" style="display: block"> <div id="imgListnum12"> <span>[Fig 3]논문검색 결과화면</span> <a href="#Fig 3"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_f003.jpg" width="180" alt="논문검색 결과화면" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'results', '12');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTresults_13"> <div id="FTIDresults_132" style="display: block"> <div id="imgListnum13"> <span>[Fig 4]운용의 용이성을 고려한 그래프</span> <a href="#Fig 4"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_f004.jpg" width="180" alt="운용의 용이성을 고려한 그래프" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'results', '13');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTresults_14"> <div id="FTIDresults_143" style="display: block"> <div id="imgListnum14"> <span>[Fig 5]개편 후 웹 접근성 준수율(자동 평가)</span> <a href="#Fig 5"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_f005.jpg" width="180" alt="개편 후 웹 접근성 준수율(자동 평가)" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'results', '14');"> </a> </div> </div> </dd> <dd class="poopbdimg_rccon on" id="FTresults_15"> <div id="FTIDresults_154" style="display: block"> <div id="imgListnum15"> <span>[Fig 6]개편 후 웹 접근성 준수율(전문가 평가)</span> <a href="#Fig 6"> <img src="http://oak.go.kr/repository/journal/10499/tn_GGJBCP_2010_v41n4_187_f006.jpg" width="180" alt="개편 후 웹 접근성 준수율(전문가 평가)" onClick="javascript:showImgPOP('10499', 'mainText', '', 'true', 'results', '15');"> </a> </div> </div> </dd> </dl> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <script language="javascript" type="text/javascript"> // var keywords = ''; // if (keywords != '') { // //문장내 단어 변경 스크립트 // for(var num=0; num<=4; num++) { // artBT = document.getElementById("tran_area"+num).innerHTML; // artBT = artBT.replace(/keywords/gi,"<span class='main_texton'>"+keywords+"</span>"); // document.getElementById("tran_area"+num).innerHTML=artBT; // } // } if ('mainText' == 'fita') { showImgPOP('10499', 'mainText', '', 'true', 'Intro', ''); } function activeArtTAB2(id) { activeArtTAB(id); artBodyContTog(12, 'f'); artBCTogAll(id); } function artBCTogAll(id) { artBodyContTogAll(id); artBodyContLeftAll(); if(id == 2) artBodyContTogAll('ex'); } // ppt download - jhpark function DownPPT() { var aDown = confirm("Do you want to download this article images?"); if (aDown === true) { var form = $('#fInfo'); form.submit(); } return; } // Article Image View function showImgPOP(article_seq, tabname, aLicense, imgCnt, title_label, label_seq) { console.log("article_seq=" + article_seq); console.log("tabname=" + tabname); console.log("aLicense=" + aLicense); console.log("imgCnt=" + imgCnt); console.log("title_label=" + title_label); console.log("label_seq=" + label_seq); $.smartPop.open({ borderColor : "#FB9D3D", title : '', width : 900, height : 800, url : '/central/journallist/showImg.do?article_seq=' + article_seq + '&tabname=' + tabname + '&license=' + aLicense + '&img=' + imgCnt + '&label=' + title_label + '&label_seq=' + label_seq, border : 2, background : '#666666', closeImg : { width : 21, height : 21, src : '../images/new/button/btn_img_close.png' } }); } </script> <script language="javascript" type="text/javascript"> $('#anal').accordion({ canToggle : false }); $(".loading").removeClass("loading"); </script> --> <script> (function(i, s, o, g, r, a, m) { i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function() { (i[r].q = i[r].q || []).push(arguments) }, i[r].l = 1 * new Date(); a = s.createElement(o), m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m) })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga'); ga('create', 'UA-57263384-1', 'auto'); ga('send', 'pageview'); </script> <footer> <div class="footer_wrap"> <div class="logo_footer"> <img src="/central/images/n2019/footer-banner.png" alt="" /> </div> <div class="address_footer"> <p> 06579 서울시 서초구 반포대로 201(반포동) T:02-537-6389 F:02-590-0571 <br> Copyright(c) National Library of Korea. All rights reserved. <a href="http://nl.go.kr/nl/etc/private_policy.jsp" target="_blank"><b>개인정보처리방침</b></a><br> 문의: <a href="mailto:oak2014@korea.kr">oak2014@korea.kr</a> </p> </div> <script type="text/javascript"> // $(function(){ // $('div.dropdn_footer select').change(function(){ // window.open($(this).val()); // }); // }); </script> <div class="dropdn_footer"> <select class="select" onchange="location.href=this.value"> <option value="">유관사이트</option> <optgroup label="국내기관"> <option value="http://www.nl.go.kr/">국립중앙도서관</option> <option value="http://oak.go.kr/">OAK PORTAL</option> <option value="http://copyright.oak.go.kr/">학술지저작권안내시스템</option> <option value="http://www.kisti.re.kr/">한국과학기술정보연구원</option> <option value="http://www.kofst.or.kr/">한국과학기술단체총연합회</option> <option value="http://www.nrf.re.kr/">한국연구재단</option> <option value="http://www.cckorea.org/">C.O.D.E - Commons Openness Diversity Engagement</option> </optgroup> <optgroup label="국외기관"> <!-- <option value="http://www.sherpa.ac.uk/romeo/index.php">SHERPA/RoMEO</option> --> <option value="https://v2.sherpa.ac.uk/romeo/">SHERPA/RoMEO</option> <!-- <option value="http://www.opendoar.org/">OpenDOAR</option> --> <option value="https://v2.sherpa.ac.uk/opendoar/">OpenDOAR</option> <option value="http://roar.eprints.org/">ROAR</option> <option value="http://www.openaccessweek.org">Open Access Week</option> <option value="http://openaccess.mpg.de/BerlinOA">Berlin Conference</option> <option value="https://www.coar-repositories.org">COAR - Confederation of Open Access Repositories</option> <option value="https://rd-alliance.org/">RDA - Research Data Alliance</option> <option value="https://www.jisc.ac.uk/open-access">JISC - Joint Information Systems Committee</option> <option value="http://www.nii.ac.jp">NII - National Institute of Informatics</option> <option value="http://www.jst.go.jp">JST - Japan Science and Technology Agency</option> <!-- <option value="http://scpj.tulips.tsukuba.ac.jp/">SCPJ - Society Copyright Policies in Japan</option> --> <option value="http://road.issn.org/">ROAD - Directory of Open Access Scholarly Resources</option> </optgroup> </select> </div> </div> </footer> </html>