시각 장애인을위한 CSS?


17

그래서 HTML을 배우는 동안 CSS가 발생했습니다. CSS를 사용하면 웹 페이지를 시원하거나 더 아름답게 만들 수 있기 때문에 흥미 롭습니다. 그러나 색상, 디자인, 스타일 등에 관한 것이기 때문에 CSS 코드의 결과를 알 수 없습니다. 시각 장애가있는 사람으로서 시각 장애인이 항상 볼 수 있기 때문에 웹 페이지를 더 잘 디자인 할 수 있다면 왜 CSS를 배워야합니까?

  1. CSS를 작성하는 맹인 프로그래머가 있습니까? 어떻게 했어?
  2. CSS를 모두 무시하고 프로그래머에게 맡겨 두어야합니까? 아니면 사람들이 내 페이지를보고 디자인이 좋은지 알도록 요청하지 않고도 CSS에서 할 수있는 일이 있습니까?

3
CSS 의 청각 적 측면에 관심이있을 수 있습니다 .

1
디자인이 너무 까다 롭지 않은 경우 CSS 템플릿 (사전 정의 된 색 구성표 및 세부 정보) 사용을 고려할 수 있습니다. 어쩌면 당신을 위해 그들을 설정할 수있는 눈에 띄는 디자이너와 함께 일하는 것을 고려하십시오. 그런 다음 직접 선택하여 선택할 수 있습니다.
rpeg

시각 장애인을 위해 웹 페이지를 만들고 있는지에 따라 다릅니다. 둘 다인 경우 팀을 구성해야합니다.
Ronni Skansing

답변:


12

CSS는 일반적인 스타일링 언어이며 청각 마크 업에 대한 속성도 포함 합니다 . 이 중 어느 것도 주류 브라우저에 의해 구현되지는 않지만 독자를 선별하는 것이 유용 할 수 있습니다 (그러나 청각 마크 업이 "실제로"가 아니라는 점을 고려하면 구현이 있는지 알 수 없습니다).

나는 보는 사람으로서 CSS를 약간 바꾼 피드백 루프에서 CSS를 작성하고 페이지가 어떻게 변하는 지 지켜 봅니다. 이 피드백이 가능하지 않거나 매우 어려운 경우, 설계 원칙으로 돌아가서 제대로 작동하기를 바랍니다.

  • 페이지를 그리드로 생각하면 비율을보다 쉽게 ​​관리 할 수 ​​있습니다. 일반적인 구분은 탐색 및 헤드 라인에 맨 위 행을 사용하고 관련 컨텐츠에 대해서는 오른쪽 열을 사용하는 것입니다. 왼쪽 열은 기본 콘텐츠에 사용되며 오른쪽 열의 약 2 ~ 3 배입니다. 이것은 대략 Stack Exchange 사이트가 렌더링되는 방식입니다. CSS에서는이 구현 될 수 display: table및 표시 스타일 관련 table-rowtable-cell, 또는 새로운 인 flexbox 모델을. 정확한 비율은 놀랍게도 중요하지 않습니다.

  • 페이지가 가로 중앙에 있으면 더 좋아 보입니다.

  • 많은 색상을 사용할 필요가 없습니다. 배경색 (보통 밝고 불포화)과 텍스트 색 (보통 어둡고 포화)이 있습니다. 각주, 줄 또는 기타 세부 사항과 같은 텍스트를 강조 표시하지 않도록 밝기 대비를 줄일 수 있습니다. HSV 색상 모델을 사용하는 것이 RGB보다 훨씬 쉬워야합니다. 일반 회색이 너무 지루한 경우 사용할 수있는 여러 색상 팔레트가 있습니다. 색상을 사용해야하지만 조금만 사용해야합니다.

  • 글꼴 크기는 중요도를 나타내는데도 사용할 수 있습니다. 2pt 단계와 9pt 이하의 단계는 의미가 없습니다. 일반 텍스트의 경우 글꼴 크기가 14pt를 초과하지 않아야합니다. 글꼴 크기와 텍스트 대비는 말의 양과 비슷합니다.

  • CSS 제공뿐만 아니라 같은 측정의 절대 단위 pxcm뿐만 아니라 상대 단위 등의 em키워드와 같은 thinmedium. 상대적 측정 및 이러한 키워드를 사용하는 것이 종종 더 쉽습니다.

  • 텍스트가보다 넓어서는 안됩니다 40em.

  • 브라우저에는 기본 스타일 시트가 제공됩니다. 그것들은 예쁘지는 않지만 모든 것을 재정의 할 필요는 없습니다. 간단한 웹 폰트를 선택하고 텍스트 요소의 최대 너비를 설정하는 것이 가장 중요한 두 가지입니다. 시맨틱 HTML 작성은 기본 스타일이 작동하는 데 중요합니다.

이를 통해 간단한 블로그 등을 스타일링 할 수 있어야합니다. 하나:

  • 수행중인 작업을 볼 수 없다면 코드 디버깅이 훨씬 어렵습니다. 첫 시도에서 물건을 얻지 못했습니다. 그러나 상황이 "올바른"시점을 어떻게 알 수 있습니까?

  • 팝업 메뉴 등 요소를 정확하게 배치해야하는 경우가 있습니다.

  • 이미지와 아이콘은 디자인에 깊이를 더할 수 있지만 선택하기는 어렵습니다.

  • CSS 상자 모델은 끔찍하며 종종 머리에서 시뮬레이션하기가 어렵습니다.

나는 당신이 약간의 CSS를 작성할 수 있다고 가정 할 것이지만, 그것은 매우 실망 스럽습니다. 어떤 보조 기술이 존재하는지 모르겠지만 촉각 피드백을 통해 일반적인 레이아웃을 디자인 할 수 있다고 가정합니다. 시력이있는 사람과 쌍으로 프로그래밍하는 것이 작은 세부 사항에 적합한 솔루션 일 수 있습니까?


3
쌍 프로그래밍 제안에 동의합니다. 시력은 디버깅이나 아키텍처와 마찬가지로 빌릴 또 다른 기술입니다.
Jon Purdy

5

Eşref Armağan그림을 그릴 수 있다면 시각 장애인은 웹 페이지를 만들 수 있어야합니다. 그러나 얼마나 어려운지 고려할 때 다른 프로그래밍 영역을 고려해야합니다. 나는 그들이 때문에이 부분에 매우 효과적 여러 장님 프로그래머를 알고 있었다 필요 항상 염두에 전체 프로그램을 유지하기 위해.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.