01 Contenido HTML I V9 PDF

PROGRAMACIÓN HTML I
SEMANA 1
Fundamentos de HTML
Todos los derechos de autor son de la exclusiva propiedad de IACC o de los otorgantes de sus licencias. No está
permitido copiar, reproducir, reeditar, descargar, publicar, emitir, difundir, poner a disposición del público ni 1
ESTE
utilizarDOCUMENTO
los contenidos paraCONTIENE LAdeSEMANA
fines comerciales 1
ninguna clase.
2
ESTE DOCUMENTO CONTIENE LA SEMANA 1
ÍNDICE
FUNDAMENTOS DE HTML ................................................................................................................... 4

OBJETIVOS ESPECÍFICOS ........................................................................................................................... 4
INTRODUCCIÓN ...................................................................................................................................... 4
1. HISTORIA DEL HTML......................................................................................................................... 5
2. ¿CÓMO ESCRIBIR HTML? .................................................................................................................. 6
3. HERRAMIENTAS DE PRUEBA DE HTML.............................................................................................. 10
3.1. SERVIDOR WEB XAMPP ..................................................................................................... 10
3.1.1. CARACTERÍSTICAS...................................................................................................... 10
3.1.2. FUNCIONES ................................................................................................................ 10
3.1.3. INSTALACIÓN ............................................................................................................. 11
3.1.4. CONFIGURACIÓN ....................................................................................................... 15
3.1.5. UTILIZACIÓN .............................................................................................................. 17
3.2. EDITOR DE PÁGINAS WEB KOMPOZER.............................................................................. 19
3.2.1. CARACTERÍSTICAS...................................................................................................... 19
3.2.2. FUNCIONES ................................................................................................................ 19
3.2.3. INSTALACIÓN ............................................................................................................. 20
3.2.4. CONFIGURACIÓN ....................................................................................................... 21
3.2.5. UTILIZACIÓN .................................................................................................................. 23
COMENTARIO FINAL.......................................................................................................................... 32
REFERENCIAS........................................................................................................................................ 33
3
FUNDAMENTOS DE HTML
OBJETIVOS ESPECÍFICOS
 Conocer el origen y perspectiva histórica del HTML.
 Comprender y aplicar la forma de escribir en HTML.
 Comprender el funcionamiento, características y utilidad de las herramientas de prueba
HTML XAMPP y KompoZer.
 Utilizar las herramientas de prueba XAMPP y KompoZer para escribir en HTML.
INTRODUCCIÓN
Esta semana se revisarán los conceptos básicos de HTML, conceptos fundamentales para los
contenidos de las siguientes semanas, además se instruirá en la implementación de un ambiente
que será la base para los ejercicios por desarrollar, finalmente se avanzará hacia la construcción de
una página básica.
El concepto de HTML puede ser utilizado de dos maneras: por una parte, es entendido como el
lenguaje de marcas o tags para la diagramación de páginas web y, por otro, es la sigla que se utiliza
para Hyper Text Markup Language (lenguaje de marcas de hipertexto).
Un lenguaje de marcas es un conjunto de etiquetas que representan elementos y que permiten

dar la estructura a una página web. Cada etiqueta HTML describe diferentes contenidos o
elementos del documento.
4
1. HISTORIA DEL HTML
A continuación se definen los principales hitos de la historia de HTML.
El físico Tim Berners-Lee propone un revolucionario sistema basado en

