SlideShare uma empresa Scribd logo
1 de 7
Diseño web
Anatomía de una
página de inicio
perfecta
2
El diseño de una página de inicio se divide en tres partes claramente diferenciadas:
ZONA 1
Una primera parte o zona destinada a hablar de la propia marca. Esta primera sección es
la más alta de la home y la primera que ven los usuarios al llegar a nuestra web.
Es esencial que en esta primera parte dejes claro en no más de tres segundos a qué te
dedicas y qué beneficio obtendrá el usuario si finalmente decirte comprar tus productos o
servicios.
Es interesante, y casi obligado, colocar los elementos en la página de inicio en forma de
pirámide invertida, dejando los elementos menos importantes en la parte final de la
página.
¿Qué elementos podemos incluir en esta sección?
3
- Slider: ideal para impactar en un primer vistazo con una fotografía y frase que te
identifique
- Logotipo: para que siempre que vean y naveguen por tu web sepan quién está detrás de
esos servicios
- Menú: para facilitar lo máximo posible al usuario llegar a los distintos servicios y
productos de tu web
- Caja de búsqueda: solamente cuando tengas muchísimos servicios o tengas una tienda
online
- Datos de contacto: siempre muy visibles para que el usuario contacte contigo fácilmente
si es lo que realmente está buscando
- Favicon: una forma de mejorar tu branding y facilitar el acceso a tu web de los usuarios
cuando tengan más de una pestaña abierta en su navegador
4
ZONA 2
Esta sección está destinada a hablar de tus servicios. Es importante añadirlos a la web
para que rápidamente el usuario sepa qué puedes hacer por él sin tener que navegar por
tu sitio mucho tiempo.
Si tienes muchos servicios, para no abrumar en la home, puedes elegir los 3 o 4 más
representativos para la página de inicio o agruparlos entre ellos para que el diseño quede
más ligero.
Por otro lado, colocar aquí los servicios no solamente beneficia a la usabilidad y
experiencia de usuario del posible cliente, sino que contribuye al SEO. Esta sección se
puede optimizar por palabras clave por las que quieras posicionarte, mejorando así los
resultados en Google y pudiendo incluso captar nuevos clientes.
5
ZONA 3
Esta última parte es la más variable dentro de un sitio web. Además, contiene los
elementos menos importantes de la home dada la disposición de pirámide invertida que
hemos utilizado en el diseño. Elementos que se pueden incluir:
• Testimonios: siempre y cuando sean de clientes reales y de valor
• Logotipos de clientes: si consideras que son clientes importantes añadirán prestigio tu
marca
• Redes sociales: enlazar siempre y cuando los perfiles sean profesionales. Si están vacíos
y sin contenido es mejor no indicarlo
• Últimos artículos del blog: del mismo modo que con las redes sociales, si tenemos el
blog completamente desactualizado es mejor no enlazar a ningún artículo
• Mapa y contacto: si tu negocio reside principalmente en un sitio físico sitúalo en un
mapa para que te localicen fácilmente. Si no, añade tus datos de contacto bien visibles e
incluso un formulario para facilitar que se pongan en contacto contigo.
6
¿Dudas o preguntas?
Te recomiendo que leas el artículo completo en
“Diseño web: anatomía de una página de inicio”.
7

Mais conteúdo relacionado

Último

PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docxPLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
Leo Florez
 
secuencias de los figuras de cuadros y rectangulos
secuencias de los figuras de cuadros y rectangulossecuencias de los figuras de cuadros y rectangulos
secuencias de los figuras de cuadros y rectangulos
RosarioLloglla
 
PLANTILLA UNAD JJAJJJJJWRBJHGURGERRTERTRTRY
PLANTILLA UNAD JJAJJJJJWRBJHGURGERRTERTRTRYPLANTILLA UNAD JJAJJJJJWRBJHGURGERRTERTRTRY
PLANTILLA UNAD JJAJJJJJWRBJHGURGERRTERTRTRY
karendaza9506
 
Sofia Ospina Architecture and Design Portfolio
Sofia Ospina Architecture and Design PortfolioSofia Ospina Architecture and Design Portfolio
Sofia Ospina Architecture and Design Portfolio
sofiospina94
 
GRUPO 1.pptx problemas oportunidades objetivos
GRUPO 1.pptx problemas oportunidades objetivosGRUPO 1.pptx problemas oportunidades objetivos
GRUPO 1.pptx problemas oportunidades objetivos
CristianGmez22034
 
