Vale la pena crear una imagen visual de cómo desea que se vea su sitio web. Diseñe su sitio web antes de construirlo, esto puede darle una idea de cómo se verán los elementos y lo que necesita. Es un proceso simple que puede realizar desde Illustrator.
Cómo crear un sitio web en Illustrator
Cualquier versión de Illustrator puede ser útil, ya que solo usaremos las herramientas básicas de la aplicación. Antes de comenzar, tenga en cuenta que todo en un sitio web debe estar a un clic de distancia y menos siempre es más.
Configurar documento
Abra la aplicación Illustrator.
Cree un nuevo documento, use el comando de acceso directo Ctrl + N.
Ingrese el nombre del archivo.
Ingrese las dimensiones de la hoja. Estas medidas corresponden a una imagen en un monitor grande.
Ancho 1024 px.
Alto 1479 px. Este valor puede variar según lo que necesite agregar a su sitio web.
Elija la orientación vertical.
Como se trata de un diseño basado en resultados digitales, elija el modo de color RGB.
Organizar las áreas del sitio
En este punto, debes tener claro qué elementos quieres agregar a tu página web. Agregue rectángulos de colores para dividir áreas de una página, como el encabezado, el cuerpo y el pie de página.
Cuando termina, bloquea la capa para que no mueva esos elementos.
Crea una nueva capa para colocar los elementos web.
En cada área, haga una subdivisión para cada contenido. Por ejemplo, un cuadro para marcar el lugar donde va una imagen o rectángulos para marcar el lugar de un texto.
Bloquea esta nueva capa y crea otra para contenido como botones, imágenes y texto.
Agregar pautas
Utilice las pautas como referencia para que cada elemento del lienzo se coloque correctamente. Las imágenes, el texto, el logotipo y los botones deben estar bien estructurados.
Simplemente haga clic en la regla de la mesa de trabajo y arrastre el cursor a un punto de la hoja.
Puede desactivar las guías en cualquier momento presionando Ctrl + punto y coma.
Insertar elementos web
Ahora agregue todos los elementos de su sitio web. Agrega el logo al encabezado con el título o banner. Las imágenes y los gráficos son importantes para darle un acabado real, así como los íconos de las redes sociales.
Agrega el texto a la página teniendo en cuenta el estilo de la fuente que vas a utilizar, así como los botones. A medida que avanza, puede ver más claramente lo que necesita y lo que puede prescindir.
Agregar colores
Finalmente, desbloquee las dos capas anteriores y elimine los bloques grises en cada área del sitio web. Asigne color a cada área, como encabezado, cuerpo y pie de página.
También debe asignar un color a otros elementos como figuras o textos dentro del sitio. Cuando todo esté listo, guarde el documento con la opción Archivo / Guardar para Web, para guardarlo en un formato ligero.
Razones para diseñar un sitio web
En el desarrollo profesional de cualquier sitio web, el proceso de análisis es fundamental para el éxito del proyecto. La idea es poder interpretar gráficamente la apariencia de un sitio y ahorrar muchas horas de programación.
Al diseñar un sitio, puede comprender cómo funciona y si el enfoque inicial cumple con los requisitos para ser una solución viable. Mostrar una imagen gráfica del sitio al cliente antes de comenzar puede ahorrar mucho tiempo en el rediseño.
El diseño inicial le da una idea del comportamiento de la página y el diseño del contenido. Cuanto más se muestre esta imagen inicial, más fácil será de interpretar.