1980 "hipertexto" con el objetivo de compartir documentos. Trabajando
mancomunadamente con el ingeniero de sistemas Robert Cailliau, crearon lo
que hoy se conoce como World Wide Web (WWW).
El primer manual del lenguaje HTML fue publicado en 1991 con el nombre de
1993 HTML Tags, pero no sería hasta 1993, por gestión del organismo IETF (Internet
Engineering Task Force), que sería presentado como candidato para ser el
lenguaje oficial para la internet. En los primeros años se consiguieron algunos
avances importantes como la definición de tags para imágenes, formularios y
tablas, así nacieron las versiones llamadas HTML y HTML+, pero estas no
lograron convertirse en estándar oficial.
En septiembre, el IETF publica HTML 2.0, que será el primer estándar oficial de
1995 HTML.
En enero World Wide Web Consortium (W3C) publica la versión HTML 3.2, que
1997 incorpora los últimos avances de las páginas web desarrolladas hasta 1996,
como applets de Java y texto que fluye alrededor de las imágenes.
El 24 de abril se publica HTML 4.0, una de las versiones más recordadas ya que
1998 incorpora extraordinarios avances como el uso de las hojas de estilo CSS y la
posibilidad de incrustar reducidos scripts de lenguajes como Java dentro del
html de las páginas web. Además de mejorar la accesibilidad de las páginas
diseñadas, adiciona tablas y formularios más complejos.
La última especificación oficial de HTML se publicó el 24 de diciembre y se

1999 denomina HTML 4.01. Se trata de una revisión y actualización de la versión
HTML 4.0, por lo que no incluye novedades significativas.
Desde que la W3C HTML 4.01 inicia su actividad se orientó a desarrollar XHTML.
2004 Es por ello que las empresas Apple, Mozilla y Opera se organizaron en una nueva
asociación llamada WHATWG (Web Hypertext Application Technology Working
Group).
WHATWG publicó en octubre la actual versión HTML 5, en la cual están basados

2014 los últimos navegadores que permiten interactuar en forma mejorada con
archivos de audio y video.
Fuente: tabla elaborada para la asignatura en base a Librosweb (s. f.).
5
2. ¿CÓMO ESCRIBIR HTML?
Básicamente un sitio web es un conjunto de páginas web conectadas entre sí. En la creación de
estas páginas es necesario conocer la estructura básica de una página, que consiste en una
cabecera (HEAD) y un cuerpo (BODY). En estas dos secciones incluiremos elementos que le irán
dando forma a la página.
Una página HTML posee la siguiente estructura básica:
Fuente: material elaborado para la asignatura.
HTML indica al navegador que el contenido está escrito en lenguaje HTML, para ello la página
termina y comienza con estas etiquetas o tags:
<HTML>…</HTML>
Dentro de estas dos etiquetas se distinguen dos secciones principales:
La cabecera (<HEAD>...</HEAD>)
El cuerpo (<BODY>...</BODY>)
La cabecera está enmarcada dentro de las etiquetas <HEAD> y </HEAD>. Se han de definir en ella
características que afectarán a todo el documento en forma general, como estilos de visualización,
formas de interacción con otras páginas o lenguajes, o información útil que describe o controla el
documento.
6
En esta sección se puede encontrar la versión del HTML en que fue desarrollada la página, el título
de ella y notas del autor, además de poder incluir scripts o programas escritos en algún otro
lenguaje para internet (ejemplo: javascript). El conjunto de estos datos recibe el nombre de
metainformación.
La información contenida en la etiqueta de <HEAD>...</HEAD> no se despliega directamente en el

navegador, sino que afecta a las propiedades generales de la página, por esta razón no debe
escribirse ninguna instrucción o comentario ajeno a las etiquetas estandarizadas propias de esta
parte del documento.
Las etiquetas válidas a utilizar dentro de la cabecera son las siguientes:
<TITLE> Define el título de la página, este texto aparece en la parte superior del navegador.
<META> Especifica el tipo de contenido, el set de caracteres, etc.
Ejemplo:
Se vería así en Internet Explorer:
<BASE> Señala la url de origen o base de todos los links relativos que se usarán en la página.
Este tema será abordado más adelante en esta asignatura.
<LINK> Define una referencia a otro documento, generalmente se ocupa para enlazar la
página a una “hoja de estilo” (Archivo .css), que contiene información de los
formatos dados a los componentes de la página, por ejemplo: colores y fuentes para
los botones o textos.
link rel="stylesheet" media="screen" href="global.css" type="text/css" >
7
<STYLE> Define características de formato sobre los elementos de la página. Ejemplo: el tipo
de letra que será utilizado.
<SCRIPT> Permite insertar, junto al HTML, scripts o trozos de código en otros lenguajes de
programación como javascript, vbscript y otros. Código que vendrá a complementar
la funcionalidad del HTML de la página.
<script type="text/javascript" href="ajaxtcr.js"></script>
Un ejemplo:
8
La segunda sección es el cuerpo y para definirlo se utilizarán las siguientes etiquetas:
<BODY> y </BODY> Esta sección para algunos navegadores es opcional, pero siempre
debería ser incluida. Al interior del body encontraremos elementos tales
como: textos, encabezados, imágenes, tablas, animaciones, y otros, que
poseen sus propios atributos para definir el formato de cada uno de
ellos.
La etiqueta <BODY>...</BODY> posee ciertos atributos que definirán

