HTML (Pagina Web)

COLEGIO DE ESTUDIOS CIENTIFICOS Y
TECNOLOGICOS DEL ESTADO DE TABASCO

ORGANISMO DESCENTRALIZADO
CECYTE PLANTEL 4
INTEGRANTES:
JADIEL ELIU MIRANDA CHABLÉ
YESSENIA MARTINEZ LARA
PEDRO IVÁN DE LOS SANTOS ARIAS
ESPECIALIDAD PROGRAMACIÓN
SEMESTRE: 5 GRUPO: Ñ
TURNO: VESPERTINO
NOMBRE DEL PROYECTO:

PROYECTO PRODUCTIVO:
(PAGINA WEB INFORMATIVA O FRONT END.)
ASESOR: JUAN CARLOS MORALES PÉREZ
FECHA DE ENTREGA:
15 DE DICIEMBRE DE 2021
pág. 1
INDICE
INDICE..........................................................................2
INTRODUCCIÓN...........................................................3
OBJETIVOS..................................................................4
OBJETIVO GENERAL................................................4
OBJETIVOS ESPECIFICOS......................................4
CONTENIDO................................................................5
DESARROLLO DE LA PAGINA HTML......................5
CARACTERISTICAS DE LA PAGINA HTML.............7
PROPUESTA................................................................8
FUNCIONAMIENTO DE LA PAGINA HTML..............8
CAPTURAS DE PANTALLA.....................................10
CÓDIGOS DE LA PROGRAMACIÓN DE LA PAGINA
HTML........................................................................12
CONCLUSION............................................................15
pág. 2
INTRODUCCIÓN
HTML (Lenguaje de Marcas de Hipertexto, del inglés HyperText Markup

Language) es el componente más básico de la Web. Define el significado y
la estructura del contenido web. Además de HTML, generalmente se utilizan
otras tecnologías para describir la apariencia/presentación de una página
web (CSS) o la funcionalidad/comportamiento (JavaScript).
"Hipertexto" hace referencia a los enlaces que conectan páginas web entre
sí, ya sea dentro de un único sitio web o entre sitios web. Los enlaces son
un aspecto fundamental de la Web. Al subir contenido a Internet y vincularlo
a las páginas creadas por otras personas, te conviertes en un participante
activo en la «World Wide Web» (Red Informática Mundial).
HTML utiliza "marcas" para etiquetar texto, imágenes y otro contenido para
mostrarlo en un navegador Web. Las marcas HTML incluyen "elementos"
especiales como <head>, <title>, <body>, <header>, <footer>, <article>,
<section>, <p>, <div>, <span>, <img>, <aside>, <audio>, <canvas>,
<datalist>, <details>, <embed>, <nav>, <output>, <progress>, <video>,
<ul>, <ol>, <li> y muchos otros.
Un elemento HTML se distingue de otro texto en un documento mediante

"etiquetas", que consisten en el nombre del elemento rodeado por "<" y ">".
El nombre de un elemento dentro de una etiqueta no distingue entre
mayúsculas y minúsculas. Es decir, se puede escribir en mayúsculas,
minúsculas o una mezcla. Por ejemplo, la etiqueta <title> se puede escribir
como <Title>, <TITLE> o de cualquier otra forma.
pág. 3
OBJETIVOS
OBJETIVO GENERAL
Para la realización de este proyecto nos han solicitado, la creación de una

pagina web por medio del HTML, pero antes de seguir, tenemos que tener
claro que es una pagina web, y como sabemos una página web, página
electrónica, página digital o ciber página, es un documento o información
electrónica capaz de contener texto, sonido, vídeo, programas, enlaces,
imágenes, hipervínculos y muchas otras cosas, y que puede ser accedida
mediante un navegador web. Pero en si para que sirve una página web, las
páginas web dependiendo la función que necesitemos nos ayudara, como,
por ejemplo, si vendes productos sirve para promocionar tus productos,
para ofrecer información, realizar ventas e incluso compartir fotos. Desde el
punto de vista de la utilidad una página web puede cubrir muchas
necesidades. Todo depende de qué se necesite y cómo se diseñe.
OBJETIVOS ESPECIFICOS
El objetivo es crear y desarrollar nuestra propia página web, pero si

