Crear Páginas Web Con KompoZer

Crear pginas web con KompoZer
KompoZer le permite crear sus propias pginas y publicarlas en la web. No tiene que saber HTML para usar KompoZer; es tan fcil de usar como un procesador de textos. Los botones de la barra de herramientas le permiten aadir listas, tablas, imgenes, enlaces a otras pginas, colores y tipos de letra. Puede ver qu aspecto tendr su documento en la web a medida que lo crea, y lo puede compartir fcilmente con otros usuarios, con independencia del tipo de navegador o programa de correo con soporte de HTML que utilicen.
Comenzar una nueva pgina

Crear una nueva pgina
KompoZer es un editor de HTML (Hypertext Markup Language) que permite la creacin y edicin de pginas web. Adems, es un editor WYSIWYG, por lo que se puede visualizar la forma en que se mostrar la pgina al tiempo que se crea. No es necesario conocer HTML ya que la mayora de las funciones bsicas del HTML se encuentran disponibles como rdenes en la barra de herramientas y en los mens. KompoZer tambin le permite la edicin del cdigo fuente HTML si lo desea. Para ver o editar el cdigo fuente HTML, abra el men Ver, y escoja Cdigo fuente HTML, o pulse la pestaa Etiquetas <HTML> en la barra de herramientas de modo de edicin de la parte inferior de la ventana de KompoZer. Para crear una pgina web utilice uno de los mtodos que a continuacin se describen. Una vez haya comenzado una pgina, puede agregar y editar texto de la misma manera en la que lo hara en un procesador de textos. Para crear una nueva pgina en KompoZer:
y
Haga clic en el botn Nuevo de la barra de herramientas de KompoZer.
Para comenzar a partir de un archivo HTML almacenado en su disco local: 1. Abra el men Ventana y seleccione KompoZer. Se mostrar la ventana de KompoZer. 2. Abra el men Archivo y seleccione Abrir Archivo.... Se mostrar el cuadro de dilogo Abrir archivo HTML. 3. Localice en su disco local el archivo que desee editar. 4. Haga clic en Abrir para mostrar el archivo escogido en la ventana de KompoZer. Para editar una pgina web:
1. Abra KompoZer 2. Haga clic en el men Archivo y seleccione Abrir direccin. Se mostrar el cuadro de dilogo Abrir direccin web. 3. Escriba la URL de la pgina a editar (por ejemplo, http://www.mozilla.org) y haga clic en el botn Crear. Se mostrar la pgina en KompoZer. KompoZer tambin da la opcin de crear un documento nuevo usando el formato XHTML. Para crear un documento XHTML, active la opcin crear un documento XHTML en el cuadro de dilogo Crear un nuevo documento o plantilla. Consejo: en la ventana de KompoZer se pueden abrir rpidamente los archivos con los que se ha estado trabajando ms recientemente mediante la apertura del men Archivo, seleccionando Pginas recientes y escogiendo el archivo deseado de la lista. [ Volver al principio de la seccin ]
Pestaas - Editar varios documentos

KompoZer permite editar varios documentos al mismo tiempo. En lugar de cambiar de una ventana a otra para editar ms de un documento, KompoZer ofrece la posibilidad de las Pestaas. Se pueden abrir varios documentos al mismo tiempo con KompoZer en la misma ventana pero en distintas pestaas. Las pestaas pueden abrirse usando Ctrl+T o bien seleccionando Crear en: Nueva pestaa dentro del cuadro de dilogo Crear un nuevo documento o plantilla. Aunque se tengan varias pestaas abiertas, cada una es gestionada independientemente. Se indica el estado de cada documento; por ejemplo, si ha sido modificado y necesita ser guardado, aparecer un icono de un disquete rojo en la pestaa correspondiente. [ Volver al principio de la seccin ]
Guardar y visualizar la nueva pgina

Se pueden guardar los documentos de KompoZer como HTML o como slo texto. Al guardar un documento en HTML se mantiene el formato del documento, como los estilos de texto (por ejemplo, negrita o cursiva), tablas, enlaces e imgenes. Al guardar un documento como formato de slo texto se eliminan todas las etiquetas HTML pero se mantiene el texto del documento. Para guardar un documento como archivo HTML:
y
Abra el men Archivo y escoja Guardar o bien pulse el botn Guardar en la barra de herramientas de redaccin. Si no se ha proporcionado an un ttulo a la pgina, KompoZer le pedir que lo haga. KompoZer mostrar el ttulo de la pgina en la barra de ttulo de la ventana
cuando se muestre la pgina en el navegador. El ttulo del documento tambin aparecer en la lista de marcadores si se guarda la pgina en ella. A continuacin, KompoZer le pedir que introduzca el nombre del archivo y que especifique la ubicacin donde desea que se guarde. Asegrese de que conserva la extensin .html en el nombre del archivo. Cuando almacene o edite documentos usando XHTML, el archivo debe tener la extensin .xhtml. Los archivos con una directiva DOCTYPE de tipo XHTML que tengan extensin .html no sern considerados como documentos xhtml. Para cambiar el nombre o la direccin de un archivo HTML existente:
y
Escoja Archivo > Guardar como y seleccione un nombre o ubicacin diferente.
Cuando guarda una pgina en KompoZer, todos los componentes de la pgina (el HTML, las imgenes y otros archivos, tales como archivos de sonido y hojas de estilo), se guardan en el disco local. Si slo quiere guardar la parte HTML de la pgina, debe cambiar la preferencia de KompoZer relativa al almacenamiento de pginas. Vea Preferencias de KompoZer para ms informacin sobre cmo cambiar la configuracin de KompoZer al guardar pginas. Si la direccin de una imagen es absoluta (comienza con http://) y se encuentra conectado a Internet, continuar viendo la imagen en el documento tanto en KompoZer como en Navigator. Sin embargo, si la direccin de la imagen es relativa a la direccin de la pgina (comienza con file:///), entonces no ver la imagen en la versin local del documento. Para guardar un documento como archivo de slo texto: 1. Abra el men Archivo y seleccione Exportar a texto. 2. Introduzca el nombre y la ubicacin en la que se desea guardar el archivo. Nota: las imgenes no aparecen en los documentos guardados en formato de slo texto. Consejo: se puede escoger Revertir desde el men Archivo para retomar la copia ms recientemente guardada del documento en el que se est trabajando. Tenga en cuenta que los cambios actuales se perdern. Para ver la pgina en una ventana del navegador con el fin de comprobar los enlaces:
y
Abra el men Archivo y escoja Visualizar pgina en el navegador (o haga clic sobre Navegar en la barra de herramientas de redaccin). Si an no ha guardado el documento, KompoZer le pedir que introduzca el ttulo de la pgina, el nombre del archivo y la ubicacin. La ventana de KompoZer permanecer abierta tras la nueva ventana de Navigator.
Dar formato a prrafos, ttulos y listas
Para aplicar un formato a un prrafo, comience desde la ventana de KompoZer: 1. Haga clic para emplazar el punto de insercin donde quiera que comience el formato o seleccione el texto al que desea aplicar el formato. 2. Escoja un formato de prrafo utilizando la lista desplegable de la barra de herramientas de formato: 3. o Cuerpo del texto: aplica el tipo de letra y estilo por omisin al texto normal, sin afectar al espaciado anterior o posterior a ste. o Prrafo: inserta una etiqueta de prrafo (se utiliza para comenzar un nuevo prrafo). El prrafo incluye un margen superior y otro inferior. o Ttulo 1 - Ttulo 6: aplica un formato de titular al prrafo. Ttulo 1 es el titular de mayor grado mientras que Ttulo 6 es el de menor grado. o Direccin: puede ser utilizado para la firma de una pgina web que indique el autor de la pgina y una persona con la cual contactar para obtener ms informacin, por ejemplo: usuario@ejemplo.com Quiz se desee aadir la fecha y un aviso de copyright. Este formato aparece a menudo en el pie de las pginas web bajo una lnea horizontal. Navigator mostrar el formato direccin en cursiva.
o
Preformato: ste es til para elementos del tipo de ejemplos de cdigo, datos en columna y mensajes de correo que se desea sean mostrados con un tipo de letra de ancho fijo. Con el texto normal la mayora de los navegadores eliminan los espacios extra, tabulaciones y retornos de carro. Sin embargo, el texto que utiliza el estilo preformato se muestra con los espacios en blanco intactos, preservando el diseo del texto original.
Para dar formato de titular al texto: 1. Haga clic para emplazar el punto de insercin en cualquier sitio dentro del texto al que desea aplicar el formato. 2. Utilice la lista desplegable de la barra de formato y escoja el grado de titular que desee, desde 1 (mayor) a 6 (menor). Por ejemplo, escoja Ttulo 1 para el ttulo principal, Ttulo 2 para el siguiente nivel, y as sucesivamente. Para dar formato a un elemento de una lista: 1. Haga clic para emplazar el punto de insercin dentro de la lnea de texto a la que se desea aplicar el formato. 2. Abra el men Formato y escoja Lista. 3. Escoja el estilo de lista: 4. o No numerada: cada elemento tiene una vieta (punto) a su lado (como en esta lista). o Numerada: Los elementos estn enumerados.
Trmino y Definicin: estos dos estilos trabajan juntos creando una apariencia del estilo de los glosarios. Utilice la etiqueta Trmino para la palabra que se est definiendo y la etiqueta Definicin para la definicin. El texto del trmino aparecer resaltado a la izquierda y el texto de la definicin aparecer sangrado.
Truco: se puede aplicar rpidamente un estilo de lista a un bloque de texto seleccionando ese texto y haciendo clic sobre los botones de Lista numerada de la barra de formato. Para cambiar el estilo de las vietas o de los nmeros: 1. Haga clic para emplazar el punto de insercin dentro del texto del elemento de la lista que desea modificar o seleccione uno o ms elementos de la lista si se desea aplicar un estilo nuevo a toda la lista entera. 2. Abra el men Formato y escoja Propiedades de la lista. 3. Seleccione una vieta o un estilo de numeracin de la lista desplegable. En el caso de listas numeradas se puede especificar un nmero de comienzo. En el caso de las listas no numeradas se puede modificar el estilo de la vieta. Consejo: tambin puede hacer doble clic en una vieta o nmero de la lista para mostrar el cuadro de dilogo de propiedades de la lista. Para alinear un prrafo o texto de la pgina, por ejemplo, al centro, a la izquierda o a la derecha: 1. Haga clic para emplazar el punto de insercin dentro del prrafo o la lnea de texto que se desea alinear. 2. Abra el men Formato, escoja Alinear y seleccione un tipo de alineado. Nota: tambin se puede utilizar la barra de formato para alinear el texto. [ Volver al principio de la seccin ] o Lista no numerada
Trabajar con listas

Para finalizar una lista y continuar escribiendo texto normal:
y
Haga clic para emplazar el punto de insercin al final del ltimo elemento de la lista y presione Enter (Return en Mac OS) dos veces hasta el final de la lista.
Para cambiar uno o ms de los elementos de la lista a texto normal: 1. Haga clic para emplazar el punto de insercin dentro del elemento de la lista o seleccione los elementos de la lista.
2. Para una lista numerada, haga clic en el botn de lista numerada (o, para una lista no numerada, haga clic en el botn de lista no numerada) de la barra de formato. Para colocar texto sangrado bajo un elemento de una lista: 1. 2. 3. 4. Haga clic para emplazar el punto de insercin dentro del elemento de la lista. Presione Mays-Enter para crear el sangrado libre. Escriba el texto que desea sangrar. Presione Mays-Enter para crear otro prrafo sangrado, o presione Enter para crear el siguiente elemento de la lista.
Truco: se puede incrementar o decrementar el sangrado de los elementos de la lista haciendo clic en cualquier lugar dentro de un elemento de la lista y pulsando a continuacin los botones Sangrado o Desangrado de la barra de herramientas de formato. Alternativamente, puede hacer clic en cualquier lugar dentro de un elemento de la lista y pulsar Tab para aumentar el sangrado en un nivel. Pulse Mays+Tab para reducir el sangrado en un nivel. Para juntar dos listas adyacentes: 1. Seleccione las dos listas que desea unir. Asegrese de seleccionar todos los elementos de ambas listas. Tenga en cuenta que cualquier texto existente entre las dos listas tambin pasar a formar parte de la nueva lista. 2. Haga clic sobre el botn de lista numerada o no numerada para juntar las listas. [ Volver al principio de la seccin ]
Cambiar el color, estilo y tipo de letra

Para cambiar el estilo, color o tipo de letra del texto seleccionado: 1. Seleccione el texto sobre el que desea aplicar el formato. 2. Abra el men Formato y escoja uno de los siguientes: 3. o Tipo de letra: selo para seleccionar un tipo de letra. Si prefiere utilizar los tipos de letra personalizados por el navegador del lector seleccione Anchura variable o Anchura fija. Nota: no aparecen todos los tipos de letra instalados en el ordenador. En vez de especificar un tipo de letra que podra no estar disponible para todos los que vayan a ver la pgina web, generalmente es mejor seleccionar uno de los tipos de letra proporcionados por el men ya que stos funcionan en todos los ordenadores. Por ejemplo, los tipos de letra Helvetica, Arial, Times y Courier por lo general se ven de la misma manera cuando se muestran en cada uno de los distintos ordenadores. Si selecciona un tipo de letra diferente, podra no visualizarse de la misma manera en otro ordenador.
Tamao: selo para seleccionar un tamao de letra relativo o escoja una de las opciones para incrementar o decrementar el tamao del texto (relativo al texto circundante). o Estilo de texto: selo para seleccionar un estilo, como cursiva, negrita o subrayado, o para aplicar un estilo estructurado, por ejemplo, Cdigo. o Color de texto: selo para seleccionar un color mediante el selector de color. Si est familiarizado con los cdigos hexadecimales de color del HTML, puede escribir un color especfico o escribir simplemente un nombre de color en ingls (por ejemplo, blue). Encontrar un til conversor de cdigos de colores aqu.
o
Para cambiar el color de fondo de la pgina: 1. 2. 3. 4. Haga clic en cualquier punto de la pgina. Pulse el bloque de color de fondo en la barra de herramientas de formato. Escoja un color de fondo del cuadro de dilogo de color de fondo. Pulse Aceptar.
Truco: para cambiar con rapidez el color del texto al ltimo utilizado, seleccione el texto, presione Mays y haga clic sobre el selector de color. Esto es til cuando se desea usar un nico color en lneas de texto separadas. Tambin puede utilizar una imagen como fondo. Vea Configuracin de fondos y colores de pgina. [ Volver al principio de la seccin ]
Eliminar o deshabilitar los estilos de texto

Para eliminar todos los estilos de texto (negrita, cursiva y dems) de un texto: 1. Seleccione el texto. 2. Abra el men Formato y escoja Eliminar todos los estilos de texto. 3. Contine escribiendo. Para seguir escribiendo texto con todos los estilos eliminados: 1. Emplace el punto de insercin donde desee deshabilitar los estilos de texto. 2. Abra el men Formato y seleccione Eliminar todos los estilos de texto. 3. Contine escribiendo. [ Volver al principio de la seccin ]
Buscar y reemplazar texto

Para buscar texto dentro de la pgina en la que se est trabajando:
1. Haga clic para emplazar el punto de insercin donde desee comenzar la bsqueda. 2. Abra el men Editar y seleccione Buscar y reemplazar. Ver el cuadro de dilogo Buscar y reemplazar. 3. Escriba el texto que desea localizar en el campo Buscar texto. Para acotar la bsqueda seleccione una o ms de las siguientes opciones: o Coincidencia de maysculas/minsculas: sela para especificar si la bsqueda distinguir entre maysculas y minsculas. o Buscar en todo el documento: sela para buscar hasta el final de la pgina y volver a la parte superior o inferior, dependiendo de si la bsqueda es hacia adelante o hacia atrs. o Buscar hacia atrs: sela para buscar desde el punto de insercin hasta el inicio de la pgina. 4. Haga clic en Buscar siguiente para comenzar la bsqueda. Cuando KompoZer localice la primera coincidencia, haga clic sobre Buscar siguiente para buscar la siguiente coincidencia. 5. Haga clic sobre Cerrar cuando haya terminado. Para buscar y reemplazar texto dentro de la pgina en la que se est trabajando: 1. Haga clic para emplazar el punto de insercin donde desee comenzar la bsqueda. 2. Abra el men Editar y seleccione Buscar y reemplazar. Ver el cuadro de dilogo Buscar y reemplazar. 3. Escriba el texto que desea localizar y el texto por el cual lo quiere reemplazar. 4. Para acotar la bsqueda seleccione una o ms de las siguientes opciones: o Coincidencia de maysculas/minsculas: sela para especificar si la bsqueda distinguir entre maysculas y minsculas. Si no selecciona esta opcin, la bsqueda encontrar coincidencias tanto en letras maysculas como en minsculas. o Buscar en todo el documento: sela para buscar hasta el final de la pgina y volver a la parte superior o inferior. o Buscar hacia atrs: sela para buscar desde el punto de insercin hasta el inicio de la pgina. 5. Haga clic en Buscar siguiente para buscar la siguiente coincidencia. KompoZer seleccionar la siguiente coincidencia del texto. 6. Haga clic en Reemplazar para cambiar el texto seleccionado por el texto de reemplazo. Haga clic en Reemplazar y buscar para reemplazar el texto seleccionado y encontrar la siguiente coincidencia. Haga clic en Reemplazar todos para cambiar cada una de las coincidencias del del documento por el texto de reemplazo. 7. Haga clic sobre Cerrar cuando haya terminado. [ Volver al principio de la seccin ]
Insertar lneas horizontales
Las lneas horizontales se utilizan normalmente para separar diferentes secciones de un documento de forma visual. Para insertar una lnea horizontal (tambin llamada regla) dentro de la pgina, comience desde la ventana de KompoZer: 1. Haga clic para emplazar el punto de insercin donde desee que aparezca la lnea. 2. Abra el men Insertar y seleccione Lnea horizontal.
Establecer las propiedades de una lnea horizontal

Se puede personalizar el alto, largo, ancho, alineacin y sombreado de una lnea. 1. Haga doble clic en la lnea para mostrar el cuadro de dilogo Propiedades de la lnea horizontal. 2. Edite cualquiera de estas propiedades: o Anchura: escriba el ancho y luego escoja % de la ventana o pxeles. Si especifica la anchura como un porcentaje, la anchura de la lnea cambiar siempre que la ventana de KompoZer o del navegador sea redimensionada. o Altura: escriba un nmero para el alto de la lnea (en pxeles). o Sombreado 3-D: seleccinelo para aadir profundidad a la lnea mediante la adicin de un bisel sombreado. o Alineacin: especifique cmo desea que se alinee la lnea (a la izquierda, centrada o a la derecha). 3. Haga clic sobre Usar como opcin predeterminada para utilizar estas configuraciones como las predeterminadas para la prxima vez que se inserte una lnea horizontal. 4. Para editar manualmente las propiedades de la lnea horizontal haga clic sobre Edicin avanzada. Vea la seccin Editor avanzado de propiedades, para mayor detalle. Truco: se puede seleccionar Etiquetas HTML del men Ver para que se muestren todos los elementos HTML en cajas amarillas. Se puede hacer doble clic sobre cualquiera de estas cajas para que se visualice el cuadro de dilogo del Editor avanzado de propiedades para esa etiqueta o elemento HTML. [ Volver al principio de la seccin ]
Insertar caracteres especiales

Para insertar caracteres especiales como tildes, marcas de copyright o smbolos monetarios: 1. Haga clic para emplazar el punto de insercin donde desee que aparezca el carcter especial. 2. Abra el men Insertar y seleccione Caracteres y smbolos. Ver el cuadro de dilogo Insertar carcter. 3. Seleccione una categora de caracteres.
Si escoge Maysculas acentuadas o Minsculas acentuadas, abra la lista desplegable Letra y seleccione la letra sobre la cual quiere poner la tilde (nota: no todas las letras tienen una forma acentuada). Seleccione Smbolos comunes para insertar caracteres especiales como el smbolo de copyright o fracciones. 4. Seleccione el carcter que desea insertar de la lista desplegable Carcter. 5. Haga clic en Insertar.
o
Se puede continuar escribiendo en el documento (o en una ventana de redaccin de correo) mientras se mantiene el cuadro de dilogo abierto, si es que desea utilizarlo de nuevo. 6. Haga clic en Cerrar cuando termine de insertar caracteres especiales. [ Volver al principio de la seccin ]
Insertar elementos y atributos HTML

Si sabe cmo trabajar con el cdigo fuente HTML podr insertar etiquetas adicionales, atributos de estilo y JavaScript en la pgina. Si no est seguro de cmo trabajar con el cdigo fuente, es preferible que no lo modifique. Para trabajar con el cdigo fuente HTML siga uno de estos mtodos:
y
Posicione el punto de insercin donde desee incluir el cdigo HTML o seleccione el texto que quiere editar, y a continuacin abra el men Insertar y seleccione HTML. En el cuadro de dilogo Insertar HTML introduzca las etiquetas y texto. Haga clic en Insertar. Seleccione un elemento, como una tabla, un enlace interno, una imagen, un enlace o una lnea horizontal. Haga doble clic sobre el elemento para abrir el cuadro de dilogo de las propiedades asociadas al elemento. Haga clic en Edicin avanzada para abrir el Editor avanzado de propiedades. Se puede usar este editor para aadir atributos HTML, JavaScript y CSS a los objetos. Abra el men Ver y seleccione Cdigo fuente HTML o haga clic sobre la pestaa Etiquetas <HTML> en la barra de herramientas del modo de edicin en la parte inferior de la ventana de KompoZer. (Si no ve esta barra, abra el men Ver, seleccione Barras de herramientas y asegrese de que la barra de herramientas del modo de edicin est seleccionada).
Utilizar el editor avanzado de propiedades

Para aadir atributos HTML y JavaScript a objetos como tablas, imgenes y lneas horizontales se puede utilizar el editor avanzado de propiedades. Nota: a menos que entienda claramente cmo aadir, eliminar o modificar los atributos HTML y sus valores asociados, es preferible que no utilice este editor.
Si no est viendo actualmente el cuadro de dilogo del editor avanzado de propiedades, lleve a cabo los siguientes pasos: 1. Desde el men Ver (o la barra de herramientas del modo de edicin) escoja Etiquetas HTML. 2. Haga doble clic sobre el objeto que desea modificar para abrir su cuadro de dilogo Propiedades. 3. Haga clic en Edicin avanzada para abrir el editor avanzado de propiedades del objeto. El editor avanzado de propiedades tiene tres pestaas, cada una de las cuales tiene una lista con las propiedades actuales del objeto seleccionado: o Atributos HTML: haga clic en esta pestaa para visualizar o introducir atributos HTML adicionales. o Estilo incrustado: haga clic sobre esta pestaa para visualizar o introducir propiedades CSS (hojas de estilo en cascada) adicionales mediante el atributo <style>. Para ms informacin sobre el uso de estilos CSS en KompoZer, vea Preferencias de KompoZer. o Eventos JavaScript: haga clic en esta pestaa para visualizar o introducir eventos JavaScript. 4. Para editar una propiedad o atributo en cualquiera de estas tres pestaas, seleccione el atributo que desee editar. Podr entonces editar el nombre del atributo o el valor mediante el uso de los campos editables Atributo y Valor de la parte inferior del cuadro de dilogo. Para aadir un nuevo atributo, escriba su nombre en el campo Atributo de la parte inferior del cuadro de dilogo. El nuevo atributo se aadir automticamente cuando haga clic en el campo Valor. Para eliminar un atributo, seleccinelo de la lista y haga clic en Eliminar. Nota: Los atributos obligatorios se encuentran resaltados en la lista de atributos. 5. Haga clic sobre Aceptar para aplicar los cambios del cuadro de dilogo del editor avanzado de propiedades. 6. De nuevo, haga clic en Aceptar para salir del cuadro de dilogo Propiedades. KompoZer coloca comillas dobles de forma automtica en el texto del atributo. [ Volver al principio de la seccin ]
Validar el HTML
Antes de subir el documento a un servidor web (publicarlo), es una buena prctica comprobar antes el formato del HTML del documento con el objetivo de asegurarse de que cumple con los estndares web. Los documentos que contienen HTML validado son menos propicios a causar problemas en su visualizacin por los diferentes navegadores. Comprobar nicamente de manera visual la pgina web en su navegador favorito no significa que su documento vaya a aparecer correctamente al ser abierto en otros navegadores.
KompoZer proporciona un modo apropiado para comprobar que el documento cumple los estndares HTML de la W3C (World Wide Web Consortium). KompoZer utiliza el Servicio de validacin de HTML de la W3C, que comprueba si la sintaxis HTML del documento se ajusta al estndar HTML 4.01. Este servicio proporciona adems informacin sobre cmo corregir los errores. Nota: hay que estar conectado a Internet para utilizar esta caracterstica. Para validar la sintaxis del documento HTML: 1. Abra el men Herramientas y seleccione Validar HTML. Si no ha guardado los cambios, KompoZer le preguntar si hacerlo antes de proceder. 2. KompoZer abrir una nueva ventana con los resultados de su documento una vez que el servicio de validacin de la W3C examine su archivo html. [ Volver al principio de la seccin ]
Escoger el modo de edicin correcto

Normalmente no se necesitar cambiar el modo predeterminado de edicin (Normal). Sin embargo, si se desea trabajar con el cdigo fuente HTML del documento, quiz se desee cambiar el modo de edicin. KompoZer permite saltar rpidamente entre cuatro modos de edicin o vistas. Cada modo de edicin permite continuar trabajando en el documento, pero muestra niveles variables de etiquetas HTML (e iconos de etiquetas). Antes de escoger un modo de edicin:
y
Abra el men Ver, seleccione Mostrar/Ocultar y asegrese de que la opcin Barra de modo de edicin est marcada.
La Barra de modo de edicin dispone de cuatro pestaas:

y
y y
Normal: ste es el modo de edicin WYSIWYG, por lo que se visualiza la forma en la que se mostrar el documento al tiempo que se crea. Seleccione este modo para que se muestren los bordes de las tablas y los iconos de los vnculos internos. El resto de iconos de las etiquetas HTML quedarn ocultos. Etiquetas HTML: seleccione este modo para que se muestren los iconos de todas las etiquetas HTML. Cdigo fuente: seleccione este modo para ver y editar el documento como cdigo fuente HTML sin formato. Cuando se guarde el documento, el modo Normal reaparecer. Vista preliminar: seleccione este modo para visualizar y editar el documento de la manera exacta en la que aparecer en la ventana de un navegador, excepto porque los enlaces y las funciones JavaScript estarn desactivadas.
Nota: las funciones JavaScript, marcos, enlaces, Java, objetos incrustados y archivos GIF animados no estn activos en ninguno de los modos de edicin. Para visualizarlos en su estado activo, haga clic en el botn Navegar de la barra de herramientas de redaccin para cargar la pgina dentro de una ventana del navegador. [ Volver al principio de la seccin ]
Utilizar la barra de estado para dar formato a la pgina web

KompoZer dispone de una innovadora caracterstica de aplicacin de estilos incrustados y etiquetas class e id al texto seleccionado mediante la barra de estado. Este modo de aplicacin de estilo est disponible en todos los modos excepto el modo de edicin Cdigo fuente.
y y y
Seleccionar: al hacer clic en Seleccionar se seleccionara el texto completo limitado por la etiqueta de estilo. Eliminar etiqueta: al hacer clic en Eliminar etiqueta se eliminar la etiqueta de estilo, y en consecuencia todos los estilos para esa etiqueta desaparecern. Cambiar etiqueta: al utilizar esta opcin, se puede cambiar la etiqueta usada para el texto con el mnimo esfuerzo. Al hacer clic en Cambiar etiqueta el texto de la etiqueta correspondiente se vuelve editable en la barra de estado. Escriba pues la etiqueta deseada y presione Enter. Las propiedades predeterminadas de la etiqueta se aplicarn al texto dentro de la pgina web. Estilos incrustados: en cualquiera de los modos de edicin Normal, Etiquetas HTML, o Vista preliminar las etiquetas que recubren la posicin actual se muestran en la barra de estado de KompoZer. Las propiedades de estilo de cada una de las etiquetas pueden ser modificadas seleccionando una opcin del men contextual. Para cambiar las propiedades de estilo incrustadas: 1. Haga clic con el botn derecho sobre la etiqueta que desee editar. 2. Haga clic en Estilos incrustados. 3. Escoja la seccin de propiedades que desee editar: Propiedades del texto Propiedades del borde Propiedades del fondo Propiedades de la caja Propiedades aurales Extraer y crear estilo genrico Seleccionando cualquiera de las opciones excepto la ltima se abrir la pestaa de la seccin correspondiente del editor CSS (ms informacin sobre CSS en la seccin Utilizar hojas de estilo). Con la seccin correspondiente abierta, se pueden definir estilos propios que sern almacenados segn el estilo de cdigo CSS de la W3C. La opcin Extraer y crear estilo genrico permite extraer informacin de estilo a una regla de estilo y guardarla en una hoja de estilos externa/interna.
Plantillas: se ofrecen dos opciones, Hacer editable y Eliminar rea editable, que pueden ser utilizadas al trabajar con plantillas. Para ms informacin sobre plantillas, vea la seccin Trabajar con plantillas. ID: se muestran las etiquetas ID (si existen) de la hoja de estilos actual aplicada al documento. Para aplicar una etiqueta determinada al texto seleccionado simplemente haga clic en esa etiqueta ID. Clases: se muestran las etiquetas de clase (si existen) de la hoja de estilos actual aplicada al documento. Para aplicar una clase al texto seleccionado simplemente haga clic en esa etiqueta de clase. Propiedades avanzadas: permite usar el editor de propiedades avanzado para agregar atributos HTML y JavaScript a objetos como tablas, imgenes, enlaces, etc. Vea la seccin Editor avanzado de propiedades, para mayor detalle.
Usar hojas de estilo en cascada

Las hojas de estilo en cascada (CSS, Cascade Style Sheets) pueden usarse para proporcionar estilo a un documento HTML de tres maneras: 1. Con estilos incrustados. 2. Con hojas de estilo internas. 3. Con hojas de estilo externas. KompoZer dispone de un editor de hojas de estilo denominado CaScadeS. CaScadeS puede ser utilizado para producir tanto hojas de estilo internas como externas. A diferencia de los estilos incrustados, las hojas de estilo internas o externas ayudan a mantener separadas la informacin del contenido de la del estilo. Para proporcionar estilo al documento html que se edita, CaScadeS puede iniciarse haciendo clic en el men Herramientas y seleccionando Editor CSS. CaScadeS permite dos modos de edicin de hojas de estilo: 1. Modo para principiantes: este modo permite crear reglas asociadas a selectores de clase o selectores de tipo de elemento. 2. Modo avanzado: este modo permite crear reglas sin restricciones. En caso de que no haya hoja de estilo, se crear una nueva automticamente. [ Volver al principio de la seccin ]
Crear hojas de estilo con KompoZer

Al usar CaScadeS, se pueden crear tanto hojas de estilo internas como externas. Para crear una hoja de estilo interna: 1. Haga clic en el botn de elemento <style>.
(Opcional) Rellene la informacin sobre Lista de medios y Ttulo de la hoja de estilo. 2. Haga clic en Crear hoja de estilo.
o
Para crear una hoja de estilo externa: 1. Haga clic en el botn de elemento <link>. 2. Escriba la URL de la hoja de estilo en el panel de la derecha. Si no existe ya, se crear un nuevo fichero en el sistema de archivos local. o (Opcional) Rellene la informacin sobre Lista de medios y Ttulo de la hoja de estilo. 3. Active comprobar al crear una hoja de estilo alternativa si sta es una alternativa. Consejo: guarde siempre el documento html antes de agregar una hoja de estilo local. Guarde tambin el documento inmediatamente antes de cerrar el editor CSS. Consejo: utilice el botn Recargar del panel de la izquierda si la hoja de estilo no se descarga inmediatamente. [ Volver al principio de la seccin ]
Crear reglas para las hojas de estilo

Despus de crear una o ms hojas de estilo para el documento html, se pueden crear reglas para cada hoja de estilo de forma individual. Para usar una hoja de estilos concreta al crear o modificar reglas, seleccinela en el panel de la izquierda haciendo clic sobre ella con el botn izquierdo del ratn. El panel de la derecha mostrar entonces los detalles de la hoja de estilo en la pestaa General. Para crear reglas nuevas: 1. Haga clic en el botn Regla del panel de la izquierda. 2. El panel de la derecha mostrar opciones para especificar el tipo de regla a crear. Elija una entre las siguientes: o estilo con nombre (introduzca abajo el nombre de la clase) o estilo aplicado a todos los elementos del tipo (introduzca el tipo abajo) o estilo aplicado a todos los elementos coincidentes con este selector 3. Rellene el nombre de la regla. 4. Haga clic en Crear regla de estilo. Las reglas pueden ser definidas usando las pestaas de estilo (Texto, Fondo, Bordes, Caja, Aural) del panel de la derecha. Para ver todas las definiciones de una regla de estilo, seleccinela en el panel de la izquierda y haga clic en la pestaa General del panel de la derecha. La pestaa General mostrar todas las definiciones aplicadas a la regla.

Al usar CaScadeS, se pueden crear tanto hojas de estilo internas como externas. Para crear una hoja de estilo interna: 1. Haga clic en el botn de elemento <style>. o (Opcional) Rellene la informacin sobre Lista de medios y Ttulo de la hoja de estilo. 2. Haga clic en Crear hoja de estilo. Para crear una hoja de estilo externa: 1. Haga clic en el botn de elemento <link>. 2. Escriba la URL de la hoja de estilo en el panel de la derecha. Si no existe ya, se crear un nuevo fichero en el sistema de archivos local. o (Opcional) Rellene la informacin sobre Lista de medios y Ttulo de la hoja de estilo. 3. Active comprobar al crear una hoja de estilo alternativa si sta es una alternativa. Consejo: guarde siempre el documento html antes de agregar una hoja de estilo local. Guarde tambin el documento inmediatamente antes de cerrar el editor CSS.
Consejo: utilice el botn Recargar del panel de la izquierda si la hoja de estilo no se descarga inmediatamente. [ Volver al principio de la seccin ]


Las hojas de estilo en cascada (CSS, Cascade Style Sheets) pueden usarse para proporcionar estilo a un documento HTML de tres maneras: 1. Con estilos incrustados. 2. Con hojas de estilo internas. 3. Con hojas de estilo externas. KompoZer dispone de un editor de hojas de estilo denominado CaScadeS. CaScadeS puede ser utilizado para producir tanto hojas de estilo internas como externas. A diferencia de los estilos incrustados, las hojas de estilo internas o externas ayudan a mantener separadas la informacin del contenido de la del estilo. Para proporcionar estilo al documento html que se edita, CaScadeS puede iniciarse haciendo clic en el men Herramientas y seleccionando Editor CSS. CaScadeS permite dos modos de edicin de hojas de estilo:
1. Modo para principiantes: este modo permite crear reglas asociadas a selectores de clase o selectores de tipo de elemento. 2. Modo avanzado: este modo permite crear reglas sin restricciones. En caso de que no haya hoja de estilo, se crear una nueva automticamente. [ Volver al principio de la seccin ]

Al usar CaScadeS, se pueden crear tanto hojas de estilo internas como externas. Para crear una hoja de estilo interna: 1. Haga clic en el botn de elemento <style>. o (Opcional) Rellene la informacin sobre Lista de medios y Ttulo de la hoja de estilo. 2. Haga clic en Crear hoja de estilo. Para crear una hoja de estilo externa: 1. Haga clic en el botn de elemento <link>. 2. Escriba la URL de la hoja de estilo en el panel de la derecha. Si no existe ya, se crear un nuevo fichero en el sistema de archivos local. o (Opcional) Rellene la informacin sobre Lista de medios y Ttulo de la hoja de estilo. 3. Active comprobar al crear una hoja de estilo alternativa si sta es una alternativa. Consejo: guarde siempre el documento html antes de agregar una hoja de estilo local. Guarde tambin el documento inmediatamente antes de cerrar el editor CSS. Consejo: utilice el botn Recargar del panel de la izquierda si la hoja de estilo no se descarga inmediatamente. [ Volver al principio de la seccin ]

Despus de crear una o ms hojas de estilo para el documento html, se pueden crear reglas para cada hoja de estilo de forma individual. Para usar una hoja de estilos concreta al crear o modificar reglas, seleccinela en el panel de la izquierda haciendo clic sobre ella con el botn izquierdo del ratn. El panel de la derecha mostrar entonces los detalles de la hoja de estilo en la pestaa General. Para crear reglas nuevas: 1. Haga clic en el botn Regla del panel de la izquierda. 2. El panel de la derecha mostrar opciones para especificar el tipo de regla a crear. Elija una entre las siguientes:
estilo con nombre (introduzca abajo el nombre de la clase) estilo aplicado a todos los elementos del tipo (introduzca el tipo abajo) estilo aplicado a todos los elementos coincidentes con este selector 3. Rellene el nombre de la regla. 4. Haga clic en Crear regla de estilo.
o o o
Las reglas pueden ser definidas usando las pestaas de estilo (Texto, Fondo, Bordes, Caja, Aural) del panel de la derecha. Para ver todas las definiciones de una regla de estilo, seleccinela en el panel de la izquierda y haga clic en la pestaa General del panel de la derecha. La pestaa General mostrar todas las definiciones aplicadas a la regla.


Al usar CaScadeS, se pueden crear tanto hojas de estilo internas como externas. Para crear una hoja de estilo interna: 1. Haga clic en el botn de elemento <style>. o (Opcional) Rellene la informacin sobre Lista de medios y Ttulo de la hoja de estilo. 2. Haga clic en Crear hoja de estilo.
Para crear una hoja de estilo externa: 1. Haga clic en el botn de elemento <link>. 2. Escriba la URL de la hoja de estilo en el panel de la derecha. Si no existe ya, se crear un nuevo fichero en el sistema de archivos local. o (Opcional) Rellene la informacin sobre Lista de medios y Ttulo de la hoja de estilo. 3. Active comprobar al crear una hoja de estilo alternativa si sta es una alternativa. Consejo: guarde siempre el documento html antes de agregar una hoja de estilo local. Guarde tambin el documento inmediatamente antes de cerrar el editor CSS. Consejo: utilice el botn Recargar del panel de la izquierda si la hoja de estilo no se descarga inmediatamente. [ Volver al principio de la seccin ]


Las hojas de estilo en cascada (CSS, Cascade Style Sheets) pueden usarse para proporcionar estilo a un documento HTML de tres maneras: 1. Con estilos incrustados. 2. Con hojas de estilo internas.
3. Con hojas de estilo externas. KompoZer dispone de un editor de hojas de estilo denominado CaScadeS. CaScadeS puede ser utilizado para producir tanto hojas de estilo internas como externas. A diferencia de los estilos incrustados, las hojas de estilo internas o externas ayudan a mantener separadas la informacin del contenido de la del estilo. Para proporcionar estilo al documento html que se edita, CaScadeS puede iniciarse haciendo clic en el men Herramientas y seleccionando Editor CSS. CaScadeS permite dos modos de edicin de hojas de estilo: 1. Modo para principiantes: este modo permite crear reglas asociadas a selectores de clase o selectores de tipo de elemento. 2. Modo avanzado: este modo permite crear reglas sin restricciones. En caso de que no haya hoja de estilo, se crear una nueva automticamente. [ Volver al principio de la seccin ]



Las hojas de estilo en cascada (CSS, Cascade Style Sheets) pueden usarse para proporcionar estilo a un documento HTML de tres maneras: 1. Con estilos incrustados. 2. Con hojas de estilo internas. 3. Con hojas de estilo externas. KompoZer dispone de un editor de hojas de estilo denominado CaScadeS. CaScadeS puede ser utilizado para producir tanto hojas de estilo internas como externas. A diferencia de los estilos incrustados, las hojas de estilo internas o externas ayudan a mantener separadas la informacin del contenido de la del estilo. Para proporcionar estilo al documento html que se edita, CaScadeS puede iniciarse haciendo clic en el men Herramientas y seleccionando Editor CSS. CaScadeS permite dos modos de edicin de hojas de estilo: 1. Modo para principiantes: este modo permite crear reglas asociadas a selectores de clase o selectores de tipo de elemento. 2. Modo avanzado: este modo permite crear reglas sin restricciones. En caso de que no haya hoja de estilo, se crear una nueva automticamente.
[ Volver al principio de la seccin ]


Despus de crear una o ms hojas de estilo para el documento html, se pueden crear reglas para cada hoja de estilo de forma individual. Para usar una hoja de estilos concreta al crear o modificar reglas, seleccinela en el panel de la izquierda haciendo clic sobre ella con el botn izquierdo del ratn. El panel de la derecha mostrar entonces los detalles de la hoja de estilo en la pestaa General. Para crear reglas nuevas: 1. Haga clic en el botn Regla del panel de la izquierda. 2. El panel de la derecha mostrar opciones para especificar el tipo de regla a crear. Elija una entre las siguientes: o estilo con nombre (introduzca abajo el nombre de la clase) o estilo aplicado a todos los elementos del tipo (introduzca el tipo abajo) o estilo aplicado a todos los elementos coincidentes con este selector 3. Rellene el nombre de la regla. 4. Haga clic en Crear regla de estilo.
Las reglas pueden ser definidas usando las pestaas de estilo (Texto, Fondo, Bordes, Caja, Aural) del panel de la derecha. Para ver todas las definiciones de una regla de estilo, seleccinela en el panel de la izquierda y haga clic en la pestaa General del panel de la derecha. La pestaa General mostrar todas las definiciones aplicadas a la regla.

Crear Páginas Web Con KompoZer

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Crear Páginas Web Con KompoZer

Uploaded by

Copyright:

Available Formats

Crear pginas web con KompoZer

Comenzar una nueva pgina

Haga clic en el botn Nuevo de la barra de herramientas de KompoZer.

Pestaas - Editar varios documentos

Guardar y visualizar la nueva pgina

Escoja Archivo > Guardar como y seleccione un nombre o ubicacin diferente.

Dar formato a prrafos, ttulos y listas

Trabajar con listas

Cambiar el color, estilo y tipo de letra

Eliminar o deshabilitar los estilos de texto

Buscar y reemplazar texto

Insertar lneas horizontales

Establecer las propiedades de una lnea horizontal

Insertar caracteres especiales

Insertar elementos y atributos HTML

Utilizar el editor avanzado de propiedades

Escoger el modo de edicin correcto

La Barra de modo de edicin dispone de cuatro pestaas:

Utilizar la barra de estado para dar formato a la pgina web

Usar hojas de estilo en cascada

Crear hojas de estilo con KompoZer

Crear reglas para las hojas de estilo

Usar hojas de estilo en cascada

Crear hojas de estilo con KompoZer

Crear reglas para las hojas de estilo

Usar hojas de estilo en cascada

Crear hojas de estilo con KompoZer

Crear reglas para las hojas de estilo

Usar hojas de estilo en cascada

Crear hojas de estilo con KompoZer

Crear reglas para las hojas de estilo

Usar hojas de estilo en cascada

Crear hojas de estilo con KompoZer

Crear reglas para las hojas de estilo

Usar hojas de estilo en cascada

[ Volver al principio de la seccin ]

Crear hojas de estilo con KompoZer

Crear reglas para las hojas de estilo

You might also like