cómo se visualizará esta parte del documento. Entre estos tenemos
atributos para definir color y diseño de la página.
Ejemplo:
<BODY bgcolor="white” text="blue" leftmargin="0" topmargin="0"
marginwidth="0" marginheight="0">
... Este es el cuerpo de mi página

</BODY>
Y se mostraría así en Internet Explorer:
Fuente: material preparado para la asignatura.
Los atributos comunes de la etiqueta <BODY> son:
bgcolor Define el color del fondo de la página.

link Color para los links que contiene la página.
background Señala a una imagen específica como fondo para la
página.
text Color para texto de la página.
vlink Color de links ya visitados.
alink Color que aparece al darle clic sobre un link.
topmargin Distancia que existe entre la margen superior del
navegador y el contenido medido en pixeles.
leftmargin Distancia que existe entre la margen izquierda del
navegador y el contenido medido en pixeles.
marginheight Tamaño del margen superior e inferior.
marginwidth Tamaño del margen izquierdo y derecho.
9
3. HERRAMIENTAS DE PRUEBA DE HTML
3.1. SERVIDOR WEB XAMPP
XAMPP es el acrónimo de la Plataforma (X), Apache (A), MySQL (M), PHP (P) y Perl (P). Es un
paquete de Apache de arquitectura ágil que facilita enormemente a los desarrolladores crear un
servidor web local para realizar pruebas1.
3.1.1. CARACTERÍSTICAS
XAMPP posee todo lo que un servidor web necesita para configurar un ambiente local de pruebas:
Apache, una base de datos (MySQL) y un lenguaje de programación para la web (PHP). Este
ambiente funciona bien tanto en Linux, como Mac o Windows. Dado que la mayoría de los
servidores web actuales usan los mismos componentes que XAMPP, la transición desde el servidor
de prueba local al servidor de producción es muy fácil.
3.1.2. FUNCIONES
XAMPP se compone de cuatro aplicaciones principales. Estas son:
 Apache: es un servidor web, el cual tiene la finalidad de publicar una página HTML para
que pueda ser accesada por navegadores como Internet Explorer (se revisará este
concepto más adelante).
 MySQL: todo desarrollo para la web necesita de una base de datos para mantener los
datos que procesa. Este motor de base de datos es de código abierto y uno de los más
populares.
 PHP: es la sigla del preprocesador de hipertexto. Es un lenguaje de programación
orientado para la web que funciona del lado del servidor (concepto a revisar más
adelante). Es de código abierto (open source), fácil de entender y funciona perfectamente
con el gestor de base de datos MySQL.
 Perl: lenguaje de programación especializado en trabajo con redes y la administración de
sistemas.
1
Adaptado de: https://blog.udemy.com/tutorial-de-xampp-como-usar-xampp-para-ejecutar-su-propio-
servidor-web/
10
3.1.3. INSTALACIÓN
XAMPP se puede descargar sin costo desde el siguiente sitio:
http://www.apachefriends.org/es/xampp.html
A continuación se muestra un tutorial explicativo sobre cómo instalar XAMPP en sistema operativo
Windows 7, que será la plataforma base para el desarrollo de esta asignatura.
Paso 1 Seleccionar la primera opción de XAMPP para Windows.
Paso 2 Una vez descargado el archivo .exe, se debe comenzar con la instalación dando
doble clic sobre el archivo descargado.
Paso 3 Automáticamente se abrirá una pantalla de presentación del servidor. Para avanzar
se debe presionar el botón “Next”.
11
Paso 4 A continuación se debe determinar la carpeta en la cual será instalado XAMPP.
Se sugiere dejar la carpeta por defecto, para fines de continuidad en las
especificaciones de las operaciones a realizar durante esta asignatura.
Paso 5 A continuación se presenta un producto relacionado con XAMPP (Bitnami). Se

