Want to create interactive content? It’s easy in Genially!

Get started free

Introducción al diseño web

yahiraldo723

Created on February 12, 2024

Actividad 3

Start designing with a free template

Discover more than 1500 professional designs like these:

Corporate Christmas Presentation

Business Results Presentation

Meeting Plan Presentation

Customer Service Manual

Business vision deck

Economic Presentation

Tech Presentation Mobile

Transcript

Introducción al diseño web

ALDO YAHIR HUERTA ROSARIO3° " 1 " NO. 16

Actividad 3

Bloques

Desde el punto de vista del diseño, un sitio web requiere una maquetación o boceto, esto es, las partes por las que estará integrado y cómo será visualmente. Así que es necesario tener claros cuáles serán los bloques que formarán cada página. Dichos bloques están constituidos por elementos fundamentales (texto, imágenes y videos), los cuales veremos a continuación.

Contextualiza tu tema con un subtítulo

Texto

Se refiere a los contenidos escritos que integran un sitio web. Cada bloque que se ha pensado para el diseño incluye una parte textual. Estos textos pueden ser títulos, subtítulos, descripciones, llamadas a la acción (CTA), frases persuasivas, etiquetas, entre otros. Cuando se incluya un texto es importante verificar que las tipografías sean válidas para sitios web y elegir la que vaya acorde con el mensaje que quieres comunicar.

Contextualiza tu tema con un subtítulo

Imágenes y videos

Un sitio web debe ser atractivo visualmente; esto se logra a través del uso de videos o imágenes en distintos formatos. Un bloque de una página web puede contener solamente texto, imagen, video o hacer una combinación. Por ejemplo, cuando ves un banner principal ubicado en el home de un sitio web, por lo general se muestra una imagen con un copy (texto corto y directo), que indican lo que ofrece el sitio web.

Contextualiza tu tema con un subtítulo

Espacios

Para el diseño, un elemento clave es lo que no se ve, es decir, el espacio. Una buena conjugación de bloques respeta espacios en blanco que funcionan como descansos visuales, generan expectativa o le dan un estilo minimalista, elegante o funcional al sitio web. Si observas cualquier sitio web siempre habrá una combinación de textos, imágenes y espacios. Por ejemplo, si estás mostrando un bloque de productos y tienes 3 imágenes, cada una puede ir acompañada de un texto debajo que describa el producto. Pero para que haya una armonía, estas 3 imágenes y 3 textos deben tener espacios entre sí que sean homogéneos, justamente para que sea visualmente atractivo y conceptualmente correcto.

Contextualiza tu tema con un subtítulo

Hosting

Para que un sitio web exista requiere 3 elementos clave desde el punto de vista técnico. Necesita un hosting o servidor que es donde se aloja el sitio web (con todos los elementos propios de la programación). Existen hostings de diferentes tipos y capacidades; por lo regular, varios sitios web comparten o están alojados en un mismo hospedaje.

Contextualiza tu tema con un subtítulo

Dominio

Este se refiere al nombre del sitio web, más una extensión, por el que será localizado en la red. Mediante el dominio los navegadores web y los usuarios pueden encontrar un sitio web y navegar en él. Por ejemplo, el dominio de HubSpot es hubspot.es Elementos técnicos de un sitio web El nombre de dominio es único para cada sitio web y se ubica generalmente en la dirección URL o liga de un sitio, por ejemplo: www.casas-en-venta.com, escuela-primaria.org. Las terminaciones o conexiones tienen que ver con el tipo de dominio. De ahí que .com sea el más usado porque se refiere a páginas comerciales, mientras que .net se emplea más cuando son proveedores de servicio en la red, y .org se utiliza para organizaciones o instituciones generalmente sin fines de lucro.

Contextualiza tu tema con un subtítulo

Plataforma

Se refiere a los espacios virtuales de un sitio donde se ejecutan acciones de programas o aplicaciones con diferentes propósitos; por ejemplo, realizar un pedido y pagarlo. Por esta razón, la plataforma es la base de cómo se desarrolla un sitio web a partir de la programación web, por medio de diferentes lenguajes como HTML, CSS, Java Script, entre otros. Todo sitio web requiere un lenguaje propio que la red comprenda y resulte funcional. Incluso puede configurarse de tal manera que se convierta en un sitio web dinámico, que genere contenido de acuerdo con la petición del usuario.

Contextualiza tu tema con un subtítulo

Home

Respecto a la estructura de un sitio web hay varios elementos que debes considerar. Recuerda que un sitio web está formado por varias páginas vinculadas, así que cada una se convierte en un elemento. La primera página o home page es fundamental; es la cara que todos ven desde el principio. Funciona como una carta de presentación, por lo que debe mostrar todo lo que puede encontrarse en dicho sitio web. !

Contextualiza tu tema con un subtítulo

Header

El header o cabezal es el elemento que va en la parte superior del sitio web, el cual se mantiene mientras ingresas o navegas en las demás páginas o secciones. Es crucial que el header sea intuitivo y funcional para que los usuarios puedan navegar sin problemas. En el header regularmente verás el logotipo y nombre de la empresa, porque es una forma de identificar en todo momento con quién estás tratando. Ahí suele ubicarse el menú, algún dato de contacto, iconos de redes sociales, una barra de búsqueda, botones de inicio de sesión, entre otros elementos.

Contextualiza tu tema con un subtítulo

Body

El body o cuerpo de una página web es todo el espacio que hay entre el header y el footer; en él se integran los contenidos visuales y textuales. Esta parte refleja cómo se visualizó desde la etapa de diseño para determinar cuántos bloques habrá, si es más horizontal o si juega con algunas columnas verticales; incluso si es un sitio web más creativo que no utilice bloques tan definidos.

Contextualiza tu tema con un subtítulo

¡GRACIAS!