search
HomeWeb Front-endHTML TutorialThe differences and uses of b tag, Strong tag and h1 tag

strong It is recommended to use b only once but you can use strong multiple times to emphasize semantically and boldly b in form.

1. What are STRONG and B tags?

As we all know, the development of affairs can only become more and more standardized, and search engines must also prefer standardized things. The b tag is the content of HTML, and STRONG is the content of XHTML. Therefore, from a standardization perspective, the STRONG tag is better than the B tag. Therefore, when technology permits, it is a trend for websites to use DIV+CSS for layout as much as possible.

From a semantic point of view:

"strong" is an emphasis tag

"b" is a bold tag

The tag is a Entity tag, the characters it surrounds will be set to bold (bold), and the tag is a logical tag, its role is to strengthen the mood of the character. Generally speaking, strengthening the mood of the character is by changing the character This is achieved by changing it to bold. It can be seen that the B tag is just functional bolding, while STRONG has a deeper meaning, emphasis. The humanization of search engines focuses more on the STRONG tag.

 2. How to use the STRONG tag?

Tags such as H1 are mainly used in titles, while STRONG focuses more on content applications, such as the identification of keywords. Some websites also use the STRONG tag to emphasize subtitles. But it should be noted that excessive use of STRONG tags may also lead to search engine penalties.

Reminder: The STRONG tag must be written on the page. STRONG defined through CSS is useless for inclusion and ranking. Although robots can crawl CSS files, it is estimated that search engines only crawl the content.

Of course, it does not mean that with strong, b is eliminated, but this b is a bold font, which happens to be the same as the emphasis effect of strong by default. In fact, this strong can be defined in other styles. Emphasis on effect, but in order to comply with current W3C standards, it is recommended to use the strong tag.

-------------------------------------------------- --------------------------

 B tag: visual effect bold. It does not have HTML semantics per se.

WEB standards advocate the separation of style and content, so it is no longer recommended to use B purely to achieve boldness.

Strong tag: visual effect is bold. HTML semantics are emphasis, indicating emphasis and emphasis in tone.

When a blind person uses a screen reader, the difference between B and Strong can be clearly seen. When you encounter B, read it as you would a normal word. When you encounter Strong, read it with emphasis and pause.

 B and Strong from an SEO perspective. In fact, it is a question of how search engines view B and Strong. After all, search engines are machines, and we are facing users after all. Therefore, in my opinion, there is no need to compare who has a greater optimization effect. I also had doubts about the two tags when I read the bold tags mentioned in the SEO document. I deliberately read the "XHTML Definitive Guide" again, and then gradually gained some experience in practice. There is really no need to take it seriously. If it's just to know who is more effective, wouldn't it be better to just use H? But can it be ranked if all optimization techniques are used? Can that still be called optimization?

Therefore, from the perspective of XHTML document meaningfulness and user experience, Strong is more beneficial and is recommended to be used. As for SEO, it depends on the optimization situation. There are some things that we may be confused about and unable to distinguish at the moment. At this time, insist that user experience comes first.

The above is the detailed content of The differences and uses of b tag, Strong tag and h1 tag. For more information, please follow other related articles on the PHP Chinese website!

Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
What is the purpose of the <datalist> element?What is the purpose of the <datalist> element?Mar 21, 2025 pm 12:33 PM

The article discusses the HTML <datalist> element, which enhances forms by providing autocomplete suggestions, improving user experience and reducing errors.Character count: 159

What is the purpose of the <progress> element?What is the purpose of the <progress> element?Mar 21, 2025 pm 12:34 PM

The article discusses the HTML <progress> element, its purpose, styling, and differences from the <meter> element. The main focus is on using <progress> for task completion and <meter> for stati

What is the purpose of the <meter> element?What is the purpose of the <meter> element?Mar 21, 2025 pm 12:35 PM

The article discusses the HTML <meter> element, used for displaying scalar or fractional values within a range, and its common applications in web development. It differentiates <meter> from <progress> and ex

How do I use HTML5 form validation attributes to validate user input?How do I use HTML5 form validation attributes to validate user input?Mar 17, 2025 pm 12:27 PM

The article discusses using HTML5 form validation attributes like required, pattern, min, max, and length limits to validate user input directly in the browser.

What is the viewport meta tag? Why is it important for responsive design?What is the viewport meta tag? Why is it important for responsive design?Mar 20, 2025 pm 05:56 PM

The article discusses the viewport meta tag, essential for responsive web design on mobile devices. It explains how proper use ensures optimal content scaling and user interaction, while misuse can lead to design and accessibility issues.

What is the purpose of the <iframe> tag? What are the security considerations when using it?What is the purpose of the <iframe> tag? What are the security considerations when using it?Mar 20, 2025 pm 06:05 PM

The article discusses the <iframe> tag's purpose in embedding external content into webpages, its common uses, security risks, and alternatives like object tags and APIs.

What are the best practices for cross-browser compatibility in HTML5?What are the best practices for cross-browser compatibility in HTML5?Mar 17, 2025 pm 12:20 PM

Article discusses best practices for ensuring HTML5 cross-browser compatibility, focusing on feature detection, progressive enhancement, and testing methods.

How do I use the HTML5 <time> element to represent dates and times semantically?How do I use the HTML5 <time> element to represent dates and times semantically?Mar 12, 2025 pm 04:05 PM

This article explains the HTML5 <time> element for semantic date/time representation. It emphasizes the importance of the datetime attribute for machine readability (ISO 8601 format) alongside human-readable text, boosting accessibilit

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Tools

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Atom editor mac version download

Atom editor mac version download

The most popular open source editor