Buenas noches. Este es el enunciado del ejercicio CU00730B del tutorial de programación web con HTML desde cero:
Crea tres archivos HTML con diferente contenido y guárdalos con tres nombres de archivo distintos, por ejemplo webpage1.html, webpage2.html y webpage3.html. Establece links entre cada una de las páginas webs para que se pueda pasar de una a otra, por ejemplo desde webpage1.html hemos de poder pasar con un link a webpage2.html y webpage3.html, etc.. A continuación sube los tres documentos HTML al servidor y comprueba que puedan visualizarse y navegar mediante los links entre una página y otra.
Acá el link para ver la página:
http://enigmaticnerd.byethost13.com/pagina1.htmlAcá los códigos:
Página1.html:
<!DOCTYPE html>
<html lang="es">
<head>
<title>
Interstellar
</title>
<meta charset="utf-8"/>
</head>
<body style="background-color:honeydew">
<div id="page" style="width: 980px; text-align: center; margin: auto; border: 2px solid blue;">
<!--INICIO DE LA CABECERA-->
<div id="cabecera">
<h1 style="text-align:center;">Bienvenidos a mi página web</h1>
<p>
Hoy vamos a hacer a una reseña sobre la película <a href="https://es.wikipedia.org/wiki/Interstellar" target="_blank" title="Ir a Wikipedia">Interstellar</a>,
donde se conocerán ciertos aspectos del film y mi experiencia personal con el
</p>
<img src="data:image/jpeg;base64,/9j/4AAQ..." height="400px" alt="Poster de Interstellar"/>
</div>
<!--FIN DE LA CABECERA-->
<!--INICIO DEL CONTENEDOR-->
<div id="wrapper">
<!--INICIO DEL MENÚ-->
<div id="menu">
<ul>
<li><a href="#reseña" title="Ir a reseña">Reseña de la película</a></li>
<li><a href="#opinion" title="Ir a opinión personal">Opinión personal</a></li>
<li><a href="pagina2.html" title="Ver personajes">Personajes principales de la película</a></li>
<li><a href="pagina3.html" title="">Atinos científicos en la película</a></li>
</ul>
</div>
<!--FIN DEL MENÚ-->
<hr/>
<!--INICIO DEL CUERPO-->
<div id="cuerpo">
<h3 id="reseña">Reseña de la película</h3>
<p>
Interstellar (Interestelar en Hispanoamérica)
es una película épica de ciencia ficción estadounidense de 2014,
dirigida por Christopher Nolan y protagonizada
por Matthew McConaughey, Anne Hathaway, Jessica Chastain, Michael Caine y Matt Damon.
La película presenta a un equipo de astronautas que viaja a través de un agujero
de gusano
en busca de un nuevo hogar para la humanidad.
Los hermanos Christopher y Jonathan Nolan escribieron el guion, que tuvo su origen
en un borrador que Jonathan desarrolló en 2007.
Christopher Nolan produjo la película junto a su esposa Emma Thomas
mediante su compañía
productora Syncopy,
y con Lynda Obst a través de Lynda Obst Productions.
El físico teórico Kip Thorne, cuyo trabajo inspiró la película,
fue productor ejecutivo
y participó como consultor científico. Warner Bros.,
Paramount Pictures y Legendary Pictures cofinanciaron la película.
</p>
<br/>
<h3 id="opinion">Opinión personal</h3>
<p>
Al saber que existía la película me interesé en ella, dado que soy aficionado de los films de
ciencia ficción ligados con drama (<a href="https://es.wikipedia.org/wiki/Contact_(pel%C3%ADcula)" target="_blank" title="Ir a Wikipedia">Contacto</a>,
<a href="https://es.wikipedia.org/wiki/The_Dark_Knight" target="_blank" title="Ir a Wikipedia">Batman: el caballero de la noche</a>, entre otras).
</p>
<p>
Desde el comienzo me atrapó con la trama pre-apocalíptica donde el mundo está
a punto de llegar a su fin porque las fuentes de alimentos ya no son suficientes y la
única restante está a punto de extinguirse. El personaje principal (representado por <a href="https://es.wikipedia.org/wiki/Matthew_McConaughey" target="_blank" title="Ir a Wikipedia">
Matthew McConaughey</a>) ya era uno de mis favoritos por su papel en la serie <em>True detective</em> donde
personaliza a un detective de filosofía nihilista pero muy profesional.
</p>
<p>
La trama principal es la que me impactó porque involucra el viaje al espacio e interdimensional,
donde su misión principal es encontrar vestigios de una misión que ya había sido enviada años antes.
Viaje que es dirigido por un muy respetado cuerpo de científicos y el mismísimo gobierno de Estados Unidos,
desde una base secreta.
</p>
</div>
<!--FIN DEL CUERPO-->
</div>
<!--FIN DEL CONTENEDOR-->
<br/>
<!--INICIO DEL PIE-->
<div id="pie">
<img src="data:image/png;base64,iVBO...=" height="30" alt="copyright"/>
EnigmaticNerd 2017-2018. <a href="#cabecera" title="Ir a arriba">Volver arriba</a>
</div>
<!--FIN DEL PIE-->
</div>
</body>
</html>
Página2.html:
<!DOCTYPE html>
<html lang="es">
<head>
<title>
Interstellar
</title>
<meta charset="utf-8"/>
</head>
<body style="background-color:honeydew">
<div id="page" style="width: 980px; text-align: center; margin: auto; border: 2px solid crimson;">
<!--INICIO DE LA CABECERA-->
<div id="cabecera">
<a style="font-size: 20px;" href="pagina1.html" title="Ir al Inicio">Volver a la página principal</a>
<h1>Personajes principales</h1>
<img src="data:image/jpeg;base64,/9j/4AA..." alt="Interstellar"/>
</div>
<!--FIN DE LA CABECERA-->
<hr/>
<!--INICIO DEL CONTENEDOR-->
<div id="wrapper">
<!--INICIO DEL MENÚ-->
<div id="menu">
<ul>
<li><a href="#joseph" title="Ir a Joseph Cooper">Joseph Cooper</a></li>
<li><a href="#murphy" title="Ir a Murphy Cooper">Murphy Cooper</a></li>
<li><a href="#amelia" title="Ir a Amelia Brand">Amelia Brand</a></li>
</ul>
</div>
<!--FIN DEL MENÚ-->
<hr/>
<br/>
<!--INICIO DEL CUERPO-->
<div id="cuerpo">
<span id="joseph">
<img src="https://vignette3.wikia.nocookie.net/interstellarfilm/images/d/de/Josephcooper1.jpg/revision/latest/scale-to-width-down/286?cb=20140606062816" alt="Joseph Cooper"/>
<h2>Joseph Cooper</h2>
<hr/>
<p>
<b>Joseph A. Cooper</b> es un piloto de la NASA con experiencia en ingeniería, y el piloto
de la expedición interestelar. Cooper tiene dos hijos, Tom Cooper y Murphy Cooper. Es interpretado
por el actor <a href="https://es.wikipedia.org/wiki/Matthew_McConaughey" target="_blank" title="Ir a Wikipedia">
Matthew McConaughey</a>
</p>
<br/>
<p><b>Película</b></p>
<hr/>
<p>
No se sabe mucho sobre los primeños años de vida de Cooper excepto que cuando estaba creciendo
ya no había juegos de beisbol debido a los conflictos por comida entre otras cosas.
</p>
<p>
Unos diez años antes del lanzamiento del Endurance, Cooper trabajó como piloto de pruebas para la NASA.
El banco de pruebas que utilizó fue un prototipo de Ranger, mientras sobrevolaba la estratósfera, una anomalía
causó que estrellara la nave.
</p>
<p>
Copper tiene alrededor de 35 años al momento del lanzamiento del Endurance. Al principio, él era muy despectivo
respecto a la fijación de su hija por un "fantasma" en su habitación.
</p>
</span>
<hr/>
<br/>
<span id="murphy">
<img src="https://vignette3.wikia.nocookie.net/interstellarfilm/images/a/ae/Youngmurph.jpg/revision/latest/scale-to-width-down/227?cb=20140606061322" alt="Murphy Cooper"/>
<h2>Murphy Cooper</h2>
<hr/>
<p>
<b>Murphy Cooper</b>, conocida comunmente como <cite>"Murph"</cite> es la hija más joven de Erin y Joseph Cooper.
Ella desarrolla una personalidad idealística pero ruda más adelante en su vida. Ella heredó la afición de su padre por explorar
lo desconocido. Es interpretada por la actriz <a href="https://es.wikipedia.org/wiki/Mackenzie_Foy" title="Ir a Wikipedia" target="_blank">Mackenzie Foy</a>.
</p>
<br/>
<p><b>Película</b></p>
<hr/>
<p>
De los hijos de Cooper, ella era la más apegada a su padre, tenía esa emoción de explorar y descubrir los desconocido,
muy parecida a su padre.
</p>
<p>
Demás está de decir que no le gustaba su nombre, debido a que tenía la idea de que ella era la portadora de la mala suerte,
como sea su padre le reforzaba la idea de que su nombre es en realidad un llamado a la <em>esperanza</em>.
</p>
<p>
Una mañana, ella afirmó que su habitación era acechada por un "fantasma", idea que su hermano y padre no tomaban en cuenta.
Eventualmente, descubrió que se trataba de algo realmente importante, como una serie de filas de polvo acumulado en un patrón
consistente con código binario. Su padre sugirió que eran coordenadas, las cuales llevan al cuartel general de la NASA.
Se puso furiosa cuando su padre le dijo que dejaría la tierra, lo cual tómo como un abandono de parte de él. Rencor que
mantuvo por casi veinticinco años.
</p>
</span>
<hr/>
<br/>
<span id="amelia">
<img src="https://vignette1.wikia.nocookie.net/interstellarfilm/images/d/d9/Ameliabrand1.jpg/revision/latest/scale-to-width-down/300?cb=20140606063903" alt="Amelia Brand"</>
<h2>Amelia Brand</h2>
<hr/>
<p>
Dr.<b>Amelia Brand</b> es la científica/bióloga comandante en jefe de la expedición enviada a través del agujero de gusano
pretendiendo reubicar a la raza humana. Ella es la hija del Dr. John Brand. Es protagonizada por la actriz <a href="https://es.wikipedia.org/wiki/Anne_Hathaway" title="Ir a Wikipedia" target="_blank">Anne Hathaway</a>
</p>
<br/>
<p><b>Película</b></p>
<hr/>
<p>
Como la hija de el director de la NASA, en esencia, fue una de la científicas al frente de la misión.
Aproximádamente diez años antes del lanzamiento del Endurance, ella y un compañero científico Dr. Wof Edmunds estuvieron enamorados.
Cooper sospecha de sus sentimientos hacia Edmund cuando discuten sobre el destino al que arribarían, sabiendo que sus sentimientos hacia
Wolf harían que ella quisiese ir a su planeta primero.
</p>
</span>
</div>
<!--FIN DEL CUERPO-->
</div>
<!--FIN DEL CONTENEDOR-->
<br/>
<br/>
<!--INICIO DEL PIE-->
<div id="pie">
<img src="data:image/png;base64,iVB...I=" height="30" alt="copyright"/>
EnigmaticNerd 2017-2018. <a href="#cabecera" title="Ir a arriba">Volver arriba</a> <a href="pagina1.html" title="Ir al Inicio">Volver a la página principal</a>
</div>
<!--FIN DEL PIE-->
</div>
</body>
</html>
Página 3.html:
<!DOCTYPE html>
<html lang="es">
<head>
<title>
Interstellar
</title>
<meta charset="utf-8"/>
</head>
<body style="background-color:honeydew">
<div id="page" style="width: 980px; text-align: center; margin: auto; border: 2px solid crimson;">
<!--INICIO DE LA CABECERA-->
<div id="cabecera">
<a style="font-size: 20px;" href="pagina1.html" title="Ir al Inicio">Volver a la página principal</a>
<br/>
<br>
<h1>Atinos científicos de la película</h1>
<img src="http://up-ship.com/blog/wp-content/uploads/2014/08/bwah.png" width="500px" alt="Gargantua"/>
</div>
<!--FIN DE LA CABECERA-->
<hr/>
<!--INICIO DEL CONTENEDOR-->
<div id="wrapper">
<!--INICIO DEL CUERPO-->
<div id="cuerpo">
<p>
<b>Atinos</b>: La contribución más sobresaliente del asesoramiento científico de Kip Thorne a la producción de Interstellar fue el de lograr una representación comprensible, atractiva
y consistente de Gargantúa, el agujero negro al que llegan los protagonistas en su búsqueda
de los planetas colonizables.
</p>
<p>
Para esto, Throne se dedicó por un año entero a la creación de ecuaciones que permitían seguir
los rayos de luz a medida que rodean a un agujero negro o entran a un agujero de gusano,
todo con base en la Teoría de la Relatividad de Eistein. El paso siguiente
fue la programación de un software de CGI (Computer Generared Images) que interpretara y
graficara los cálculos de Thron, con un resultado sencillamente espectacular: la imagen de
un agujero de gusano con la apariencia de una esfera de cristal que refleja todo el universo,
y además la icónica imagen del agujero negro con un halo de luz que no sólo lo rodea sino que
también pasa por el medio de él. Pero por qué la luz tendría esta configuración? Kip Throne
explica en el libro “The Science Behind Interstellar” que existe un fenómeno sobresaliente del
agujero negro llamado “disco de acreción”, compuesto por gas caliente procedente de otros soles
que orbita en torno al agujero negro. Sorprendentemente, la interpretación que realizó el
software de los cálculos de Throne fue que esta nube amarilla de gas debería observase como
un flujo luminoso que pasa estar encima, debajo y en frente del agujero.
</p>
<p>
Este trabajo científico arrojó tal cantidad de información novedosa sobre los fenómenos que ocurren alrededor de un agujero negro,
que se están escribiendo ya dos artículos de investigación con estos descubrimientos,
y los expertos consideran ya a Gargantúa
como <b>la representación más realista jamás lograda de un agujero negro hasta el día de hoy</b>.
</p>
</div>
<!--FIN DEL CUERPO-->
</div>
<!--FIN DEL CONTENEDOR-->
<br/>
<!--INICIO DEL PIE-->
<div id="pie">
<img src="data:image/png;base64,iVB...I=" height="30" alt="copyright"/>
EnigmaticNerd 2017-2018. <a href="#cabecera" title="Ir a arriba">Volver arriba</a> <a href="pagina1.html" title="Ir al Inicio">Volver a la página principal</a>
</div>
<!--FIN DEL PIE-->
</div>
</body>
</html>
Nota: Tuve que acortar algunas rutas de imágenes en los códigos dado que eran muy largas y excedían la longitud de caracteres permitidas acá.
Si tienen correcciones o sugerencias, se las agradeceré enormemente. Gracias.