Diseño de páginas web

Get Started. It's Free
or sign up with your email address
Rocket clouds
Diseño de páginas web by Mind Map: Diseño de páginas web

1. Accesibilidad e intercambio de información

1.1. 1.1 Consorcio para la web (W3C)

1.1.1. El W3C es una asociación internacional que se fundó en 1994 con la intención de proponer pautas y protocolos comunes para todos los usuarios que permitieran obtener el máximo potencial y favorecer la evolución de la World Wide Web.

1.2. 1.2 Iniciativa para la accesibilidad (WAI)

1.2.1. La WAI es un área de trabajo incluida en el consorcio W3C cuyo objetivo es promover y garantizar el acceso a la web de cualquier persona, con independencia del tipo de hardware o software que posea, de su idioma su cultura, su localización geográfica o la infraestructura de red existente.

1.2.2. Su objetivo es conseguir que la web sea más accesible para todos los usuarios y que esta accesibilidad no dependa de sus circunstancias personales ni de los dispositivos que posean para el acceso a la información.

1.3. 1.3 Pautas de accesibilidad (WCAG)

1.3.1. Pretenden orientar en la generación de páginas web para que se eliminen las barreras en el acceso a la información.

1.3.2. Estas pautas van dirigidas a desarrolladores de herramientas de autor para la web y de contenidos web, y proporcionan soluciones para aquellos casos en los que el diseño de la página pueda producir problemas de acceso a la información.

1.3.3. Las pautas de accesibilidad se publican periódicamente y están en constante revisión y adecuación a los nuevos tiempos, por lo que con frecuencia aparecen nuevas versiones de las mismas.

1.4. 1.4 Intercambio de información

1.4.1. Cuando varias personas intercambian información, han de asegurarse de que el formato que utilizan es compatible con sus programas; en caso contrario, no podrán acceder a ella.

1.4.2. La mejor opción para el intercambio de información es utilizar alguno de los considerados formatos estándar, ya que, de este modo, se garantiza que cualquier usuario tenga acceso.

1.5. 1.5 Tipos de formato

1.5.1. Formato cerrado o propietario. La especificación de estos formatos no está publicada y, por tanto, solo la pueden utilizar las aplicaciones de su propiedad.

1.5.2. Formato publicado. Su especificación pertenece a empresas, pero su código sí está publicado y, por tanto, puede ser utilizado por aplicaciones de otras empresas.

1.5.3. Formato abierto. La especificación de estos formatos está publicada en su totalidad.

2. Páginas web

2.1. 2.1 ¿Qué es una página web?

2.1.1. Documentos que conforman la World Wide Web, el servicio más conocido y utilizado en internet. Se trata de documentos hipertexto.

2.2. 2.2 ¿Qué es un sitio web?

2.2.1. Conjunto de páginas web pertenecientes a una persona, empresa o entidad. Dicho sitio está constituido por los documentos HTML correspondientes a las páginas web y por todos los recursos que se hayan utilizado en ellas. Es necesario crear carpetas para organizarlo.

2.3. 2.3 Tipos de páginas web

2.3.1. Páginas web estáticas

2.3.1.1. Son documentos HTML que muestran información.

2.3.2. Páginas web animadas

2.3.2.1. Las página web estáticas se pueden animar incluyendo scripts o applets, que son pequeños programas escritos en un lenguaje de programación compatible con HTML y, por lo tanto, interpretables por los navegadores web.

2.3.3. Páginas web dinámicas

2.3.3.1. Ofrecen al usuario la posibilidad de interactuar con la página e incluso de modificar o introducir información.

2.3.4. Páginas web de contenidos

2.3.4.1. Proporcionan una plataforma en la que los usuarios pueden participar activamente en la elaboración de la información mostrada.

3. Editores de páginas web

3.1. 3.1 Editores de texto

3.1.1. Las páginas web son, en realidad, documentos de texto que contienen multitud de etiquetas HTML, necesarias para especificar las características y el contenido de las mismas. Lógicamente, es necesario conocer el lenguaje HTML y tener nociones de programación para diseñar y crear páginas web.

3.2. 3.2 Editores visuales

3.2.1. Permiten crear páginas web sin tener conocimientos de HTML.

3.2.2. Este tipo de editores permiten que el usuario pueda ver, en todo momento, el documento con el aspecto que tendrá cuando se visualice con un navegador web.

3.3. 3.3 Herramientas de la web 2.0

3.3.1. También se pueden crear documentos HTML utilizando herramientas de la web 2.0 disponibles en distintos servidores de Internet o aplicaciones específicas en línea.

3.4. 3.4 Editores online

3.4.1. Su gran ventaja es que se pueden crear páginas web sin necesidad de utilizar ninguna aplicación específica. El único requisito indispensable es disponer de un navegador web para acceder a Internet.

