18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

Call: +44 (0) 808 22 444 22 Email: info@hitreach.co.uk

Blog

Home

About

Services

Our Work

Clients

Testimonials

WP Plugins

Resources

Contact

Blogging

You are here: Home / The Anatomy of a Perfect Web Page / Anatoma de la Pgina web Perfecta

Anatoma de la Pgina web Perfecta

18
Share

173
Compartir

35
Like

60
Tw eet

Anatoma de la Pgina web Perfecta (edicin de 2013) es diseado con el fin de presentarte un resumen, una introduccin y recursos ms completos para cada elemento que forma parte de la pgina web perfecta. Dado que el diseo web, la experiencia de usuario, el SEO, la optimizacin de la tasa de conversin y muchas otras actividades se mezclan cada vez ms, tienes que saber cmo todos los elementos de una pgina forman el xito de t sitio web, sea lo que sea t papel en el proceso. Tambin es importante que conozcas los vnculos que existen entre todos estos elementos. Cada seccin es corta y fcil de entender. En esta presentacin se encuentran numerosos enlaces hacia otros sitios web que incluyen recursos exhaustivos y de alta calidad para que puedas aprender ms sobre cada elemento. Esperamos que os guste!

http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/

1/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

Diseo & Contenido

01

Llamadas a la accin

02

Posicionamiento interno

03

Marcado

04

05
Cdigo
Tiempos de carga Compresin de imgenes Responsive design HTML5 CSS3

Titular Navegacin Contenido Legibilidad Web Fonts Imgenes Sellos de confianza Migas de pan Videos Pie de pgina

Llamada a la accin principal Botones para compartir de las redes sociales Llamadas a la accin secundarias Venta cruzada & Up-selling

Arquitectura del sitio web Estructura de la URL Etiqueta Title Etiqueta Meta Description Etiquetas Header Enlaces contextuales Atributo Alt

Authorship markup Schema.org Migas de pan Markup Atributo Rel=canonical Protocolo Open Graph

01 / Diseo & Contenido

Alojamiento de T diseo forma parte de t videos & Mapa comunicacin. Tiene que ayudar al del sitio usuario a entender el tema de t sitio Mapa del sitio de un vistazo y ensearle el valor aadido que puede aportarle. El diseo sirve tanto para satisfacer las necesidades de los consumidores como para crear un aspecto visual precioso. Lo importante es no separar el diseo y el contenido para que el diseo ms ponga de relieve el impacto del contenido. Es posible crear un contenido ms atractivo eligiendo el medio de comunicacin ms apropiado para dar a conocer t mensaje. Se puede as combinar un artculo, textos e imgenes con el fin de crear una pgina web con contenido rico muy eficiente.

1 Titular
http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 2/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

T titular es sin duda alguna el elemento del contenido ms importante de t pgina web. Con respecto a a la navegacin del internauta, es importante que t titular describa el tema de t sitio para que el usuario sepa lo que va a encontrar aqu y que est seguro de estar en la pgina correcta. Esto tambin hace referencia al trabajo de posicionamiento web: el buscador debe entender el tema de t pgina web, por lo tanto, el incluir t palabra clave primaria en el ttulo suele ser buena prctica. Cuando se trata de una pgina web de producto, basta utilizar simplemente el nombre del producto. Si t pgina web trata de un contenido ms social, debes tener en cuenta el potencial de clics de t titular porque en este caso, no slo cuentas con la tasa de clics que proviene de las pginas de resultados del buscador (SERPs de Search Engines Results Pages por sus siglas en ingls) sino tambin con la que proviene de las redes sociales como Twitter. Otros recursos recomendados: How to Write Magnetic Headlines de Brian Clark
http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 3/19

01 / Diseo & Contenido

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

Are Your Titles Irresistibly Click Worthy & Viral?! de Dan Shure

2 Navegacin

La arquitectura de la informacin permite organizar y clasificar el contenido de t sitio con el fin de mejorar su usabilidad as como su encontrabilidad. T objetivo consiste en ayudar a los usuarios a encontrar lo que buscan a la vez de dirigirles hacia algunas pginas que determines como claves. La navegacin es fundamental para la estructura de la informacin del sitio web y debe ser determinado durante la fase de planificacin y investigacin. Bsicamente, t navegacin debe permitir a los usuarios llevar a cabo sus objetivos inmediatos de la forma ms fcil posible. Qu tareas intentan realizar? Qu problemas intentan resolver? Tienes que definir t forma de comunicarte con tus usuarios con el fin de ensearles cmo pueden llevar a cabo sus objetivos de la forma ms natural posible. Si t sitio web es grande, tienes que, de una u otra manera, clasificar tus

