Encabezado de una pagina web
Artículo de la página web
Preste atención cuando cambie el ancho de su imagen de cabecera. Si utiliza el método anterior para reducir el ancho, SiteBuilder puede estirar su imagen y reducir su calidad. Esto se debe a que el ancho de la cabecera está configurado al 100% para el diseño responsivo para múltiples pantallas. Puede cambiar el ancho de forma segura de la siguiente manera:
En el menú lateral, vaya a la pestaña SEO. Haga clic en ella para mostrar la configuración de la optimización para motores de búsqueda. Encontrará el campo de código html de la cabecera en el menú Código de la cabecera o Código de la cabecera. Coloque el siguiente código.
Si este código no da el resultado deseado, es posible que el identificador sea incorrecto: los distintos diseños suelen tener identificadores diferentes. Descubrirá lo que necesita viendo el código fuente a través del navegador.
Mueva el cursor sobre los trozos de código hasta que sólo se ilumine la cabecera en el diseño. Copie este identificador. En este ejemplo, su identificador es ‘header-image’, por lo que la línea de código que necesita encontrar debería tener este aspecto:
Si ve un identificador o clase diferente, cambie el código anterior en el menú de Código de cabecera. Utilice ‘#’ cuando describa el objeto a través del identificador -el valor ‘id’- y utilice ‘.’ en lugar de ‘#’ cuando describa el objeto a través del valor de la clase.
Código de la cabecera del sitio web
La cabecera de un sitio web es lo primero que ven los visitantes cuando visitan un sitio, y aparece en todas las páginas del mismo. Un buen encabezado de sitio web equilibra un diseño limpio y una navegación clara hacia las páginas más profundas de un sitio web. Por lo tanto, es importante concentrarse en las mejores prácticas para diseñar un encabezado de sitio web para sus clientes que ayude a sus clientes a llegar rápidamente a la información que necesitan. Para ayudarle a construir grandes cabeceras para sus sitios, aquí hay 11 consejos para guiarle.
Piense en lo principal que quiere que hagan los visitantes de un sitio y asegúrese de que este elemento sea claramente visible en la cabecera. Por ejemplo, para los sitios sin ánimo de lucro, tenga un icono de Donar Ahora; para los sitios de restaurantes, tenga un icono de Reservar una Mesa.En general, las cabeceras contienen información que facilita a los visitantes la interacción con el sitio, incluyendo:
El texto de la cabecera debe ser legible de un vistazo. Utilice palabras cortas, siempre que sea posible, y elija fuentes claras y de tamaño relativamente grande. Las cabeceras no suelen ser el lugar adecuado para las fuentes estilizadas, ya que pueden ser más difíciles de leer.
Sitio web sin cabecera
<cabecera>El elemento HTML <cabecera> representa el contenido introductorio, normalmente un grupo de ayudas a la introducción o a la navegación. Puede contener algunos elementos de encabezamiento, pero también un logotipo, un formulario de búsqueda, un nombre de autor y otros elementos.
Notas de usoEl elemento <header> no secciona el contenido y, por tanto, no introduce una nueva sección en el esquema. Dicho esto, un elemento <header> está destinado a contener normalmente el encabezamiento de la sección circundante (un elemento h1-h6), pero esto no es obligatorio.Uso históricoAunque el elemento <header> no se abrió paso en las especificaciones hasta HTML5, en realidad ya existía en los inicios de HTML. Como se ve en el primer sitio web, se utilizaba originalmente como el elemento <head>. En algún momento, se decidió utilizar un nombre diferente. Esto permitió que <header> quedara libre para desempeñar un papel diferente más adelante.AtributosEste elemento sólo incluye los atributos globales.EjemplosPage Header<header>
Cuerpo de una página web
Tenga en cuenta que la página de inicio no siempre es la primera página en la que aterrizan los visitantes cuando entran en su sitio web (especialmente si tiene una estrategia inteligente de marketing y SEO basada en la educación). Por lo tanto, todas las páginas de su sitio web deberían llevar a los visitantes a saber más sobre usted y a actuar, no sólo la página de inicio.
Aunque los sliders eran muy populares hace varios años, no suelo recomendar el uso de sliders en el diseño de sitios web modernos. Consulte este artículo para conocer muchas razones por las que los sliders no hacen un gran trabajo para que los visitantes tomen acción.
A menudo escuchamos a los clientes llamar a estos “pestañas” en la parte superior del sitio, pero los menús diseñados para parecer pestañas son básicamente inexistentes en 2018. En lugar de llamar a estas “pestañas”, en su lugar nos escuchará referirse a los elementos del menú como “enlaces” o “páginas” en el menú.
Ten en cuenta que la navegación puede incluir menús de navegación primarios y secundarios. Se utilizan dos menús de navegación separados cuando puede haber mucha navegación necesaria, y se quiere tener claro qué enlaces son los más importantes.