3.4.2. Suelen permitir crear un sitio web y publicar directamente en Internet las páginas creadas.

3.5. 3.5 Gestores de contenidos

3.5.1. Plataforma que permite crear una estructura de soporte para que distintos usuarios puedan crear, publicar y administrar información con un diseño común.

4. Crear páginas web con HompoZer

4.1. 4.1 Crear y administrar un sitio web local

4.1.1. Antes de iniciar la creación de una página web, se debe crear una carpeta en el disco duro del ordenador que actuará como sitio web local. Posteriormente, hay que configurar KompoZer para que pueda administrar el sitio local.

4.2. 4.2 Crear una página web

4.2.1. 1- Abrir el menú "Archivo" y seleccionar la opción "Nuevo"

4.2.2. 2- Activar las opciones que se deseen.

4.2.3. Hacer clic en el botón "Crear"

4.3. 4.3 Escribir texto en una página web

4.3.1. 1- Modificar el formato de los caracteres

4.3.2. 2- Escribir una lista

4.3.3. 3- Modificar el formato de los párrafos

5. Trabajar con páginas web

5.1. 5.1 Cambiar los colores de una página

5.1.1. 1- Abrir el menú "Formato" y seleccionar "Colores y fondo de la página"

5.1.2. 2- Activar la opción "Usar colores personalizados"

5.1.3. 3- Hacer clic sobre el botón "Fondo" y elegir el color que se quiera de la paleta que aparecerá

5.1.4. 4- Cerrar la paleta de colores y, posteriormente, el cuadro de diálogo haciendo clic sobre el botón "Aceptar"

5.2. 5.2 Guardar una página web

5.2.1. Se debe guardar, preferiblemente con un nombre que no se exceda en más de ocho caracteres

5.3. 5.3 Cambiar las propiedades de una página

5.3.1. Se activa mediante la opción "Título y propiedades de la página" del menú "Formato"

5.4. 5.4 Modos de edición

5.4.1. Se ofrecen varios modos de edición

5.5. 5.5 Comprobar las páginas creadas

5.5.1. Es conveniente abrirlas con uno o varios navegadores para comprobar su compatibilidad y confirmar que su aspecto es el esperado.

5.6. 5.6 Trabajar con varias páginas web

5.6.1. Las páginas web guardadas, siguen estando visibles

6. Tablas en páginas web

6.1. 6.1 Insertar una tabla como estructura de la página web

6.2. 6.2 Insertar una tabla para mostrar datos

6.2.1. Habrá que indicar su tamaño en píxeles

6.3. 6.3 Escribir texto en una tabla

6.3.1. Basta con activar sus distintas celdas e introducir el texto que se quiera en cada una

6.4. 6.4 Modificar la estructura de una tabla

6.4.1. Insertar o eliminar filas y columnas

6.4.2. Unir celdas

6.5. 6.5 Cambiar el aspecto de una tabla

7. Imágenes en páginas web

7.1. 7.1 ¿Qué son los vínculos relativos?

7.1.1. Son todos los elementos que se incluyen en las páginas web, excepto el texto escrito, no se almacenan en el archivo de la misma página, sino que contiene vínculos a cada elemento que indican en qué archivo están los mismos

7.2. 7.2 Insertar una imagen

7.2.1. Aquellas que tienen algún tipo de compresión

7.3. 7.3 Modificar una imagen

7.3.1. Cambiar el tamaño

7.3.2. Distribuir texto alrededor

8. Enlaces en páginas web

8.1. 8.1 Crear un enlace de texto

8.1.1. Cualquier texto que esté escrito en la página web puede ser utilizado como un enlace

8.2. 8.2 Crear un enlace en una imagen

8.3. 8.3 Crear un enlace a una página de Internet

8.3.1. Es muy importante poner la URL de la página web elegida

8.4. 8.4 Crear un enlace a otros tipos de documentos

8.4.1. Los enlaces no solo se utilizan para enlazar documentos HTML, sino que se pueden usar para abrir cualquier otro tipo de documento.

8.5. 8.5 Crear un enlace a un correo electrónico

8.6. 8.6 Crear un enlace a un vídeo

9. Lenguaje HTML en páginas web

9.1. 9.1 Lenguaje HTML

9.1.1. Es el que se utiliza para crear páginas web. Se trata de un conjunto de palabras clave, tags o etiquetas que permiten dar formato al texto y al resto de elementos utilizados en las páginas

9.2. 9.2 Etiquetas HTML

9.2.1. Los documentos creados con lenguaje HTML están constituidos por un conjunto de elementos que pueden tener propiedades diferentes

10. Hojas de estilo en páginas web

10.1. 10.1 Crear una hoja de estilos enlazada

10.2. 10.2 Crear reglas de estilo

10.3. 10.3 Enlazar una hoja de estilos a una página web