효율적인 색상 생성 효율성 만들기
"스크린 컬러 생성 지원 도구"1 년 동안 무료

 토토 사이트. (Hitachi라고 불리는 Nakanishi Hiroaki / Hightinafter)는 최근 "CSS 레벨 3"(이하 CSS3로 언급 된 CSS 3”(이하 CSSANITING STHETS)의 추가 명세서를 지원하는 "스크린 컬러 제작 지원 도구"(이 도구라고 불림)를 개발했습니다. 인터넷 웹 사이트 및 웹 브라우저는 내년 7 월 19 일까지 오늘부터 1 년 동안 웹 사이트에서 무료로 제공 될 예정입니다. CSS는 화면 디자인 등을 레이아웃하는 방법을 알려줍니다. W3C*1를 기반으로 한 사양 중 하나입니다. 이 도구는 랜드토토 Group의 디자인 부서 인 Design Headquarters 및 랜드토토 Public Systems Engineering Co., Ltd. (사장 및 CEO : Takebe Kiyomi/Healinafter)가 공동 연구를 통해 개발했습니다.

최근 몇 년 동안 인터넷 웹 사이트 및 웹 브라우저를 사용하는 비즈니스 시스템 화면을 설계하기 위해 새로운 기술 및 도구가 개발되어 표현 화면을 자유롭게 설계 할 수 있습니다. 반면에 화면을 만들 때 접근성을 고려하는 방법은 화면 디자이너 및 시스템 개발자에게는 어려운 일입니다.

 예를 들어, 화면의 "버튼"또는 "텍스트"의 그림자 또는 그라디언트와 같은 3 차원 디자인을 설계 할 때 CSS3에 지정된 컴퓨터 언어를 사용하여 달성 할 수 있습니다. 그러나 CSS3은 기존 CSS보다 더 복잡한 규정을 가지고 있습니다. 따라서 디자이너가 신속하게 설계하려면 복잡한 CSS3보다는 이미지로 만든 "버튼"및 "텍스트"를 더 쉽게로드 할 수 있습니다. 그러나 W3C의 접근성 지침 WCAG (Web Content Accessibility Guidelines) 2.0 및 JIS 표준은 이미지를 가져올 때 색상, 크기 등을 사용자 정의하기가 어렵 기 때문에 가능한 한 많이 사용하지 않는 것이 좋습니다. 또한 이러한 표준은 색상 비전의 특성과 시력이 약한 사람들을 고려하므로 배경과 텍스트 사이의 밝기 비율이 필요합니다*24.5 ~ 1 이상이어야합니다*3, 그림자 및 그라데이션과 같이 색상이 점차 변화하는 디자인의 사양을 충족하기가 어렵습니다. 또한 PC에 오디오 읽기 소프트웨어가 설치되면 "버튼"과 같은 문제가 발생하고 적절한 Alt 텍스트가 작성되지 않은 이미지에서 "이미지"로 큰 소리로 읽는 텍스트가 발생합니다.

  이번에는 1 년 동안 무료로 출시되는이 CSS3 호환 도구를 사용하여 디자이너는 스크린을 효율적으로 만들 수 있습니다. 특히 색상 비전 특성에 의존하지 않고 식별 가능한 색상을 선택하여 더 많은 사람들이 쉽게 볼 수있는 화면을 만들 수 있습니다. 이 도구에서 텍스트와 배경색을 한 색으로 지정하면 웹 접근성 표준에 JIS X 8341-3을 사용하십시오.*4를 준수하는지 확인하면서 색상을 선택할 수 있습니다. 또한 그라디언트 배경색을 사용하거나 그림자를 텍스트로 사용하려면 대략적인 휘도 비율 Grayscale*5를 사용하면 색상 비전 특성에 의존하지 않고 구별 할 수있는 색상을 쉽게 선택할 수 있습니다.

랜드토토 Group은 가정 기기, 정보 서비스, 공공 시스템 및 소셜 인프라를 포함하여 모든 분야의 모든 사람에게 사용하기 쉬운 제품 및 서비스를 개발하고 제공하기 위해 노력하고 있으며 액세스 할 수 있습니다. 이에 대한 한 가지 예는 랜드토토 GP가 제공하는 웹 접근성을 지원하는 소프트웨어 인 ZoomSight입니다. 랜드토토 Group은 또한 Bank ATM과 같은 자동 기계의 작동 화면, 엘리베이터 자동차 내부 디스플레이 및 스테이션과 같은 공공 장소의 디지털 간판과 같이 액세스 할 수있는 웹 및 정보 시스템을 제공합니다.

  앞으로 랜드토토는 접근성을 염두에두고 설계된 제품 및 서비스를 계속 개발할 것이며이 도구로 CSS3의 확산을 지원할 것입니다.

*1

월드 와이드 웹 컨소시엄의 약자. W3C는 웹에서 사용되는 다양한 기술의 표준화를 촉진하는 비영리 조직입니다.

*2

밝기 (반사 휘도)는 점에 의해 결정되고 해당 지점의 방향으로 물체로부터 지시 된 단위 면적당 빛의 양 (CD/m2)을 나타냅니다. 여기에 사용 된 휘도 비율은 배경의 그늘과 그늘의 차이와 텍스트 (일반적으로 대비라고도 함)로 다시 표현할 수 있습니다.
부록 A에서 WCAG 2.0 : 용어집
http : //www.w3.org/tr/wcag20/#contrast-ratiodef
일본어 번역 :http : //waic.jp/docs/wcag20/overview.html#contrast-ratiodef

*3

섹션 1.4.3, "대비 (최소)"WCAG 2.0
http : //www.w3.org/tr/understanding-wcag20/visual-audio-contrast-contrast.html
일본어 번역 :http : //waic.jp/docs/understanding-wcag20/visual-audio-contrast-contrast.html

*4

JIS X 8341-3 "노인 및 장애인을위한 고려를위한 설계 지침 - 정보 및 커뮤니케이션의 장비, 소프트웨어 및 서비스 - 파트 3 : 웹 컨텐츠"

*5

원래 색상의 밝기를 근사하여 변환 된 회색조 이미지.

관련 정보

• "CSS3에서 화면 표시를위한 스크린 컬러 제작 지원 도구"공개 웹 사이트
• 각 브라우저에서 "스크린 컬러 생성 지원 도구"를 사용하여 생성 된 코드의 디스플레이 결과를 확인할 수있는 웹 사이트
• 접근성 지지자 "Zoomsight"(Hitachi Public Systems Engineering Co., Ltd.) 웹 사이트

상표 이름 공개

• "Zoomsight"는 Hitachi Public Systems Engineering Co., Ltd.의 등록 상표입니다.
• 다른 회사 이름과 제품 이름은 해당 회사의 상표 또는 등록 상표입니다.

연락처 정보

랜드토토, Ltd. 설계 본부 계획 사무소 [책임 : WADA]
Akasaka Biz Tower, 5-3-1 Akasaka Minate-Ku, 도쿄 107-6323
전화 : 03-6230-4692 (Direct)

위