ATENCION INTEGRAL DEL ADULTO Y ADULTO MAYOR.pptx
ATENCION INTEGRAL DEL ADULTO Y ADULTO MAYOR.pptxATENCION INTEGRAL DEL ADULTO Y ADULTO MAYOR.pptx
ATENCION INTEGRAL DEL ADULTO Y ADULTO MAYOR.pptx
EdisonCondesoDelgado1
 

Último (20)

Afiche de arquitectura manierista Paola Perez
Afiche de arquitectura manierista Paola PerezAfiche de arquitectura manierista Paola Perez
Afiche de arquitectura manierista Paola Perez
 
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdfINICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
 
Apuntes de criterios estrcuturales, calculo de trabes y contratrabes de concr...
Apuntes de criterios estrcuturales, calculo de trabes y contratrabes de concr...Apuntes de criterios estrcuturales, calculo de trabes y contratrabes de concr...
Apuntes de criterios estrcuturales, calculo de trabes y contratrabes de concr...
 
Torre agbar analisis arquitectonico.....
Torre agbar analisis arquitectonico.....Torre agbar analisis arquitectonico.....
Torre agbar analisis arquitectonico.....
 
Slaimen Barakat - SLIDESHARE TAREA 3.pdf
Slaimen Barakat - SLIDESHARE TAREA 3.pdfSlaimen Barakat - SLIDESHARE TAREA 3.pdf
Slaimen Barakat - SLIDESHARE TAREA 3.pdf
 
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docxPLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
PLAN DE MANTENIMIENTO DE SISTEMAS DE AGUA CHONTAYOC.docx
 
Anexo Nivel 3 Ficha Lectura pptjsbdkks
Anexo  Nivel 3 Ficha  Lectura pptjsbdkksAnexo  Nivel 3 Ficha  Lectura pptjsbdkks
Anexo Nivel 3 Ficha Lectura pptjsbdkks
 
Portafolio Santiago Agudelo Duran 2024 -30
Portafolio Santiago Agudelo Duran 2024 -30Portafolio Santiago Agudelo Duran 2024 -30
Portafolio Santiago Agudelo Duran 2024 -30
 
POESÍA ERÓTICA DEL SIGLO XVIII - SERIA Y CARNAL
POESÍA ERÓTICA DEL SIGLO XVIII - SERIA Y CARNALPOESÍA ERÓTICA DEL SIGLO XVIII - SERIA Y CARNAL
POESÍA ERÓTICA DEL SIGLO XVIII - SERIA Y CARNAL
 
cabildo abierto forma de participación ciudadana
cabildo abierto forma de participación ciudadanacabildo abierto forma de participación ciudadana
cabildo abierto forma de participación ciudadana
 
GROPUIS Y WRIGHT DIPOSITIVA ARQUITECTURA DISEÑO MODERNIDAD
GROPUIS Y WRIGHT DIPOSITIVA ARQUITECTURA DISEÑO MODERNIDADGROPUIS Y WRIGHT DIPOSITIVA ARQUITECTURA DISEÑO MODERNIDAD
GROPUIS Y WRIGHT DIPOSITIVA ARQUITECTURA DISEÑO MODERNIDAD
 
secuencias de los figuras de cuadros y rectangulos
secuencias de los figuras de cuadros y rectangulossecuencias de los figuras de cuadros y rectangulos
secuencias de los figuras de cuadros y rectangulos
 
Fundamentos de la Ergonomía y sus características principales
Fundamentos de la Ergonomía y sus características principalesFundamentos de la Ergonomía y sus características principales
Fundamentos de la Ergonomía y sus características principales
 
CATALOGO 2024 DIA DE LA MADRE, presentación.pdf
CATALOGO 2024 DIA DE LA MADRE, presentación.pdfCATALOGO 2024 DIA DE LA MADRE, presentación.pdf
CATALOGO 2024 DIA DE LA MADRE, presentación.pdf
 
PLANTILLA UNAD JJAJJJJJWRBJHGURGERRTERTRTRY
PLANTILLA UNAD JJAJJJJJWRBJHGURGERRTERTRTRYPLANTILLA UNAD JJAJJJJJWRBJHGURGERRTERTRTRY
PLANTILLA UNAD JJAJJJJJWRBJHGURGERRTERTRTRY
 
Sofia Ospina Architecture and Design Portfolio
Sofia Ospina Architecture and Design PortfolioSofia Ospina Architecture and Design Portfolio
Sofia Ospina Architecture and Design Portfolio
 
Planificación del mes de afrovenezolanidad2024.doc
Planificación del mes de afrovenezolanidad2024.docPlanificación del mes de afrovenezolanidad2024.doc
Planificación del mes de afrovenezolanidad2024.doc
 
