Text_level Semantic 에 관하여..
# Text-level semantics
- HTML 요소 내에서 텍스트로 취급되는 요소
- 텍스트 사이에서 텍스트로 취급되는 요소
--------------------------------------------------------------------------------------------------------------
## HTML a 요소
- HTML 내에서 하이퍼텍스트 (링크)를 생성할 때 사용하는 요소
<a href =" http://naver.com"> 네이버 </a>
- href 속성은 필수값은 아니다.
- 활성화 상태 / 비활성화 상태
<a>네이버</a>
- a 요소 내에는 다른 a 요소를 삽입할 수 없다.
- 인터렉티브 콘텐츠 내에는 다른 인터렉티브 콘텐츠를 넣어서는 안된다.
<div>
<a href="http://google.com">
<h1> google </h1>
<p> 세계 1위 검색 포털이다 </p>
</a>
<button type="button"> 선호하는 URL에 추가 </button>
<div>
( HTML4 는 a 태그 안에 다른 요소가 들어갈 수 없었지만 현재 living standard 는 가능하다. )
- a요소 hash link
<nav>
<a href=""> HTML em 요소 </a>
<a href=""> HTML strong 요소 </a>
</nav>
<h2 id="html-em"> HTML em요소 </h2>
<h2 id="html-strong"> HTML strong요소 </h2>
HTML em요소를 누르면 id-html-em 요소로 이동한다.
--------------------------------------------------------------------------------------------------------------
## em 요소, strong 요소
- 강조를 나타내는 요소
- strong 은 조금 더 강한 강조 : warning, Attention, required
- em 은 보편적인 강조
strong 주의하세요 /strong
<h1> Chapter 1. <strong> hello world </strong> </h1>
<em> 감자 <em> 는 맛있습니다.
--------------------------------------------------------------------------------------------------------------
## q, cite 요소
- q 요소 : 인용구를 나타내는 요소 ( 문장 )
- cite 요소 : 실체가 있는 물건이나 사이트 등을 인용해 올 때
<p> <q> HTML is awesome </q> is on the <cite> Smashing magazine </cite> </p>
-> Smashing magazine 이라는 사이트에서 HTML is awesome 이라는 문장을 인용해 왔다 라고
생각하면 좋음.
<p> <cite> Monocle </cite> 이라는 메거진을 읽고 있습니다. </p>
--------------------------------------------------------------------------------------------------------------
## dfn, abbr 요소
- dfn 요소는 해당 페이지에서 최초로 정의된 용어를 나타낼 때 사용하는 요소
( 전문용어를 사용했거나, 기존에는 없던 용어인데 해당 사이트에서만 사용했을 경우 )
- abbr 요소는 약어를 나타내는 요소
<p>
<dfn id="whatwg">
<abbr title="web Hypertext Application ... ">
WHATWG
</abbr>
</dfn> 는 웹 표준화 기구입니다.
</p>
<p> <a href="#whatwg"> WHATWG </a> 에서 제정한 표준에는 HTML Living standard가 있습니다. </p>
--------------------------------------------------------------------------------------------------------------
## code 요소
- HTML 문서 내에서 코드를 나타낼 때 사용하는 요소
<p>
HTML의 DOCTYPE에는 <code> < !DOCTYPE HTML> </code> 같은 것들이 있다.
</p>
--------------------------------------------------------------------------------------------------------------
## span 요소
- 별다른 의미는 없지만, 여러개의 텍스트를 감싸야할 때 사용하는 요소
- 최후의 수단으로 활용
<span lang="ko">
텍스트
<span>
--------------------------------------------------------------------------------------------------------------
## br 요소, wbr 요소
- break
- HTML 문서 내에서 줄바꿈을 일으킬 때 사용
- wbr 요소는 특정한 조건에서만 줄바꿈이 발생
<p>
안녕하세요 <br>
현준입니다.
</p>
<p>
안녕하세요 <wbr>
현준입니다.
</p>
--------------------------------------------------------------------------------------------------------------
요즘 틈틈히 듣고 있는 HTML 강의 이다.
들으면 들을수록 기초가 쌓이고 기본을 지켜야 하는 이유를 알게 되는것 같다.
왜 시맨틱이 중요한지, 이걸 지키지 않으면 어떤 문제가 생기는지 현실감 있게 문제를
보지는 못하지만, 한번도 안들어 본 것 보다는 낫겠지..
이제 다시 스터디 준비도 병행하면서 공부를 할 계획이다. 게으름 피우지 말고 끝까지 끌고 갈 수 있기를
화이팅 !