40 PAGINAS WEB INCREIBLES - CARVAJAL

Vista previa del material en texto

PÁGINAS
WEB
INCREÍBLES
introducción // 3
qué debe tener una página web increíble// 4
cómo utilizar este eBook // 6
e-commerce // 7
entretenimiento, arte y medios // 15
empresas y ONG’s // 22
herramientas web // 27
animaciones y juegos // 31
curiosidades // 37
navegación increíble // 40
mejor uso de la fotografía // 45
diseño // 51
índice
introducción
Alguna vez ha escuchado la frase “la primera impresión es la que cuenta”. No sé si en todas las áreas 
aplica, pero por lo menos en cuanto a lo que experimentamos cuando alguien visita nuestra página web, 
si se cumple. Las segundas oportunidades no existen. Por eso hemos seleccionado 40 ejemplos de 
páginas web grandiosas, de diferentes sectores para que se inspire, tome ideas y las implemente en su 
sitio web.
En cada una de estas páginas encontrará un común denominador: desde el home están ofreciendo su 
propuesta de valor y producen un altísimo impacto. Le están enviando a su visitante un mensaje 
concreto: ¡Llegó al lugar correcto, acá tenemos lo que necesita! Porque si a un nuevo usuario no le gusta 
lo que encuentra, su reacción instintiva será dar clic en el botón "back".
Para evitar perderlo debe proporcionarle respuestas rápidas a las siguientes preguntas que él, de 
manera inconsciente, se hará una vez esté en la página de inicio: ¿Qué es esto? ¿Qué puedo hacer aquí? 
¿Qué tienen en este sitio? ¿Por qué debería estar aquí y no en otro lugar?.
Es cierto que diseñar, crear y mantener un sitio web no es tarea fácil. No existe el sitio perfecto, pero 
estamos seguros de que el ver las páginas ganadoras de premios tan importantes como el 
aWWWAWards o que han recibido reconocimiento de la revista Time, le servirán de guía.
¿qué debe tener una
página web increíble?
Contenido: 
Recursos (multimedia o texto) que llaman la atención del visitante a permanecer en la página por su 
relevancia. Adicional es importante que su estilo de presentación sea tan “vendedor” que lleve a 
hacer una acción determinada: comprar, compartir, etc.
También se tuvo en cuenta que los sitios web tuvieran un blog actualizado y con contenido de 
calidad, pues esto contribuye a incrementar las visitas, la conversión y la fidelización de los visitantes.
Aunque hay varios criterios que son fundamentales para lograr impacto, conseguir tráfico y lograr 
conversión (lo invitamos a revisar en este artículo), hemos destacado estos 4 para seleccionar las que 
aparecen en esta colección:
http://blog.carvajalinformacion.com/Blog/bid/319600/10-Tips-para-tener-un-Sitio-Web-de-Impacto
página web increíble?
Usabilidad: 
Hace referencia a lo sencillo que resulta para un usuario encontrar lo que busca o hacer lo que 
quiere en una página web. Hay varias preguntas para hacerse, pero algunas de las más importantes 
son: ¿Cuál es el contenido más importante? ¿El usuario puede identificarlo en menos de 8 
segundos?, ¿Se ve claramente lo que ofrece la empresa?, ¿La Tipografía es clara y contrasta con el 
fondo?, ¿Se puede llegar fácilmente al home desde cualquier página?, entre otros.
Diseño: 
Además de la creatividad, originalidad e interactividad, hay un criterio indispensable y es si esa 
página está adaptada a cualquier dispositivo. ¿Cómo se ve la información si ingresó desde un 
smartphone o una tableta?
Otros aspectos a tener en cuenta son la calidad de las imágenes (relación con el producto que 
ofrecen) y el lenguaje de programación utilizado, pues de esto último depende su compatibilidad 
con diferentes exploradores, la velocidad de carga, etc.
Conversión: 
Para cumplir con este criterio, el sitio se debe estructurar de manera que los usuarios hagan lo que 
queremos, ya sea agregar un artículo al carrito de compra, diligenciar un formulario y/o descargar 
cierta información. Esto se logra mediante diseños adecuados que atiendan cada uno de los 
diferentes perfiles y la ubicación de Llamados a la Acción (CTA) en sitios estratégicos.
SALE
¿cómo utilizar este eBook?
En la parte superior de cada página web seleccionada verá que hemos destacado algunos de los siguientes 
íconos, lo que quiere decir que esa página cumple ese (os) criterio (s):
SALE
ConversiónContenido Usabilidad Diseño
Por ejemplo, cuando los 3 primeros íconos están grises y sólo el de contenido se ve color naranja, significa 
que esa página SOBRESALE por ese aspecto, pero con esto no queremos decir que los otros sean 
deficientes, porque en la colección hemos seleccionado sitios web increíbles para inspirarlos.
SALE
e-commerce
1
Saturdays
En una Tienda Virtual es indispensable que las imágenes, el contenido y la navegación 
lleven a realizar la acción clave: comprar. Definitivamente este sitio lo ha logrado.
Outgrow.me
SALE
http://www.saturdaysnyc.com/
2
Outgrow.me
Aunque con un diseño sencillo, este sitio se destaca porque es el primer marketplace 
que ofrece productos que se financiaron por crowfounding. ¡Eso lo hace único!
SALE
http://outgrow.me/
3
Hukkster
Sobrio, elegante y efectivo. Sin necesidad de saturar la atención del visitante, muestra 
con claridad su oferta y destaca perfectamente su CTA (Llamado a la Acción).
SALE
http://www.hukkster.com/
4
Hukkster Goldbely
Una mezcla llamativa y poderosa de recursos multimedia (fotos y vídeos), hacen de 
este sitio web uno de los más increíbles y “tentadores” para comprar.
Marshall
SALE
https://www.goldbely.com/
5
Marshall
Sin lugar a dudas la tipografía, las imágenes y los colores de este sitio web identifican 
con claridad la esencia de esta marca. ¡Nada quedó al azar!
SALE
http://www.marshallheadphones.com/
6
The Grommet
Lo que define a este sitio web es la coherencia. La tipografía, las fotos y los CTA 
(Call-to-Action) están perfectamente sincronizados con lo que venden.
SALE
http://www.thegrommet.com/
The Grommet
7
Luhse Tea
Este sitio rompe con los esquemas de lo que uno se esperaría encontrar en una página de 
venta de artículos de té. Sus ilustraciones y los íconos de su menú motivan a conocer más.
SALE
http://www.luhsetea.com/
entretenimiento,
arte y medios
8
Sound Cloud
A esta página le dan el calificativo de la Flickr de la Música. En esta comunidad 
compartir sonidos es tan fácil como escucharlos. Además su herramienta para 
visualizar la reproducción es única y llamativa.
SALE
https://soundcloud.com/
9
Naive
Este sitio demuestra que no sólo tiene una excelente estructura y contenido, 
sino que también han cuidado los detalles en la navegación y en el diseño.
SALE
http://www.naive.fr/
10
DuJour
Esta página lograr transmitir con claridad que es un magazine, pero combina 
perfectamente las buenas practicas: contenido de calidad, llamados a la acción y fotos de impacto.
Tattoo Sound
SALE
http://dujour.com/
DuJour
11
Tattoo Sound
No sólo la foto de su página principal es descrestante, sino también la disposición 
de su menú, la navegación y la originalidad para “vender” su contenido.
SALE
http://www.ta2music.com/
12
At60 inches
Sin la menor discusión, está página se destacada por un diseño increíble, que desde 
la página de inicio logra transmitir múltiples emociones.
SALE
http://www.at60inches.com/
At60 inches Clouds Over Cuba
Con una espectacular foto de inicio y sólo con la información precisa, esta página 
cumple su objetivo: llevarnos a ver el documental.
13 SALE
http://cloudsovercuba.com/
empresas y ONG’s
Digital Public Library of America
Esta exhibición virtual se destaca prinicipalmente por la forma en la que ha organizado su contenido y 
por las herramientas complementarias que utiliza para ayudarle al visitante a profundizar.
14 SALE
http://dp.la/
15
ICRW.ORG
Con una espectacular fotografía y una frase “poderosa”, esta página lograr 
transmitir su mensaje de un solo vistazo. ¡Por supuesto también motiva a hacer la donación!
SALE
http://www.icrw.org/turning-point
ICRW.ORG
16
Medair
La combinación entre un excelente menú, llamados a la acción estratégicamente 
ubicados (CTA) y un buen contenido, hacen de esta página una delas mejores del 2013
SALE
http://experience.medair.org/
Medair
17
The BroadMoor
Este sitio es sencillo, pero su página de inicio es extramadamente efectiva gracias 
a las fotos espectaculares de fondo que van cambiando. Las fuentes y hasta los 
botones de redes sociales entran en armonia con la sobriedad de este diseño.
SALE
http://www.broadmoor.com/
herramientas web
18
KidRex
Sencillez y efectividad, combinadas con un diseño original, convierten a este 
buscados en una herramienta perfecta para niños y padres.
SALE
http://www.kidrex.org/
19
MailChimp
La herramienta preferida para e-mail marketing, cuenta con una página de inicio que 
motiva al visitante por medio de una animación para explicar lo fácil que resulta usarla.
SALE
http://mailchimp.com/
MailChimp
20
TedEd
Además de tener un diseño impecable, este sitio web permite al usuario realizar videos 
educativos en segundos, utilizando una galería de YouTube y otras herramientas espectaculares.
SALE
http://ed.ted.com/
animaciones y 
juegos
animaciones y 
juegos SoleilnoirGracias a una mezcla perfecta entre animación y navegación, este sitio brinda una 
experiencia “divertida” y “entretenida”.
21
SALE
http://www.soleilnoir.net/believein/#/youtube
empresas y ONG’s
22
Contrejour
Como en una película de Tim Burton, las ilustraciones y animaciones de esta página 
son misteriosas pero muy llamativas. Les aseguro que estarán varios minutos jugando... 
SALE
http://www.contrejour.ie/
Contrejour
23
HelloMonday
Cuando usted ve la autenticidad de este diseño, las animaciones maravillosas y la magia 
de su navegación, entiende porque ganó como Página Web del año (AWWWards).
SALE
http://www.hellomonday.com/
24
Jacquico
El diseño brillante del “Look and Feel” de esta página y la 
interactividad que le brinda al visitante, logran la combinación perfecta.
SALE
http://www.jacquico.com/
25
Pottermore
Cuando usted ingresa a esta Página Web se siente como si estuviera en la 
película de Harry Potter. Cada detalle es perfecto y lo mejor es la forma en la que 
logran involucrar al usuario.¡Tiene que experimentarlo usted mismo!
SALE
http://www.pottermore.com/es
curiosidades
herramientas web
curiosidades
26
Distancetomars
Este es un sitio creativo, único y educativo, que le da una idea muy clara de cuál 
es la distancia que hay hasta Marte. Por medio de un viaje interactivo, a través de 
los pixeles de la página, se dará una idea de lo lejos que estamos.
SALE
http://www.distancetomars.com/
27
5secondfilms
Un sitio particular y divertido en el que podrá disfrutar de una gran variedad de películas. 
Si vive acelerado no se preocupe, sólo necesita 5 segundos para ver cada uno.
SALE
http://5secondfilms.com/
navegación 
increíble
navegación 
increíble
28
AtHome
Empezando por la página de inicio, la navegación de este sitio lo llevará a un viaje a 
través de historias que despertarán su sensibilidad. No se irá hasta finalizar. 
SALE
http://athome.nfb.ca/#/athome
animaciones y 
juegos
AtHome Mini
Sólo con la ayuda de su mouse, descubrirá las bondades de este producto, por medio 
de unas animaciones deslumbrantes.
29 SALE
http://www.mini.jp/event_campaign/big-point/
animaciones y 
juegos
30
Marco Rosella
Es fascinante ver cómo el botón de navegación se sincroniza con las animaciones y 
lo lleva a descubrir un contenido espectacular.
SALE
http://marcorosella.com/#work
Marco Rosella
31
ParaNorman
Gracias a su CTA de inicio, al menú de navegación y al contenido con imágenes muy 
llamativas, este sitio web no lo deja ir sin que vea por lo menos el trailer de la película.
SALE
http://www.paranorman.com/
mejor uso de la 
fotografía
mejor uso de la 
fotografía
32
Humans of New York
Esta página le brindará una gran experiencia por medio de sus imágenes de alta calidad 
y gracias a las historias que encontrará en cada rincón.
SALE
http://www.humansofnewyork.com/
33
Visit Denmark
Gracias a cientos de fotos espectaculares y al uso adecuado de categorías, 
puede tener un recorrido virtual por Dinamarca y quedar asombrado. 
SALE
http://www.visitdenmark.com/denmark/tourist-frontpage
curiosidades
MyProvence
Así como aparece en el home, al ingresar a esta página usted 
querrá cuanto antes empezar la experiencia. Se sorprenderá con la navegación, 
la utilización de recursos multimedia y la interacción.
34 SALE
http://www.myprovence.fr/snapshots2012/en/
curiosidades
35
The Last Hunt
Dese el inicio las fotos son espectaculares, pero lo que lo va a dejar sin aliento es 
la forma en la que le irán contando la historia. Música, Ilustraciones, claridad en la 
navegación, interactividad y un gran contenido.
SALE
http://thelasthunt.nfb.ca/#/thelasthunt
36
Rei
Esta es una de las páginas más novedosas de esta selección, porque además de 
generar comunidad gracias a que los usuarios pueden cargar sus fotos, las exhibe por 
medio de una línea de tiempo fantástica que le permite al visitante interactuar.
SALE
http://www.rei1440project.com/
diseño
37
Blacknegative
En esta página confluyen la perfección y la elegancia. A través de la navegación se encontrará 
con sorpresas, pero siempre verá un diseño impecable y escuchará una música majestuosa.
SALE
http://blacknegative.com/#!/home/
Blacknegative LexusCada uno de los elementos de esta página se encuentran relacionados 
con las características del producto que ofrece esta empresa. El menú, las 
fotos y la navegación evocan un viaje veloz y sorprendente.
38
SALE
http://www.lexus.co.uk/car-models/gs/million-mile-test-drive/index.tmex#
39
One Small Tweet
Los visitantes podrán recrear las millas del viaje a la luna por medio de tweets. Esta 
página tiene contenido de valor, una gran animación e interactividad con redes sociales.
SALE
http://onesmalltweet.com/
One Small Tweet Bryant Park Hotel
La página de este hotel se centro en dos atributos fundamentales: comodidad y elegancia. 
Los refleja en sus fotografias de alta resolución y en la sencillez de su menú y de los CTA.
40 SALE
http://bryantparkhotel.com/
En Carvajal Información 
tenemos múltiples opciones 
que se adaptan a las 
necesidades de su negocio. 
Con nuestras soluciones de 
presencia digital recibirá 
mucho más que una 
página web
SOLICITE UNA ASESORÍA 
GRATUITA
http://www.carvajalinformacion.com/presencia-digital/