Autor Tema: HTML. Subir nuestra web al servidor html (Internet) explorador archivo CU00730B  (Leído 2297 veces)

KOFFERO

  • Principiante
  • **
  • Mensajes: 78
    • Ver Perfil
Ejercicio CU00730B del curso de programación web con HTML desde cero.

Enunciado:
Citar
EJERCICIO

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.

Código HTML 1:
Código: [Seleccionar]
<!DOCTYPE html>
<html>
        <head>
        <title>Tutoriales de PC - jorgeprogramas.byethost18.com</title>
<meta charset="UTF-8" />
</head>
<body>
     <!-- contenedor de la página -->
        <div style="width: 840px; margin: auto; border: solid 2px gray; text-align: center;">

<!-- cabecera de la página -->
       <div id="header">
   <img src="img/img1.png" alt="header" title="jorgeprogramas"  />
   <h1>Tutoriales de PC, aprensizaje de usos de programas.</h1>
   </div>
     <!-- fin de la cabecera -->

<!-- menú de la página -->
   <div id="menu">
   <h3>Contenidos del menú:</h3>
          <ul>
   <li><a href="contec2.html">Descargar Winkawaks 1.65</a></li>
   <li><a href="contec1.html">Descargar RipSM 75</a></li>
  </ul>
   </div>
<!-- fin del menú -->

<!-- cuerpo de la página -->
<br/><br/>
   <div id="cuerpo">
         <h4>Hola amigos ?</h4>
<p>En esta ocación les presento mi simple página de inicio, por ahora es bastante simple, pero mas adelante ya le haré mas modificaciones.
Por lo tanto quiero contarle de que se tratará esta web</p>

<p>La web, simplemente lo hice para enseñar como descargar algunos programas, y como usarlos, ya luego haré otro tipo de tutoriales. Pero mientras tanto esta
página básica, que es para el ejericio del curso de HTML de <a href="https://aprenderaprogramar.com/" target="_blank">aprenderaprogramar.com</a>, espero le guste.</p>

<p>Voy crear tres archivos <b>HTML</b>, aparte del inicio de la web, ya que cree tres items en el menú y no quedaria bien si pongo inicio en el primer items.</p>

<p>Un saludo. ;)</p>
   </div>
   <!-- fin del cuerpo -->
   
   <!-- pie de la página -->
   <br/><br/>
   <div id="footer">
     <img src="img/img2.png" alt="footer" title="pie de la página web" width="150px" /><span>Copyright 2000-2017 jorgeprogramas.com</span>
   </div>
           <!-- fin del pie -->    
</div>
</body>
</html>

Código HTML 2:
Código: [Seleccionar]
<!DOCTYPE html>
<html>
       <head>
           <title>Descargar e instalar RipSM Versión 75 - jorgeprogramas.byethost18.com</</title>
   <meta charset="UTF-8" />
   </head>
   <body>
           <div style="width: 840px; text-align: center; margin: auto; border: solid 2px gray;">
          <div id="header">
  <img src="img/img1.png" alt="header" title="jorgeprogramas"  />
  </div>
  <br/><br/>
  <div id="menu">
  <h4>Elementos del menú:</h4>
         <ul>
      <li><a href="index.html">Inicio</a></li>
  <li><a href="contec2.html">Descargar Winkawaks 1.64</a></li>
</ul>
  </div>
  <div id="cuerpo">
  <br/>
         <h1>Descargar RipSM Versión 75</h1>
<h3>Hola amigos ?</h3>
<p>En esta ocación les voy a enseñar como descargar y usar <b>RipSM</b>, para que puedan descargar sus mangas favoritos.
Bueno lo primero que tienen que hacer es ir a la siguiente dirección que les dejo <a href="http://realidadscans.org/comunidad/viewtopic.php?t=6">aquí</a>.
En la siguiente dirección tienen que baja hasta bajo, donde muestra la option de descargar como muestra acontinuación:</p>
<img src="https://i.imgur.com/1hW97b2.png" alt="RipSM" title="Descargar" />
<br/>
<p>Y hay tienen que elegir para la plataforma que van a descargar, si es para <b>android</b> o para <b>windows</b>, como yo tengo windows, voy elegir esa.
Una vez han hecho click en el elence le mandara a una página para que salten los cincos segundos de pulicidad, como muestro acontinuación:</p>
<img src="https://i.imgur.com/Rtef0Af.png" alt="RipSM" title="Publicidad" width="500px" /><br/>
<p>Y le dan en saltar publicidad, y automaticamente se les enpezara a descargar el archivo. Una vez ya descargado les quedara un archivo rar
de la siguiente manera:</p>
<img src="https://i.imgur.com/bzojMvr.png" alt="RipSM" title="Rar" width="300px" /><br/><br/>
<p>Lo descomprimen y les debe quedar de la siguiente manera:</p>
<img src="https://i.imgur.com/mrDDgmk.png" alt="RipSM" title="Exe" width="300px" /><br/><br/>
<p>Una vez hecho todo esto lo ejecutamos, ya abierto les debe mostra algo así:</p>
<img src="https://i.imgur.com/QpTDsSK.png" alt="Rip" title="Programa" width="500px" /><br/><br/>
<p>Bueno ya tiene el programa, ahora solamente tienen que buscar páginas donde puedan descargar sus mangas.
Yo les recomiendo <a href="http://submanga.com/">submanga.com</a>, es una de las mejores páginas.</p>

