웹접근성(4)
-
[HTML] 당신이 몰랐을 수도 있는 시맨틱 태그들 구조 편
1. , map 태그는 태그와 함께 사용되며, 이미지 맵(클릭 가능한 링크 영역)을 정의할 때 사용된다. map에 사용 될 이미지는 태그로 넣어주며, map과 img태그를 링크해 주는 어트리뷰트는 map태그의 name, img태그의 usemap 어트리뷰트이다. 이 때 태그가 이미지 내의 클릭 가능한 영역을 정의할 때 사용된다. 태그의 shape 어트리뷰트는 이미지의 모양을(사각형, 원형 등), coords 어트리뷰트는 클릭 가능한 좌표를 작성할 때 사용한다. href는 클릭 되었을 때 이동할 링크를 넣어준다. (optional) 이 때 coods에 넣어줄 좌표를 구하는 방법은 여기를 참고하면 좋다. See the Pen Untitled by seoulsaram (@seoulsaram) on CodePen..
2023.11.17 -
[HTML] 웹페이지 접근성 향상시키기
웹 접근성 표준 기술 규격 보러 가기 웹 접근성이란 웹 접근성이라는 것은 웹 사이트에서 제공하는 정보를 차별 및 제한 없이 동등하게 이용할 수 있도록 보장하는 것 웹페이지 접근성을 높여야 하는 이유 시각장애인이 웹을 사용할 때, 웹 페이지를 읽어주는 소프트웨어인 스크린리더는 웹사이트의 접근성이 높을 수록 html의 의미를 더욱 명확하게 읽어줄 수 있다. ⇒ 일반인도 운동중이나 운전중일 때 스크린 리더를 사용할 수 있다. 다양한 환경과 새로운 기기에서의 이용이 용이해진다. ⇒ 마우스 사용이 불가할 때 키보드 이용이 용이하도록 만들거나, 여러 모바일 기기에서의 호환성이 좋아지도록 만들어야 한다. 몸이 불편한 사람, 고령자 등 웹 사이트의 정보를 차별이나 제한 없이 동등하게 이용할 수 있도록 보장할 수 있음과..
2022.09.17 -
[HTML] 당신이 몰랐을 수도 있는 시맨틱 태그들 텍스트 편
1. , ins 태그는 문서에 추가된 텍스트의 범위를 나타낸다. 태그와 함께 사용하면 삭제된 텍스트의 범위를 함께 나타낼 수 있다. 태그는 기본적으로 밑줄로 렌더링 된다. del 태그는 문서에서 삭제된 텍스트를 나타낸다. 태그는 기본적으로 취소선 텍스트로 렌더링 된다. 두 태그는 문서의 변경 사항을 추적하기 위해 설계되었다. See the Pen Untitled by seoulsaram (@seoulsaram) on CodePen. 2. em 태그는 텍스트에 강조의 의미를 추가한다. 기본적으로 이탤릭체로 렌더링 된다. 요소는 다른 요소 내에 중첩될 수 있고, 중첩이 깊을 수록 강조 수준이 높아진다. See the Pen Untitled by seoulsaram (@seoulsaram) on CodePen..
2022.09.17 -
[HTML] 당신이 몰랐을 수도 있는 시맨틱 태그들 기본 편
당신이 몰랐을 수도 있는 시맨틱 태그 1. abbr태그는 약어를 감쌀 때 사용한다. abbr태그의 title어트리뷰트를 사용하면 hover했을 때 약어에 대한 설명을 제공할 수 있다. See the Pen Untitled by seoulsaram (@seoulsaram) on CodePen. 2. address 태그는 연락처 정보를 지정할 때 사용한다. 이름, 주소, 이메일, 전화번호, 소셜미디어 등이 포함될 수 있다. See the Pen Untitled by seoulsaram (@seoulsaram) on CodePen. 3. blockquote 태그는 긴 인용문을 작성할 때 사용한다. 기본적으로 텍스트는 들여쓰기된 텍스트 블록으로 렌더링된다. 선택적으로 사용되는 cite 어트리뷰트는 인용문의 UR..
2022.09.17