fuéramos más allá de ser un trabajo escolar, los principales objetivos que
puede tener al crear una página web pueden ser:
1- Vender productos
2- Sitio de información o recopilación de datos
3- Página para convivir con más personas ya se con un mismo propósito
o por algún interés
4- Vender servicios en línea
pág. 4
CONTENIDO
DESARROLLO DE LA PAGINA HTML
Encabezado de la página web
Para comenzar a crear una nueva página web HTML, debes abrir un editor
de texto, como el Bloc de notas. Puedes usar sin problema el que viene por
defecto, en Windows. Una vez que hayas abierto el nuevo archivo, puedes
comenzar escribiendo este código.
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE> DEBES ESCRIBIR EL TITULO DE TU WEB </TITLE>
<META name="description" content=">donde escribirás una breve

descripción de la página">
<META name="keywords" content="Aquí escribe las palabras clave

separadas por una coma">
</HEAD>
<BODY>
</BODY>
</HTML>
Explicación:
<! DOCTYPE HTML> define que el documento debe ser HTML.
<HTML> es el elemento principal de la página HTML.
pág. 5
<HEAD> es la parte donde se inserta información de la web.
<TITLE> es el título de la página que se muestra en la parte superior de la

página navegador.
En el campo «contenido» de la metaetiqueta DESCRIPCIÓN debes ingresar

una descripción que sea relevante para la página de tu sitio, mientras que
en el otro campo de la etiqueta KEYWORDS, ingresa las palabras clave en
las que deseas que se encuentre en particular la web que estás creando.
<BODY> es la parte del documento que contiene la parte «visible» del sitio:
Ahora guarda el archivo de bloque (usa GUARDAR CON NOMBRE) y

guárdalo como index.html . Una vez guardado, lo abres, se abrirá la página
web HTML vacía, pero ya podrás ver el título de la página en la parte
superior.
Insertar un texto
Una vez has creado el comienzo de tu página web puedes comenzar a

introducir el contenido. Para ello, el código html del texto debe colocarse
entre las etiquetas <BODY> </ BODY> .
Ante se usaba la etiqueta FONT, pero como ya no es compatible, para

formatear un texto de una manera particular, es necesario recurrir a CSS.
La etiqueta que se usa para ajustar en su lugar siempre es válida y es <br>.

Entonces, si escribo en el bloc de notas:
Hola <br> esta es una prueba de mi web.
Lo que se mostrará en la página será:
>Hola,
pág. 6
esta es una prueba de mi web
La <br> inserta un salto de línea.
Esta es una etiqueta que no debe abrirse y luego cerrarse.
Ahora veamos cómo usar etiquetas útiles para el texto: entre las más
usadas puedes utilizar negrita, cursiva, subrayado, borrado: <b>, <i>, <u>
<del>
</u>te permite escribir con subrayado</u>
</i>te permite escribir en cursiva</i>
</b>te permite escribir en negrita</b>
<del>te permite cancelar un texto<del>
Estas etiquetas deben estar abiertas y cerradas . Podemos usar una a la

vez o más etiquetas juntas (no se pueden usar juntas por razones obvias, la
etiqueta para subrayar y eliminar).
Color del texto
Veamos cómo colorear el texto para hacer páginas web HTML atractivas.
Debes adjuntar al texto que deseas colorear la etiqueta SPAN. Por sí solo,
la etiqueta SPAN no produce ningún cambio visible en el texto, pero
podemos imponer un estilo con CSS.
Aquí está el código html, el color se puede expresar con el nombre del color
en inglés o con el número hexadecimal precedido por el número de la libra.
pág. 7
CARACTERISTICAS DE LA PAGINA HTML

 Puede ser creado y editado con cualquier editor básico de textos.
 Es multiplataforma, o sea, puede ser visualizado por cualquier
navegador de cualquier sistema operativo.
 No diferencia entre mayúsculas y minúsculas.
 Utiliza etiquetas o marcas, que consisten en breves instrucciones de
comienzo y final, mediante las cuales se determina la forma en la que
debe aparecer en su navegador el texto, así como también las
imágenes y demás elementos en la pantalla del ordenador.
 Cada elemento de un documento HTML consta de una etiqueta de
comienzo, un bloque de texto y una etiqueta de fin.
 Lenguaje estático.
 Es utilizado para la creación de páginas web.
 Los documentos HTML son documentos de hipertexto que aparecen
enlazando a otros documentos.
 Es un estándar reconocido por todo el mundo y cuyas normas define
un organismo sin ánimo de lucro llamado World Wide Web
Consortium, más conocido como W3C.
pág. 8
PROPUESTA
FUNCIONAMIENTO DE LA PAGINA HTML
La función de toda página web es exclusivamente la de difusión de
información de toda índole: comercial, institucional, educativa, periodística,
gubernamental, etc.
Una página sirve para recopilar o difundir información a través de diferentes
redes informáticas. Es el equivalente en Internet de un folleto, revista,
periódico o diario. Puede estar dedicada a un solo tema o cubrir muchos
temas.
TIPOS DE PÁGINAS WEB
Desde el punto de vista de programación existen páginas con contenido