02 / Llamadas a la accin 03 / Posicionamiento interno 04 / Marcado 05 / Cdigo

http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/

4/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

pginas web y ordenarlas en categoras lgicas y pertinentes. No existe una sola forma de lograrlo pero debes de tener en cuenta algunas opciones: La clase (Ejemplo: cama ) Ejemplos de uso (Ejemplo: sueo ) Marco contextual (Ejemplo: habitacin ) Otros recursos recomendados: SEO Smackdown: Information Architecture vs. Technical Architecture de Shari Thurow Putting SEO in Its Place: An Information Architecture Strategy de Nathaniel Davis Proper Site Architecture for SEO de Joseph Pracci Getting The Website Information Architecture Right: How to Structure Your Site for Optimal User Experiences de Peep Laja

3 Contenido

Redactar para la web consiste en escribir a la vez para los usuarios y

http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 5/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

para los robots. A efectos de SEO, t contenido debe ser nico y debes de incluir tus palabras claves y sus sinnimos de forma natural y sin miedo ninguno. T contenido debe ser claro y descriptivo. Debe tratar ms de los beneficios que de las caractersticas y empatizar con t usuario tpico. Es ms, quieres que t contenido sea memorable, por lo tanto escribe con una cercania cognitiva a tu usuario evite jerga y redactes con frases fciles de entender (y que los usuarios realmente usen para hacer bsquedas ellos mismos). El efecto de las expresines coloquiales disminuyen el esfuerzo cognitivo del usuario de forma que tu contenido sea ms creble y persuasivo a la vez. Otros recursos recomendados: Content Recall de AJ Kohn Quick Course On Effective Website Copywriting de Peep Laja Writing for Cognitive Ease de Tim Minor

4 Legibilidad

http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/

6/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

No vale la pena crear un contenido memorable si nadie en si se esfuerza a leerlo. Reduce esa barrera mental del usuario de leerlo presentndolo de una forma ms atractivo. Por lo general, los usuarios suelen ojear t contenido de un vistazo y seleccionan las partes que ms les interesan. Ayudalos a identificar estas partes ofreciendoles un contenido ms troceado. Asegurate que la tpografa as como su tamao sean legibles y que la altura de t lnea sea cmodo para la lectura. Usa espacios en blancos: con el fin de separar los bloques de textos, usa los prrafos y los subttulos. Pon en negrita las frases ms importantes o presntalas bajo la forma de una lista con vietas. Otros recursos recomendados: Readability & SEO de AJ Kohn Writing Better on the Web de Anthony Pensabene 9 Key Steps to Improve Website Readability de Peep Laja

5 Web Fonts
http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 7/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

Hasta hace poco, los diseadores web tenan que conformarse con una gama limitada de tpografas para usar como textos en los sitios web. Haba que incorporar las tpografas ms creativas como imgenes (o en formato flash). Entonces, el contenido que representaban era o invisible para los robots, o descrito con una etiqeta alt . Las Web Fonts (tipografas descargables) permiten que los diseadores y los desarrolladores usen fuentes mucho ms creativos mientras siguen utilizando un texto legible para los robots. La tipografa es una disiciplina en si-mismo y los diseadores web llevan aos usando fuentes llamativas y originales para atraer la atencin de los usuarios ahora, con las Web Fonts el proceso es ms ameno para el SEO. La mayora de las veces, tienes que pagar una licencia para poder utilizar las fuentes de algunos proveedores tales como Fonts.com, MyFonts, Typekit y Font Deck. Sin embargo, existen servicios gratuitos como Google Fonts. Otros recursos recomendados:

http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/

8/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

Designing for SEO (SEOMoz Webinar) de Justin Taylor

6 Imgenes

Hay un cierto volumn de estudios que han demostrado que las imgenes son ms recordables que el texto y que numerosos compradores internautas navegan la web tan solamente mirando imgenes. Para las pginas de productos, usa imgenes ntidas y ligeras y procura que el espacio para ellas sea lo ms grande posible. Contempla incluir una versin ms grande de la imagen o una funcin zoom. La imagen por defecto debe ser t imagen ms pertinente (por ejemplo, elige el color que ms vende) y aade numerosas imgenes complementarias con el fin de mostrar las distintas opciones de color, los productos usados en y fuera de su contexto y las fotos en grupos. Si eres minorista, puedes realizar tu fotografa propia o demostrar t oferta nica en el mercado de tal forma que te permitir diferenciarte de las fotos de banco de imgenes de tus competidores. Importante: Si no posees todos los
http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 9/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

