Este wikiHow te enseñará cómo diseñar un sitio web que parezca profesional y funcione bien. Si bien la mayor parte del diseño de su sitio web depende en última instancia de usted, hay algunas cosas críticas que debe hacer, y evitar, al crear un sitio web.
Pasos
Parte 1 de 2: Cómo diseñar su sitio web
Paso 1. Determine si desea utilizar un creador de sitios web
Los sitios web creados desde cero requieren una comprensión bastante detallada de la codificación HTML, pero puede crear fácilmente un sitio web utilizando un servicio de alojamiento gratuito como Weebly, Wix, WordPress o Google Sites. Los creadores de sitios web tienden a ser mucho más fáciles de usar para los diseñadores principiantes que HTML.
- Si decide codificar su propio sitio web, deberá aprender a codificar tanto HTML como CSS.
- Si invertir tiempo y energía para crear su sitio web no le parece atractivo, también puede contratar a un diseñador de sitios web para que lo cree por usted. Los diseñadores independientes pueden costar entre $ 30 la hora y más de $ 100 por hora.
Paso 2. Trace un mapa de su sitio
Antes incluso de abrir un creador de sitios web, debe saber aproximadamente cuántas páginas desea que tenga su sitio web, cuál debe ser el contenido de cada una de esas páginas y el diseño general de las páginas importantes, como la página de inicio y el "Acerca de". página.
Las páginas de su sitio web pueden ser más fáciles de visualizar si dibuja imágenes aproximadas de cada una de ellas en lugar de simplemente determinar qué contenido debe aparecer
Paso 3. Utilice un diseño intuitivo
Si bien hay algo que decir a favor de las nuevas ideas, el diseño básico de su sitio web debe seguir pautas establecidas como las siguientes:
- Las opciones de navegación (por ejemplo, pestañas para diferentes páginas) deben ir en la parte superior de la página.
- Si usa un ícono de menú (☰), debe estar en la esquina superior izquierda de la página.
- Si usa una barra de búsqueda, debe estar cerca de la parte superior derecha de la página.
- Los enlaces útiles (por ejemplo, enlaces a la página "Acerca de" o la página "Contáctenos") deben ir al final de cada página.
Paso 4. Sea consistente
Independientemente de la fuente de texto, la paleta de colores, el tema de la imagen y las opciones de diseño que elija, asegúrese de utilizar la misma decisión en todo su sitio web. Puede ser increíblemente discordante ver una fuente o esquema de color usado para la página "Acerca de" cuando se usó uno completamente diferente para la página de inicio.
- Por ejemplo, si utiliza exclusivamente colores de tonos fríos para la página de inicio de su sitio, no implemente colores brillantes y fuertes en la página siguiente.
- Tenga en cuenta que el uso de colores fuertes o contradictorios, especialmente cuando los colores se muestran de forma dinámica (por ejemplo, en movimiento), puede evocar epilepsia en una pequeña cantidad de usuarios de la web. Si decide utilizar estos colores en su sitio, asegúrese de agregar una advertencia de epilepsia antes de las páginas relevantes.
Paso 5. Agregue opciones de navegación
Colocar enlaces directos a páginas importantes en su sitio web en la parte superior de la página de inicio ayudará a dirigir a los visitantes nuevos al contenido que importa. La mayoría de los creadores de sitios agregan estos enlaces de forma predeterminada.
Es importante asegurarse de que se pueda acceder a todas las páginas de su sitio web haciendo clic en las opciones de su sitio web en lugar de que solo se pueda acceder a ellas a través de la dirección de la página
Paso 6. Utilice colores que se complementen
Como cualquier otro tipo de diseño, el diseño de sitios web se basa en combinaciones de colores agradables a la vista; por ello, es fundamental elegir colores temáticos que vayan juntos.
Negro, blanco y gris es una buena combinación si no sabe por dónde empezar
Paso 7. Considere la posibilidad de utilizar un diseño minimalista
El minimalismo fomenta los colores de tonos fríos, los gráficos simples, las páginas de texto en blanco y negro y la menor cantidad de adornos posible. Debido a que el minimalismo requiere pocos elementos sofisticados, es una manera fácil de hacer que su sitio web se vea profesional y atractivo sin requerir mucho trabajo.
- Muchos creadores de sitios web tendrán un tema "minimalista" que puede seleccionar al configurar su sitio web.
- Una alternativa al minimalismo es el "brutalismo", que utiliza líneas más duras, colores brillantes, texto en negrita e imágenes mínimas. El brutalismo tiene menos seguidores que el minimalismo, pero dependiendo del contenido de su sitio web, puede que se adapte mejor a sus necesidades de diseño.
Paso 8. Tome decisiones únicas
Las líneas rectas y los elementos web bloqueados en cuadrículas son apuestas seguras, pero tomar algunas decisiones de estilo únicas le dará personalidad a su sitio y ayudará a que su sitio se destaque.
- No tenga miedo de oponerse a las tendencias colocando los elementos del sitio web de forma asimétrica o utilizando elementos superpuestos para crear una apariencia en capas.
- Mientras que las esquinas elegantes y afiladas y los elementos cuadrados (también conocidos como presentación "basada en tarjetas") son menos favorables que los elementos redondeados y suaves.
Parte 2 de 2: Cómo maximizar el rendimiento del sitio web
Paso 1. Aproveche las opciones de optimización móvil
Los navegadores móviles representan más tráfico web que los navegadores de escritorio, lo que significa que la cantidad de atención que prestas a la versión móvil de tu sitio web debe ser al menos igual al desarrollo de tu sitio web de escritorio. La mayoría de los servicios de creación de sitios web crean automáticamente una versión móvil de su sitio, pero querrá tener en cuenta la siguiente información para su sitio móvil:
- Asegúrese de que los botones (por ejemplo, enlaces a sitios) sean grandes y fáciles de tocar.
- Evite implementar funciones que no se pueden ver en dispositivos móviles (por ejemplo, Flash, Java, etc.).
- Considere la posibilidad de crear una aplicación móvil para su sitio web.
Paso 2. Evite usar demasiadas fotos por página
Tanto los navegadores de escritorio como los móviles pueden tener dificultades para cargar páginas que muestran una gran cantidad de fotos o videos. Si bien las imágenes son importantes en el diseño web, usar más de unas pocas por página puede causar tiempos de carga innecesariamente largos, lo que evitará que las personas visiten las páginas en cuestión.
En términos generales, desea que las páginas de su sitio web se carguen en menos de cuatro segundos
Paso 3. Agregue una página de "Contacto"
Notará que prácticamente todos los sitios web establecidos tienen una página de "Contáctenos" que tiene información de contacto (por ejemplo, un número de teléfono y una dirección de correo electrónico); algunos sitios incluso tienen un formulario de preguntas incorporado en esta página. Agregar una página de "Contacto" brindará a los visitantes del sitio web una línea de comunicación directa con usted, agregando así una solución a las posibles frustraciones.
Paso 4. Cree una página 404 personalizada
Cuando alguien visita una página específica en su sitio web que no se ha configurado o no existe, se mostrará una página web con "Error 404". La mayoría de los navegadores tienen una página 404 predeterminada, pero es posible que pueda personalizar la suya desde la configuración del creador de su sitio web; Si es así, asegúrese de incluir los siguientes detalles:
- Un mensaje de error alegre (p. Ej., "¡Felicitaciones, ha encontrado nuestra página de error!")
- Un enlace a la página de inicio del sitio.
- Una lista de enlaces vistos comúnmente
- Una imagen o logotipo para su sitio web
Paso 5. Utilice una barra de búsqueda si es posible
Si el método de creación de su sitio web permite agregar una barra de búsqueda a su sitio web, se recomienda encarecidamente que lo haga. Esto garantizará que los usuarios puedan navegar rápidamente a una página o elemento específico sin tener que hacer clic en las opciones de navegación.
Las barras de búsqueda también son útiles cuando su audiencia quiere buscar un término general sin usar prueba y error
Paso 6. Invierta la mayor cantidad de tiempo en su página de inicio
Cuando alguien llega a la página de inicio de su sitio web, debe conocer la esencia del tema de su sitio web de inmediato; Además de esto, todos los elementos de la página de inicio deberían cargarse rápidamente, incluidas las opciones de navegación y las imágenes. Tu página de inicio debe tener los siguientes aspectos:
- Una llamada a la acción (p. Ej., Un botón para hacer clic o un formulario para completar)
- Una barra de herramientas de navegación o un menú
- Un gráfico atractivo (por ejemplo, una foto sólida, un video o un pequeño grupo de fotos con texto adjunto)
- Palabras clave relacionadas con el servicio, el tema o el enfoque de su sitio web
Paso 7. Pruebe su sitio web en múltiples navegadores en múltiples plataformas
Esto es increíblemente importante, ya que diferentes navegadores pueden manejar aspectos de su sitio web de manera diferente. Antes de comenzar a promocionar su sitio web, intente visitar y utilizar su sitio web en los siguientes navegadores en las plataformas Windows, Mac, iPhone y Android:
- Google Chrome
- Firefox
- Safari (solo iPhone y Mac)
- Microsoft Edge e Internet Explorer (solo Windows)
- El navegador integrado en varios teléfonos Android diferentes (por ejemplo, Samsung Galaxy, Google Nexus, etc.)
Paso 8. Continúe actualizando su sitio web a medida que envejece
Las tendencias de diseño, los enlaces, las fotos, los conceptos y las palabras clave cambian a medida que pasa el tiempo, por lo que tendrá que seguir realizando cambios en su sitio web para mantenerse actualizado. Esto requerirá que verifique el rendimiento de su sitio web junto con otros sitios web similares al menos una vez cada tres meses (preferiblemente con más frecuencia).
Ayuda HTML básica
Ejemplo de página web con HTML
Apoyar wikiHow y desbloquear todas las muestras.
Hoja de referencia HTML
Apoyar wikiHow y desbloquear todas las muestras.
Ejemplo de página web simple
Apoyar wikiHow y desbloquear todas las muestras.
Consejos
- La accesibilidad del sitio web es otro aspecto importante del desarrollo de un sitio web. Esto incluye cosas como subtítulos para audiencias con problemas de audición, descripciones de audio para visitantes ciegos y advertencias de fotosensibilidad si su sitio web utiliza efectos potencialmente inductores de convulsiones.
- La mayoría de los creadores de sitios web tienen un conjunto de plantillas que puede utilizar para cimentar el diseño y el diseño de su sitio antes de agregar sus elementos preferidos.
Advertencias
- La mayoría de los creadores de sitios son gratuitos; sin embargo, si desea utilizar su propio dominio (por ejemplo, "www.yourname.com" en lugar de "www.yourname.wordpress.com"), tendrá que pagar una tarifa mensual o anual.
- Evite el plagio y respete todas las leyes de derechos de autor: no agregue imágenes aleatorias de la Web, ni siquiera elementos estructurales, sin permiso.
