볼드체(굵은체라고도 함)는 타이포그래피에서 강력한 강조 유형으로 간주됩니다. 최신 HTML에는 기본적으로 굵은 글꼴 두께("굵게 표시"라고도 함)를 텍스트 요소(대부분의 브라우저에서)에 적용하는 두 개의 HTML 요소가 있습니다.
<strong>를 사용할 수 있습니다. 태그 또는 <b> 다음과 같은 태그:
<p>The strong tag is used to <strong>emphasize</strong> text.</p>
<p>The b tag is used to <b>emphasize</b> text.</p>
최신 HTML(HTML5)에서는 <strong> 및 <b> 의미 있고 유효한 것으로 간주됩니다. 둘 다 최신 브라우저에서 동일한 굵게 표시되는 스타일을 사용하지만 의미나 목적은 동일하지 않습니다.
그러면 strong과 b를 사용하는 것의 차이점은 무엇이며 무엇을 위해 사용해야 합니까?
<strong>요소는 매우 중요한 내용(예:경고)에 사용됩니다.<b>요소는 중요성을 암시하지 않고 주의를 끌기 위해 사용됩니다.
<b> 사용 예 :
The Spanish word <b>idioma</b> means “language”. It originates from Greek.위의 예에서 저는 타이포그래퍼로서 idioma라는 단어를 강조 표시하기로 결정했습니다. 훌륭한 중요하지만, 영어가 아닌 외국어이기 때문에 주변 텍스트에서 돋보이고 싶습니다. 의미를 전달하기 위해 해야 하는 일이라기보다는 스타일에 따른 결정입니다.
따라서 뒤에 특정한 의미 없이 주의를 끌고 싶다면 <b> 역사적으로 (HTML5 이전) 사용하기에 정확합니다. 즉, 현대에는 프레젠테이션에 HTML을 사용하지 않고 CSS를 사용하므로 <b>를 사용하지 않습니다.
<strong> 사용 예 :
In 2020, <strong>security</strong> and <strong>performance</strong> are are
crucial for your SEO.위의 예에서 나는 보안을 강력하게 강조하기로 결정했습니다. 및 실적 이러한 주제는 실제로 웹사이트의 SEO(및 UX)에 매우 중요하기 때문입니다.
기본적으로 <strong> 및 <b> 대부분의 브라우저에서 동일한 볼드체 스타일을 텍스트에 적용하므로 당연히 많은 혼란을 야기합니다. 서로 다른 사용 사례에 대해 서로 다른 도구인데 왜 똑같이 보이게 합니까?
동의합니다. 짜증나네요.
이것이 브라우저 기본값을 무시하고 다른 스타일을 적용하려는 이유입니다.
<strong>를 구별하는 좋은 방법 및 <b> 프리젠테이션은 <strong>에 500~900(글꼴 패밀리에 따라 다름)의 글꼴 두께를 적용하는 것입니다. CSS가 있는 요소입니다. 다음과 같이:
strong {
font-weight: 700;
}
그런 다음 <b>에 대해 다른 스타일을 사용합니다. , 예:
b {
font-weight: 400;
color: green;
}위의 제안은 스타일 제안이 아니라 브라우저에서 렌더링된 페이지를 볼 때 사용한 스타일을 더 쉽게 기억할 수 있는 방법의 예입니다.
마크다운을 사용하는 경우
<b>를 변환하려고 하면 또는 <strong> Browserling과 같은 HTML에서 Markdown 변환기로 마크다운하려면 둘 다 동일한 ** **를 얻는다는 것을 알 수 있습니다. — <strong>로 렌더링됩니다. 브라우저에서.
그래서 무엇을 제공합니까?
잘 모르겠다. <b>를 렌더링하는 방법을 보여주는 마크다운 가이드를 찾을 수 없습니다. 마크다운 구문을 사용하지 않고 마크다운을 사용할 때 브라우저에.
걱정하지 마세요. HTML 구문을 마크다운 파일 내부에 직접 적용할 수 있습니다(이전 버전을 사용하지 않는 한). 따라서 <b>를 사용하거나 사용해야 하는 경우 <strong> 대신 , 다음과 같이 간단히 추가할 수 있습니다.
Here is a line of text inside a <b>markdown</b> file which automatically gets wrapped by paragraph tags
저는 이 튜토리얼을 마크다운으로 작성하고 있습니다. 이제 이 텍스트를 강조표시하겠습니다. <b> 사용 요소. 이 단락을 표시하고 선택하고 "검사"를 클릭하면 실제로 <b>를 사용하고 있음을 알 수 있습니다. 요소.
어떤 것을 사용하느냐가 그렇게 중요합니까?
이것은 분명히 삶과 죽음의 문제가 아닙니다. 그렇지 않으면 최신 브라우저에서 <b>를 렌더링하지 않습니다. 및 <strong> 동일한 볼드체 스타일로.
그러나 의미적으로는 차이가 있습니다. 이것이 제가 전달하고자 하는 메시지입니다. 따라서 면접을 보러 간다면 면접관이 많은 시맨틱 마크업에 대해서는 차이점을 아는 것이 중요합니다.
요약:
<b>특정 텍스트에 주의를 끌기 위해 사용됩니다.<strong>중요한 텍스트에 사용됩니다.- 의심스러운 경우
<strong>를 사용하십시오. .
경험의 좋은 규칙은 강조를 완전히 남용하지 않는 것입니다. 너무 강조하려고 하면 강조가 힘을 잃습니다. 모든 것을 강조하면 아무 것도 강조하지 않음 (일반 마케팅 랜딩페이지 사이트를 보고 있습니다.)