팁: 당신의 프로젝트를 인터넷으로 접근할 수 있도록 (1페이지, 총 3페이지)
세 부분으로 구성된 시리즈에서 웹 접근성 제안 목록을 만들 것입니다. 모든 부분은 순서와 탭, 내용과 탭, 그리고 색깔과 대비도에 중점을 두겠습니다.
섹션 1 - 주문 및 레이블
페이지 컨텐트 주문
모든 페이지를 만들 때 이해하기 쉬운 방식으로 내용을 명확하게 배열하는 것이 중요하다.맹인 방문객이 화면 판독기로 당신의 페이지를 보고 있다고 상상해 보세요.CSS 기술이 끊임없이 발전함에 따라 심지어 페이지 내용을 정렬할 수 있기 때문에 그들은 새 페이지를 클릭할 때마다 네비게이션 메뉴를 통해 선별할 필요가 없다.대신 필요한 경우 페이지 내용을 먼저 주문할 수 있습니다.
어떻게
전체 사이트의 페이지 내용을 일치된 방식으로 기획하여 모든 사용자에게 즐거운 체험을 제공한다.이것은 화면 판독기를 사용하는 관중들이 페이지의 의미 있는 부분에 들어가기 전에 대량의 메뉴 옵션을 선택할 필요가 없다는 것을 의미할 수 있다.
리소스
사이트 키보드 친화적 (초점 상태)
당신은 마우스나 터치보드를 사용하지 않은 상태에서 어떤 사이트를 방문하여 이 사이트에서'클릭'을 시작한 적이 있습니까?없으면 해봐!일부 방문자들은 키보드만 사용하면 당신의 사이트를 방문할 수 있다.CSS에는 현재 상호작용 요소와 연결된 선택기가 있습니다. 브라우저의 '관심' html 대상에 스타일을 설정할 수 있습니다.이 css 선택기는
:focus와 :active입니다. 키보드의 상호작용을 개선하기 위해 웹 사이트에 사용할 수 있는 초점 스타일을 포함해야 합니다.어떻게
전체 사이트의 상호작용 요소에 초점 스타일을 설정해야 합니다.많은 라이브러리와 프레임워크 (예: Bootstrap) 는 초점 스타일을 포함하고 있기 때문에 마음대로 변경할 수 있지만 삭제할 수 없습니다.양식은 사이트의 디자인과 어울릴 수 있지만 모든 사용자(색맹 관중 포함)에게는 뻔해야 한다.
적어도 css 문서에는 다음이 포함됩니다.
*:focus {
border: solid 1px blue;
}
적절한 태그 사용
HTML 태그가 업데이트되어 브라우저에서 전달되는 컨텐트가 어디에 있는지 및 어떻게 전달되는지 알립니다.이러한 창설 방식은 화면 리더가 내용의 차원 순서를 감지할 수 있고, 읽는 순서가 논리적인 순서를 유지하는 데 도움을 준다.또한 적당한 라벨을 사용하면 검색엔진 최적화에 도움이 된다. 구글의 로봇은 라벨을 통해 페이지 내용을 스캔하고 식별하기 때문이다(이 내용을 검색엔진 최적화 순위와 관련시키기 때문이다).
어떻게
의미 html 표기는 특정 유형의 내용을 표시하는 데 사용되며 화면 리더에 의해 더욱 정확하게 사용할 수 있다.전체 사이트에서 숙제를 위해 정확한 의미 표기집을 사용한다.
의미 html 태그의 예는 다음과 같습니다.
<header> <footer> <button> <form> <table> <thead> <tbody> <h1> <h2>비의미 html 태그의 예는 다음과 같습니다.<div> <span>리소스결론
파이팅!나는 네가 인터넷에 접속하기 쉬운 과정에서 이 첫 번째 제안이 매우 유용하다는 것을 발견하길 바란다.웹 접근성은 끊임없이 발전하고 개선되어 왔다. 나는 여전히 디자이너와 개발자의 모든 수요, 옵션과 미세한 차이를 이해하려고 노력하고 있다.기억해라. 당신의 사이트를 쉽게 방문하여 새로운 사용자에게 문을 열어 주는 것은 매우 좋은 사용자 체험 디자인이기 때문에 기본 기능을 실현하는 것은 좋은 시작이다.어떤 평론이나 추가 자원을 회답해 주십시오. 저는 독자를 포함하여 유용한 것을 발견할 수 있습니다.
추가 자원
다음은 일부 추가 사이트의 방문 가능한 자원, 도구와 지도 방침이다.
기타 도구
섹션 2 - 컨텐트 및 레이블 - 곧 게시됩니다...
Reference
이 문제에 관하여(팁: 당신의 프로젝트를 인터넷으로 접근할 수 있도록 (1페이지, 총 3페이지)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/lukekyl/tips-making-your-projects-web-accessible-1-of-3-2icc텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
