Que Es HTML

Instituto Tecnológico
Internacional
Asignatura
Laboratorio
Alumnos
Daniela Aguilar
Profesor
Lic. Sarahi Macoto
Grado
12mo BTPI
Laboratorio: HTML
1. ¿Qué es el HTML?
Es el lenguaje que se emplea para el desarrollo de páginas de internet.
Está compuesto por una serie de etiquetas que el navegador interpreta y da
forma en la pantalla.
2. ¿Qué empresas utilizan HTML?

Google
Yahoo!
Microsoft
Adobe
Mozilla
3. ¿Cuál es la diferencia de HTML y editores de páginas web?

Dominas con mayor precisión el código de la página, queda más limpio. Si
dominas bien el HTML nunca tendrás ningún problema para hacer lo que
deseas.
Es más complicado el aprendizaje, más lento y cuando se llega a un nivel
avanzado también se hace considerablemente más difícil.
Hacer una página cuesta más trabajo y tiempo.
4. ¿Cómo empiezo a escribir HTML?
El HTML se escribe en forma de «etiquetas», rodeadas por corchetes
angulares (<,>,/). El HTML también puede describir, hasta un cierto punto, la
apariencia de un documento, y puede incluir o hacer referencia a un tipo de programa
llamado script, el cual puede afectar el comportamiento de navegadores web y otros
procesadores de HTML.8
HTML también sirve para referirse al contenido del tipo de MIME text/html o todavía
más ampliamente como un término genérico para el HTML, ya sea en forma
descendida del XML (como XHTML 1.0 y posteriores) o en forma descendida
directamente de SGML (como HTML 4.01 y anteriores).
HTML consta de varios componentes vitales, entre ellos los elementos y

sus atributos, tipos de data y la declaración de tipo de documento.
Primero se debe contare con un editor de ficheros HTML, como Notepad++ o

bloc de notas, luego se comienza con el encabezado_
<HTML>
Daniela Aguilar Página 2

Laboratorio: HTML
5. ¿Qué necesito para crear una página Web?

Los requisitos principales y fundamentales, para escribir código
HTML y crear páginas web, son básicamente dos: saber HTML
(esto lo conseguirás siguiendo este curso) y un editor de texto
(nosotros utilizaremos el Notepad++, aunque se pueden usar
otros editores o programas). Hay muchos profesionales que crean sus páginas
en Dreamweaver, usando Flash u otros programas o tecnologías.
Esta forma de crear páginas web tiene a favor la fácil creación de éstas pero,
si quieres hacer páginas web de calidad y tener un control total sobre el código
generado, lo primero es saber HTML sin más.
Para crear páginas web obviamente necesitas un ordenador y un navegador

(Explorer, Firefox, Chrome o similar) instalado. ¿Necesitamos conexión a
internet para crear páginas web? La respuesta es que no: podemos crear
nuestras páginas en nuestro propio ordenador y a posteriori subirlas a un
servidor remoto para que estén accesibles en internet desde cualquier parte
del mundo. En este curso vamos a trabajar inicialmente en local (es decir, en
nuestro propio ordenador sin necesidad de conexión a internet), y más
adelante veremos cómo subir una web a un servidor. También podríamos
generar una página web directamente sobre un servidor, pero por motivos de
didáctica y sencillez consideramos preferible empezar trabajando en local. Una
vez tengas conocimientos más avanzados, podrás hacerlo como te resulte más
cómodo.
Ahora indicaremos unos sencillos consejos que deberías tener en cuenta antes
de crear tus páginas web.
* Tomar ideas.
Ojo, tomar ideas no es copiar contenidos con derechos de propiedad

intelectual, no debes reproducir el trabajo de otros sin valorar si estás
vulnerando el derecho de propiedad intelectual. Sin embargo, es importante
inspirarte en otros sitios, buscar contenidos que te puedan servir,
combinaciones de colores que se vean bien, y diseños organizados que te
puedan ser útiles.

Laboratorio: HTML
* No uses toda la gama de colores en tu página web.
No crees una página web que parezca un arcoiris: inicialmente te puede

parecer curiosa, pero un usuario que visite tu página web, se sentirá molesto
con demasiados colores.
Por ejemplo, es preferible utilizar el clásico fondo blanco y texto negro o azul,
que el fondo rosa con puntos morados y el texto verde fosforescente. Cuida
que los colores de tu página tengan una buena combinación, y que hagan fácil
la lectura.
Ejemplo mal diseño, colores e imágenes:
* Se ve mejor si cabe en la pantalla.

Procura que tu diseño esté basado en el tamaño de la pantalla, no busques
escribir una novela completa en la página inicial de tu web. Es preferible que
las páginas no tengan scroll horizontal y que el scroll vertical no sea demasiado
largo.
* Administra tus imágenes.

