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 WebAppers.
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 de los WebAppers
? WebAppers es un blog dedicado a compartir recursos de código abierto de alta calidad para desarrolladores y diseñadores web a diario. Como diseñador web, encontrarás algunos de los mejores iconos gratuitos, fotos de archivo, pinceles, fuentes e inspiraciones de diseño. Como desarrollador web, también encontrarás algunos de los mejores componentes de Javascript y Ajax, como ventanas modales, menús, galerías, información sobre herramientas, gráficos, complementos de calendarios y mucho más. ?
Aquí hay una sección de la página de inicio:
Como puedes ver, WebAppers es un bonito blog. Tiene un diseño muy centrado en el contenido y lo lleva directamente a las grandes vistas previas de los artículos más recientes. La combinación de colores es mayormente de grises y negros, lo que le da al sitio una sensación de clase cuando se combina con el fondo de textura sutil.
Para darle un recorrido adecuado, analicemos el diseño pieza por pieza.
Encabezamiento
El encabezado de las aplicaciones web es bastante mínimo. Tiene solo unos 80 píxeles o más y tiene un efecto negro brillante aplicado.
Me gusta el logo grande y el brillo, creo que van bien con el tema del sitio. Sin embargo, no estoy seguro de tener un anuncio grande en el encabezado de su sitio. Sin embargo, definitivamente me doy cuenta de que necesitamos anuncios. Así es como los blogs de diseño permanecen abiertos y nunca criticaré un blog por usarlos (¡nosotros mismos tenemos muchos!).
Aquí, aunque el anuncio se configura en una competencia visual con el logotipo del sitio. El encabezado está dividido a mitad de camino con los dos gráficos y no es evidente de inmediato que “Design to XHTML”. no es de lo que se trata WebAppers.
Yo sugeriría usar el encabezado para crear un mensaje visual más claro para que los usuarios sepan de inmediato que WebAppers ofrece recursos gratuitos de código abierto. Libre es una palabra mágica y decirlo en voz alta y orgulloso en el encabezado ayudará a evitar que el visitante ocasional pase al siguiente sitio antes de mirar alrededor.
Estructura del poste
Dado que se trata de un blog, desde entonces se analiza cómo están estructuradas las publicaciones. Aquí hay una foto del formato básico:
No hay mucho que discutir aquí, pero me gusta. El texto es agradable y fácil de leer, me gusta la cita de la fecha y el autor aparece claramente en la lista.
Mi sugerencia aquí sería aumentar el tamaño de los títulos de las publicaciones para que contrasten más con el resto del texto de la página. Haga esto junto con agregar un poco de espacio para respirar aquí y aumentará drásticamente la facilidad con la que los usuarios pueden escanear su página de inicio en busca de temas interesantes.
Barras laterales
El lado derecho del sitio está ocupado por dos barras laterales. La primera contiene una extensa lista de categorías encabezada por una forma vectorial y contiene iconos y encabezados para separar las diferentes secciones. El segundo es un área de anuncios básica con una sola franja vertical de espacios publicitarios.
Me gusta que hay tantas categorías de post enumeradas aquí. En un sitio que se centra en el contenido gratuito, es importante poder encontrar lo que buscas rápidamente y eso es lo que se logra aquí. Los números que indican cuántas publicaciones hay en cada categoría también son importantes.
El gráfico en la parte superior se siente un poco en stock, pero es atractivo y ayuda a desviar su atención a esta área.
Barra de búsqueda
Una de las áreas que creo que podría ser un poco de atención es la barra de búsqueda. Por un lado, realmente tienes que cazar para encontrarlo, así que no me sorprendería si la mayoría de tus usuarios ni siquiera supieran que existía.
Además, siento que el botón está empequeñecido un poco por la barra de búsqueda y podría ser más grande. Finalmente, la opción de fuente aquí no coincide con la del contenido principal, que no coincide con la de las categorías, que no coincide con la? Recomendada? Sección debajo del área de búsqueda.
Recomiendo elegir una o dos fuentes y luego pegarlas en todo el diseño. En este momento, cada área se siente como si hubiera sido diseñada individualmente y no como un todo cohesivo.
Pie de página
Me gusta la idea de tirar un par de libros aquí abajo, es un poco aleatorio pero útil para cualquier lector que se aventure hasta el pie de página.
Aparte de eso, creo que la zona se siente un poco incómoda. El fondo de la esquina redondeada invertida es un poco funky y la segunda columna de texto está demasiado cerca de la primera y demasiado lejos de la tercera. No tienen que estar espaciados uniformemente, pero la primera columna podría quitar un poco de su ancho.
¡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.