Volvemos con la serie de consejos y ejemplos útiles para detectar la buena calidad en Diseño de sitios web:

06. El uso del color en su pleno potencial

La gente a menudo juzga los colores de acuerdo a sus gustos personales. Esto es un gran error. Si usted siempre esta en una situación en la que necesita decidir qué colores se ven bien en su diseño, su mente siempre debe estar puesta en la marca, en la construcción de un tema y en la búsqueda de un filosofía utilizando las diferentes combinaciones de colores.

Ejemplos de los Usos de colores brillantes en Diseño Web:

Una Inmobiliaria realmente colorida: Oypro

Hay una cosa que me gusta del sitio web Oypro; nos demuestra que no necesariamente un asunto “aburrido” tiene tener un diseño aburrido.

Con demasiada frecuencia las empresas se resisten a tener sitios que permitan a los diseñadores poner su talento y creatividad en acción mediante sus diseños. Parece que hay una necesidad de mantener las cosas simples, planas y de color gris. Sin embargo, este diseño demuestra que se puede tener un sitio web empresarial, sin la necesidad de mantenerse conservador en el aspecto del mismo.

Como mantener los colores apropiados en Tennessee Summertime

Summertime in Tennessee es un vibrante, brillante y cálido sitio web. Aquí, en su diseño, esta todo lo que deseamos asociar con un sitio que busca promover actividades de verano. Hay un montón de colores en juego en este diseño, pero una cosa es clara: Todos son relevantes. Los diseños que muestran una buena calidad tienen una combinación de colores que es adecuada al servicio o al producto para el cual se está diseñando.

Cuando lo obvio, no lo es tanto: Hell Design

A veces lo obvio es la mejor opcion de color para crear un gran diseño; un buen ejemplo es Hell Design (ya que esto no tendría ningún sentido si el color del fuego no fuera rojo).

La Variedad en los Fondos: Saturized Studio

Tener un buen color de fondo no es suficiente para hacer interesante tu diseño. Algunos de los mejores fondos son los que tienen un poco de variedad. En este ejemplo, vemos que la belleza del naranja y el rojo está sujeta a todo tipo de efectos de iluminación y gradientes. De esta forma, se da algo extra al fondo del diseño, y se impide que luzca plano y poco fresco. Es importante señalar tambien, que el contraste entre la oscuridad y la profundidad del color naranja generan un efecto muy bonito al portfolio.

Recordamos que algunas de las imágenes de este articulo pueden estar desactualizadas debido a que los diseñadores de los sitios a los cuales hacen referencia son innovadores constantes.

Consejos para utilizar el color en el diseño web

El color es siempre una buena área para la explorar y probar las distintas posibilidades y variantes en tu página web, pero siempre es importante tener en cuenta algunas cosas a la hora de elegir los colores y sus combinaciones.

• Experimente
Un tema aburrido no tiene porque tener colores aburridos.

• Varíe
Trate de usar los degradados, patrones y brushes en los colores de sus fondos. El Color por sí solo, no hace que algo que se vea bien.

• Cumpla con el Propósito del sitio web
Asegúrese de que sus colores sean adecuados para su producto / servicio.

———————————————————————————————–

Este articulo es una traducción al castellano de How to Spot Quality within Web Design: Examples & Tips

Fuente: www.wefunction.com

Comparte esta contenido en tus redes sociales

Hide Sites

Despues de un tiempo volvemos con la serie de consejos y ejemplos útiles para detectar la buena calidad en Diseño de sitios web:

05. Moderación y Sutileza

Los diseñadores siempre estamos buscando las maneras crear un impacto mediante un diseño único o un efecto especial dentro de la página web.

Pero hay veces que podemos lograr un mayor impacto restringiéndose uno mismo. Llega un punto en que el diseño pasa de ser bueno a ser demasiado cargado.

Un buen diseñador debe detectar cuando se ha cruzado esta línea; y esto consiste en evitar demasiados retoques o efectos especiales en el diseño.

Ejemplos de efectos sutiles en Diseño Web:

Degradados suaves en el sitio web “Things”.