estático y contenido dinámico:
Estático, desarrolladas principalmente en HTML y CSS, su contenido se
encuentra definido en el servidor y no sufre ninguna modificación en su
entrega al navegador web.
Dinámico, desarrollada principalmente en lenguajes como PHP, ASP y con
bases de datos MYSQL o SQL (aunque también hacen uso del HTML y
CSS), su contenido se genera dinámicamente en el momento en el que se
hace una solicitud al servidor desde un navegador web, la información se
encuentra almacenada en una base de datos.
pág. 9
Desde un punto de vista más de mercadotecnia existe una variedad mas

amplia de páginas, las más comunes son:
Landing Page, página única con información condensada y formas de
contacto utilizada principalmente para campañas publicitarias.
Sitio web, la generalidad de las páginas entra en este rubro y se refiere a
cualquier tipo de sitio de cualquier número de páginas que difunde cualquier
tipo de información.
Tienda en línea, sitio dedicado específicamente a la comercialización de
productos y servicios.
Portal de información, éste tipo de sitios se especializa en la difusión de
noticias de toda índole.
Desde un punto de vista de accesibilidad de la información podemos
distinguir dos tipos de páginas: públicas y privadas. En la primera cualquiera
puede acceder a la información sin ningún tipo de restricción mientras que
en la segunda, se requiere de una invitación o suscripción para poder
acceder a ella.
La mayoría de los sitios utilizan combinaciones de todos los tipos antes
mencionados para desplegar su información. Podemos encontrar sitios, por
ejemplo, que combinan información estática (descripción de servicios) y
dinámica (venta de productos en línea).
pág. 10
CAPTURAS DE PANTALLA
Algunas capturas de pantalla de toda la página HTML.
pág. 11
pág. 12
CÓDIGOS DE LA PROGRAMACIÓN DE LA PAGINA HTML

Estos son los códigos de la página principal de nuestra pagina html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Medio Ambiente</title>
<link rel="stylesheet" href="css/estilos.css">
<link rel="shortcut icon" href="imagenes/favicon-32x32.png">
</head>
<body>
<div id="contenedor">
<header>
<img src="imagenes/mediimg.jpg" alt="MedioAmbienteimg">
</header>
<nav id="menu">
<ul id="desple">
<li id="item"><a href="cuidados.html"
target="_blank">CUIDADOS</a></li>
<li><a href="problemas.html"
target="_blank">PROBLEMAS</a></li>
<li><a href="caracteristicas.html"
target="_blank">CARACTERISTICAS</a></li>
</ul>
</nav>
<section>
<p>
Dentro de los primeros, agrupados bajo la denominación de factores
bióticos, forman parte —además del ser humano y del resto de animales—
toda la flora del planeta junto a los hongos y a pequeños organismos que
cumplen funciones esenciales para el sostenimiento de la vida, y cuyo
principal representante son las bacterias. <br>
pág. 13
En cuanto a los elementos sin vida, conocidos como factores abióticos, son
esenciales para la subsistencia de los organismos vivos y conforman el
espacio físico del ambiente, siendo los componentes básicos del
ecosistema, es decir, el agua, el aire y el suelo. En cuanto a los artificiales,
creados por el ser humano, cabe destacar las tradiciones, la urbanización o
la cultura. La suma de todos conforma el medioambiente.
</p>
<p>
Todo lo relacionado con el medioambiente es estudiado por la ecología, una
rama de la biología especializada en los seres vivos y en su interacción con
el medio. Los especialistas de esta disciplina tienen en la forestación una
cuestión fundamental, ya que los árboles cumplen funciones vitales para
gran parte de la fauna existente y para los seres humanos. Tanto es así que
son los principales productores de oxígeno de los ecosistemas terrestres.
<br><br>
Cada 5 de junio, el mundo conmemora el Día del Medioambiente, con el
objetivo de concienciar a la sociedad sobre la importancia de garantizar una
protección duradera del planeta y sus recursos naturales. Las cifras hablan
por sí solas: 1.200 toneladas de CO2 se vierten a la atmósfera cada
segundo, 8.000 personas mueren al día en algún punto del planeta por
causas relacionadas con la contaminación del aire, alrededor de 140.000
elefantes africanos desaparecieron en la última década como consecuencia
de la falta de acceso a la alimentación o al agua. De ahí la importancia de
contribuir a garantizar una sostenibilidad real a largo plazo de los
ecosistemas.
</p>
<br>
<h1>El factor clave para la vida</h1>
<p>
Cualquier organismo obtiene del medioambiente el sustento necesario para
garantizar su supervivencia, no solo alimento, sino, también, refugio, aire o
energía. Por eso, mantener su equilibrio resulta fundamental para asegurar
la vida tal y como se conoce hoy en día. En el caso de los seres humanos,
precisamos del consumo de gran cantidad de recursos naturales para
comer, vestirnos o, incluso, para fabricar herramientas y otros productos
que luego utilizamos en nuestras actividades diarias. Cuidar el ecosistema
para hacer sostenible el uso de estos recursos y evitar su desaparición no
es, por lo tanto, una filosofía simplemente bondadosa en relación con el
planeta en el que vivimos, sino que nos va nuestra propia vida en ello.
</p>
<p>
pág. 14
Por sí solos y sin ninguna intervención humana, la mayoría de los

