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 Two Chaps Branding, una firma de marketing y diseño web con sede en Baltimore.
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.
Sobre dos chaps
? Aquí en TwoChaps creemos que una marca es más que un bonito logotipo y una declaración de misión cargada con las últimas palabras de moda de la industria. Creemos que una marca es la historia de una empresa, una historia que define sus relaciones pasadas, presentes y futuras con sus clientes y clientes. Creemos que una marca es más que la forma en que desea ser percibido, es cómo se percibe realmente. Ya sea que se ignore o se cuide, su marca lo define a usted.
Aquí está la página de inicio de Two Chaps:
El diseño general es muy atractivo. El tema envejecido se ejecuta bien en todos los colores, tipos y texturas, y el diseño es simple pero poderoso. La alineación es muy estrecha, ya que la mayoría del contenido comprende una columna claramente definida.
Analicemos algunos de los aspectos del diseño y véalos de una manera más profunda.
El logo
Me gusta mucho el trabajo que han hecho en el logo. El bombín y el bigote son un mensaje visual perfecto para "Two Chaps". nombre. Del mismo modo, el tipo de letra serif fuerte es perfecto para el período de tiempo que los diseñadores están buscando.
Aunque me gusta el logotipo tal como está, no puedo evitar preguntarme si sería más fuerte sin el bigote. En este momento hay dos elementos gráficos que compiten en el logotipo y reducirlo a uno solo podría mejorar la pieza. Me doy cuenta de que el bigote, las letras y el sombrero están juntos sugiriendo una cara, pero todavía se lee más como letras con un bigote y un sombrero.
Como gráfico principal, el jugador de bolos podría usarse en otros lugares como un elemento independiente independiente del resto del logotipo.
El encabezado
El titular es mi cosa favorita del sitio. Aunque aparece a la derecha, es uno de los primeros que se ven cuando la página se carga debido a su tamaño y audacia.
Los tamaños de las letras se han estructurado perfectamente para crear una unidad cohesiva que llame su atención y permita una lectura rápida. Observe cómo las palabras menos importantes (the, of) se han reducido en tamaño para dar espacio a las palabras más importantes (arte verdadero).
Ya que este es un tipo gráfico y no en vivo, definitivamente recomendaría tomarse el tiempo para trabajar en el kerning del texto aquí. Algunas letras, como la? T? y? r? en verdad,? están extrañamente alejados mientras que otros están un poco aplastados juntos.
Es fácil olvidar este paso cuando está diseñando, pero si la tipografía va a ser una característica principal en el diseño, siempre querrá asegurarse de que el espacio entre las letras sea lo más cercano a la perfección posible.
Miniaturas de imagen
Las imágenes en la página de inicio han recibido un excelente tratamiento fronterizo. El sombreado realmente da a las imágenes mucha profundidad ya que crea tres niveles separados.
Por defecto, las imágenes son en escala de grises, pero si pasas el cursor sobre ellas, bajan uno o dos píxeles (¿intencional?) Y se vuelven a todo color. Este es un buen efecto con el que es divertido jugar si está visitando el sitio por primera vez.
La barra lateral
Como puede ver, la barra lateral es una cinta vertical que contiene el logotipo, la navegación, un par de botones sociales y alguna información legal. Si revisa el sitio en vivo, verá que el pie de página permanece estacionario mientras el sitio se desplaza. Esto proporciona un acceso fácil para cambiar de página sin importar dónde se encuentre en el sitio.
Me encanta la audacia del rojo y lo mucho que se destaca del resto del diseño. También me gusta el tratamiento y los colores utilizados para los botones de Facebook y Behance. Es un poco extraño que las letras en? Facebook? ¿Tienes una sombra tan dura mientras estas en? Behance? no lo hagas
Las secciones de navegación de la barra lateral se expanden y contraen con una animación suave al hacer clic en los encabezados. La clave aquí es que todos los elementos siguen siendo perfectamente accesibles con JavaScript deshabilitado, los menús simplemente se muestran en la posición abierta y ni siquiera sabría que se estaba perdiendo nada.
Siempre es bueno hacer un esfuerzo adicional y asegurarse de que su sitio funcione para los navegadores que admiten sus pequeños beneficios visuales, así como para aquellos que no lo hacen.
Pie de página
El pie de página contiene el llamado a la acción para contratar a la firma y es otro giro muy bien diseñado sobre el tema envejecido.
Las líneas en la parte superior e inferior son un buen toque, así como las pequeñas. ¿Haga clic aquí? firmar con un curl de página. Esta sección parece un poco como algunos expertos en SEO? ¿Lo tengo como la palabra? ¿Marca? aparece muchísimas veces para tan poco texto.
Legibilidad
Como dije anteriormente, en general me gusta mucho el diseño del sitio. Es único, audaz, atractivo y bastante funcional. Sin embargo, sí creo que la usabilidad del sitio está sufriendo debido al texto. Echa un vistazo a la imagen de abajo de la? Nuestra historia? página.
Como puede ver, ni el encabezado grande de color a continuación ni el texto del cuerpo en blanco son muy legibles en el fondo texturizado. Esto se ve agravado por el hecho de que el fondo permanece en su lugar a medida que el texto se desplaza, creando un efecto visual realmente complejo y ocupado mientras navega por el sitio.
Al final, el bonito fondo texturizado puede ser más difícil que bueno. Es una buena idea experimentar con dejar caer su opacidad o desecharlo por completo en favor de algo más simple.Puede que sea desagradable escucharlo, pero si aumenta la legibilidad del texto en todo el sitio, vale la pena el esfuerzo.
¡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.