Siempre debemos buscar sutiles efectos en todos los sitios web que visitemos. Quizás esto sea un poco obsesivo, pero no podemos dejar pasar los pequeños detalles que nos pueden ayudar de inspiración para el futuro. Los Degradados suelen ser los más utilizados, y es muy frecuente que pasen desapercibidos, pero quien utiliza correctamente un gradiente puede añadir a los elementos un efecto de realidad y profundidad a su dibujo.

La mayoría de la gente aún no ha descubierto los degradados y estos, a nuestro entender, son de gran utilidad a la hora de destacar nuestros diseños.

Sombras en Icon Dock

Icon Dock es un mix de ingredientes sutiles. Pixeles al detalle, degradados y sombras.

Pero para entender estos diseños de iconos web nos centraremos en el tipo de sombra. Aqui la sombra no es muy grande y la opacidad se ha reducido a sólo poner un relieve en el contenido de la caja y llevarla  ligeramente hacia adelante.

Es un bello ejemplo.

Sutiles texturas de fondo en Scouting for Girls

Tener una textura de fondo puede hacer o deshacer a su diseño.

Muchas veces el fondo se convierte en una gran distracción; y esto está lejos de proveer calidad al diseño. Por lo tanto, menudo es buena idea mantener las texturas del sitio web con un fondo sutil y suave.

El sitio web The Scouting for Girls realiza un gran trabajo al utilizar un estilo de textura oval complementándolo con una gran calidad de diseño.

Consejos para lograr la Sutileza en tu diseño

Para mí, los detalles sutiles en un diseño pueden impulsar al mismo; de ser bueno ha ser sorprendente.

Si estás buscando una manera de inyectar algo especial en tu página web, los detalles sutiles son el camino a seguir.

Aquí hay algunos consejos para tener en cuenta si desean incluir detalles sutiles en su diseño.

• Incrementa tus diseños propios
Nunca utilices un vector o la textura de otro, crea (en la medida de lo posible) tus propios detalles en la construcción de tu página web.

• Experimenta con la opacidad y el color
Incluso el 3% de opacidad puede tener un impacto positivo en tu diseño.

• No te preocupes, ser valiente (Don’t worry, Be Brave)
No tengas miedo de ser demasiado sutil, o descolorido tu bosquejo.

Este articulo es una traducción al castellano de How to Spot Quality within Web Design: Examples & Tips
Fuente: www.wefunction.com

Comparte esta contenido en tus redes sociales

Hide Sites

Pues bien, parece que ya no existen dudas. Las redes sociales ya están consolidadas en todos los ámbitos de nuestras vidas digitales (y no digitales), hasta tal punto en que una de las grandes noticias de la semana fue que por segunda vez en su historia Facebook superó en visitas al gran Google.

Según el informe publicado por la empresa Hitwise, Facebook fue el sitio más visitado en EEUU. En esos días, la gran red social marcó un incremento de visitas del 185% respecto del mismo período en el 2009, mientas que Google sólo incrementó el 9%.

La primera vez que esto había pasado fue en navidad del 2009.

Si sos inquieto y querés comenzar a conectar tus “viejos” medios, te acercamos 25 plugins que no podés ignorar para integrar Facebook con Wordpress.

Comparte esta contenido en tus redes sociales

Hide Sites

10 respuestas sencillas y directas para responder a una de las preguntas que les quita el sueño a muchos:

Para darle prestigio a tu web

1 – Para aumentar su visibilidad en la web

2 – Para aumentar su tráfico de visitas

3 – Para que su información sea más atractiva en los buscadores

4 – Para dotar de buen contenido a su web

5 – Para hacer su sitio web más navegable

6 – Para que tus clientes recuerden tu marca

7 – Para que tus potenciales clientes conozcan tu marca

8 – Para darle prestigio a tu web

9 – Para tener mayores contactos

10 –  Para tener mayores posibilidades de vender más

Comparte esta contenido en tus redes sociales

Hide Sites

Entre los datos más destacados encontramos que existen 1.73 mil millones de usuarios en la web y se envían alrededor de 247 mil millones de correos electrónicos por día.

Además podrás encontrar datos concretos sobre Facebook y Twitter, las dos estrellas de las redes sociales.

JESS3 / The State of The Internet from JESS3 on Vimeo.

Comparte esta contenido en tus redes sociales

Hide Sites