derechos de las imgenes, puedes u obtenerlos o utilizar imgenes cuyo uso con fines comerciales ya ha sido autorizado (en Creative Commons o sitios parecidos). Otros recursos recomendados: 7 Tips to Boost Your Sites Conversion Rate Using Images de Mustafa Khundmiri How Images Can Boost Your Conversion Rate de Peep Laja

7 Sellos de confianza

Para que la gente compre en t sitio web tienen que confiar en ti. Adems de un diseo atractivo, de un contenido pertinente y de una buena experiencia de usuario, puedes fomentar la confianza que el usuario tenga de ti incluyendo en t sitio sellos de confianza tales como las opiniones de los clientes. La mayora de estos sellos pretenden convencer al internauta que el sitio es dirigido por personas que realmente existen, que tenga envergadura suficientemente para gestionar sus compras y otros tantos consumidores ya confen l. Otros sellos de confianza incluyen:
http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 10/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

Opiniones de consumidores especialmente los videos ya que es ms difcil falsificarlos) Chatear en Directo al permitir comprobar que el sitio es dirigido por personas que realmente existen) Preguntas y respestuas Donde miembros de la plantilla o usuarios del sitio contestan a las preguntas de algunos usuarios. Esto demuestra que otros usuarios se interesan por el sitio y/o ya compraron un producto. Un nmero de telfono local (adems de un nmero nacional) Los contadores de redes sociales (si destacan) es prueba social de xito Indicar una direccin fsica (y invitar visitas) Listas de clientes y logotipos Los logotipos del pago seguro (SSL) y de las tarjetas de crdito aceptadas en el sitio Polticas de privacidad trasparentes Logotipos de associaciones de tu nicho Tus cuentas en las redes sociales: requieren t actividad en las redes sociales Otros recursos recomendados: 39 Factors: Website Credibility Checklist de Peep Laja
http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 11/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

The Road to Influence. Be Liked. Be Trusted. de Chris Gilchrist The Trust Threshold de Iain Bartholomew The lesson of the year: Never stop building trust de Wil Reynolds

8 Migas de pan

Las migas de pan constituyen un elemento muy importante para la usabilidad de t sitio porque permiten al usuario saber dnde est. Tambin indican a menudo todo el camino que ha seguido el usuario para llegar a una pgina y le dan la posibilidad de volver fcilmente a una categora superior (sin tener en cuenta la pgina en la que se encuentra). Las migas de pan tambin sirven para el posicionamiento web porque permiten a los buscadores entender la estructura del sitio web ms fcilmente. El uso de marca microdata permite que las migas de pan aparezcan en las pginas de resultados de los buscadores: en vez de mostrar una URL algo fea, muestra t nombre de dominio y el enlace de las migas de pan. Adems, son otra seal de confianza que puede ayudarte a
http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 12/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

incrementar la tasa de clics! (CTR) Otros recursos recomendados: 12 Effective Guidelines for Breadcrumb Usability & SEO de Justin Mifsud Everything About Breadcrumbs & SEO de Ann Smarty Ver seccin 4 Markup: Migas de pan

9 Videos

Los videos son buenas herramientas que pueden ser utilizadas en las pginas de productos porque permiten presentar las caractersticas y los beneficios de un producto de manera mucho ms eficaz que el texto o las imgenes. Numerosas empresas registran un aumento importante de la tasa de conversin despus de haber incorporado los videos de productos. El contenido de los videos tambin incrementa la riqueza de la pgina y mejora as la experiencia de usuario y aparece como una seal de confianza adicional. Las opiniones en video de los clientes constituyen un medio muy inteligente de
http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 13/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

combinar el contenido video generado por los usuarios con una seal de confianza fuertsima (en particular cuando ellos ensean el producto). Adems, puedes transcribir t videos por un precio muy barato utilizando servicios como Speechpad, que te facilitan un contenido textual nico, natural y muy pertinente sin que necesites producirlo por t-mismo. Si organizas correctamente t alojamiento video y si utilizas el marcado apropiado, puedes obtener rich snippets (fragmentos enriquecidos) en las pginas de los SERPs, lo que mejora la tasa de clics(CTR) y te permite pillar clics de sitios web que esten posicionados por encima de ti. Otros recursos recomendados: Using Video SEO to Steal Clicks, Localize Results and Increase Conversion Rate de John-Henry Scherck Distilled Guide to Online Video Marketing de Phil Nottingham How to Use Video to Increase Conversions de Peep Laja Ver seccin 3 Posicionamiento interno: Alojamiento de videos & Mapa del sitio Ver seccin 4 Markup: Esquema video & Mapa del sitio

