Dominando el texto en negrita en HTML

Introducción

En este laboratorio, aprenderás a usar la etiqueta HTML <b> para crear texto en negrita en una página web. También cubriremos las mejores prácticas para usar esta etiqueta y las alternativas recomendadas cuando sea necesario.

Nota: Puedes practicar la codificación en index.html y aprender Cómo escribir HTML en Visual Studio Code. Haga clic en 'Go Live' en la esquina inferior derecha para ejecutar el servicio web en el puerto 8080. Luego, puede actualizar la pestaña Web 8080 para previsualizar la página web.

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL html(("HTML")) -.-> html/BasicStructureGroup(["Basic Structure"]) html(("HTML")) -.-> html/TextContentandFormattingGroup(["Text Content and Formatting"]) html(("HTML")) -.-> html/LayoutandSectioningGroup(["Layout and Sectioning"]) html(("HTML")) -.-> html/AdvancedElementsGroup(["Advanced Elements"]) html/BasicStructureGroup -.-> html/basic_elems("Basic Elements") html/TextContentandFormattingGroup -.-> html/text_head("Text and Headings") html/TextContentandFormattingGroup -.-> html/para_br("Paragraphs and Line Breaks") html/LayoutandSectioningGroup -.-> html/doc_flow("Document Flow Understanding") html/AdvancedElementsGroup -.-> html/inter_elems("Interactive and Dynamic Elements") subgraph Lab Skills html/basic_elems -.-> lab-70706{{"Texto en negrita en HTML"}} html/text_head -.-> lab-70706{{"Texto en negrita en HTML"}} html/para_br -.-> lab-70706{{"Texto en negrita en HTML"}} html/doc_flow -.-> lab-70706{{"Texto en negrita en HTML"}} html/inter_elems -.-> lab-70706{{"Texto en negrita en HTML"}} end

Configurar el archivo HTML

Crea un nuevo archivo llamado index.html en tu editor de código. En el cuerpo del documento, agrega un párrafo con algún texto que desees poner en negrita.

<body>
  <p>Here is some text that needs to be bold.</p>
</body>

Agregar la etiqueta

Para poner el texto en negrita, enciérralo con las etiquetas <b> de la siguiente manera:

<body> <p>Here is some <b>bold</b> text.</p> </body>

Estilo CSS predeterminado

El estilo CSS predeterminado para la etiqueta <b> es el siguiente:

<style> b { font-weight: bold; } </style>

Mejores prácticas

Evite usar la etiqueta <b> de manera excesiva. Utilícela solo en texto importante que requiera énfasis.

Para los títulos, use las etiquetas <h1> a <h6> en lugar de la etiqueta <b>.

Para enfatizar el texto, use la etiqueta <em> en su lugar. Esta etiqueta también utiliza texto en cursiva en lugar de negrita.

Para texto importante, use la etiqueta <strong> en su lugar. Esta etiqueta pondrá el texto en negrita e indicará su importancia para los motores de búsqueda.

Resumen

¡Eso es todo! Ahora sabes cómo usar la etiqueta HTML <b> para crear texto en negrita en tu página web. Recuerda usar esta etiqueta adecuadamente y seguir las mejores prácticas para obtener una codificación óptima.