Hoy continuaremos con nuestra nueva serie de críticas de diseño web, donde analizaremos en profundidad un sitio web en vivo y señalaremos sus puntos fuertes y las áreas que podrían mejorar.
Top Test Prep, el sitio que veremos hoy, fue nuestro primer cliente, pero las solicitudes han estado llegando, así que asegúrese de estar en la lista pronto.
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.
Preparación para el examen superior
Meet Top Test Prep, una empresa de tutoría privada que se jacta de tener algunos de los mejores y más brillantes tutores. El diseño de su página de inicio es bastante simple; Un diseño centrado claramente dividido en varias secciones.
Antes de entrar en lo que podría ser mejor sobre el diseño, echemos un vistazo a algunas cosas que se han hecho bien.
Control deslizante y fotografía
Soy un imbécil para los deslizadores de imagen jQuery. Agregan un nivel dinámico a un diseño y solo el movimiento suficiente para dar vida a una página estática sin crear demasiada distracción.
La fotografía utilizada en el deslizador es realmente agradable. Las caras sonrientes atraen su atención de inmediato y los colores brillantes con poca profundidad de campo indican un fotógrafo profesional. La tercera imagen de los tres graduados se ve un poco en stock, pero comunica fuertemente el mensaje que está buscando, así que funciona.
De hecho, me gustaría ver una versión en la que el control deslizante de imagen ocupe todo el espacio ocupado por el cuadro horizontal en la parte superior. El? Hablar con un experto? La información se puede mover inmediatamente debajo de ella. Esto podría cortar a algunas personas de la usabilidad, pero creo que aumentaría un poco el atractivo estético.
Alineación
El diseño podría requerir un poco de trabajo, pero la mayoría de los elementos de la página están claramente alineados y las secciones son visualmente distintas. Esto puede parecer poco importante, pero le sorprendería saber cuántos diseñadores profesionales saben poco o nada sobre las técnicas de alineación adecuadas.
Mejora
Ahora echemos un vistazo a algunos cambios que podrían hacerse para fortalecer el atractivo visual del sitio.
Logo y marco de página
En primer lugar, el logotipo es un poco extraño y podría usar una actualización visual. Si no está buscando cambiar el nombre de su imagen en este momento, al menos preste atención al logotipo actual. El kerning debe estar más ajustado después de las letras mayúsculas y las dos líneas de texto deben estar alineadas a la izquierda. La alineación central actual deja el lema varado en la tierra de nadie y es un poco incómodo.
En cuanto al marco de la página, parece un poco inconsistente. Me gusta el color intenso que se usa en la navegación, pero parece extraño que se extienda por toda la página y que el pie de página no lo haga. Mi consejo es que coloque las sombras creando el marco de imitación por completo y extienda el encabezado y el pie de página a lo largo de toda la página.
Además, para darle al sitio un punto de contraste aún más fuerte y un encabezado claro, extendería el gradiente de navegación hasta la parte superior de la página y anularía el logotipo / copia. Aquí hay una maqueta simplificada de lo que quiero decir:
Eliminar el marco de la página podría proporcionar mucho más espacio para espaciar un poco las cosas y darle al diseño algo de espacio para respirar al aumentar el espacio en blanco.
¿El? ¿Hablar con un experto? Caja
Sentí que esta área podría usar una revisión. Me gusta mucho el estilo y el diseño del botón como una pieza independiente, pero parece que no encaja bien con el resto del sitio. Consideraría reducir el radio de las esquinas redondeadas (o simplemente hacerlas 90 grados) y reducir el color más oscuro del encabezado.
Además, la cabeza flotante es un poco rara. Puedo entender conceptualmente por qué una cara debe estar aquí, pero en cuanto al diseño, simplemente no funciona. Creo que esto se debe principalmente al corte de estilo de esquina que está ocurriendo en su lado derecho e inferior. Le da a esta área, por lo demás, un marco superficial que solo existe en ese punto. Vaya bien y cree un marco visible o elimine completamente la cabeza flotante.
Las tres columnas
Veo dos problemas principales con esta área, resaltados en la imagen de abajo.
En primer lugar, una lista con viñetas debe Nunca estar alineado en el centro Separa la viñeta y el contenido y es una violación de lo que se supone que debe lograr una lista con viñetas: fácil y rápida lectura. Además, como todos los demás textos de la página están alineados a la izquierda, es una buena idea mantener la tendencia.
Finalmente, la imagen del pequeño libro en el extremo derecho parece estar flotando en el espacio. No hay una explicación de qué es, por qué está ahí o por qué debería hacer clic en él. En este momento, grita de último momento y realmente necesita ser bien trabajado en el diseño de la página o tirado por completo.
¡Tu turno!
En resumen, Top Test Prep tiene un buen comienzo, pero el diseñador debe considerar crear un encabezado más sólido, deshacerse del marco de la página falsa y resolver los problemas de diseño mencionados anteriormente.
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.