10 Pie de pgina
http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 14/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

Formando parte de tu plantilla en todo el sitio web, los usuarios estan habituados de gozar de cierta informacion en t pie de pgina tales como enlaces haca las pginas de la empresa (por ejemplo Concenos o Contctanos), enlaces hacia otras pginas (por ejemplo el blog), la poltica de privacidad y los enlaces de las cuentas en las redes sociales. Algunos opinan que los usuarios que visitan hasta abajo del todo en el pie de pgina estn muy implicados por eso puedes optimizar t pie de pgina con llamadas a la accin adicionales como el formulario de registro para una newsletter. Tambin puedes recompensar la curiosidad de tus usuarios y hacer tus pginas ms interesantes gracias a un diseo del pie de pgina nico, sorprendente o humorstico. Otros recursos recomendados: Most Creative Footer Designs for Inspiration de Aidan Huang 50 Excellent Blog Footer Designs de Hongkiat Lim 200 Best Footer Designs for Inspiration de Web Design Shock
http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 15/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

Seccin siguiente: 02 / Llamadas a la accin

Comments
posicionamiento de pginas web says: October 9, 2013 at 5:02 am

Enlaces web SEO para mejorar el posicionamiento de pginas web puede encontrar en PosicionamientodeUnaWeb.com desde 49,90. Reply

Leave a comment
Name * Email * Website

six +

=9

Post Comment

Notify me of follow-up comments via e-mail

http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/ 16/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

What Our Clients Say

James Agate Managing Director Skyrocket SEO Chris and his team are patient, responsive and have a sense of humour even when I asked them to change something that I'd insisted upon initially. Would definitely recommend to anyone looking for an awesome WordPress development and design team. Richard Sedley Director Seren Hit Reach were really easy to deal with and provide exemplary service. They implemented exactly what we wanted and guided us when we were uncertain about the solution. A highly professional and cost effective solution what's not to love. Roger Green Director

Best4tyres.com Hit Reach got it absolutely right. They embraced the challenge and complexity of the site, and exceeded expectation with quick response times and great service.

Recent Blog Posts

The Porn Viewing Habits of Scots

January 8, 2014 by Chris Dyson

Optimise This with Mat Bennett of OKO Digital

December 20, 2013 by Patrick Hathaway

Interview with JohnHenry Scherck from SEO Gadget

November 30, 2013 by Chris Dyson

Pornhub the worlds largest porn site and one of the top 100 most trafficed sites in the world have released data insights on their UK audience. As we

In our latest episode of Optimise This I was joined by Mat Bennett from OKO Digital talking about their recent rebranding

For this Blogvember feature, I had the pleasure of interviewing John-Henry Scherck from SEO
17/19

http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

like
Read more

and the new Google Adsense

Read more

Gadget about free tools, scraping and much more.The answers

Read more

Lets Talk
Want to chat about your project or requirements? If you call now you can talk to me directly: Call +44 (0) 808 22 444 22 and ask for Chris Email: chris.gilchrist@hitreach.co.uk Drop in: Hit Reach, Unit 16c, City Quay, Camperdown St, Dundee, DD1 3JA, United Kingdom

We build high quality, cost effective & SEO friendly websites that you can easily update & manage
Unlike other web design companies who just build you a site, we strive to understand your core challenges first and then our team of web designers work passionately with you to develop tools that help you deliver real business solutions. Learn more about us

http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/

18/19

18/1/2014

Anatoma de la Pgina web Perfecta - Hit Reach

COMPANY
About Us

SERVICES
Website Design Website Reviews

BITS & PIECES

Our Work Clients Testimonials Blog WordPress Plugins Resources Link Club Blogging

WEBSITE
Terms & Conditions Privacy Policy Disclaimer

Copyright 2013 Hit Reach

Connect with us:

Core Values

Meet the Team Search Engine Optimisation Available Positions SEO Training Giving Back Contact Us White Label Agreements

http://www.hitreach.co.uk/perfect-web-page/anatomia-de-la-pagina-web-perfecta/

19/19