본문 바로가기
Study/HTML&CSS

HTML <STRONG> 태그와 <EM> 태그

by 얏옹이 2022. 12. 13.
반응형

Strong 태그는 문서에서 중요함을 나타내는 문서이다.

지금도 방금 글을 쓰면서 중요함 에 강조하기위해서 "굵게" 옵션을 사용했는데. 이와 같은것이다. 문자를 굵게 나타내주고 중요하다고 표시해줄수 있는 태그가 바로 <Strong> 태그이다.

Strong 태그는중요함을 나타내주기 위한 코드입니다

 

<!DOCTYPE html>
<html lang="ko">
    <head>
        <meta charset="utf-8">
        <title>
            Strong
        </title>
    </head>
    <body>
        <h1>Strong 태그 알아보기</h1>
        <Strong>중요함</Strong>을 나타내주는 태그로써 웹 텍스트에서 <Strong>중요함</Strong>을 강조하기 위해 굵게 표현해줍니다.
    </body>
</html>

 

Strong

Strong 태그 알아보기

중요함을 나타내주는 태그로써 웹 텍스트에서 중요함을 강조하기 위해 굵게 표현해줍니다.

 

EM태그는 문자열을 강조하기 위해서 사용하는 태그이다.

 

예를들어 문장이나 단어를 강조 하기 위해서 사용되어지는데. 이건 바로 코드로 확인해보면 어떤말인지 알수있다.

 

<!DOCTYPE html>
<html lang="ko">
    <head>
        <meta charset="utf-8">
        <title>
            Strong
        </title>
    </head>
    <body>
        <h1>EM 태그 알아보기</h1>
        <em>중요한건 꺾이지 않는 마음!</em> 우리는 바로 이 마음가짐을 지니며 살아 가야합니다.<br/>
        포기하지 않는다면 우리에겐 항상 길이 있고 그 길 끝엔 <em>노력한만큼의 보상이 주어질것입니다.</em>

    </body>
</html>

 

 

Strong

EM 태그 알아보기

중요한건 꺾이지 않는 마음! 우리는 바로 이 마음가짐을 지니며 살아 가야합니다.
포기하지 않는다면 우리에겐 항상 길이 있고 그 길 끝엔 노력한만큼의 보상이 주어질것입니다.

 

 

Strong 태그와는 달리 글자가 살짝 누웠다(?)

 

이클립스 내에서 Java 소스코드중에 Final Static을 입력해보면 눕는 글씨처럼 문장을 강조 해준다.

 

굵게 처리해주던 필기체처럼 처리해주던 뭐가 다르냐? 라고 할수 있을텐데 눈으로만 보기에는 크게 차이가 없을수도있다.

 

이렇게 강조해주나 저렇게 중요하다고 표시하나 일반적으로는 "표시해주기 나름" 이기때문이다.

 

하지만 예를들어 검색엔진에서 HTML 문서에 대한 품질을 검증할때 정확한 코드로 이루어진 HTML 문서는 좀더 검색엔진 최적화에 유리하기 때문이다.

 

 

<Strong> 태그와 <EM> 태그와 같은 기능을 가진 <b>태그와 <i> 태그가 있다. 비교를 해보자.

 

<!DOCTYPE html>
<html lang="ko">
    <head>
        <meta charset="utf-8">
        <title>
            Strong
        </title>
    </head>
    <body>
        <h1>Strong EM B I</h1>
        <h2>Strong과 EM 태그 사용</h2><br/>
        <Strong>Deft</Strong>선수의 롤드컵 우승을 축하합니다.<br/>
        <em>DRX</em>팀을 떠나 <em>담원</em>에서도  행복한 롤 프로게이머 생활이 되었으면 합니다.<br/><br/>
        <hr/>
        <h2>b태그와 i태그 사용</h2>
        <b>Deft</b> 선수의 롤드컵 우승을 축하합니다<br/>
        <i>DRX</i> 팀을 떠나 <i>담원</i>에서도 행복한 롤 프로게이머 생활이 되었으면 합니다.



    </body>
</html>

 

Strong

Strong EM B I

Strong과 EM 태그 사용


Deft선수의 롤드컵 우승을 축하합니다.
DRX팀을 떠나 담원에서도 행복한 롤 프로게이머 생활이 되었으면 합니다.


b태그와 i태그 사용

Deft 선수의 롤드컵 우승을 축하합니다
DRX 팀을 떠나 담원에서도 행복한 롤 프로게이머 생활이 되었으면 합니다.

 

눈으로 보기에 차이가 있는가? 없다. 하지만 HTML 문서 내에서의 의미는 다르다

 

Strong은 중요함을 나타내주는 의미가 있고 B태그는 단순하게 글자를 굵게 해준것이다

마찬가지로 EM은 문자열을 강조해주는 의미가 있지만 i 태그는 단순하게 글씨체를 스타일링 해준것이다.

 

마지막으로 EM과 Strong 태그를 중복으로 사용해서 좀더 중요하고 강조의 의미를 부여할수 있다.

 

<!DOCTYPE html>
<html lang="ko">
    <head>
        <meta charset="utf-8">
        <title>
            Strong
        </title>
    </head>
    <body>
        <h1>Strong EM 중복</h1>
        <Strong><em>중요한건 꺾이지 않는 마음</em></Strong>
    </body>
</html>

 

Strong

Strong EM 중복

중요한건 꺾이지 않는 마음

 

이렇게 중복으로 표현해줄수도 있다. 강조되는 문구가 중요하다는 의미로 해석할수 있겠다

반응형