WireFrames

Elementos para el home de tu sitio webDiseo Web

Introduccin En los negocios, slo tienes una oportunidad de lograr una buena primera impresin, y lo mismo ocurre con tu sitio Web.

Cuando los clientes acceden a tu sitio deben tener, instantneamente, un entendimiento claro de quin eres y qu es lo que haces.

La relacin entre un cliente y un negocio se basa en la confianza. Tu sitio Web es amigable con los clientes y les transmite confiabilidad?Informacin de contactoLa mayora de las pginas Web de pequeas empresas no incluyen liga al correo electrnico en la pgina principal, y muchas de ellas tampoco cuentan con el nmero telefnico. Mnimo, tu pgina home debe tener tu email y tu telfono.

Si tienes una ubicacin fsica, considera tambin incluir la direccin completa, as como un mapa con instrucciones para llegar. Imgenes que representan lo que hacesSi vendes, por ejemplo, pasteles para bodas, tu pgina home debe tener una fotografa de uno de tus mejores pasteles. Aunque esto suene bsico, muchos sitios Web de pequeos negocios usan grficos irrelevantes como fotos familiares o de mariposas, o peor an, no incluyen ningn tipo de imagen. Define cmo se desplegarn tus imgenes.

Piensa dos veces antes de decidir si stas girarn o si se agitarn o si hacen cualquier movimiento que pudiera resultar molesto.Navegacin clara con ligas que funcionenTu pgina principal debe tener un sistema de navegacin claro, ya sea en la parte superior o inferior, o a un costado de la pgina. Los botones deben estar bien marcados y corresponder con el contenido de tu sitio para ayudar a los clientes a que encuentren rpidamente lo que estn buscando. Tambin considera incluir botones de Envo, Preguntas y de Historia de la compaa. Una caja de registroUna forma efectiva de motivar la lealtad del cliente es a travs del envo regular de newsletters (boletines electrnicos). En tu pgina home incluye una caja de registro para tu sitio Web y ofrece recompensas, como descuentos en compras a todo aquel que ingrese su direccin de correo. Ligas a tus redes socialesAydales a los clientes a estar en contacto contigo al proveerles links a tus cuentas de redes sociales desde tu pgina de inicio. Usa los conos reconocibles de Facebook, Twitter, LinkedIn o Google+.

Tambin puedes incluir los widgets de las redes sociales que facilitan que los usuarios te sigan inmediatamente y que compartan tu contenido. Fuente: http://soyentrepeneur.com/RecomendacionesEs normal que actualmente muchos empresarios y ejecutivos nuevos en el rea online se cuestionen con frecuencia, qu es lo que en la prctica debe contener una buena pgina web. La respuesta que mejor se adecua al tema es:

"La informacin y servicios que tus clientes necesitan y que esperan encontrar en tu sitio web", ni ms ni menos.WireFramesDISEO WEB

IntroduccinUna vez que se tiene claro funcionalmente qu queremos que haga nuestra tienda online, la siguiente fase en nuestro proyecto es la de aterrizar nuestra idea consensuada con el departamento tcnico, en un diseo elegante.Qu es un WireFrame?Un Wireframe es una representacin esquemtica de una pgina web sin elementos grficos que muestran contenido y comportamiento de las pginas.

Sirven como herramienta de comunicacin y discusin entre arquitectos de informacin, programadores, diseadores y clientes.

Los wireframes son estructuras cuadriculadas (sin diseo, sin curvas, sin imagen) y organizadas, de cada pgina de nuestra tienda online, con un peso bastante real de lo que ponderar cada zona de la misma. De hecho, entre los wireframes ms importantes destacan el de la cabecera (header) y el pie (footer) de nuestro e-commerce, ya que debern incluir todo lo que se necesita a lo largo de una compra online (el logo de la tienda, el acceso a la zona cliente, el contacta, el quines somos, el carro, etc.Cada oveja con su parejaAdems de los wireframes de encabezado y pie, cada pgina de nuestro sitio web debe tener su propio wireframe: home, universo, categora, subcategora, producto, carro, registro, olvid mi contrasea, contacto, confirmacin de la entrega, confirmacin del pedido, contacta, aviso legal, etc.

Muchos de ellos sern bastante parecidos as que bastar con copiarlos y cambiar lo que queramos o reaprovecharlos. Por ejemplo, las pginas estticas de contenido en texto plano tipo quines somos, aviso legal, condiciones de compra, etc. podrn perfectamente utilizar el mismo wireframe, y eso que nos ahorraremos en horas de diseadorCmo se hacen los wireframesCualquiera puede hacer sus propios wireframes. Basta con abrir powerpoint y mediante rectngulos ir construyendo la estructura.

Cuando tengamos un wireframe completado, bastar con copiar esa pgina y sobre la copia, manteniendo los elementos comunes como el encabezado y pie, hacer las modificaciones necesarias para la nueva pgina.Consejos a la hora de hacer los wireframesEmpieza por tener perfectamente clara la estructura completa de navegacin de tu pgina web y la relacin de pginas estticas que la compondrn. Aprende cules de tus pginas son realmente similares en cuanto a su estructura, de manera que puedan reaprovechar el mismo wireframe.

Fjate en los lderes online, pgina a pgina, y obtn sus wireframes para luego disear el tuyo propio, pgina a pgina: home, producto, etc.

Ten muy clara cmo ser la navegacin por el sitio web: por universos horizontales superiores, o mediante un solo botn que permita desplegar todos los departamentos (como Amazon).

Donde vayan precios prev precios mximos para ver que quepan.

una misma pgina puede tener varios wireframes

No olvides que el wireframe es la traslacin visual del documento funcional pero sin diseo