ecosistemas, comprendiendo dentro de estos la distinta flora y fauna que los
conforman, serían autosuficientes, gracias al desarrollo de un equilibrio tal
que garantizan su propia supervivencia a través de la biodiversidad. Sin
embargo, la mano del hombre en el pasado ha sido letal para ellos, ya que
el no cuidado de sus interacciones ha provocado la desaparición de
especies o la reducción relevante en su número de especímenes vivos.
<br><br>
De ahí que resulte fundamental la concienciación global de la sociedad para
que realice un uso consciente y racional de los entornos con los que nos
relacionamos. De este modo, además de garantizar la sostenibilidad,
también se promueve el mantenimiento de los factores bióticos y abióticos
para las generaciones futuras, de manera que, a largo plazo, se está
trabajando colectivamente en el mantenimiento, en la conservación y en la
mejora de los ecosistemas.
Según el Banco Mundial, cuando el medioambiente y los recursos naturales
se administran bien, pueden ser la base de un crecimiento sostenido e
inclusivo, contribuyendo decisivamente a la reducción de la pobreza.
Además, este organismo afirma que un tercio de las 100 ciudades más
grandes del mundo se abastece de agua a partir de áreas protegidas,
mientras que tres cuartas partes de los 115  principales cultivos alimentarios
del mundo se basan en la polinización animal. En los países en desarrollo,
los bosques, los lagos, los ríos y los océanos aportan una proporción
considerable de los alimentos, combustibles e ingresos de los hogares, y
constituyen una red de protección social muy valiosa en épocas de crisis,
particularmente para los pobres que viven en zonas rurales.
</p>
<p style="text-align: center;"><img src="imagenes/1.jpg" width="400px"

height="300px" alt="img1"></p>

<h1>
Contaminación y Transformación
</h1>
<p>
La vida está en permanente evolución. Desde que se originó hace millones
de años, los seres han estado en continua transformación, de modo que
algunos se adaptaban a las condiciones cambiantes del ecosistema
mientras otros desaparecen por el camino. De esta manera, la vida en la
Tierra ha logrado persistir en el tiempo de un modo natural, logrando salir
adelante y triunfar en condiciones tan adversas como un gran cataclismo en
pág. 15
el clima, inundaciones de la corteza terrestre o violentas erupciones

volcánicas.
</p>
<p style="text-align: center;"><img src="imagenes/2.jpg" width="400px"

