Cada semana echamos un vistazo a un nuevo sitio web y analizamos el diseño. Señalaremos tanto las áreas que se realizan bien como las que podrían ser útiles. Finalmente, terminaremos pidiéndole que proporcione sus propios comentarios.
El sitio de hoy es Redka3d, el portafolio personal de un diseñador web de Indonesia.
Si desea enviar su sitio web para que aparezca en una futura crítica de diseño, solo le llevará unos minutos. Cobramos $ 24 por criticar su diseño, ¡mucho menos de lo que pagaría por un consultor para que visite su sitio! Puedes encontrar mas aqui.
Acerca del propietario del sitio
? La familia y los amigos me llaman Tata, soy un diseñador web de Indonesia y actualmente reside en Yakarta. ?
Aquí hay una sección de la página de inicio de Tata:
Rendimiento del sitio
Antes de comenzar nuestra crítica sobre el diseño, debo decir que los tiempos de carga de la página pueden ser tan importantes o incluso más de lo que parece el sitio. Internet de alta velocidad nos ha echado a perder y los usuarios simplemente no esperan más de unos segundos para que se cargue una página.
Redka3d parece sufrir algunos tiempos de carga de páginas muy largos. Es probable que este sea un problema temporal con el servidor, pero en caso de que sea indicativo de un problema a largo plazo, pensé que recomendaría estudiarlo.
Encabezamiento
Desde el principio puedes ver que este sitio va a ser único. La idea aquí es ciertamente audazmente diferente; el nombre del sitio está encerrado en un triángulo grande con diferentes tamaños de letras.
Admito que estéticamente, esta sección no es mi favorita. Pero, como no es convencional, el diseñador gana algunos puntos de estilo.
Sin embargo, un par de áreas definitivamente necesitan ser abordadas. Primero, las letras en el logotipo sangran fuera del triángulo de una manera incómoda. Dado que las letras son del mismo color que el fondo del sitio, se sienten como agujeros cortados en el triángulo. Sin embargo, no comparten la sombra de la forma, por lo que no están realmente fuera de la forma. En los bordes, las letras incluso salen del triángulo y cubren partes de su sombra. Esto crea cierta confusión visual sobre lo que realmente está sucediendo aquí. Recomiendo enmascarar las letras para que no se desangren o cortarlas del triángulo.
Otra área que podría ser útil es la flecha. La copia anima a los usuarios a hacer clic aquí? con una flecha grande, pero no hay nada al final de la flecha, así que parece que algo no se cargó bien. En verdad, el elemento que señala la flecha es muy pequeño y está muy lejos de la flecha (el texto "¿Quién soy yo?"). Recomiendo repensar cómo funciona esta área ya sea cambiando la flecha, el texto o ambos para que estén más claramente conectados.
Finalmente, es posible que desee jugar con las sombras y el color del texto utilizado en el sitio. Como regla general, trato de evitar que la sombra de mis sombras se acerque demasiado a la de los objetos a los que se aplican. La razón es que cuando estos colores son demasiado similares, la sombra casi parece un borrón en lugar de una sombra. Una solución fácil para esto es aclarar la sombra para que sea significativamente diferente del texto.
Solo observe la diferencia que esto hace en la legibilidad de su texto.
Navegación
La navegación para el sitio se coloca justo debajo del encabezado. El estado predeterminado es el texto en negrita que luego se desliza hacia la izquierda al pasar el mouse mientras se desliza una versión más ligera. Este es un efecto genial. La transición es suave y es divertido jugar con la animación.
Sin embargo, es posible que desee ajustar un poco el espaciado en los estados de desplazamiento. Cada elemento de texto se posiciona bien en el estado predeterminado, pero se desplaza demasiado hacia la izquierda en el estado flotante. Por ejemplo, en la imagen de abajo, la palabra? Servicios? Debe estar centrado entre? Inicio? y? escaparate? tanto en el estado por defecto como en el de hover.
Cuando hace clic en la navegación, aparecen nuevas secciones a través de este efecto de carrusel 3D. Es difícil de describir o mostrar aquí, así que asegúrese de pasar por el sitio y probarlo. De hecho, el sitio está lleno de pequeños efectos jQuery. Puede que sea demasiado para algunas circunstancias, pero es bueno disparar para un "wow". factor en una cartera personal.
Sección Sígueme
La última área que discutiremos es el centro de redes sociales cerca del fondo. Debido a lo grande? Sígueme? texto, esta área ocupa un lugar bastante alto en la jerarquía visual a pesar de estar cerca de la parte inferior de la página.
El hecho de que esta área sea tan llamativa puede ser buena o mala dependiendo de las intenciones del diseñador. Si se supone que esta área es uno de los aspectos más importantes del sitio, está funcionando. Si no es así, recomendaría alterar el diseño para que no distraiga tanto el contenido anterior.
En cuanto a los iconos sociales, creo que son demasiado complejos visualmente. Todo ese ensombrecimiento puede ser un poco complicado, especialmente en el ícono de Digg Estos leerían mucho mejor si estuvieran invertidos y simplificados. Aquí hay una rápida maqueta de lo que quiero decir.
Finalmente, en el contexto del resto de la página, el feed de Twitter se parece un poco a un anuncio. Google ha entrenado nuestros ojos para ignorar completamente cualquier cosa que se parezca a un anuncio de texto, así que apuesto a que muchos espectadores se saltan esto sin darse cuenta de lo que es. Intente jugar un poco más con el estilo, elimine los enlaces azules y agregue un espacio vertical adicional para que se parezca menos a un anuncio y más a una característica del sitio web.
¡Tu turno!
Ahora que ha leído mis comentarios, contribuya y ayude, dando al diseñador algunos consejos adicionales. Háganos saber lo que cree que es genial sobre el diseño y lo que cree que podría ser más fuerte. Como siempre, le pedimos que también sea respetuoso con el diseñador del sitio y que ofrezca consejos claros y constructivos sin ningún insulto.
¿Interesado en tener tu propio sitio criticado? Puedes encontrar mas aqui.