sugiere desmarcar la opción de “Learn More” y continuar presionando “Next”.
12
Paso 6 Aparecerá una pantalla de confirmación de instalación. Se debe presionar “Next”
para continuar.
13
Paso 7 A medida que avanza la instalación, la barra de progreso se irá completando hasta
alcanzar el 100%.
Paso 8 Una vez terminada la instalación aparecerá la siguiente pantalla:
Con esto se confirma que la instalación se ha ejecutado de manera exitosa.
14
3.1.4. CONFIGURACIÓN
XAMPP posee una utilidad llamada “panel de control” que permite realizar labores de
configuración en forma centralizada.
Para ingresar desde la barra de tareas de Windows 7, se debe seleccionar la opción “XAMPP
Control Panel”, tal como se muestra en la siguiente imagen:
En el panel de control de XAMPP se utilizarán los botones Start/Stop para iniciar o detener los
servicios de XAMPP: Apache, MySQL, Filezilla (servidor FTP), Mercury (servidor de correo
electrónico), entre otros.
Desde la opción de servicios se puede configurar el modo de trabajo como servicio, de manera
tal que estas aplicaciones pasen a ser parte del sistema operativo como servicios. Así se podrá
configurar con reinicio automático para que entren en ejecución cada vez que el computador
entre en funcionamiento.
15
Fuente: material preparado para la asignatura.
Al terminar la instalación uno de los problemas comunes que puede ocurrir es que alguno de los
servicios no pueda ser inicializado. Para los fines de esta asignatura solo necesitaremos levantar el
servicio correspondiente al servidor para http Apache.
Este servidor por defecto se levanta y escucha en el puerto 80 del computador. Si otra aplicación,
por ejemplo Internet Información Server (IIS), está ocupando este puerto será necesario configurar
Apache para que escuche peticiones de servicio en otro puerto como 88 o 85. A continuación se
podrá ver qué es el servicio escucha en el puerto 88:
Paso 1 En el nivel de servicio de Apache se debe presionar el botón “Config”.
Paso 2 Se abrirá un menú en el cual se debe seleccionar la opción “Apache

(httpd.conf)”.
16
Paso 3 Al abrir el archivo de texto “httpd.conf” se podrá ejecutar el cambio
escribiendo el puerto 88.
Luego se debe grabar el archivo e inicializar el servicio del servidor Apache.
3.1.5. UTILIZACIÓN
Para comprobar que el servidor web está en funcionamiento se debe realizar la siguiente
operación, nuevamente desde el panel de control usando la opción “Admin”.
Si no existen problemas, en pantalla deberá aparecer la siguiente página web en el navegador por
defecto en el computador:
17
La URL http://localhost da cuenta de que el servidor ya está en funcionamiento.
Una de las cosas importantes a las que se debe poner atención en relación a la utilización del
servicio de XAMPP es que la carpeta en la cual se procederá a crear los sitios y páginas de prueba
es la carpeta “htdocs” dentro de la carpeta “xampp”.
18
3.2. EDITOR DE PÁGINAS WEB KOMPOZER
3.2.1. CARACTERÍSTICAS
Esta aplicación es un editor de páginas web con característica WYSIWYG

(What you see is what you get - Lo que ves es lo que obtienes). Su
función principal es permitir un desarrollo ágil y que el desarrollador o
diseñador pueda ir visualizando el documento tal como se mostrará en
la ventana del navegador.
Posee herramientas importantes, como un soporte integrado de CSS y

una gestión mejorada para el servicio de transferencia de archivos FTP,
Fuente: importante para la actualización y publicación de las páginas en la web.
http://www.kompozer.ne
t/community.php
3.2.2. FUNCIONES
KompoZer sigue el estándar estricto de la versión HTML 4.01, pero el usuario puede cambiar los
ajustes y escoger entre (EcuRed, s. f.):
 DTD estricto y transicional.

 HTML 4.01 y XHTML 1.0.
 Admite etiquetas PHP sin alterar su contenido.
 Limpiador de código HTML.
 Generador automático de tablas de contenido basado en los niveles de encabezado.
 Editor CSS avanzado, con capacidad de crear y usar tanto archivos CSS externos como