height="300px" alt="Img2"></p>
<p>
Todos estos procesos han sido consecuencia del inexorable paso de
periodos de tiempo muy largos, que han permitido a los ecosistemas y a la
propia biosfera ir encontrando el equilibrio a largo plazo. El problema es que
desde que el hombre dejó de ser un animal nómada e itinerante para
establecerse en lugares fijos y desarrollar la economía, cada vez se ha ido
acelerando más la influencia y el cambio que ha ejercido en la modificación
del medioambiente, utilizando los recursos para su supervivencia y su
propio bienestar. Algunas de estas acciones han traído aparejadas consigo
la destrucción del medio o, al menos, su contaminación. <br> <br>
A partir de mediados del siglo XVIII en adelante, el despegue de la
Revolución Industrial significó la sobreexplotación de los recursos naturales,
con la presencia de agentes químicos, físicos o biológicos que han tenido
un impacto negativo sobre el equilibrio de los ecosistemas, aumentando, de
manera exponencial, la contaminación del medioambiente. La extracción y
la utilización sin control de los recursos minerales, la destrucción de los
bosques, el crecimiento de la agricultura y de la ganadería intensivas, el
desarrollo imparable de las ciudades o la apuesta por las energías no
renovables y por la utilización de los combustibles fósiles han provocado
unos niveles de deterioro de muchos ecosistemas prácticamente
irreparables. <br><br>
En el caso del agua, los desechos industriales y domésticos o la pesca
indiscriminada han diezmado a muchas especies, cambiando los sistemas
de equilibrio, por ejemplo, en la pirámide alimentaria. En cuanto a los
recursos naturales, el abuso de la minería para producir petróleo o
elementos para la industria han llenado muchos ecosistemas de desechos
no biodegradables, que tardarán varios siglos en poder eliminarse de un
modo natural. Por su parte, el uso de combustibles fósiles, como el carbón,
el petróleo o el gas natural, en industrias, sistemas de calefacción o medios
de transporte, libera cada día toneladas de gases nocivos, como el CO2, a
la atmósfera, contribuyendo, de este modo, al calentamiento global. En
cuanto al suelo, los pesticidas y los residuos plásticos han provocado un
deterioro en sus propiedades naturales prácticamente imposible de revertir.
</p>
<br>
<br>
pág. 16
</section>
<footer>
<p style="text-align: center;"><small>&copy 2021. Todos los Derechos
Reservados</small></p>
</footer>
</div>
</body>
</html>
pág. 17
CONCLUSION
Como hemos visto, una página es un archivo donde está contenido el

código HTML en forma de texto. Estos archivos tienen extensión .html o
.htm (es indiferente cuál utilizar). De modo que cuando programemos en
HTML lo haremos con un editor de textos y guardaremos nuestros trabajos
con extensión .html, por ejemplo mipágina.html
Consejo: Utilizar siempre la misma extensión en tus archivos HTML. Eso
evitará que nos confundamos al escribir los nombres de los archivos unas
veces con .htm y otras con .html. Cabe remarcar que hoy todo el mundo usa
la extensión ".html" y no ".htm"
pág. 18

HTML (Pagina Web)

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

HTML (Pagina Web)

Cargado por

Copyright:

Formatos disponibles

COLEGIO DE ESTUDIOS CIENTIFICOS Y

TECNOLOGICOS DEL ESTADO DE TABASCO

NOMBRE DEL PROYECTO:

ASESOR: JUAN CARLOS MORALES PÉREZ

HTML (Lenguaje de Marcas de Hipertexto, del inglés HyperText Markup

Un elemento HTML se distingue de otro texto en un documento mediante

Para la realización de este proyecto nos han solicitado, la creación de una

El objetivo es crear y desarrollar nuestra propia página web, pero si

Encabezado de la página web

<TITLE> DEBES ESCRIBIR EL TITULO DE TU WEB </TITLE>

<META name="description" content=">donde escribirás una breve

<META name="keywords" content="Aquí escribe las palabras clave

<! DOCTYPE HTML> define que el documento debe ser HTML.

<HTML> es el elemento principal de la página HTML.

<HEAD> es la parte donde se inserta información de la web.

<TITLE> es el título de la página que se muestra en la parte superior de la

En el campo «contenido» de la metaetiqueta DESCRIPCIÓN debes ingresar

Ahora guarda el archivo de bloque (usa GUARDAR CON NOMBRE) y

Una vez has creado el comienzo de tu página web puedes comenzar a

Ante se usaba la etiqueta FONT, pero como ya no es compatible, para

La etiqueta que se usa para ajustar en su lugar siempre es válida y es <br>.

Hola <br> esta es una prueba de mi web.

Lo que se mostrará en la página será:

esta es una prueba de mi web

La <br> inserta un salto de línea.

Esta es una etiqueta que no debe abrirse y luego cerrarse.

</u>te permite escribir con subrayado</u>

</i>te permite escribir en cursiva</i>

</b>te permite escribir en negrita</b>

<del>te permite cancelar un texto<del>

Estas etiquetas deben estar abiertas y cerradas . Podemos usar una a la

Color del texto

CARACTERISTICAS DE LA PAGINA HTML

TIPOS DE PÁGINAS WEB

Desde el punto de vista de programación existen páginas con contenido

Desde un punto de vista más de mercadotecnia existe una variedad mas

CÓDIGOS DE LA PROGRAMACIÓN DE LA PAGINA HTML

Por sí solos y sin ninguna intervención humana, la mayoría de los

<p style="text-align: center;"><img src="imagenes/1.jpg" width="400px"

el clima, inundaciones de la corteza terrestre o violentas erupciones

<p style="text-align: center;"><img src="imagenes/2.jpg" width="400px"

Como hemos visto, una página es un archivo donde está contenido el

También podría gustarte