Haga clic aquí para volver a la columna del tutorial Wulin.com HTML.
Arriba: Lista del Capítulo1
Fuente original
Soluciones de diseño estandarizadas - Manualde marcado
y estilo Parte 1: Baje con Markup Comience con Markup Título del Capítulo2 Descripción general:No solo todas las páginas web necesitan tener títulos, sino que pueden agregar mucho color al diseño web y la facilidad de uso si se marcan correctamente.
En términos de apariencia, el título de una página web suele ser un tamaño de fuente más grande, y puede usar un color o fuente diferente del texto principal. La función del título es describir brevemente el tema discutido en los capítulos posteriores. W3C lo describe así: muestra el resumen de cada párrafo en la página web.
¿Cómo crear un título de página para hacer la información que queremos presentar el uso más efectivo? En este capítulo, estudiaremos varios métodos de uso común para tratar con títulos, trataremos de encontrar una de las formas más útiles para nosotros, y luego usaremos algunos consejos y trucos CSS para decorar el mejor método.
¿Cuál es la mejor manera de crear un título de documento?Antes de responder a esta pregunta, supongamos que el título ahora se está colocando en la parte superior del documento, y echemos un vistazo a tres formas de lograr efectos similares.
Método A: ¿Tiene sentido?<span class = Heading> Título de la página Super Cool </span>
Aunque la etiqueta <span> es una etiqueta conveniente en algunos casos, no tiene mucho sentido para los títulos de página. El único beneficio de usar este método es que podemos especificar un estilo CSS para la clase de encabezado para que el texto parezca un título.
.título {
tamaño de fuente: 24px;
Font-Weight: Bold;
Color: azul;
}
Ahora, todos los encabezados marcados con el encabezado se volverán más grandes, más gruesos y azules, lo cual es genial, ¿verdad? Pero, ¿qué pasa si alguien usa un navegador que no admite CSS para acceder a esta página?
Por ejemplo, ¿qué sucede si colocamos estilos CSS en un archivo de hoja de estilo externo que no es compatible con el navegador antiguo, o cuando la pantalla lee la página para un usuario deshabilitado? Los usuarios que acceden a esta página a través de estos canales no verán (sin sonido) la diferencia entre el título y el texto.
El método de anotación como class = Heading describe ligeramente el significado del contenido de la etiqueta, pero <span> es solo un contenedor de propósito general, que solo permite que la mayoría de los navegadores cambien el estilo de visualización predeterminado.
Cuando los motores de búsqueda rastrean esta página, se omitirán la etiqueta <span> como si no estuviera allí, y no aumentarán el peso para las palabras clave que pueden incluirse. Más tarde, en este capítulo se mencionarán más relaciones entre los motores de búsqueda y los títulos de página.
Finalmente, dado que la etiqueta <span> es un elemento en línea, en su mayoría necesitamos colocar el contenido del método A en otro contenedor de nivel de bloque, como <p> o <div>, para que pueda ocupar una sola línea. Esto generará mucho código innecesario. Incluso si agrega el contenedor requerido, los navegadores que no admiten CSS aún mostrarán el texto de su manera original, para que los usuarios no puedan ver ninguna diferencia entre el título y el cuerpo.
Página anterior1 2 3 4 5 Página siguiente Lea el texto completo