밀 종합 ٩(`╹ω╹´)و

toggle을 사전에 검색해 보면, 아래와 같이 알려줍니다. 외투 등에 다는 짤막한 막대 모양의 단추 toggle은 더플코트 등에 달린 길다란 막대 모양 단추를 말합니다. 위 단추 모양과 비슷한 on/off 스위치를 토글 스위치라 불렀습니다. 토글 스위치는 한 개의 스위치로 on과 off를 모두 작동시킬 수 있기 때문에 컴퓨터에서는 한 개의 키로 두 가지 state를 번갈아가며 왔다갔다 할 수 있게 하는 키를 토글 키라고 부르게 되었습니다. [공부좌표] https://m.facebook.com/groups/174499879257223?view=permalink&id=1065755650131637

웹 페이지를 구성하는 모든 이웃한 콘텐츠는 시각적으로 구분되도록 제공해야 합니다. 7) 콘텐츠 간의 구분

웹 페이지에서는 모든 소리가 자동으로 재생되지 않아야 합니다. 이런 소리가 자동 재생됨으로 인해 스크린리더 사용자가 콘텐츠를 인식하고 사용하는데 방해받지 않아야 합니다. 페이지 진입 시 자동 재생되는 3초 이상의 배경음 콘텐츠(동영상 포함) 콘텐츠에 포함된 멀티미디어 파일은 정지 상태로 제공되어야 하고, 사용자가 요구할 경우에만 재생 가능하도록 제공해야 합니다. 불가피하게 제공할 경우 해결 방안 3초 내에 정지 ESC 키 선택 시 정지 소스 상 가장 먼저 제공하여 정지 기능 실행 가능하도록 구현 [공부좌표] 6) 자동 재생 금지

텍스트 콘텐츠와 배경 간의 명도 대비는 4.5:1 이상이어야 합니다. [텍스트 명도 대비] 페이지에 존재하는 모든 텍스트에 대해 명도 대비를 준수해야 하는 것은 물론이고, 텍스트가 이미지로 된 경우에도 명도 대비를 준수해야 합니다. [의미가 있는 이미지 명도 대비] 텍스트뿐만 아니라 의미 있는 이미지의 경우에도 이미지를 인식할 수 있도록 명도 대비를 준수해야 합니다. [확대가 가능한 브라우저의 명도 대비] 확대가 가능한 브라우저에서는 최소 3:1 이상이면 준수입니다. 그래도 명도 대비가 높을수록 가독성이 높기 때문에 4.5:1 이상이 되도록 구현해주시기 바랍니다. [예외의 경우] 로고, 장식 목적의 콘텐츠, 마우스나 키보드를 활용하여 초점을 받았을 때 명도 대비가 커지는 콘텐츠 등은 예외로 합니다. [공..

지시 사항은 모양, 크기, 위치, 방향, 색, 소리 등에 관계없이 인식될 수 있어야 합니다. 지시 사항을 특정한 단일 감각에만 의존하는 방법으로 제공해서는 안 된다는 것입니다. 즉, 여러 가지 다른 감각을 통해서도 지시 사항을 인식하는 데 문제가 없도록 콘텐츠를 제공해야 합니다. [공부좌표] 4) 명확한 지시 사항 제공

멀티미디어 콘텐츠에는 이에 대한 대체 수단(자막, 대본, 수화 등)을 제공해야 합니다. 1) alt 제공 , , , 의 alt에는 적절한 대체 텍스트를 제공한다. *는 이미지맵에 사용되는 태그 [이미지가 이모티콘인 경우] 시각적으로 인식하는 것과 동일하게 대체 텍스트를 제공해야 한다. [이미지가 이모티콘인 경우] 시각적으로 인식하는 것과 동일하게 대체 텍스트를 제공해야 한다. [의미 없는 이미지의 경우] 속성에 alt=""는 무조건 필수로 넣어야 하기 때문에 아무것도 넣지 않는다. Q. alt 속성을 넣지 않으면 어떻게 되나요? NVDA - 누락된 이미지 설명을 확인하려면 컨텍스트 메뉴를 여세요. 출력. 보이스오더 - 이미지 출력. Q. alt=" "로 넣으면 어떻게 되나요? (가장 위험) NVDA - ..

텍스트 아닌 콘텐츠(ex. 이미지)는 그 의미나 용도를 인식할 수 있도록 대체 텍스트를 제공해야 한다. 1) alt 제공 , , , 의 alt에는 적절한 대체 텍스트를 제공한다. *는 이미지맵에 사용되는 태그 [이미지가 이모티콘인 경우] 시각적으로 인식하는 것과 동일하게 대체 텍스트를 제공해야 한다. [이미지가 이모티콘인 경우] 시각적으로 인식하는 것과 동일하게 대체 텍스트를 제공해야 한다. [의미 없는 이미지의 경우] 속성에 alt=""는 무조건 필수로 넣어야 하기 때문에 아무것도 넣지 않는다. Q. alt 속성을 넣지 않으면 어떻게 되나요? NVDA - 누락된 이미지 설명을 확인하려면 컨텍스트 메뉴를 여세요. 출력. 보이스오더 - 이미지 출력. Q. alt="", alt=" "로 넣으면 어떻게 되나요..

브라우저 정보 얻기 요소는 독립적인 콘텐츠를 표현한다. 일반적으로 는 문서의 내용에 참조는 되지만, 내용에 영향을 주지 않는다. 문서의 다른 부분이나 부록으로 이동할 수있는 이미지, 일러스트레이션, 다이어그램, 코드 조각 등을 가리킨다. 요소를 사용해 설명을 붙일 수 있다. 피규어, 설명, 콘텐츠는 하나의 단위로 참조된다. (반드시 3개를 한 셋트로 사용하는것은 아님) [공부좌표] https://developer.mozilla.org/ko/docs/Web/HTML/Element/figure

선언 방법 사용자 지정 속성은 두 개의 붙임표로 시작하는 속성의 이름과 함께, 유효한 CSS 값이라면 아무거나 그 값으로 지정해 선언할 수 있다. :root { /* 보통 이 패턴을 많이 사용한다. */ --main-bg-color: brown; } div { /* 요소에서도 사용 가능하다. */ --main-bg-color: brown; } 사용 방법 var() 함수를 지정하고, 매개변수로 선언한 사용자 지정 속성의 이름을 사용한다. /* :root로 사용했을 경우 */ :root { --main-bg-color: brown; } .header { background: var(--main-bg-color); } /* 요소에서 사용했을 경우 */ div { --main-bg-color: brown; ba..