Fundamentos de diseño
Para diseñar su sitio web de todas las formas posibles, abra Diseño avanzado. Puede editar el diseño y la distribución en modo WYSIWYG. Los cambios se mostrarán de inmediato.El área de trabajo del explorador está dividida en dos. En la parte superior, puede ver la barra multifunción. Muestra las funciones disponibles. Para obtener más información, véase Barra multifunción y contenido.En la parte inferior, puede ver la vista previa de página. Aquí puede editar el diseño y la distribución directamente. La vista previa de página le muestra la página web actual con el diseño y la distribución especificados por el estilo seleccionado; véase Estilos propios.El sitio web se divide en las siguientes áreas funcionales; véase la Figura 8.
Figura 8: Estructura del sitio web
Área 1: Encabezado Área 2: Parte superior Área 3: Izquierda Área 4: Área de contenido Área 5: Derecha Área 6: Parte inferior Área 7: Pie
Además, está el área de trabajo alrededor del explorador en que se muestra el sitio web. Véase Vista de página en el explorador.Si desea editar una área, haga clic con el ratón en el punto correspondiente. Al hacerlo, se activa el área en cuestión. Se resalta mediante un borde y la barra multifunción muestra las funciones que se pueden llevar a cabo en el área.En lo que se refiere a las opciones de edición y configuración, las áreas del sitio se pueden clasificar en áreas verticales y horizontales, así como el área de contenido:
Al combinarse, los parámetros de las distintas áreas crean el diseño completo. Algunos parámetros se influyen entre ellos o son interdependientes. Estos efectos secundarios deben tenerse en cuenta. La información siguiente puede resultar útil:
- En las áreas, las imágenes de fondo tienen prioridad sobre los colores de fondo. Esto significa que si carga una imagen de fondo y define también un color de fondo, la imagen de fondo cubrirá el color.
- Todos los tamaños y dimensiones de los ejemplos se muestran en píxeles (px). También puede utilizar cualquier otro tamaño que se pueda emplear en hojas de estilo, como por ejemplo porcentajes (%). Para obtener más información sobre las posibles opciones y cómo utilizarlas, consulte la bibliografía especializada o los sitios web correspondientes, como http://www.selfhtml.org (sólo parcialmente en inglés).
- Pruebe las diferentes opciones. Recuerde que puede utilizar la función Deshacer en cualquier momento para restaurar el estado inicial. También puede hacer una copia del estilo actual y probar las distintas opciones en la copia. Puede hacerlo en la tabla de sus propios estilos mediante la función Crear copia de seguridad. Para obtener más información al respecto, véase Estilos propios. Una vez que haya creado allí el diseño deseado, active el estilo para sus clientes.
Notas sobre las imágenes de fondoSe cargan plantillas coincidentes para las imágenes de fondo en cada plantilla de diseño. Puede sustituirlas por sus propias imágenes. Si elimina sus propias imágenes, la plantilla se volverá a cargar automáticamente. Si no desea utilizar ninguna imagen de fondo, debe eliminar también la imagen de la plantilla. Para ello, haga clic en el enlace Quitar plantilla. Una vez eliminada la plantilla, el nombre de este enlace cambiará a Restaurar plantilla. Haga clic en este enlace para restaurar la plantilla predeterminada para la imagen de fondo sin tener que buscar nombres de archivo.Nota: Si define tanto un color de fondo como una imagen de fondo, la imagen de fondo estará siempre encima del color de fondo. Por consiguiente, si desea mostrar el color, debe eliminar la imagen de fondo. Si desea que el fondo se rellene completamente, debe cambiar el tamaño de la imagen para adaptarla al área, o puede activar Imagen en mosaico.Imagen en mosaicoLas imágenes de fondo se pueden mostrar como una sola imagen o repetidamente hasta llenar todo el fondo de la página. Así, se disponen copias de la imagen de lado a lado y de arriba abajo hasta llenar toda la página.