img ; 이미지 요소
2019. 9. 5. 14:14ㆍWEB/HTML
웹 접근성을 높일려면 title 속성에 글을 쓰는 것보다 alt 속성에 글을 써야 함.
이미지에 글이 많을 경우 예전에는 longdesc 속성을 썼지만 개인적으로 스타일로 대체하는 것이 좋을 것 같음.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>img</title>
<style>
.desc { width:636px; height:542px; background:url(img/diagram.gif); text-indent:-9999em; }
</style>
</head>
<body>
<h1>img</h1>
<p><img src="img/board.jpg" alt="자연 풍경"></p>
<p><img src="img/diagram.gif" alt="운동철학" longdesc="data/desc.html"></p>
<hr>
<div class="desc">
<h1>운동철학</h1>
<ul>
<li>
<h2>그물코정신</h2>
<h3>관계라는...</h3>
<p>과도한 소비로...</p>
</li>
<li>
<h2></h2>
<h3></h3>
<p></p>
</li>
<li>
<h2></h2>
<h3></h3>
<p></p>
</li>
</ul>
</div>
</body>
</html>
※인프런 강좌 보고 작성했습니다.
https://www.inflearn.com/course/html-css-webazit#
퍼블리셔 취업을 위해 제대로 배워보는 html과 css, 그리고 웹표준 - 인프런
웹표준 기초인 html과 css를 마스터하고 실전 웹페이지를 제작해 봅니다. 그때 그때 '그럴 것같은' 이 아니라 제대로 된 퍼블리싱 개념과 방법을 배워 퍼블리셔가 될 수 있습니다. 입문 웹 개발 웹앱 디자인 html/css 웹 디자인 온라인 강의
www.inflearn.com
※인프런 강좌 강사님 네이버 카페 참고했습니다.
웹표준,웹디자인 : 네이버 카페
웹표준과 html을 공부하는 카페입니다.
cafe.naver.com