strong 태그와 em 태그의 차이

SEO를 고려한 시멘틱 마크업을 하기에 있어 strong 태그와 em 태그를 문맥상 강조할 때 많이 사용하실텐데요.

 

차이점은 다음과 같습니다.

 

strong	em
중요성, 긴급성, 심각성을 알리는 경우 그 부분을 강조하는 데 사용	문장 내에서 특정 문맥의 강조할 때 사용

 

이 중에서 중요성이라는 항목이 가장 모호할텐데요.

 

강조의 정도에 있어서는 em은 strong보다는 덜 강합니다.

 

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/strong#%3Cem%3E_vs._%3Cstrong%3E

: The Strong Importance element - HTML: HyperText Markup Language | MDN

 

While <em> is used to change the meaning of a sentence as spoken emphasis does ("I love carrots" vs. "I love carrots"), <strong> is used to give portions of a sentence added importance (e.g., "Warning! This is very dangerous.") Both <strong> and <em> can be nested to increase the relative degree of importance or stress emphasis, respectively.

 

강조성에 있어서는 둘다 상대적 정도의 강조 또는 문맥상 강조구문을 각각 사용할 수 있다고 되어있지만 em의 경우에는 문맥상의 의미를 바꾸어주는 강조라고 되어있습니다. 

 

HTML5 공식문서에서도 찾아볼 수 있는데요.

https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-em-element

HTML Standard

 

문맥상의 강조를 보여주는 em태그의 예시와 문장 전체 또는 단어에 포함되는 강조구문을 사용하고 또는 의미 전체를 묶어 강조하는 strong 태그를 보실 수 있습니다.

 

여러 공식문서와 Stack Overflow와 같은 관습적인 부분에서 찾아본 결과,  em은 기본 문맥적 강조를 위하여 사용하고 그 상위 개념으로 strong의 긴급성, 심각성, 중요성을 포함하는 특별 강조구문이나 강조문장을 사용해주시면 될 것 같습니다.

 

 

감사합니다.