본문 바로가기

Study/HTML6

Image Replacement(IR기법) CSS Image Replacement(IR기법) 의미가 포함되어 있는 image를 배경으로 표현하고, 그에 상응하는 내용을 text로 전경에 기입하는 방법으로, 시각이 있는 사용자는 이미지로 처리된 화면을 볼 수 있지만 "화면 낭독기를 사용하는 시각 장애인, CSS제거 및 인쇄"시에는 문자에 접근하거나 문자를 볼 수 있는 형태로 설계 하는 기법을 말한다 첫번째 h1#technique-one { width: 250px; height: 25px; background-image: url(logo.gif)} h1#technique-one span{display: none;} CSS-Tricks 두번째 h1.technique-two {width: 2350px; height: 75px; background: ur.. 2013. 3. 26.
href=# 대안법 흔히들 을 사용하곤 한다.이렇게 사용할 경우 최상단으로 이동하기 때문에 페이지 위치가 바뀌어 버린다.이같은 오류를 해결할 수 있는 방법에는 3가지가 있다. 1. 2. 3. 2013. 3. 12.
웹 표준과 웹 접근성 웹표준(Web Standard)이란? '웹에서 표준적으로 사용되는 기술이나 규칙'을 의미하며, 이는 특정 브라우저에서만 사용되는 비 표준화된 기술은 배제하고 W3C의 토론을 통해 나온 권고안(recomendation)을 사용하는 것을 말하며, 웹 문서의 구조와 표현, 그리고 동작을 구분해서 사용하는 것을 뜻한다. 원칙 1. 인식의 용이성(Perceivable): 모든 콘텐츠는 사용자가 인식할 수 있어야 한다. 1.1 (대체 텍스트) 텍스트 아닌 콘텐츠에는 대체 텍스트를 제공해야 한다. 1.1.1(적절한 대체 텍스트 제공) 텍스트 아닌 콘텐츠는 그 의미나 용도를 이해할 수 있도록 대체 텍스트를 제공해야 한다. 1.2(멀티미디어 대체 수단) 동영상, 음성 등 멀티미디어 콘텐츠를 이해할 수 있도록 대체 수단을.. 2013. 2. 26.
시맨틱한 마크업을 위한 HTML5요소 이름 내용 header 상단(header)에 사용 article 내용(content)에 사용 footer 하단(footer)에 사용 nav 네비게이션이나 메뉴에 사용 section 내용을 나눌 때 사용 aside 사이드바에 사용 figure 특정한 요소의 제목에 사용 2013. 2. 26.
시맨틱 마크업 현재 웹상에서는 방대한 정보와 필요한 정보를 추출, 해석, 가공하는 방법이 없기 때문에 불필요한 정보가 검색된다.시맨틱 마크업은 2001년 팀 버너스리 등에 의해 정립화된 것으로 컴퓨터가 처리할 수 있게 온톨로지 형태로 표현한 것으로 검색로봇이 의미를 잘 가져갈 수 있도록 홈페이지를 구조적으로 마크업 하는 방법이다.HTML태그를 이용해 내용이 담고있는 의미가 무엇인지 파악하며 마크업해야 시맨틱한 웹을 만들 수 있다.RSS가 대표적인 예이다. * 온톨로지 형태 : 사람들이 세상에 대해 보고 듣고 느낀 것을 서로 간의 토론을 통해 합의를 이룬 것 ex)) 테스트 1테스트 1-1테스트 1-2테스트 1-3 위의 마크업은 시맨틱하지 못한 마크업이다.시각장애인을 위한 스크린리더에서 제목과 내용의 의미를 제대로 파악.. 2013. 2. 26.
[HTML5] 새로운 요소 article - 문서나 페이지, 사이트에서 독립적으로 배포 혹은 재사용(예를 들어 투고 같은)할 수 있는 섹션을 나타낸다. 삶에서 가장 중요한 원칙당신 주변 어디에라도 마이크가 있다면 그 마이크는 열띤 토론을 이끌어 내는 것이고 당신이 하는 말을 전부 전세계로 퍼뜨리고 있다 생각해야 합니다. 농담이 아니에요.show comments aside - 주위 내용과 접점을 이루는 섹션을 나타내며 주위 내용과는 분리된 것으로 간주할 수 있다. aside 요소가 나타내는 섹션은 출력하였을 때 사이드바 형태로 표현되는 것이 일반적이다. 스위스스위스, 지질학적으로 유럽의 중심에 있으며 육지로 둘러싸인 이 나라는 유럽 여러 조약의 승인국이지만 지정학적 단체인 EU에 가입하였습니다. audio - 소리 또는 오디오를 나.. 2013. 2. 24.