08. Body - 이미지

안녕하세요.

콤퓨타 학원에 원장을 하고 있는 이프로입니다. 헤헴 ^^

 

홈페이지를 만들때 이미지를 빼놓을 수 없조.

이번 강좌에서는 html로 이미지를 불러와 처리하는 방법에 대해서 이야기해보겠습니다.

---

 

img 태그 문법

<img src="이미지가 있는 경로" alt="대체 텍스트" title="마우스 오버시 툴팁 정보"><br>
<img src="logo.png" alt="코딩다운" title="코딩다운">

img 태그는 이미지를 표현할때 사용하는 태그에요.

src 속성은 이미지가 있는 위치를 말합니다.

a태그에 href와 비슷하게 실제 파일의 위치를 설정해주면 됩니다.

alt 속성은 대체 텍스트라고 하는 부분인데요. 

이부분은 눈이 보이시지 않는 맹인 분들을 위한 기능이라고 볼수 있는데요.

맹인 분들은 이미지를 볼수 없기때문에 텍스트를 읽어주는 기능일 이용해서 홈페이지를 방문하여 소리로 어떤 홈페이지인지 알수 있다고 합니다.

이미지의 경우 이미지가 어떤 이미지인지를 alt에 적어 놓으면 그걸 읽어 준다고 합니다.

그래서 이미지를 볼수 없지만 의미를 파악할수 있겠조.

물론 SEO라고해서 네이버나 구굴이 우리가 만든 홈페이지의 내용을 분석할때 도움울 준다고 해요.

title 속성은 이미지르 마우스 오버 하면 툴팁이 표현되는데 그곳에 표현할 텍스트를 적어 놓는 곳이에요.

---

img 태그에 더 다양한 속성이 있지만 이번글또한 소개정도여서

이후 자세히 다루는 강의를 만들거니 조그만 기다려주세요.

 

이번 강의는 여기까지에요.

여러분들의 관심과 사랑이 있다면 좀 더 좀은 컨텐츠를 제공해줄 수 있을거 같습니다.

많은 관심과 사랑 부탁드립니다.

 

감사합니다.

그럼 콤빠~