DIAGNOSTICO URBANO DE DE LA ISLA DE COCHE
DIAGNOSTICO URBANO DE DE LA ISLA DE COCHEDIAGNOSTICO URBANO DE DE LA ISLA DE COCHE
DIAGNOSTICO URBANO DE DE LA ISLA DE COCHE
 
GRUPO 1.pptx problemas oportunidades objetivos
GRUPO 1.pptx problemas oportunidades objetivosGRUPO 1.pptx problemas oportunidades objetivos
GRUPO 1.pptx problemas oportunidades objetivos
 
ATENCION INTEGRAL DEL ADULTO Y ADULTO MAYOR.pptx
ATENCION INTEGRAL DEL ADULTO Y ADULTO MAYOR.pptxATENCION INTEGRAL DEL ADULTO Y ADULTO MAYOR.pptx
ATENCION INTEGRAL DEL ADULTO Y ADULTO MAYOR.pptx
 

Destaque

How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
ThinkNow
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Kurio // The Social Media Age(ncy)
 

Destaque (20)

How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
 
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdfAI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
 
Skeleton Culture Code
Skeleton Culture CodeSkeleton Culture Code
Skeleton Culture Code
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
 
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work
 
ChatGPT webinar slides
ChatGPT webinar slidesChatGPT webinar slides
ChatGPT webinar slides
 

Diseño web: anatomía de una página de inicio perfecta

  • 1. Diseño web Anatomía de una página de inicio perfecta
  • 2. 2 El diseño de una página de inicio se divide en tres partes claramente diferenciadas: ZONA 1 Una primera parte o zona destinada a hablar de la propia marca. Esta primera sección es la más alta de la home y la primera que ven los usuarios al llegar a nuestra web. Es esencial que en esta primera parte dejes claro en no más de tres segundos a qué te dedicas y qué beneficio obtendrá el usuario si finalmente decirte comprar tus productos o servicios. Es interesante, y casi obligado, colocar los elementos en la página de inicio en forma de pirámide invertida, dejando los elementos menos importantes en la parte final de la página. ¿Qué elementos podemos incluir en esta sección?
  • 3. 3 - Slider: ideal para impactar en un primer vistazo con una fotografía y frase que te identifique - Logotipo: para que siempre que vean y naveguen por tu web sepan quién está detrás de esos servicios - Menú: para facilitar lo máximo posible al usuario llegar a los distintos servicios y productos de tu web - Caja de búsqueda: solamente cuando tengas muchísimos servicios o tengas una tienda online - Datos de contacto: siempre muy visibles para que el usuario contacte contigo fácilmente si es lo que realmente está buscando - Favicon: una forma de mejorar tu branding y facilitar el acceso a tu web de los usuarios cuando tengan más de una pestaña abierta en su navegador
  • 4. 4 ZONA 2 Esta sección está destinada a hablar de tus servicios. Es importante añadirlos a la web para que rápidamente el usuario sepa qué puedes hacer por él sin tener que navegar por tu sitio mucho tiempo. Si tienes muchos servicios, para no abrumar en la home, puedes elegir los 3 o 4 más representativos para la página de inicio o agruparlos entre ellos para que el diseño quede más ligero. Por otro lado, colocar aquí los servicios no solamente beneficia a la usabilidad y experiencia de usuario del posible cliente, sino que contribuye al SEO. Esta sección se puede optimizar por palabras clave por las que quieras posicionarte, mejorando así los resultados en Google y pudiendo incluso captar nuevos clientes.
  • 5. 5 ZONA 3 Esta última parte es la más variable dentro de un sitio web. Además, contiene los elementos menos importantes de la home dada la disposición de pirámide invertida que hemos utilizado en el diseño. Elementos que se pueden incluir: • Testimonios: siempre y cuando sean de clientes reales y de valor • Logotipos de clientes: si consideras que son clientes importantes añadirán prestigio tu marca • Redes sociales: enlazar siempre y cuando los perfiles sean profesionales. Si están vacíos y sin contenido es mejor no indicarlo • Últimos artículos del blog: del mismo modo que con las redes sociales, si tenemos el blog completamente desactualizado es mejor no enlazar a ningún artículo • Mapa y contacto: si tu negocio reside principalmente en un sitio físico sitúalo en un mapa para que te localicen fácilmente. Si no, añade tus datos de contacto bien visibles e incluso un formulario para facilitar que se pongan en contacto contigo.
  • 6. 6 ¿Dudas o preguntas? Te recomiendo que leas el artículo completo en “Diseño web: anatomía de una página de inicio”.
  • 7. 7