hojas incrustadas en el archivo HTML mediante etiquetas <style>. Enlace directo con el
validador HTML de W3C.
 Editor web WYSIWIG con la representación del motor Gecko 1.8.1 (en la próxima
versión 0.8, ya en beta avanzada).
 Opciones especiales para la inserción de imágenes, tablas y formularios.
 Posibilidad de definir y usar plantillas.
 Completa ayuda incorporada en el programa.
19
3.2.3. INSTALACIÓN
A continuación se muestra un tutorial explicativo en el cual se detalla la instalación de KompoZer

paso a paso:
Paso 1 Lo primero que se debe hacer es descargar el editor desde la siguiente dirección:
http://www.kompozer.net/
Paso 2 Una vez en la página, se debe seleccionar la opción “Download KompoZer for
Windows”. El programa será descargado en formato comprimido.
Paso 3 Una vez descargado el programa se debe descomprimir el archivo, acción que
generará la carpeta KompoZer 0.7.10. Dicha carpeta contiene el programa de edición.
Paso 4 Posteriormente se debe crear un acceso directo desde Windows al editor. Para ello
se debe localizar la carpeta Kompozer en la raíz del disco duro en que haya quedado
guardado el programa. Se debe hacer clic con el botón secundario del mouse,
seleccionar la opción “Enviar a”, y luego desde el menú desplegable seleccionar la
20
opción “Escritorio (crear acceso directo)”.
Paso 5 Una vez creado el acceso directo, aparecerá en el escritorio el link para acceder a
KompoZer.
3.2.4. CONFIGURACIÓN
En este ámbito solo se debe chequear que en el lenguaje HTML sea el seleccionado para trabajar
en el editor KompoZer.
A continuación se muestra un breve tutorial en el cual se explicita cómo comprobar que la

configuración de KompoZer sea la adecuada:
Paso 1 Una vez que se ha abierto el programa, se debe seleccionar desde el menú
superior la opción “Tools”, y luego “Options”.
21
Paso 2 Una vez que se ha ingresado a la pantalla “Options” se debe seleccionar la
opción “Advanced”. Posteriormente se debe seleccionar la opción “HTML 4”
correspondiente a “Languague”.
22
3.2.5. UTILIZACIÓN
La ventana de KompoZer está conformada por las siguientes barras de trabajo:
A continuación se explica en detalle cada una de las barras:
De título A la izquierda se encuentra el título de la página web. En la derecha se

pueden encontrar los botones de control de la ventana, tales como
minimizar, maximizar/restaurar y cerrar.
De menús Aquí se encuentran los menús File, Edit y otros. Estos están compuestos por
subopciones a las que también se puede acceder.
De redacción Aquí se encuentran los botones con las opciones más habituales para el
manejo de los archivos y de la edición que encontramos en la barra de
menús. Son botones para acceder más velozmente. Por ejemplo, los botones
New, Open, Save, etc.
Barras de Barra que incorpora la opciones más fundamentales para el formateo de

formato párrafos y textos.
Ventana Aquí se encuentran las opciones para la configuración de los sitios web que
administración se vayan construyendo. Se puede acceder también de forma más expedita a
sitios web las distintas páginas web o archivos que conforman el sitio.
23
Permite la publicación y edición de contenido local (en el computador) o
remoto (en otro sitio de la internet).
Ventana de Se trata del espacio de trabajo. Cada página que se edite se mostrará en esta
área de área, pudiendo cambiar de una a otra mediante las pestañas que se
edición muestran en la parte superior con el título de cada página. También permite
mostrar las reglas en esta área, las que ayudarán a dimensionar los diversos
objetos presentes en la página que se está diseñando.
Barra de modo En esta barra se pueden encontrar cuatro pestañas que permiten cambiar el
de edición modo de edición:
 Normal (o modo WYSYWYG).

 HTML Tags (muestra de forma esquemática las etiquetas utilizadas).
 Source (acceso al código HTML de la página).
 Preview (cómo se vería la página en el navegador).