Tu página se verá más atractiva si usas imágenes. No obstante, debes usarlas
de una forma moderada porque un excesivo número de imágenes puede ser
también perjudicial si no permite una buena lectura del contenido.

Laboratorio: HTML
* Haz que tu sitio sea fácil de navegar.
Por muy obvia que parezca esta recomendación, debes dividir la información
en diferentes secciones y ubicar los enlaces a las mismas donde la gente
espere encontrarlos.
Hay algunos sitios donde sólo es posible desplazarse hacia delante o hacia
atrás. En realidad, eso no es "navegar". Es necesario que el visitante pueda
elegir en todo momento qué sección quiere visitar y en qué orden: por ejemplo
tener un menú es algo generalmente aconsejable. No te olvides de incluir en
todas las páginas un enlace a la página de inicio (la primera página) para
facilitar la navegación.
Ejemplo de menú:
También es interesante incluir el logotipo de tu sitio en todas las páginas,

porque no siempre el visitante ingresa al sitio por la página de inicio; si
proviene del enlace de un buscador, es probable que ingrese por cualquier
sección, en ese caso, el logotipo en todas las páginas ayuda a ubicar al posible
visitante donde está.
* Mantén tu sitio actualizado.
Nada es más desagradable que volver a un sitio tiempo después de una visita
y no encontrar ningún cambio. Realizar cambios frecuentes crea en los
visitantes la idea de que el contenido es valioso y vale la pena darse una
vueltecita a menudo.

Laboratorio: HTML
* Prográmate un esquema de actualización y cúmplelo.
Renueva tus promociones, agrega más información sobre nuevos productos,

servicios o artículos, incluye testimonios de clientes o usuarios satisfechos, usa
tu imaginación.
También puedes incluir la fecha de la última actualización en un lugar visible de

tu página de inicio, o bien mantener un apartado donde se vea que los
contenidos están actualizados.
* Promociona tu web: on-line y off-line
Envía tu sitio a los principales motores de búsqueda y directorios (google,

yahoo, etc.). Dedica tiempo a realizar un trabajo a conciencia, el mismo se
justificará plenamente con un mejor posicionamiento en los buscadores.
Después de todo ¿de qué te sirve tener un sitio en Internet si nadie lo

encuentra?
En este curso aprenderemos a utilizar palabras claves (keywords) que

