Errores que probablemente ya cometiste como diseñador web
Todos los diseñadores web quieren la perfección. Sin embargo, son solo humanos y siempre pueden aparecer errores. Es tan fácil simplemente pasar por alto algunos detalles. No hay diseñador en el mundo que no cometiera errores y evitarlos es algo que normalmente sucede después de un tiempo.
Ahora hablaremos de algunos de los errores más comunes que los diseñadores web cometen de manera constante, esos que muy probablemente ya cometiste al menos una vez. Corrige tus malos hábitos y supera los obstáculos de los que eres culpable actualmente para que tu trabajo sea mejor que nunca.
El uso de Flash
En el diseño de sitios web modernos, rara vez vemos el uso de Flash, incluso si es bastante sorprendente en lo que puede hacer. Estamos ante la posibilidad de brindar al visitante una experiencia animada que es impresionante pero tiene un bagaje asociado.
Hay diferentes problemas que aparecen con el uso de Flash en el diseño web. Tienes un mayor tiempo de carga, problemas con los usuarios móviles por la falta de soporte y el diferente lenguaje de programación utilizado. La cantidad de dispositivos que actualmente admiten Flash es muy baja. Además, en el futuro no esperamos un mayor apoyo. Las bibliotecas nuevas parecen más sólidas y populares, especialmente aquellas que se basan en JavaScript como AngularJS y jQuary.
Uso de imágenes realmente grandes
La tendencia moderna en el diseño web es utilizar imágenes grandes en todo el sitio. Eso definitivamente hará que la experiencia sea más placentera y el usuario tendrá algo grandioso que ver, pero hay algunas complicaciones que el diseñador y el desarrollador deben tener en cuenta.
La carga de la página aumenta automáticamente cada vez que se utilizan imágenes más grandes. Esto puede conducir a un escenario muy malo para el visitante del sitio. La buena noticia es que tenemos acceso a varias herramientas diferentes que ayudan mucho con la optimización de imágenes. Los que usted puede querer considerar incluyen:
Las aplicaciones como PrePros pueden ayudar a optimizar las imágenes automáticamente mientras se encuentran dentro de las aplicaciones. El problema es que las herramientas ayudarán a los flujos de trabajo pero no resolverán el gran problema asociado con el tiempo de carga, al menos no completamente.
Muchos diseñadores ahora usan SVG. Utilizan códigos para animar y dibujar gráficos en un entorno de navegador. Así terminamos con una carga de página acelerada y varios elementos que llaman la atención.
También debemos destacar el hecho de que las imágenes más grandes complicarán el diseño web debido al factor de no respuesta. Estamos hablando de un elemento de diseño que tiene una altura y un ancho establecidos. Los navegadores escalarán las imágenes pero tenemos el mismo tamaño de archivo.
W3C ahora funciona con el uso de " <picture>" como un elemento HTML5. Eso permitiría llamar imágenes de diferentes tamaños según el ancho de la pantalla de visualización. Cuando esto sucede, la experiencia sería mucho mejor para el espectador, pero hasta la implementación, debe evitar las imágenes más grandes.
Uso de ancho y alto fijos
La adaptación se restringe automáticamente para los usuarios cuando se codifican tamaños fijos. Tenemos soluciones, pero siempre debemos pensar en crear un patrón de diseño web que sea 100% receptivo. La altura fija que se establece en CSS puede limitar el área visible para el usuario. Repasar eso es posible a través de ajustes de consulta de medios, pero el código adicional que se agrega generará problemas con el rendimiento. Realmente no necesitas eso. En la mayoría de los casos, no debe usar tamaños fijos. Deben evitarse tanto como sea posible en el entorno de diseño web moderno.
Hacer suposiciones sobre los ajustes de diseño
Los diseñadores web normalmente trabajan con software como Adobe Photoshop o Sketch. Cuando se termina el trabajo, la suposición común es tener un punto de interrupción específico en el flujo de trabajo receptivo. Los anchos de pantalla que se ven como estándar cubrirán muchos tamaños de pantalla diferentes, pero cubrirlos todos no es una certeza. Tenemos miles de dispositivos móviles disponibles en el mercado. Crear un diseño que funcione para todo es muy difícil.
Cuando trabaja en anchos específicos, tiene que planificar y pensar en el futuro se convierte en una habilidad importante para el diseñador web. Debe asegurarse de no hacer suposiciones y de que realmente trabajará dentro del navegador después de que termine el trabajo normal del editor gráfico.
Usar demasiados efectos y animaciones
Puede ver este problema incluso en algunos de los sitios más populares del mundo. Muchos sitios web ofrecen una experiencia impresionante, y muchos ofrecen algo verdaderamente único y sorprendente. Sin embargo, esto no significa agregar tantos efectos y animaciones como puedas. Es muy importante combinar los principios del diseño web con el fin de encontrar la combinación adecuada entre funcionalidad e impacto gráfico.
Hay dos grandes problemas asociados con el exceso de animaciones y efectos:
- Se aumenta el tiempo de carga de la página
- Los efectos y la animación serán problemáticos para las computadoras más antiguas.
Los trucos y animaciones populares en este momento son aquellos que agregan elementos que se desvanecen, aumentan o disminuyen. Pueden verse muy bien y harán que los sitios se vean muy bien, pero eso no significa que siempre debas usarlos. Vea si la carga general de la página sería demasiado para los dispositivos que usarán la mayoría de los visitantes y nunca se olvide de la velocidad de carga de la página. Estos son muy importantes y deben ofrecer siempre grandes experiencias para los visitantes.
Enlaces con estilos inadecuados
Este es un error que es mucho más común de lo que puedes pensar en este momento. Los enlaces deben hacer siempre lo que hacen. Esto significa que cuando un enlace tiene un estilo inadecuado, las personas no se darán cuenta de que son enlaces. Siempre debemos pensar en los visitantes, por lo que los enlaces siempre deben verse como enlaces. Puede experimentar y no ceñirse al subrayado azul estándar, pero nunca debe excederse.
No usar DRY en CSS
En caso de que no lo sepas, DRY significa "No te repitas". Es un método en diseño web y prácticamente significa que se ayuda al diseñador a mantener el código conciso y clonado. Solo se recomienda el uso del código necesario en cada momento para el diseño del sitio web.
Cuando se usa CSS tradicional, se necesita mucha repetición con elementos específicos que se usan dentro de otros elementos. Los selectores terminan siendo realmente grandes y llevará mucho tiempo escribirlos. Cuando usa clases en el diseño en lugar de diseñar cada elemento en la página HTML, todo se vuelve mucho más simple.
Una muy buena idea en este momento es utilizar lenguajes de preprocesamiento como Sass. Son bastante útiles en términos de tecnología CSS necesaria. Los lenguajes que se utilizan acelerarán el desarrollo y el diseño debido al hecho de que incluyen características como variables, funciones, combinaciones, anidamientos y mucho más. El código que se produce se compilará en el código CSS. Los desarrolladores web y los diseñadores web ahora pueden usar menos líneas de código y la repetición se puede evitar fácilmente gracias a los lenguajes.
Degradación agraciada
Podemos definir la degradación elegante como una práctica de creación de funcionalidad web capaz de ofrecer un nivel de experiencia de usuario específico en un navegador moderno mientras se degrada a niveles de experiencia de usuario más bajos en los navegadores más antiguos. Esto suena un poco complejo, pero como ejemplo, podemos analizar la compatibilidad con Internet Explorer 8 y 7. Le sorprendería saber que la mayoría de los usuarios simplemente no actualizan los navegadores durante largos períodos de tiempo. Debido a esto, debe agregar una degradación elegante para que exista el soporte adecuado para ambas versiones del navegador.
Los sitios web modernos son fáciles de desarrollar, pero en un momento posterior puede terminar notando el hecho de que en un navegador más antiguo, las páginas se ven muy mal debido a dependencias específicas.
Mejora progresiva
Esto es algo similar a la degradación elegante mencionada anteriormente. La diferencia es que el proceso se maneja a la inversa, comenzando con el nivel de experiencia básico que se admite en todos los navegadores web. Luego, el diseñador/desarrollador agrega una mayor funcionalidad que está disponible para los navegadores que podrían usarla.
Tanto esta opción como la anterior son complicadas. Normalmente solo los usan los diseñadores realmente buenos. Sin embargo, con tantos navegadores disponibles ahora, debemos considerar seriamente las opciones. Los diseñadores web normalmente harán que los clientes decidan exactamente qué se va a admitir. Sin embargo, debe intentar utilizar estos enfoques para ofrecer una experiencia realmente excelente para los usuarios que son particularmente activos y se encuentran dentro del público objetivo.
Una de las partes más importantes de cualquier sitio web es la navegación. El diseñador tiene que ser capaz de hacer que la experiencia del visitante sea natural. El propósito es hacer que la navegación sea realmente simple e intuitiva. Un usuario entenderá automáticamente que la experiencia es adecuada cuando el diseño ha tenido en cuenta este elemento.
Siempre que la experiencia del usuario es mala, vemos a los visitantes frustrados. Simplemente no vuelven a visitar un sitio específico y buscarán en otras páginas las soluciones a sus problemas. La usabilidad siempre debe ser considerada por el diseñador. El diseño tiene que verse bien, pero nunca debes olvidarte de la funcionalidad. Se necesita facilidad de uso y la falta de esto haría que todo el diseño fuera inútil.
Una falta de enfoque en el contenido
“La forma sigue a la función" es un principio de arquitectura muy común que apareció en el siglo XX, justo durante la fase de diseño industrial de la arquitectura moderna. Este es un principio que debe recordar en todo momento en el diseño web.
El diseño web y gráfico es muy similar a la arquitectura moderna en términos de funcionalidad necesaria. La forma del objeto debe basarse primero en el propósito o función prevista. En términos de sitios web, podemos verlos como bases de datos de información que se encuentran repartidas por todo Internet. El usuario visitará un sitio web para obtener datos específicos. Aquí es donde interviene el contenido para ofrecer esos datos. Como el visitante termina en un sitio y no encuentra los datos, los buscará en otro lugar, sin siquiera mirar el diseño. Al mismo tiempo, en el caso de que el diseño dificulte mucho la localización o la digestión de los datos, se produce el mismo resultado.
Los usuarios de Internet ahora quieren tener acceso a la información y quieren que ese acceso sea rápido. Form Over Function termina siendo realmente importante en el diseño web. No tener en cuenta este principio significa que el foco se pone en la apariencia en lugar del contenido ofrecido. Como resultado, los sitios web no serán muy populares. El contenido debe destacar en todo momento.
Conclusiones
En su origen, los errores de diseño web más comunes se relacionan con tratar de crear algo realmente hermoso y único sin tener en cuenta la razón por la cual los visitantes realmente visitan un sitio. Por eso, siempre debes tener la paciencia necesaria para combinar un diseño realmente bueno con una funcionalidad completa.
Cree siempre sitios web que sean funcionales y siga aprendiendo nuevas tecnologías a medida que pasa el tiempo. Los mejores diseñadores web del mundo siguen aprendiendo y siempre actualizados con todo lo que se puede y no se puede hacer. Desea crear su diseño web, hablar con el cliente y luego asegurarse de que los visitantes aprecien lo que se ofrece. Esto es mucho más fácil decirlo que hacerlo, pero con el tiempo, todo se vuelve mucho más fácil.
Asegúrate de tomarte todo el tiempo que sea necesario para crear algo realmente genial. Otro error no mencionado en el diseño web es no permitirse el tiempo necesario para crear el diseño de sitio web perfecto. Esto normalmente sucede porque los clientes necesitan que el trabajo se haga en el menor tiempo posible. Asegúrese de tener siempre suficiente tiempo para crear ese diseño web estelar que sabe que puede.