24
Barra de Muestra información relativa a la etiqueta que se esté editando y se
estado pueden seleccionar de forma más expedita otros elementos y sus
contenidos para realizar acciones sobre ellos como dar formatos,
eliminar, etc.
A continuación se presenta un pequeño tutorial (paso a paso) en el que se explica cómo preparar
el ambiente para el desarrollo de las actividades que se revisarán en las semanas siguientes:
25
Paso 1 Lo primero que se debe hacer es ubicar la carpeta de instalación XAMPP en el disco
C.
Paso 2 Luego se debe ingresar a la subcarpeta “htdocs”. Se sugiere eliminar todo el

contenido que dicha carpeta trae por defecto.
26
Paso 3 Posteriormente se debe crear la carpeta “Clase1” dentro de “htdocs”.
La carpeta “Clase1” será la que contenga todas las páginas web que se desarrollarán
en una primera parte dentro de la asignatura, y asimismo será la base para el sitio
web que se creará en las semanas finales.
Una vez que ya se ha creado la carpeta “Clase1”, se procederá a crear un nuevo sitio. Para ello se
debe abrir el programa KompoZer.
Paso 1 Lo primero que se debe hacer es dar clic en el botón “edit sites” representado con
un ícono que posee dos pantallas de computador. Se desplegará la ventana
llamada “Publish Setting” en la cual se debe configurar el nombre de la página y la
carpeta que se utilizará para su desarrollo.
27
Paso 2 En el casillero “Site Name” se debe ingresar el nombre “Clase1” y mediante el
botón “Select directory” buscar en el disco duro la carpeta “Clase1” previamente
creada dentro de “htdocs”.
Se debe presionar “Aceptar” para continuar.
28
Paso 3 Se debe presionar “OK” para terminar la creación del sitio.
Paso 4 Dentro del editor KompoZer se crea una página web, y en la modalidad de edición
“HTML Tags”, ubicada en la zona inferior de la pantalla, se puede colocar un título
a la página y algún mensaje en el cuerpo de la misma.
29
Paso 5 Para observar los cambios hechos en el paso anterior, utilizamos la modalidad
de edición Preview, la cual muestra el sitio tal como se vería en un navegador.
Paso 6 Se guarda dentro de la carpeta “Clase1” la página creada, con el nombre de

archivo “index”. Es importante destacar que la extensión “.html” será aportada
automáticamente por KompoZer al grabar.
30
Paso 7 Se puede observar que la nueva página aparece en la ventana de
administración de sitios, dentro de la carpeta “Clase1”.
Paso 8 Posteriormente se revisa cómo se despliega la página en el navegador (en este

caso Internet Explorer). Para ello se debe escribir la siguiente URL en la barra
de direcciones: http://localhost:88/Clase1/.
Es muy importante recordar el puerto en el cual se levanta el servicio de
Apache del ambiente XAMPP, el cual debe ser especificado en la dirección a
ingresar (para efectos de este ejemplo se utiliza el 88).
31
COMENTARIO FINAL
Hoy en día la mayoría de las empresas, por no decir todas, tienen presencia en internet a través de
páginas web, lo cual trae consigo una infinidad de ventajas tanto para la empresa como para sus
clientes. Ahora bien, esas páginas deben elaborarse con algún lenguaje de programación, es por
eso que en esta primera semana conocimos HTML, el cual es un lenguaje de marcas para la
diagramación de páginas web.
Entre los contenidos que se cursaron durante esta semana, se pudo ver a grandes rasgos los
fundamentos del HTML, iniciando con su historia, para luego trabajar propiamente con el mismo,
conociendo así cómo se escribe en este lenguaje y la forma en la que se estructura una página
web. Por otra parte, se conocieron las herramientas que se deben utilizar para poder programar
en HTML, las cuales servirán de base para los ejercicios que se desarrollarán durante toda la
asignatura.
32
REFERENCIAS
EcuRed (s. f.). Kompozer. Recuperado de: http://www.ecured.cu/index.php/Kompozer
Powell, Th. (1998). HTML, manual de referencia. Madrid: McGraw-Hill Interamericana.
Librosweb (s. f.). Breve historia de HTML. Recuperado de:

