5 conceptos de codificación que pueden informar el diseño de la web

Es fácil para un experto en Photoshop hacer una maqueta del diseño de un sitio web para un cliente, sin embargo, sin un conocimiento práctico de cómo funciona la mecánica del código y los conceptos de la web, lo más probable es que estén presentando algo que no se traduce bien al lenguaje del código.

Este artículo aborda algunos fundamentos de la codificación clave que no sólo pueden ayudar a los diseñadores sin el conocimiento adecuado a mantenerse dentro de la mecánica de la codificación de la web, sino también a utilizar algunos parámetros de la web menos conocidos.

Divs

DeaPeaJay (vía Flickr)

Un div es una etiqueta HTML que esencialmente puede ser considerada como el bloque de construcción de la mayoría de los sitios web en Internet. Los divs a menudo contienen los diversos contenidos de un sitio web, y su comportamiento es lo que da estructura a un sitio web. Por esta razón es especialmente importante que los no codificadores entiendan los fundamentos del div, un punto del cual se tratará aquí.

Tal vez el aspecto más importante para entender sobre los buceadores es que son rectangulares. Por lo tanto, simplemente evitando los elementos que son circulares, arqueados, curvos y geométricamente complejos, un diseñador puede formar una conexión fluida con el lenguaje de codificación.

Esto no sólo evita que un codificador web necesite resolver problemas de creación de geometría compleja (a menudo con soluciones provisionales desordenadas), sino que también permite que los sitios web funcionen de manera más eficiente.

Colores de la red

El diseño web es un medio único en el sentido de que libera a los diseñadores de las preocupaciones de la producción impresa y también los libera en varios reinos, especialmente en el del color. En otras palabras, las computadoras pueden crear algunos colores brillantes y saturados que no pueden ser tan fácilmente reproducidos en papel, así que ¿por qué no usar eso como una ventaja?

Colgado

Internet se ha convertido en una jungla salvaje llena de efectos y animaciones complejas, tanto que algunas de las bellezas básicas del CSS parecen haber sido olvidadas. Tomemos como ejemplo el vuelo: Observa cuán efectivo puede ser este simple parámetro css cuando se ejecuta de una manera conceptualmente significativa. Incluso este ejemplo aproximado podría inspirar interminables iteraciones en las que se revelan palabras ocultas, o entran en juego coloridas ventajas.

Tiempo de carga

Simon Law (via Flickr)

Un aspecto increíblemente pasado por alto de Internet que debería informar a todos los diseños web es el tiempo de carga. El hecho es que la velocidad de Internet varía mucho de un punto de acceso a otro. Esto significa que alguien en una cafetería podría no tener la paciencia para cargar una imagen o animación de un sitio web pesado.

La conciencia del tiempo de carga permite a los diseñadores centrarse en elementos de carga rápida como la tipografía y los colores sólidos para crear sitios web que se cargan rápidamente desde cualquier punto de acceso sin perder la integridad estética.

Desplazamiento

El desplazamiento es una de las funciones más básicas del sitio web y es casi inevitable para los diseñadores y codificadores. La mayoría de los sitios web dan por sentado el desplazamiento y dejan que sirva a su propósito básico, sin embargo un diseñador inteligente puede pensar en cómo usar el desplazamiento de forma creativa.

Por ejemplo, ¿qué podría revelar el desplazamiento al espectador de una manera emocionante? ¿Cómo podría el desplazamiento ser utilizado por la imagen/color de fondo del sitio? ¿Cómo podría el desplazamiento transportar al espectador a través de interesantes espacios negativos dentro de la página?

Conclusión

Saltar al diseño web sin ningún conocimiento de mecánica web o de codificación puede ser un gran error. De hecho, un diseñador podría incluso terminar pasando horas creando un diseño que no se traduce bien a la web en absoluto; cargando al codificador, y perdiendo el tiempo.

Lo ideal sería que todos los diseñadores web tuvieran al menos algún conocimiento práctico en mecánica web y fundamentos de codificación. ¡Esperemos que este artículo funcione como un manual!

Imagen destacada: Jeff Sheldon (via unsplash)

admin

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Publicar un comentario