사이트에 이미지를 넣는 방법은 두 가지가 있습니다.
<img>태그를 사용하는 것과<div>태그에background-image속성을 추가하는 것. 두 가지 방법의 차이점과 각각 어떠한 경우에 사용하면 좋은지 설명해보세요.
div 태그는 non-semantic 태그로서, div만 확인 했을 경우 해당 부분의 id나 class에 의미를 부여함으로 겨우 어떤 역활을 하는지 알 수 있다.
하지만 모든 web에 공통적으로 적용되지 않기 때문에 해당 코드를 작성한
사람만 알 수 있다. 따라서 Semantic Tag 로서 모든 web에 공통적으로
의미를 부여해주는 태그들을 만들게 되었다.
따라서 해당 img가 검색이 작성하고자 하는 내용에서 의미를 갖는다면 div 태그보다는 img 태그로 작성하는 것이 좋을 것이다.
만약 해당 img가 내용상 의미가 없고 디자인에 사용된 경우라면 div 태그로 작성해도 무방하다.
▶ 자주 사용되는 시맨틱 태그의 종류
<header>, <nav>, <section>,<article>,<aside>,<iframe>,<address>
,<footer>,<detail>,<time>,<main> 등
Semantic Web
▶문서의 의미에 맞게 구성된 웹이다.
web이 발전함에 따라 수많은 정보들이 축적되었는데, 무분별한 정보의 축적은 오히려 많은 문제들을 불러왔다.
컴퓨터가 스스로 정보를 해석, 가공할 수 없기 때문에
검색 엔진 최적화(SEO), 웹 접근성, 코드의 가독성 등과 같은 이유로 기계가 의미에 맞게 읽고 처리하기 위해 Semantic Web으로 작성하게 되었다.
기존 웹과 Semantic Web 차이
자원 공유 및 통합 가능
문서의 Syntax 및 Semantics 도 표현
데이터의 재사용 가능
추론이 가능함
XML, RDF, OWL 언어로 표현
XML : 컴퓨터가 문법을 이해 할 수 있도록 만들어 주는 언어
RDF : 컴퓨터가 Semantic을 이해할 수 있게 만들어주는 언어
OWL : 웹상에서 첨단의 웹 검색, 소프트웨어 에이전트 및 지식관리 기능을 제공하는 온톨로지를 발간 및 공유하기 위한 시멘틱 웹 생성 언어
기존 html에서는 블럭을 전부 div로 처리해주고 id나 class 값들로
지정해주었었다고 한다. 엄청 번거로운 작업이었을 것 같다.
html5는 html의 5번째 버전이라고 하는데 2014년 10월 28일 탄생했다고 한다 일주일 뒤쯤에 생일이시다.^^
근데 div 말고 다른거 위주로 짜여진 사이트들도 많이 찾아보고 싶은데
많이 없다고 한다. 국내 웹 사이트들은 많이 없다고해서 아쉽다.