http://librosweb.es/libro/xhtml/capitulo_1/breve_historia_de_html.html
PARA REFERENCIAR ESTE DOCUMENTO, CONSIDERE:
IACC (2015). Fundamentos de HTML. Programación HTML I. Semana 1.
33
34

01 Contenido HTML I V9 PDF

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

01 Contenido HTML I V9 PDF

Cargado por

Copyright:

Formatos disponibles

PROGRAMACIÓN HTML I

FUNDAMENTOS DE HTML ................................................................................................................... 4

Un lenguaje de marcas es un conjunto de etiquetas que representan elementos y que permiten

El físico Tim Berners-Lee propone un revolucionario sistema basado en

La última especificación oficial de HTML se publicó el 24 de diciembre y se

WHATWG publicó en octubre la actual versión HTML 5, en la cual están basados

Fuente: tabla elaborada para la asignatura en base a Librosweb (s. f.).

Una página HTML posee la siguiente estructura básica:

Fuente: material elaborado para la asignatura.

Dentro de estas dos etiquetas se distinguen dos secciones principales:

La información contenida en la etiqueta de <HEAD>...</HEAD> no se despliega directamente en el

Las etiquetas válidas a utilizar dentro de la cabecera son las siguientes:

<META> Especifica el tipo de contenido, el set de caracteres, etc.

Se vería así en Internet Explorer:

link rel="stylesheet" media="screen" href="global.css" type="text/css" >

<script type="text/javascript" href="ajaxtcr.js"></script>

La etiqueta <BODY>...</BODY> posee ciertos atributos que definirán

... Este es el cuerpo de mi página

Y se mostraría así en Internet Explorer:

Fuente: material preparado para la asignatura.

Los atributos comunes de la etiqueta <BODY> son:

bgcolor Define el color del fondo de la página.

XAMPP se compone de cuatro aplicaciones principales. Estas son:

XAMPP se puede descargar sin costo desde el siguiente sitio:

Paso 1 Seleccionar la primera opción de XAMPP para Windows.

Paso 5 A continuación se presenta un producto relacionado con XAMPP (Bitnami). Se

Paso 8 Una vez terminada la instalación aparecerá la siguiente pantalla:

Con esto se confirma que la instalación se ha ejecutado de manera exitosa.

Paso 1 En el nivel de servicio de Apache se debe presionar el botón “Config”.

Paso 2 Se abrirá un menú en el cual se debe seleccionar la opción “Apache

Luego se debe grabar el archivo e inicializar el servicio del servidor Apache.

Esta aplicación es un editor de páginas web con característica WYSIWYG

Posee herramientas importantes, como un soporte integrado de CSS y

 DTD estricto y transicional.

A continuación se muestra un tutorial explicativo en el cual se detalla la instalación de KompoZer

A continuación se muestra un breve tutorial en el cual se explicita cómo comprobar que la

La ventana de KompoZer está conformada por las siguientes barras de trabajo:

A continuación se explica en detalle cada una de las barras:

De título A la izquierda se encuentra el título de la página web. En la derecha se

Barras de Barra que incorpora la opciones más fundamentales para el formateo de

 Normal (o modo WYSYWYG).

 Preview (cómo se vería la página en el navegador).

Paso 2 Luego se debe ingresar a la subcarpeta “htdocs”. Se sugiere eliminar todo el

Se debe presionar “Aceptar” para continuar.

Paso 6 Se guarda dentro de la carpeta “Clase1” la página creada, con el nombre de

Paso 8 Posteriormente se revisa cómo se despliega la página en el navegador (en este

Powell, Th. (1998). HTML, manual de referencia. Madrid: McGraw-Hill Interamericana.

Librosweb (s. f.). Breve historia de HTML. Recuperado de:

PARA REFERENCIAR ESTE DOCUMENTO, CONSIDERE:

IACC (2015). Fundamentos de HTML. Programación HTML I. Semana 1.

También podría gustarte