728x90 300x250 SMALL Front-end306 웹접근성::이미지에 텍스트 설정하고 안보이게 (ir효과) 웹접근성 연구소 사이트의 한국형 웹콘텐츠 접근성 지침에 따라 웹콘텐츠 제작기법을 보면준수해줘야 할것들이 있다. 웹접근성은 몸이 불편한 사람이라도 정보를 이용하는데 불편함이 없도록 하는것이 목적에 있기 때문에 만약 시각 장애인이 사이트를 이용할 경우 텍스트는 리더기로 읽어줄 수 있지만 이미지는 읽을 수가 없다 그래서 이미지에 텍스트를 붙여준다. 또한 css가 동작하지 않는 환경에서도 어떤 내용인지 파악이 가능해야 하기 때문에 백그라운드로 넣어주는 이미지라고 할지라도 텍스트를 써주는 것이 좋다. 이런걸 ir효과라고 하는데 http://ui.daum.net/ 위주소로 가면 다음 웹표준에대한 정의를 볼 수 있는데 http://ui.daum.net/convention/css/css_ir 여기 ir 기법에 대한 소.. 2019. 1. 7. MAMP 설치하기 홈페이지를 만들려면 웹서버가 필요한데 개인이 이 웹서버를 소유하려면 비용이 부담스럽기 때문에 보통 웹호스팅 업체를 이용하게 된다.그러나 MAMP를 이용하면 이런 호스팅 업체를 이용하지 않고도 웹서버를 이용할 수 있는 환경을 만들 수 있다.내 로컬에 웹서버인 아파치 그리고 PHP와, MySQL을 설치 해서 웹서버로 사용할 수 있게 해준다. 즉 내컴퓨터에서도 서버측 언어를 확인하면서 작업할 수 있는 환경이 만들어지기 때문에 일일이 FTP에 올려가면서 확인하 필요가 없다. https://www.mamp.info/ 위 주소로 MAMP를 다운받을 수 있다.유료버전을 구매하면로컬 뿐만아니라 웹서버로 바로 연동이 가능하다고한다. 다음단계에서 본인의 사양에 맞는 MAMP를 선택하고 다운받으면된다. 이렇게 다운받은 파일.. 2019. 1. 4. 가상요소로 불렛 코딩 추가하기 옛날 같으면 불렛을 넣으려면 이미지로 백그라운드해서 넣었지만이제는 일일이 이미지 잘라줄 필요 없이 가상요소로 넣어주면 된다. 123456 첫번째 항목 두번째 항목 위와같이 리스트를 만들었다면 12345678910111213141516.txt_list ul li { position: relative; padding-left: 8px;}.txt_list li:before { content: ''; width: 3px; height: 3px; border-radius: 50%; background: #12a47f; position: absolute; left: 0; top: 10px;}cs 이런식으로 before 가상요소를 사용하여불렛을 추가해준다. 이런식으로 불렛이 추가된것을 확인할 수 있다. 이번에는 하이.. 2019. 1. 3. 시맨틱 태그 시맨틱 태그는 태그 자체에 의미가 있는 태그를 말한다 12345678910 section : 콘텐츠를 주제별로 묶을때article : 독립적인 콘텐츠 항목, 독립적으로 때어내서 배포하거나 재분배 하더라도 완전히 하나의 콘텐츠가 되는것section :이 아티클 바깥에 갈수도 있고 안에 갈수도 있으며 하나만 쓸수도있고 둘다 같이 쓸수도 있다.aside : 본문 이외의 내용표시 필수요소가 아니므로 광고나 링크모음등 문서 메인 내용에 영향을 미치지 않는 내용들을 넣을때 사용한다. 중요도가 떨어지는내용으로 보통 오른쪽에 배치하지만 하단에 배치시킬 수도 있다. 2019. 1. 2. 이전 1 ··· 69 70 71 72 73 74 75 ··· 77 다음 728x90 반응형 LIST