일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- mobile view
- onlosecapture
- IE8
- 개발자도구함
- 웹표준 약도
- box-shadow
- break-all
- JavaScript
- font-size
- view test
- 키보드방지
- Gallery
- meta
- 소스보기방지
- HTML
- 모바일테스트
- Mobile
- 웹표준
- font
- onmouseup
- white-space:pre
- jQuery
- word-break
- Filter
- 스크립트
- keep-all
- html5
- CSS
- Ajax
- css3
- Today
- Total
감성 퍼블리셔 html,css
[웹표준/HTML] <strong>과 <B>차이, <em>과 <i>의 차이 본문
[웹표준/HTML] <strong>과 <B>차이, <em>과 <i>의 차이
보통 웹 표준을 살펴보다 보면 <b> 대신에 <strong>을 사용하라는 이야기를 들어본 적이 있을 것입니다.
왜? <b> 대신 <strong>을 사용해야 할까요?
실제 사용해보면 <b>나 <strong> 모두 동일하게 굵게 표시되기 때문에 큰 차이가 없어 보입니다.
그럼.. 먼저 W3C에서 <strong>과 <em> 태그를 설명하는 부분을 살펴 보시죠.
EM and STRONG are used to indicate emphasis. The other phrase elements have particular significance in technical documents. These examples illustrate some of the phrase elements:
Please refer to the following reference number in future
correspondence: <STRONG>1-234-55</STRONG>
The presentation of phrase elements depends on the user agent. Generally, visual user agents present EM text in italics and STRONG text in bold font. Speech synthesizer user agents may change the synthesis parameters, such as volume, pitch and rate accordingly
위 내용을 잘 읽어보면 강조하기 위해서 <em>이나 <strong>을 사용하라고 되어 있습니다.
그런데 맨 아래 문장을 읽어보면 일반적으로 사용자에게 보여줄 때, <em>은 이탤릭체로 <strong>은 굵은 글씨로 보여준다고 되어 있습니다. 또한 Speech Synthesizer 즉, 음성으로 읽어주는 경우에는 볼륨이나 톤 등을 변경해서 읽어줄 수 있다고 되어 있습니다.
종합하면 <em>이나 <strong>으로 되어 있으면 웹브라우저 뿐만 아니라 다른 음성 읽기 도구에서도 강조해서 읽어준다는 것이죠.
그러나 <b>나 <i>로 되어 있으면 그저 웹브라우저에서만 굵고, 이탤릭체로 표시되는 겁니다.
이렇게 보면 문장 내에서 강조하는 것이 아닐 경우에는 <em>이나 <strong>을 사용하면 안될 것 같아 보입니다.
이런 경우에도 <b>나 <i>를 사용하는 것보다는 CSS를 활용하는 것이 더 바람직해 보입니다.
font-style: italic;
font-weight: bold;
'HTML/CSS' 카테고리의 다른 글
DTD(Document Type Definition)란 무엇인가? css/html (0) | 2014.09.14 |
---|---|
font 관련태그 css (0) | 2014.08.08 |
IE8버전 이하에서 HTML5 사용하기 [HTML] (0) | 2014.07.28 |
익스플로어8 (ie8) 호환성 보기 없애기 (0) | 2014.04.01 |
[css] text-transform 대해 알아보자. (0) | 2014.01.07 |