describan tu negocio lo mejor posible. Aquí conviene situarse del lado de quien
busca, ¿qué keywords utilizará tu posible cliente para buscar un sitio de tus
características? Haz una lista, pregunta a amigos/as y conocidos.
No te olvides de incluir tu dirección (http://www.tusitio.com) en toda papelería y

comunicación que emitas: tarjeta comercial, papelería, facturas, remitos,
recibos, folletos, faxes, bolsas, publicidad, etc.
* Información para tus clientes.
Incluye un enlace al pié de cada página para que puedan comunicarse contigo.
En este curso aprenderemos cómo hacerlo. El agregar información con la
dirección física, teléfono completo (con el código del país), fax, etc, ayuda a
crear confianza. Después de todo tú y tu web existen en el "mundo real" no son
un ente imaginario perdidos en el ciberespacio.
Cuando te sea posible, incluye un campo donde tus usuarios puedan ingresar
el email para recibir un boletín o newsletter con novedades sobre tus

Laboratorio: HTML
productos, esto ayuda a crear confianza y lealtad a tu página. Otra opción es la

suscripción mediante RSS ó Atom, que son servicios para poder recibir las
novedades que se van publicando en tu página.
Recuerda que ahora puedes utilizar las redes sociales para promocionar tu
web o empresa online: Facebook, YouTube, Slideshare, Linkedin, etc.
Todas estas ideas pueden ayudarte a tener un sitio web de calidad y bien
posicionado en los buscadores. No tienes por qué cumplirlos todos, ni son
todos los puntos a tener en cuenta para que tu sitio esté el primero en los
buscadores, pero pueden resultar útiles. No te preocupes si ahora algunos
conceptos no te quedan claros porque a medida que trabajes en desarrollos
web irás adquiriendo una visión más completa.
6. ¿Estructura básica de un documento HTML?

Todos los documentos Html tienen la estructura que se muestRa a
continuación, aunque la etiqueta <body> puede ser sustituida
por <frameset> para un tipo de páginas que dividen la ventana del
navegador en varios cuadros (frames).
<HTML>
<HEAD>
<TITLE>Título de la página</TITLE>
...
</HEAD>
<BODY>
Aquí iría el contenido de la página
</BODY>
</HTML>

Laboratorio: HTML
7. ¿Formatos del texto?
Ejemplo
Código Resultado
Texto en negrita Texto normal Texto en negrita
<big>Texto grande</big> Texto normal Texto grande
Texto enfatizado Texto normal Texto enfatizado
Texto en itálica
Texto normal Texto en itálica
Texto pequeño
Texto normal Texto pequeño
Texto fuerte
Texto subíndice Texto normal Texto fuerte
Texto superíndice Texto normal Texto subíndice
<ins>Texto subrayado</ins> Texto normal Texto superíndice
<del>Texto tachado</del> Texto normal Texto subrayado

<tt>Texto teletipo</tt> Texto normal Texto tachado
Texto normal Texto teletipo
Etiquetas para dar forma al texto
Etiquetas Descripción
 Define un texto en negrita

<big> Define un texto grande
 Define un texto enfatizado
 Define un texto en itálica
 Define un texto pequeño
 Define un texto fuerte
 Define un texto subíndice
 Define un texto superíndice
<ins> Define un texto subrayado
<del> Define un texto tachado
<tt> Define un texto de teletipo
<s> Define un texto tachado. Desaprobado. Use <del> en su lugar
<strike> Define un texto tachado. Desaprobado. Use <del> en su lugar
 Define un texto subrayado. Desaprobado. Use <ins> en su lugar

Laboratorio: HTML
Etiquetas de "Texto estructurado"

Estas etiquetas son usadas comúnmente para mostrar códigos de programación.
<code> Define un texto en código de computadora

<kbd> Define un texto del teclado
<samp> Define un texto ejemplo de código de computadora
<var> Define una variable
<pre> Define un texto pre formateado
<listing> Desaprobado. Use <pre> en su lugar
<plaintext> Desaprobado. Use <pre> en su lugar
<xmp> Desaprobado. Use <pre> en su lugar
Etiquetas de citaciones y definiciones
<abbr> Indica una forma abreviada (p.ej., WWW, HTTP, etc.)

<acronym> Indica un acrónimo (p.ej., WAC ,radar, autobús, etc.)
<address> Define la información sobre el autor
<bdo> Define la dirección del texto (p.ej., de izq. a der., de der. a izq.)
<blockquote> Designa una cita larga
<q> Designa una cita corta
<cite> Contiene una cita o una referencia a otras fuentes
<dfn> Indica que aquí es donde se define el término encerrado

Que Es HTML

Uploaded by

Document Information

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

Que Es HTML

Uploaded by

Copyright:

Available Formats

Instituto Tecnológico

Lic. Sarahi Macoto

2. ¿Qué empresas utilizan HTML?

3. ¿Cuál es la diferencia de HTML y editores de páginas web?

HTML consta de varios componentes vitales, entre ellos los elementos y

Primero se debe contare con un editor de ficheros HTML, como Notepad++ o

Daniela Aguilar Página 2

5. ¿Qué necesito para crear una página Web?

Para crear páginas web obviamente necesitas un ordenador y un navegador

Ojo, tomar ideas no es copiar contenidos con derechos de propiedad

Daniela Aguilar Página 3

* No uses toda la gama de colores en tu página web.

No crees una página web que parezca un arcoiris: inicialmente te puede

Ejemplo mal diseño, colores e imágenes:

* Se ve mejor si cabe en la pantalla.

* Administra tus imágenes.

Daniela Aguilar Página 4

* Haz que tu sitio sea fácil de navegar.

También es interesante incluir el logotipo de tu sitio en todas las páginas,

* Mantén tu sitio actualizado.

Daniela Aguilar Página 5

* Prográmate un esquema de actualización y cúmplelo.

Renueva tus promociones, agrega más información sobre nuevos productos,

También puedes incluir la fecha de la última actualización en un lugar visible de

* Promociona tu web: on-line y off-line

Envía tu sitio a los principales motores de búsqueda y directorios (google,

Después de todo ¿de qué te sirve tener un sitio en Internet si nadie lo

En este curso aprenderemos a utilizar palabras claves (keywords) que

No te olvides de incluir tu dirección (http://www.tusitio.com) en toda papelería y

* Información para tus clientes.

Daniela Aguilar Página 6

productos, esto ayuda a crear confianza y lealtad a tu página. Otra opción es la

6. ¿Estructura básica de un documento HTML?

Daniela Aguilar Página 7

7. ¿Formatos del texto?

<ins>Texto subrayado</ins> Texto normal Texto superíndice

<del>Texto tachado</del> Texto normal Texto subrayado

Etiquetas para dar forma al texto

<b> Define un texto en negrita

Daniela Aguilar Página 8

Etiquetas de "Texto estructurado"

<code> Define un texto en código de computadora

Etiquetas de citaciones y definiciones

<abbr> Indica una forma abreviada (p.ej., WWW, HTTP, etc.)

Daniela Aguilar Página 9

You might also like