<p>Okey, ahora viene lo mas chulo, como usarlo, ya en la página submanga, lo que tienen que hacer es buscar su manga, y una vez ya lo tienen
hagan lo siguiente: copian la url del espisodio del manga, por ejemplo:</p>
<img src="https://i.imgur.com/imcTRrE.png" alt="RipMS" title="manga" /><br/><br/>
<p>Copian la url. Pero con el programa de RipMS abierto obviamente, compian y les debe aparecer el siguiente mensaje:</p>
<img src="https://i.imgur.com/9iS2Uqq.png" alt="RipMS" /><br/><br/>
<p>Le dan en aceptar y enpezara a descargar su manga:</p>
<img src="https://i.imgur.com/PkOWOC8.png" alt="Rip" /><br/><br/>
<p>Espero le haya servido amigos. Un saludo XDXD</p><br/><br/>
  </div>
  <div id="footer">
               <img src="img/img2.png" alt="footer" title="pie de la página web" width="150px" /><span>Copyright 2000-2017 jorgeprogramas.com</span>
  </div>
   </div>
   </body>
</html>

Código HTML 3:
Código: [Seleccionar]
<!DOCTYPE html>
<html>
        <head>
        <title>Descargar e instalar Winkawaks 1.64 - jorgeprogramas.byethost18.com</title>
<meta charset="UTF-8" />
</head>
<body>
        <div style="width: 840px; margin: auto; text-align: center; border: solid 2px gray;">
       <div id="header">
       <img src="img/img1.png" alt="header" title="jorgeprogramas"  />
   </div>
   <br/>
   <div id="menu">
         <ul>
      <li><a href="contec1.html">Descargar RipSM  75</a></li>
  <li><a href="index.html">Inicio</a></li>
</ul>
   </div>
   <div id="cuerpo">
          <h1>Descargar Winkawaks 1.65 para windows</h1>
  <h4>Hola amigos ?</h4>
  <p>En esta ocación le voy a mostra como descargar el emulador neogeo, para que puedan jugar sus juegos favoritos.
  Bueno lo primero es ir al siguiente link: <a href="http://www.winkawaks.org/downloads.htm">Descargar winkawaks</a>.
  Okey una vez allí tiene que hacer click en <b>Winkawaks.zip</b>, para descargarlo, por ejemplo:</p>
  <img src="https://i.imgur.com/XgFkScd.png" alt="winkawaks" title="Descargar winkawaks" width="800px" />
  <br/><br/>
  <p>Y se enpezará a descargar, y una vez descargado lo desconprimen. Y despues de eso le debe quedar una carpeta lo abren, y ejecutan <b>Winkawaks.exe</b>,
  ya ejecutado les pedira que acepten algunos ajustes sobre el gráfico, una vez abierto, selecionamos el juego.</p>
  <img src="https://i.imgur.com/XAH4N57.png" alt="winkawaks" title="juegoKOF2002" /><br/><br/>
  <p>En mi caso KOF2002.</p>
  <img src="https://i.imgur.com/N2K5E77.png" alt="kof2002" width="600px" /><br/><br/>
  <p>Espero le haya ayudado, Un saludo.</p>
   </div>
   <br/><br/>
   <div id="footer">
    <img src="img/img2.png" alt="footer" title="pie de la página web" width="150px" /><span>Copyright 2000-2017 jorgeprogramas.com</span>
   </div>
</div>
</body>
</html>

Tuve problema a la hora de ver mi archivos con el nombre webage1, pero use index.html para el primero y hay funcionó de diez

Un saludo. :D
« Última modificación: 18 de Noviembre 2017, 18:37 por Alex Rodríguez »
¡Me encanta aprender!

Alex Rodríguez

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2050
    • Ver Perfil
Ejercicio correcto

Saludos

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".