1. Páginas web
1.1. ¿Qué es una página web?
1.1.1. Las páginas web son los documentos que conforman la World Wide Web, el servicio más conocido y utilizado de Internet.
1.2. Lenguaje HTML
1.2.1. Las páginas web deben crearse con un lenguaje específico, el lenguaje HTML ya que es el único modo de garantizar que cualquier persona pueda visualizarlas con independencia del navegador web que utilice.
1.2.2. ¿Qué es un sitio web?
1.2.2.1. Tipos de páginas web
1.2.2.1.1. Se pueden clasificar según distintos criterios
1.2.2.2. Un siitio web es un 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: imágenes , vídeos, sonidos, etc...
2. Eitores de páginas web
2.1. Editores de texto
2.1.1. Se deben guardar con el formato HTM o HTM
2.2. Editores visuales
2.2.1. Los edirtores visuales permiten crear páginas web sin tener conocimientos de HTML. El usuario diseña el documento con las herramientas del editor, escribe el texto necesario y agrega otros elementos(imágenes, vídeos, etc... Destacan el KompoZer y el Adobe Dreamweaver
2.3. Herramientas de la web 2.0
2.3.1. Se pueden crear documentos HTML utilizando herramientas de la web 2.0 disponibles en distintos servidores de Internet (blogs, wikis, etc...) Aunque puede haber pequeñas variaciones, el proceso general siempre es el mismo: acceder s un servicio web 2.0 y comenzar el proceso de creació n en el que el usuario elige entre las opciones que se le ofrecn de foirma automática
2.4. Editores online
2.4.1. La gran ventaja de los editores online es que se pueden crear pásginas web sin necesidad de utilizar ningunas aplicación específica.El único requisito indispensable es disponer de un navegador web para acceder a Internet
2.5. Gestores de contenidos
2.5.1. Un sistema de gestión de contenidos es una 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.
3. Crear páginas web con KompoZer
3.1. Crear y administrar un sitio web local
3.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 . Los pasos para crear y administrar el sitio web son:, 1.Crear con el administrador de archivos del sistema operativo, una carpeta con el nombre que se quiera para el sitio web. 2. Iniciar KompoZer y hacer clic en el botón, localizaddo en el Administrador de sitios. 3.Hacer clic en el botón Nuevo Sitio 4.Seleccionar la carpeta creada, cuya ubicación depender´s del sistema operativo en el que se esté trabajando. 5.Comprobar el nombre del sitio y hscer clic en Aceptar. El sitio web creado aparecerá en el panel Administrador de sitios,
3.2. Crear una página web
3.2.1. Cuando se inicia KompoZer, el área dede trabajo presenta una página vacía para coimenzar a trabajar en ella. En el caso de que no existiera la página o se quisiera crear otra página más habría que: 1.Abrir el menú Archivo y seleccionar la opción Nuevo 2.Activar las opciones que se deseen 3.Hacer clic en el botón Crear
3.3. Escribir texto en una página web
3.3.1. Modificar formato caracteres
3.3.1.1. Se pueden realizar modifciaciones en el formato de susb caracteres mediante los botones de la barra de herramientas de formato
3.3.2. Escribir una lista
3.3.2.1. Basta con activar uno de los botones en función de cómo de quiera que aparezca el texto: en forma de lista numerada o con viñetas.
3.3.3. Modificar el formato de los párrafos
3.3.3.1. Modificar el formato en los párrafos son:1.Estilo: se pueden elegir determinados estilos para un párrafo en la lista deplegabl2.Alineación: se puede modificar la alineación predeterminada de los párrafos mediante los botones 3.Sangrado:los botones permiten aumentar y disminuir respectivamente la sangría de los párrafos
4. Trabajar con Páginas web
4.1. Guardar una página web.
4.1.1. Los pasos son: hacer clic en el botón guardar, escribir el texto del título, clic en Aceptar, activar la carpeta de KompoZer , Escribir nombre para el archivo y dar en guardar.
4.2. Cambiar los colores de una página
4.2.1. 1- Abrir el menú Formato y seleccionar Colores y fondo de página 2-Activar la opción Usar Colores Personalizados. 3- Hacer clic en el botón Fondo y elegir el color. 4-Cerrar la paleta de colores y hacer clic en Aceptar.
4.3. Cambiar propiedades de la página.
4.3.1. Se puede especificar en el cuadro de diálogo que se activa mediante la opción Título y propiedades de la página del menú Formato
4.4. Modos de edición
4.4.1. Diseño: permite crear el documento visualizándolo con su resultado final Código Fuente: da la posibilidad de trabajar escribiendo y modificando el código HTML del documento Dividir: el área de trabajo se divide para mostrar el diseño de la página y una parte de su código HTML
4.5. Comprobar las páginas creadas
4.5.1. Basta con activar la ventana correspondiente es importante recordar que se deben guardar las modificaciones en KompoZer mediante el botón guardar y actualizar la página en el navegador mediante el botón retroceso
4.6. Trabajar con varias páginas web
5. Imágenes en páginas web
5.1. ¿Qué son los vínculos relativos?
5.1.1. 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 esta contiene vínculos a cada elemento que indican en qué archivo están los mismos. Para que estos vínculos funcionen, no deben hacer referencia a un archivo localizado en una carpeta de un ordenador
5.2. Insertar una imagen
5.2.1. Los pasos son: . 1. Guardar la página web, aunque no esté finalizada. 2.Situar el cursor en el lugar donde se quiera colocar la imagen. 3. Hacer clic en el botón Imagen. 4. Activar la ficha Ubicación y seleccionar la imagen. 5. Activar la opción La URL es relativa a la. 6. Escribir un texto alternativo. 7. Activar la ficha Dimensiones y especificar el tamaño que debe tener la imagen en el documento. 8. Hacer clic sobre el botón Aceptar
5.3. Cambiar el tamaño
5.4. Distribuir texto alrededor
5.4.1. 1. Pulsar el botón derecho del ratón sobre la imagen y seleccionar la opción Propiedades de la Imagen. 2.Activar la ficha Apariencia. 3. Cambiar los valores de las propiedades que se quiera. 4. Hacer clic en Aceptar.
6. Lenguaje HTML en páginas web
6.1. Lenguaje HTML
6.1.1. El lenguaje HTML 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 a texto y al reto de elementos utilizados en las paginas. En KompoZer es el Código fuente
6.2. Etiquetas HTML
6.2.1. Los documentos creados con un lenguaje HTML están constituidos por un conjunto de elementos que pueden tener propiedades diferentes: tipo de letra, color de la fuente, color de fondo, negrita, ancho, alto...
7. Accesibilidad e intercambio de información
7.1. Iniciativa para la accesibilidad(WAI)
7.1.1. 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.
7.2. Pautas de accesibilidad(WCAG)
7.2.1. Están dirigidas a desarrollarse de herramientas de autor para la web y de contenidos web, y proporcionan soluciones para aquellos casos en los que el diseño puede producir problemas de acceso a la información.
7.3. Intercambio de información
7.3.1. Cuando varias personas intercambian informarse de que el formato que utilizan es compatible con sus programas, en caso contrario no podrán acceder a ellas
7.4. Tipos de formato
7.4.1. Formato cerrado
7.4.1.1. La especificación de estos formatos no está publicada y por tanto pueden ser utilizados por su propiedad. Un ejemplo es DOCX
7.4.2. Formato publicado
7.4.2.1. Su especificación pertenece a empresas, pero su código sí está publicado y puede ser utilizado por aplicaciones de otras empresas. Un ejemplo es RTF
7.4.3. Formato abierto
7.4.3.1. La especificación de estos formatos está publicada en su totalidad y suelen pertenecer a organizaciones sin ánimo de lucro. Un ejemplo es ODF.
7.5. Consorcio para la web(W3C)
7.5.1. Es una asociación internacional que se fundó en 1994 con la ointenció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.
8. Tablas en páginas web
8.1. Insertar una tabla como estructura de la página web
8.1.1. Los pasos son;
8.1.1.1. 1.Hacer clic sobre el botón Tabla. 2. Hacer clic sobre la pestaña PIndicar números de filas y columnas. 4.Hacer clic sobre el botón Aceptar
8.2. Insertar una tabla para mostrar datos
8.2.1. Especificar el número de filas y columnas, indicar su tamaño en píxeles o ajustarlo. También indicar un grosor para sus bordes
8.3. Escribir texto en una tabla
8.3.1. Basta con activar sus distintas celdas e introducir el texto que se quiera en cada una, modificar el formato de los caracteres, la alineación de los párrafos.
8.4. Modificar la estructura de una tabla
8.4.1. Insertar o eliminar filas o columnas
8.4.1.1. Para agregar filas o columnas los pasos son: 1. Situar e cursor en una celda de la tabla 2. Abrir el menú Tabla y seleccionar la opción Insertar. 3. Elegir una de las posibilidades que ofrece el programa para tal efecto: Fila superior, Fila interior, Columna interior...
8.4.1.2. Para eliminar filas o columnas los pasos son: 1.Situar el cursor en la celda. 2. Abrir el menú Tabla y seleccionar la opción Borrar. 3. Elegir alguna de las posibilidades: Fila, Columna, Celda...
8.4.2. Unir celdas
8.4.2.1. Los pasos son:
8.4.2.1.1. 1. Seleccionar las celdas que se quieren unir.
8.4.2.1.2. Abrir el menú Tabla y seleccionar Unir celdas seleccionadas.
8.5. Cambiar el aspecto de una tabla
8.5.1. Los pasos son: 1. Situar el cursor en la tabla para activarla. 2. Abrir el menú Tabla y seleccionar Propiedades de la tabla. 3. Activar las fichas Tabla o Celdas y modificar las propiedades que se quiera en cada una de ellas. 4. Hacer clic sobre el botón Aceptar
9. Enlaces en páginas web
9.1. Crear un enlace de texto
9.1.1. 1. Comprobar que la página web está guardada. 2. Seleccionar el texto que se quiera utilizar como enlace. 3.Hacer clic sobre el botón Enlace. 4. Hacer clic en el botón Archivos para seleccionar y localizar el archivo. 5. Comprobar que la opción URL es relativa a la dirección de la páginas está activa. 6. Hacer clic en el botón Aceptar.
9.2. Crear un enlace en una imagen
9.2.1. 1.Comprobar que la página web está guardada. 2. Hacer clic sobre la imagen para seleccionarla. 3. Hacer clic sobre el botón enlace. 4. Especificar la dirección URL del documento que se quiera enlazar. 5. Comprobar si el documento enlazado es una página del sitio web local. 6. Hacer clic sobre el botón Aceptar.
9.3. Crear un enlace a una página de Internet
9.3.1. Es muy importante escrbir la dirección URL de la página web elegida de forma correcta y compleeta
9.4. Crear un enlace a otros tipos de documentos
9.4.1. Los enlaces no se utilizan solo para enlazar documentos HTML, sino que se pueden usar para abrir cualquier tipo de documento. El formato PDF es uno de los más utilizados en Internet, ya que ofrece a los visitantes documentos con un aspecto invariable y un tamaño reducido.
9.5. Crear un enlace a un correo electrónico
9.5.1. Los enlaces también se pueden utilizar para ofrecer al visitante un modo rápido de enviar un correo electrónico.
9.6. Crear un enlace a un vídeo.
9.6.1. Se debe crear un enlace con la URL del archivo de vídeo. Existen muchos formatos de vídeo como AV1, MPEG1, MPEG2...
10. Hojas de stilo en páginas web
10.1. Crear una hoja de estilos enlazada
10.1.1. Los pasos son: 1.Abrir una página web. 2. Hacer clic sobre el botón CSS para indicar el editor de estilos. 3. Seleccionar hoja de estilos avanzada. 4. Escribir el nombre que se quiera dar a la página web de estilos. 5.Hacer clic sobre el botón crear hoja de estilos
10.2. Crear reglas de estilo
10.2.1. Pasos de la etiqueta h1
10.2.1.1. 1. Comprobar que está seleccionada en el panel izquierdo, la hoja de estilos creada anteriormente para que las reglas que se creen se guarden en la misma. 2. Seleccionar la opción regla de estilo. 3. Activar la opción estilo aplicado a todos los elementos de tipo. 4. Desplegar la lista elementos situada en la parte inferior. 5. Hacer clic sobre el botón crear regla de estilo. 6. Activar la ficha Texto y modificar las propiedades que se desee. 7. Hacer clic en Aceptar
10.2.2. Pasos para crear una regla de estilo
10.2.2.1. 1. Hacer clic sobre el botón CSS. 2. Seleccionar la opción regla de estilos. 3. Activar la opción estilo aplicado a todos los elementos de tipo. 4. Hacer clic en el botón crear regla de estilo. 5. Activar la ficha fondo y seleccionar el color que se prefiera. 6. Hacer clic sobre el botón Aceptar. 7. Cerrar la página web abierta.
10.3. Enlazar una hoja de estilos a una página web
10.3.1. 1. Abrir una página web. 2. Hacer clic sobre el botón CSS. 3. Seleccionar hoja de estilos enlazada. 4. Hacer clic en crear hoja de estilos. 5. Guardar las modificaiones en páginas web