Ejemplos de diseño de páginas web
Para la mayoría de las personas de hoy en día, ya es difícil imaginar la vida sin la Web. Diversos sitios web nos ayudan en tareas cotidianas como cocinar o comprar, apoyan nuestra educación con toneladas de datos, nos mantienen rápidamente informados con multitud de noticias, nos ayudan a gestionar, calcular, trabajar y comunicarnos. Según Internet Live Stats, en agosto de 2020 habrá casi 1.800 millones de sitios web. Por lo tanto, la diversidad de sitios web necesita cada vez más enfoques y soluciones de diseño diferentes. Sin embargo, por muy diversos que sean los sitios web, hay algunas páginas básicas típicas para la mayoría de las estructuras de los sitios web. En este artículo, le ofrecemos revisar 16 tipos básicos de páginas web que puede encontrar en la red.
La página de inicio es una de las páginas más estratégicas de cualquier sitio web. Se llama página de inicio porque suele ser un punto de partida en el que el usuario obtiene una introducción básica al sitio web y elige la dirección de su viaje posterior por él. Las páginas de inicio suelen contener enlaces a las zonas de interacción más importantes. En otras palabras, también puede denominarse página inicial o página índice. La página de inicio es el comienzo del viaje de los usuarios si son dirigidos al sitio web por los motores de búsqueda, por lo que, en la mayoría de los casos, es la página visitada por el mayor número de usuarios del sitio web.
Ejemplos de diseño de sitios web modernos
Un sitio web puede ser lo que usted quiera… pero lo más probable es que quiera que sea uno de los tipos de sitios web más populares que ya existen. Si observamos Internet en su conjunto, la mayoría de los sitios se encuadran en una de estas categorías claramente definidas, cada una de ellas con sus propias directrices y características recomendadas, lo que hace más fácil dar en el clavo a la hora de diseñar su propio sitio para que encaje en el molde.
Lo cierto es que todas las empresas del siglo XXI deberían tener un sitio web. Se está convirtiendo en una práctica popular que el primer paso que da una persona para conocer un negocio es consultar su sitio web. Para las empresas que ofrecen servicios nuevos o únicos, un sitio web empresarial ofrece la oportunidad de explicar lo que hacen; para las empresas tradicionales, es una oportunidad de aliviar la aprensión de la gente y verificar que la empresa es legítima.
Un buen sitio web empresarial presenta toda la información esencial sobre una empresa, no sólo la fundamental, como la dirección o la información de contacto, sino también información adicional, como breves biografías del personal o una declaración de objetivos. La idea es que la gente se familiarice con su empresa y, en ese proceso, se entusiasme por trabajar con usted.
Retroalimentación geben
}Media QueriesCSS3 soporta todos los mismos tipos de medios que CSS 2.1, como pantalla, impresión y mano, pero ha añadido docenas de nuevas características de medios, incluyendo max-width, device-width, orientación y color. Los nuevos dispositivos fabricados después del lanzamiento de CSS3 (como el iPad y los dispositivos Android) serán definitivamente compatibles con las características de medios. Por lo tanto, llamar a una consulta de medios utilizando las características de CSS3 para dirigirse a estos dispositivos funcionaría perfectamente, y será ignorada si se accede a ella desde un navegador de ordenador antiguo que no soporta CSS3.En el artículo de Ethan Marcotte, vemos un ejemplo de una consulta de medios en acción:<link rel=”stylesheet” type=”text/css”
}El código anterior procede de una plantilla gratuita de consultas de medios múltiples entre dispositivos populares de Andy Clark. Vea las diferencias entre este enfoque y la inclusión de diferentes archivos de hojas de estilo en el marcado, tal como se describe en su libro “Hardboiled Web Design”. “CSS3 Media QueriesLos anteriores son algunos ejemplos de cómo podrían funcionar las consultas de medios, tanto de CSS 2.1 como de CSS3. Veamos ahora cómo utilizar las consultas de medios de CSS3 para crear diseños web responsivos. Muchos de estos usos son relevantes hoy en día, y todos serán definitivamente utilizables en un futuro próximo.Las propiedades min-width y max-width hacen exactamente lo que sugieren. La propiedad min-width establece una anchura mínima del navegador o de la pantalla a la que se aplicará un determinado conjunto de estilos (o una hoja de estilo independiente). Si algo está por debajo de este límite, el enlace de la hoja de estilo o los estilos serán ignorados. La propiedad max-width hace justo lo contrario. Todo lo que esté por encima del ancho máximo del navegador o de la pantalla especificado no se aplicará a la respectiva consulta de medios.Tenga en cuenta en los ejemplos siguientes que estamos utilizando la sintaxis para las consultas de medios que podrían utilizarse todas en una hoja de estilo. Como se mencionó anteriormente, la forma más eficiente de utilizar las consultas de medios es colocarlas todas en una hoja de estilos CSS, con el resto de los estilos para el sitio web. De esta manera, no hay que hacer múltiples peticiones para múltiples hojas de estilo.@media screen and (min-width: 600px) {
Ejemplos de sitios web
En los sitios web que tienen un aspecto sencillo y despejado, los diseñadores utilizan títulos y estilos de fondo para indicar las distintas secciones del sitio web, en lugar de imágenes recargadas, bordes ornamentales y paneles elaborados.
Los sitios web sencillos suelen tener llamadas a la acción muy específicas que pueden presentar al usuario rápidamente y sin mucho contexto. Por ejemplo, cuando un usuario llega al sitio web de Apple.com, suele estar familiarizado con los productos y la reputación de Apple. El diseño de su sitio web utiliza la estética de la marca de Apple para compartir información sobre productos y servicios. El sitio no necesita dedicar mucho tiempo a transmitir el “quién” o el “por qué”. Puede pasar directamente al qué.
Único y de marcaAunque todos los sitios web estratégicos son de marca, ciertos estilos de diseño reflejan un sentido de estilo único a primera vista. Los sitios web de este tipo tienden a ajustar los elementos estándar, como el tamaño de los titulares o la colocación del logotipo, de forma creativa y llamativa.
Cuando los clientes prefieren estilos de diseño de sitios web únicos, esto indica a nuestros diseñadores que tenemos más libertad creativa para componer la página de forma original en lugar de ceñirnos a los estilos de diseño probados y comprobados que son más populares en la web.