No todas las grandes empresas registraron de inmediato sus nombres de dominio. Por ejemplo Apple registró su dominio en el año 1987 y Microsoft en el 1991.
En la actualidad hay más de 192 millones de dominios registrados, entre los cuales el mas utilizado es el .com (80 millones de registros).
Sin embargo, la etensión .cn (utilizada por los sitios chinos) se esta acercando a esa cifra.
Meses antes de esa fecha se había aprobado el Sistema de Nombres de Dominio (DNS), que asocia las palabras con las largas direcciones IP que identifican a cualquier equipo conectado a internet.Luego de la extensión .com se fueron aprobando otras, como .net, .org, .gov, .edu, .mil, .int y los dominios con extensión para los distintos países.En el primer año sólo hubo seis interesados en registrar un .com y recién dos años después se alcanzo alcanzar el centenar.

Comparte esta contenido en tus redes sociales

Hide Sites

Despues de un tiempo volvemos con la serie de consejos y ejemplos útiles para detectar la buena calidad en Diseño de sitios web:

04. Organización de Elementos

Para ser un diseñador web se debe apelar mucho a la naturaleza creativa, y esto puede ser muy divertido.

Ahora sé que la Organización no suena muy bien para la creatividad o la diversión, pero una vez que entras en el hábito de una buena organización no tiene que ser tan aburrido como parece. La manera en que se organizan los elementos de un sitio web siempre va a ser diferente, depende de qué tipo de página web es, y de lo importante que son algunas características del contenido de este sitio web. Aunque siempre hay una variación en la forma y lugar donde irán los elementos, hay algunas cosas que se pueden hacer para que la organización de su contenido sea más fácil.

Lo primero que hay que hacer es decidir lo queremos quiere lograr con el diseño. Por ejemplo, ¿Estamos diseñando para vender un producto? ¿Estamos diseñando para destacar el contenido? o ¿Es un diseño para lograr suscriptores y referidos? Entre otros tipos de objetivos en el diseño web.

Diseñado para vender: 37Signals

Echemos una mirada al sitio web masivamente popular 37Signals. Este es un sitio “fácil de ver” y no es coincidencia que sus productos se vendan tan bien. La web esta hecha lo más simple posible para que el usuario vea rápidamente lo que está en venta. La organización de los elementos sirve de ayuda a la hora de tomar la decisión final de la compra. Esto es todo lo que se necesita en un sitio web diseñado para vender.

En la siguiente fotografía (abajo) podemos ver que la página web tiene 4 características fundamentales que la hacen ideal para alentar al marketing digital:

• Lo primero es la Atención. Los diseñadores de este sitio web han hecho un cuadro oscuro en donde ubicaron un fácil y rápido resumen con grandes títulos en negrita.

• Luego de intentaron generar Interés, esto mediante un listado de beneficios para cada producto con una bonita ilustración.

• El Deseo es el siguiente punto; esto es logrado poniendo los comentarios y testimonios, y algunos videos de “Lo que nuestros clientes tienen para decir.”

• La última característica a tener en cuenta es la Acción, en 37Signals hay varios puntos de acción en toda la página, es agradable ver que la misma es bastante larga y que incluso tiene algunos puntos de acción en el pie de página.

Diseñado para el contenido (Blog): Buenos medicamentos

Cuando usted está diseñando para un blog es una historia completamente diferente. No es necesario perder tiempo para convencer a tus usuarios sobre tu producto; tu “producto” ya está en la pantalla, tu contenido es el producto.

Uno de los puntos claves es hacer más fácil la visualización de entradas para los usuarios, así los mismos exploraran tu blog e interactuaran contigo a través del mismo. Contenido debe ser (una de las) la primera cosa (s) que ves en un blog.

En este ejemplo (abajo), una buena fuente rosa en negrita como título para el contenido, llama realmente la atención directa a los ojos del usuario. Hay también un buen tamaño en la imagen de la vista previa de los contenidos. Una buena 2/3 párrafo de texto seguido por un “Continúe Leyendo” (”Continue reading”) como enlace. Se destaca también la fecha de autor y la información como contenido estandar.

Para mí este es uno de los más perfectos de la “Calidad en Diseño para el contenido.”

La Atención en este blog puede ser re-direccionada a cualquier cosa que le interese al diseñador; aquí el anuncio de suscripción tiene un gran icono que ayuda a los usuarios a mantenerse conectados con su contenido. Además, sin duda, esto aumentará la cantidad de abonados, debido a que trabaja a dos niveles:

Primero: alentando a los usuarios Explorar, los mismos pueden utilizar en cualquier caso; las pestañas (Latest Post) recientes o populares de la barra lateral. Es fácil de hacer y muy efectivo, sobre todo en un blog.

Segundo: Los blogs tienden a tener una mirada muy personal de las cosas, lo que permite a los usuarios Conectar con el dueño del blog en una variedad de formas. Por lo tanto, el Blog puede ser una gran ventaja a la hora conocerse gente.

Comparte esta contenido en tus redes sociales

Hide Sites

Entre ellos, un sitio web para una Concesionaria Honda en Grecia (http://www.bskoulouris.gr) realizado para la empresa de diseño Webco GR con la que trabajamos hace algunos años.

También para Webco, realizamos un sitio para la empresa griega FurHome (http://www.furhome.gr) dedicada a la venta de productos para el hogar realizados en pieles como alfombras, almohadones, sillas, etc. Nuestro trabajo fue, además del diseño web, asesorarlos para que pudieran colocar sus productos en línea y mejorar las ventas. Para ello, desarrollamos un sistema a medida que permite la publicación de productos, con sus precios, galería de imagenes para ver en mayor detalle el producto y por supuesto, lograr que el cliente interesado realice pedidos de manera online (ver tienda online).

Estamos orgullosos también de lanzar el rediseño del Blog de Zagada (http://www.NearshoreJournal.com). El primer blog NearshoreJournal fue lanzado a comienzos del 2008. NearshoreJournal es un sitio dedicado a publicar noticias relacionadas con el mundo de los Negocios y el IT Outsourcing (ITO), Business Process Outsourcing (BPO). En este sitio realizamos todo el rediseño basado en hoja de estilo, un completo asesoramiento en Marketing digital, trabajando con redes sociales y optimizando el código para obtener mejores resultados en google.

A nivel local, hemos finalizado otro gran sitio, en este caso para Los Ases de la Parrilla (http://www.asesdelaparrilla.com.ar) una empresa dedicada al rubro organización integral de eventos, con la particularidad de organizarlos dándole un toque criollo. Los Ases de la Parrilla necesitaban mostrar su trabajo, los servicios que ofrecen y sobretodo la trayectoria que los caracteriza. Para ello desarrollamos un sitio web en donde no sólo pueden mostrar los eventos que organizaron, sino además el usuario puede pedir asesoramiento y elegir entre los diferentes menues para eventos que los “Ases” ofrecen.

Comparte esta contenido en tus redes sociales

Hide Sites

Continuamos con la serie de consejos y ejemplos útiles para detectar la buena calidad en Diseño de sitios web:

03. Tipografía Bien Pensada

Aunque el contenido real del sitio web no será escrito por el diseñador, este (el contenido) juega un papel importante en la calidad general del diseño web. La función del diseñador será asegurarse de que el contenido se muestre en una forma fácil de seguir y leer. Hay muchas maneras de asegurarse que su tipografía sea legible y usable, y aunque no vamos a enumerar el conjunto de normas y reglamentos sobre qué hacer y qué no, daremos algunos ejemplos de tipografía inteligente para hacer la diferencia en la calidad web.

Ejemplos de Tipografía Bien Pensada

Grandes y hermosas en TheNetsetter.com

Los títulos son importantes en el diseño de páginas web, especialmente cuando se está diseñando para un blog.

Una reciente tendencia en diseño web es utilizar, para los títulos, fuentes en negrita y de gran tamaño. Esto funciona de manera positiva de muchas formas, no sólo remarcar todas las casillas de la derecha desde un punto de vista de la usabilidad, sino que también ayuda a crear espacios y definir la estructura de un diseño.

Netsetter es un gran ejemplo de estos lineamientos, aquí se puede ver cómo el título crea un montón de espacio en blanco alrededor de él y, naturalmente, es muy fácil de leer.

Texto principal, grandes espacios.

El sitio web de Viget es realmente un hermoso ejemplo de lo importante que es la tipografía en el diseño web.
El ejemplo que vemos a continuación (tomado del portfolio) muestra una vez más cómo el uso de un mayor tamaño de fuente ayuda a crear y abrir el espacio. Incluso con la fina y fresca fuente que han utilizado, se puede ver el gran espacio que se ha creado en esa zona. El tipo de letra en sí es muy pulido, y es una gran elección de la fuente.

La otra cosa que se destaca aquí es la atención a los detalles en el interlineado (texto principal). En el espacio entre cada línea de texto se ha incrementado el valor predeterminado (line-height) para crear mucho más espacio y hacer el texto mucho más legible. Este es truco que puedes probar en tu próximo diseño.

Web Design Ledger, fuentes para adaptarse a su estado de ánimo.

Encontrar la fuente perfecta se puede hacer a través del ensayo y error. Pero también se puede hacer esta elección en base a los diferentes estados de ánimo que ciertas fuentes provocan y así, ayudar a forjar el diseño.
Aquí el ejemplo de la web; Web Design Ledger. Este diseño luce un look retro y gastado. Sin embargo, se contempla en el diseño una sensación abierta y moderna, por lo que la elección de la fuente ayuda a evocar un estado de ánimo similar a su éxito.

Henry Jones (el diseñador) ha elegido para los titulos una fuente-serif muy popular: Georgia; que se complementa con un estilo retro y gastado que luce muy bien.

La moderna sensación de este sitio web viene dada por el uso de diferentes fuentes; una para los títulos (Georgia) y una para el contenido: Helvética; una fuente sans-serif con redondeado que da una sensación de libertad por sí misma. Las dos opciones de tipo de letra en este ejemplo son muy ingeniosas y realmente ayudan a lucir y establecer el estado de ánimo positivo para el diseño.

Lista Rápida para la Tipografía Bien Pensada en el Diseño Web
Arruinar una buena tipografía en el diseño web se convierte en algo un poco más fácil cuando se han visto algunos grandes ejemplos de la Tipografía Bien Pensada (arriba).

¿Que es exactamente lo que hace que estos ejemplos sean tan buenos? ¿Qué debe mirar al diseñar su próximo sitio web?

• ¿Es legible?

No tenga miedo de hacer sus títulos grandes y en negrita.

• ¿Has pensado en el espacio?

El Espaciado puede mejorar la legibilidad.

• ¿Sus fuentes de ajustarse al estado de ánimo que pretende proyectar?

Asegúrese de que sus fuentes complementan el diseño.

Probablemente hay más de mil consejos esperándolo haya afuera, pero una cosa es segura: debemos aprender a apreciar el impacto de una buena tipografía.

Este articulo es una traducción al castellano de How to Spot Quality within Web Design: Examples & Tips
Fuente: www.wefunction.com

Comparte esta contenido en tus redes sociales

Hide Sites

Este proyecto fue encargado por la Secretaría en el marco de la Campaña de Promoción de Derechos y Protagonismo Infantil y Juvenil. La necesidad planteada era generar un espacio de comunicación entre los niños y adolescentes cordobeses con sus familias. Con este desafío en mente, propusimos varias ideas entre ellas, la de un concurso. Partiendo de esta idea original realizamos todo el desarrollo de la Campaña. Desde su puesta en marcha hasta la Promoción. Eso incluyó la realización de toda la Campaña de Marketing Digital, desde el e-mail marketing, la publicación de avisos en Google Adwords hasta la promoción en distintas Redes Sociales como Facebook, Metroflog, Fotolog, etc.

Trabajando en conjunto con la Secretaría, que realizó la parte gráfica, diseñamos y programamos el Sitio Web del Concurso http://www.enredate-cba.org en donde niños, niñas y adolescentes podían subir sus trabajos (narraciones, dibujos o fotografías) a través de formularios, además podían votarlos y comentarlos. Permitiendo también la participación de sus familiares y amigos que podían apoyar a los concursantes y sus trabajos favoritos a través de votos y comentarios.

Tenemos la satisfacción de haber concluido el Concurso y la Campaña con un éxito rotundo ya que sobrepasamos los 500 participantes, con más de 300 comentarios y más de 10.000 de votos.  En breve, cuando desde el Munaf nos notifiquen, estaremos dando los resultados del concurso e informando a todos los participantes, quienes fueron los ganadores y las escuelas a las que pertenecen.

Comparte esta contenido en tus redes sociales

Hide Sites