\(@^0^@)/

3일 오후부터 4, 5일까지 재미나게 놀았으니 다시 해보자! - 제로베이스 HTML/CSS 과제 고민한 부분들 웹 접근성을 위한 텍스트 숨김 처리 TIL 작성 https://dev-minju.tistory.com/229 [TIL] 웹 접근성을 위한 텍스트 숨김 처리 h1에 텍스트 마크업은 하지만 화면에는 보이지 않고, 스크린리더에서만 읽을 수 있게 스타일링하고, 화면에는 텍스트 대신 이미지를 배경으로 설정하여야 한다. 이렇게 구현해야 되는 이유를 정 dev-minju.tistory.com 17:50 오후 회고 스터디 (만족도 : 6) 후반부에 조금 집중을 못했고, TIL을 작성하면서 과제를 하다 보니 생각보다 시간이 많이 흘러서 계획한 것들을 다 달성하지 못하고, 몇개를 내일로 미뤄야 했다ㅠ 근데 내가 ..

h1에 텍스트 마크업은 하지만 화면에는 보이지 않고, 스크린리더에서만 읽을 수 있게 스타일링하고, 화면에는 텍스트 대신 이미지를 배경으로 설정하여야 한다. 이렇게 구현해야 되는 이유를 정확히는 모르겠지만, 아마도 스크린리더로 웹 접근성을 준수하고 싶지만, 화면에는 이미 만들어진 svg를 넣어주는 것이 더 효율적이라는 생각 때문인 것 같다. 이미지를 넣고 스타일링으로 디테일을 잡아주는 부분들은 수월했지만, 막상 텍스트를 없애려니 어떻게 없애는 것이 좋은 방법일지 모르겠어서 찾아보니, 생각보다 많은 사람들이 "웹 접근성을 위한 텍스트 숨김 처리"를 고민하고 있었구나..!! 시도해본 방법들 1. display: none 혹은 visibility: hidden 보통 제일 생각해보기 쉬운 게 display: no..

- 제로베이스 HTML/CSS 과제 하이퍼링크에서 새 탭으로 브라우저를 열도록 target="_blank" 할 경우, 오프닝 사이트에게 부분적인 액세스를 제공하여 해당 페이지에 다음 액세스를 허용하고 변경하므로, 자바스크립트를 통해 악성 코드 또는 피싱 사이트에 노출될 수 있으므로 보안에 매우 취약함. 따라서 링크에 rel="noopener"를 추가하여 객체가 window.opener 요청을 함께 보내지 않도록 해야 한다. Firefox는 noopener를 지원하지 않으므로 noreferrer를 추가해야 함. 결론적으로는 rel="noopener noreferrer" https://learntutorials.net/ko/html/topic/254/%EC%95%B5%EC%BB%A4-%EB%B0%8F-%ED..