html54 [웹접근성] header/footer는 오직 한번 사용? 아니! 일반적으로 header는 로고를, footer는 coryright를 담기 위해 한 번씩만 사용하는데, 사실 header는 가까운 부모의 타이틀 영역을, footer는 출처 영역을 담는 태그로, 반드시 한 번만 사용할 수 있는 건 아니다. { ...content } 다만 위에서 "영역"이라 표현했듯이 header안에 h2 하나만 들어가는 경우라면 header는 불필요한 태그라는 의견도 있다. mian / article과 같이 큰 영역에 타이틀 영역이라 구분할 수 있는 영역이 있을 때에 사용하는 것을 추천한다. article title 2023.08.27 article contents 1 article contents 2 article contents 3 article title article content.. 2023. 8. 27. [웹접근성] CSS: outline는 절대 지우지 말 것! 간혹 'link / button을 누르고 난 후 생기는 border 좀 삭제해 주시겠어요?' 같은 QA 요청을 받는데.... outline: none은 웹접근성에 반하는 코드이다. 오히려 어디선가 은거하고 있는 outline: none가 없는지 찾아 제거해야 한다. 2023. 8. 27. [웹접근성] Skip 메뉴 header의 존재로 main content까지 불필요한 리딩이 있기 때문에, 사용자가 바로 main으로 넘어갈 수 있도록 body 내 최상단에 skip 메뉴 리스트를 추가한다. Skip to main content Skip to footer 화면에 숨길 때는, 지난 blind 편에서 언급했듯이 text-indent:-9999px와 같은 방법이 아닌, 살짝~ 가리는 정도를 추천한다. [css-real] 웹접근성을 고려한 .blind(hidden) 처리 스크린리더와 브라우저별, 그리고 매해 업데이트되는 내용들 때문에 여간 웹 접근성을 지키며 블라인드 처리하기가 쉽지 않다. 그래서 '이 방법으로 해결될 수 있습니다~'라는 방법은 아직 없다 fresh-mint.tistory.com .skip { positio.. 2023. 8. 27. [HTML5] <table> 정리1: 웹접근성과 웹표준 Point: 절대 레이아웃용으로 사용하지 않는다. 태그는 표를 위한 태그이다. Names and Mobile Number Name Mobile Number Mint 010-000-0000 010-111-1111 Names and Mobile Number Name Mobile Number Mint 010-000-0000 010-111-1111 1. Names and Mobile Number 표의 설명이나 제목이 들어가는 부분으로, 주로 웹접근성을 위해 설명 문구를 적지만, 화면상엔 비 노출한다. 여기서 비노출이란, 'display:none', 또는 'font-size:0'을 의미하지 않는다(css는 다음 글에서). 위치는 의 첫 번째 자식, 즉 최상단에 위치해야 한다. 간혹 과 summary를 같이 사용한.. 2021. 1. 19. 이전 1 다음
