Autor Tema: Subir web al servidor html crear vínculos entre distintas páginas CU00730B (Leído 2038 veces)

hymsoft · « **en:** 09 de Agosto 2016, 10:45 »

Buenas!!! ya cree mi cuenta en byethost y subi mi ejercicio del curso Aprende a crear páginas web básicas con HTML, CU00730B. Este sería el link http://cursohymsoft.byethost4.com/webpage1.html.

Traté de usar todo lo aprendido. En la página 2, uso imágenes cuya ubicación esta en la web y siempre se ven, pero en la pagina 3 uso imágenes que estan alojadas en el servidor de byethost, pero no siempre las muestra, si refresco la pagina a veces me muestra las mismas y a veces me muestra otras y asi... por lo menos eso paso durante las pruebas que hice (firefox chrome e IE10)

Aqui los códigos o meta-códigos

webpage1.html

Código: [Seleccionar]

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Página 1 - curso aprenderaprogramar.com</title>
  </head>
  <body>
    <div id="page">
      <!-- cabecera -->
      <div id="header" style="text-align:center">
        <h1>Curso aprenderaprogramar.com</h1>
        <h2>Algo sobre mí</h2>
      </div>
      <!-- fin cabecera -->
      <!--contenedor -->
      <div id="wrapper">
        <!-- menu -->
        <div id="menu">
          <a href="#">Inicio</a> -
          <a href="webpage2.html">Ciudad donde nací</a> - 
          <a href="webpage3.html">Ciudad donde crecí</a> - 
          <a href="webpage4.html">Ciudad donde vivo</a>
          <hr>
        </div>
        <!-- fin menu -->
        <!-- cuerpo -->
        <div id="cuerpo">
          <p>Mi nombre es Hugo Antonio Segura, nací el 11 de Febrero de 1972 en la ciudad de Córdoba, provincia de Córdoba, República Argentina. Soy casado, tres hijos. Mis estudios secundarios están completos pero los universitarios abandonados, ya que debo reconocerlo, soy muy autodidacta y me aburre asistir a la universidad :-(</p>
          <p>Mi primer ordenador fue un XT-8086 (aunque antes tube una <a href="https://en.wikipedia.org/wiki/Commodore_64" target="_blank" title="Mas sobre la commodore 64">commodore 64</a>), monitor fosforo ambar, 256Kb de memoria RAM soldada a la motherboard (si la memoria nome falla), una disquetera de 5 1/4 pulgadas de 360 KBytes de almacenamiento, sin disco rígido. Cargaba un SO DOS en memoria, se extraia el disquet y se colocaba otro con el software se fuera a utilizar. Fue una <strong>REVOLUCION</strong> cuando instale otra disquetera de 5 1/4, ya no tenia que sacar el disquet con el SO ;-) </p>
          No hay muchas fotos de esa maravilla tecnológica, pero externamente son iguales a las XT-8088 que ya vinieron con un bus de datos de 8bits y la esgtruendosa velocidad de 4.7MHz (juaaaaaaaaaaaaaa). Si amplian la imagen 2 veran que todo el sistema operativo se cargaba solo en 51K de memoria RAM.
          <p>
            <a href="https://en.wikipedia.org/wiki/Commodore_64" target="_blank" title="Mas sobre la commodore 64"><img src="http://i.imgur.com/YKnAuXk.jpg" alt="Imagen commodore 64" width="290"> </a>
            <a href="https://retroinformatica.wordpress.com/tag/personal-computer/" target="_blank" title="retroinformatica.wordpress.com"><img src="http://i.imgur.com/ujf0Ciw.jpg" alt="foto xt-8086/8088" width="200px"></a>
            <a href="http://i.imgur.com/2TUyCaR.jpg" title="Ampliar la imagen"><img src="http://i.imgur.com/2TUyCaR.jpg" alt="foto xt-8082/8088" width="230px"> </a>
          </p>
          <p>Mis inicios en la programacion fue en <a href="https://es.wikipedia.org/wiki/Pascal_(lenguaje_de_programaci%C3%B3n)" title="Mas sobre pascal...">Pascal</a> un lenguaje de programación estructurado y muy muy tipado. Después continué con 
          <a href="https://es.wikipedia.org/wiki/DBase" title="Mas sobre DBase...">DBase</a>,
          <a href="https://es.wikipedia.org/wiki/FoxPro_2" title="Mas sobre Foxpro...">Foxpro</a>,
          <a href="https://es.wikipedia.org/wiki/Clipper_(lenguaje_de_programaci%C3%B3n)" title="Mas sobre Clipper...">Clipper</a>,
          <a href="https://es.wikipedia.org/wiki/Visual_FoxPro" title="Mas sobre VisualFoxpro...">VisualFoxpro</a>,
          <a href="https://es.wikipedia.org/wiki/Visual_Basic" title="Mas sobre Visual Basic...">Visual Basic</a>. </p>
          <ol>
            <p>Algunos programas semi-profesionales desarrollados</p>
            <li>Sistema Catastral y Cementerio (Municipalidad de Concepción, Prov. de Tucumán)(dBase)</li>
            <li>Sistema control de pacientes, centro médico y bioquimico(San Miguel de Tucuman, Prov. de Tucumán)(dBase)</li>
            <li>Sistema control de stock Barone S.A. suc. Concepción(Concepción, Prov. de Tucumán)(FoxPro)</li>
            <li>Sistema control taller Electromecánica SER (Rio Gallegos, Prov. de Santa Cruz)(FoxPro)</li>
            <li>Actualización de sistema electromecanica SER a VisualfoxPro, luego a Visual Basic</li>
            <li>Sistema integral Fábrica de chazinados (Rio Gallegos, Prov. Santa Cruz)(Visual FoxPro)</li>
          </ol>
          <hr>
          <!-- formulario -->
          <form action="recibo_mensaje.php" method="get">
            <h3>Me dejas un comentario...</h3>
            Nombre(s): <input name="nombre" type="tex" /> Apellido(s): <input name="apellido" type="text" /> <br/>
            Ciudad donde vives??? <input name="ciudad" type="text" /> Pais: <input name="pais" type="text"/> <br/>
            E-mail: <input name="mail" type="email" size="60px" /><br/>
            Comentario: <textarea name="comentario" rows="4" cols="60"></textarea>
            <br/>
            <button type="submit">Enviar</button> <button type="reset">Cancelar</button>
          </form>
          <!-- fin formulario-->
          
        </div>
        <!-- fin cuerpo -->
      </div>
      <!-- fin contenedor -->
      <!-- pie -->
      <div id="footer">
        <hr>
        <a href="#">Inicio</a> -
        <a href="webpage2.html">Ciudad donde nací</a> - 
        <a href="webpage3.html">Ciudad donde crecí</a> - 
        <a href="webpage4.html">Ciudad donde vivo</a>
      </div>
      <br/>
      <div style="border: 0px; text-align:center; background: blue;">
        <a href="https://www.facebook.com/hymsoft" title="Ir a mi Facebook" target="_blank"><img src="http://i.imgur.com/0Vl1TBC.png"> </a>
        <a href="https://twitter.com/Hymsoft?lang=es" title="Ir a mi Twitter" target="_blank"><img src="http://i.imgur.com/wberWUx.png"> </a>
        <a href="https://www.instagram.com/hymsoft/" title="Ir a mi Instagram" target="_blank"><img src="http://i.imgur.com/qtngZH6.png"> </a>
      </div>
      <!-- fin pie -->
    </div>
  </body>
</html>

webpage2.html

Código: [Seleccionar]

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Página 2 - curso aprenderaprogramar.com</title>
  </head>
  <body>
    <div id="page">
      <!-- cabecera -->
      <div id="header" style="text-align:center">
        <h1>Curso aprenderaprogramar.com</h1>
        <h2>Hugo A. Segura(hymsoft) - Ciudad donde nací</h2>
      </div>
      <!-- fin cabecera -->
      <!--contenedor -->
      <div id="wrapper">
        <!-- menu -->
        <div id="menu">
          <a href="webpage1.html">Inicio</a> -
          <a href="#">Ciudad donde nací</a> - 
          <a href="webpage3.html">Ciudad donde crecí</a> - 
          <a href="webpage4.html">Ciudad donde vivo</a>
          <hr>
        </div>
        <!-- fin menu -->
        <!-- cuerpo -->
        <div id="cuerpo">
          <p>El río cordobés Suquía fue testigo de la fundación de Cordoba Capital, pues fue a sus márgenes donde el español Jerónimo Luis de Cabrera, el 6 de julio de 1576 le diera el nombre de Cordoba La Llana de la Nueva Andalucía.</p>
          <p>Poco más de 20 años después, en 1599, se instaló allí la orden religiosa de los Jesuitas, transformándo estas tierras en su punto central de tareas de evangelización.</p>
          <p>El trabajo pedagógico y misional de esta congregación resultaron ser de suma importancia para la vida y desarrollo cultural del Río de la Plata y de Tucumán.</p>
          <p>Así fue que dejaron una huella imborrable, en la ciudad de Córdoba Capital, llamada la Manzana de las Luces y declarada por la UNESCO Patrimonio Cultural de la Humanidad, guardande entre ladrillo y ladrillo la historia de la provincia y del país.</p>
          <p>Allí se encuentran la Iglesia de la Compañía de Jesús, la Universidad Nacional de Cordoba y el Colegio Nacional de Montserrat. Junto a ellos se erigen las Estancias Caroya, Jesús María, Santa Catalina, La Candelaria y Alta Gracia.</p>
          <p>Por la orden de expulsión dictada por el Rey Carlos III de España, los jesuitas debieron marcharse, dejando innumerables muestras de valor en estas tierras, herencia que a simple vista se puede contemplar, con sus imponentes construcciones y la riqueza de sus enseñanzas.</p>
          <p><a href="https://es.wikipedia.org/wiki/Ciudad_de_C%C3%B3rdoba_(Argentina)" target="_blank" title="Mas datos...">Mas datos sobre Córdoba - Republica Argentina</a> - <a href="http://www2.cordoba.gov.ar/portal/" title="Página oficial" target="_blank">Página oficial de la municipalidad de Córdoba</a> </p>
          <h3>Algunas Fotos:</h3>
          <img src="http://i.imgur.com/tundddG.jpg">
          <img src="http://i.imgur.com/db1KYL2.jpg">
          <img src="http://i.imgur.com/5iWiR7M.jpg">
          <img src="http://i.imgur.com/ifggbdK.jpg">
        </div>
        <!-- fin cuerpo -->
      </div>
      <!-- fin contenedor -->
      <!-- pie -->
      <div id="footer">
        <hr>
        <a href="webpage1.html">Inicio</a> -
        <a href="#">Ciudad donde nací</a> - 
        <a href="webpage3.html">Ciudad donde crecí</a> - 
        <a href="webpage4.html">Ciudad donde vivo</a>
      </div>
      <br/>
      <div style="border: 0px; text-align:center; background: blue;">
        <a href="https://www.facebook.com/hymsoft" title="Ir a mi Facebook" target="_blank"><img src="http://i.imgur.com/0Vl1TBC.png"> </a>
        <a href="https://twitter.com/Hymsoft?lang=es" title="Ir a mi Twitter" target="_blank"><img src="http://i.imgur.com/wberWUx.png"> </a>
        <a href="https://www.instagram.com/hymsoft/" title="Ir a mi Instagram" target="_blank"><img src="http://i.imgur.com/qtngZH6.png"> </a>
      </div>
      <!-- fin pie -->
    </div>
  </body>
</html>

webpage3.html

Código: [Seleccionar]

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Página 3 - curso aprenderaprogramar.com</title>
  </head>
  <body>
    <div id="page">
      <!-- cabecera -->
      <div id="header" style="text-align:center">
        <h1>Curso aprenderaprogramar.com</h1>
        <h2>Hugo A. Segura(hymsoft) - Ciudad donde crecí</h2>
      </div>
      <!-- fin cabecera -->
      <!--contenedor -->
      <div id="wrapper">
        <!-- menu -->
        <div id="menu">
          <a href="webpage1.html">Inicio</a> -
          <a href="webpage2.html">Ciudad donde nací</a> - 
          <a href="#">Ciudad donde crecí</a> - 
          <a href="webpage4.html">Ciudad donde vivo</a>
          <hr>
        </div>
        <!-- fin menu -->
        <!-- cuerpo -->
        <div id="cuerpo">
          <p>Segunda ciudad de importancia en el interior de Tucumán, Concepción se erige cercada por bellos paisajes liderando el Circuito Sur del territorio provincial. Atractiva, prometedora y desafiante, invita a hospedarse en su centro urbano y a disfrutar de las más sensacionales propuestas turística en los alrededores.</p>
          <p>Una interesante infraestructura de servicios seduce desde Concepción vociferando los maravillosos atractivos de los que es portal de ingreso o ruta de acceso. La incomparable Cuesta El Clavillo, ideal para travesías 4x4, mountain bike o cabalgatas; los majestuosos Nevados del Aconquija, ambiente propicio para la aventura en sus más diversos tipos; la Laguna del Tesoro, oculta en el Parque Provincial Cochuna, apta para el trekking y la pesca deportiva; son algunos de ellos.</p>
          <p>En tanto, dentro de la ciudad, la impactante y arbolada Plaza Mitre se arroga la posición de centro social, constituyendo un destacable punto de encuentro diurno entre turistas y lugareños. La Avenida San Martín completará el itinerario con sus bares, restaurantes y comercios, lo que en conjunto produce una movida nocturna capaz de dar al final de la jornada el toque perfecto.</p>
          <p><a href="https://es.wikipedia.org/wiki/Concepci%C3%B3n_(Tucum%C3%A1n)" target="_blank" title="Mas datos...">Mas datos sobre Concepción - República Argentina</a> - <a href="http://concepcion.gob.ar/" title="Página oficial" target="_blank">Página oficial de la municipalidad de Concepción</a> </p>
          <h3>Algunas Fotos:</h3>
          <a href="imagenes/conbig1.jpg"><img src="imagenes/consmall1.jpg" title="Ingreso a Concepción" alt="Concepcion1"></a>
          <a href="imagenes/conbig2.jpg"><img src="imagenes/consmall2.jpg" title="Catedral" alt="Concepcion2"></a>
          <a href="imagenes/conbig3.jpg"><img src="imagenes/consmall3.jpg" title="Rio Gastona" alt="Concepcion3"></a>
          <a href="imagenes/conbig4.jpg"><img src="imagenes/consmall4.jpg" title="Plaza Mitre" alt="Concepcion4"></a>
          
        </div>
        <!-- fin cuerpo -->
      </div>
      <!-- fin contenedor -->
      <!-- pie -->
      <div id="footer">
        <hr>
        <a href="webpage1.html">Inicio</a> -
        <a href="webpage2.html">Ciudad donde nací</a> - 
        <a href="#">Ciudad donde crecí</a> - 
        <a href="webpage4.html">Ciudad donde vivo</a>
      </div>
      <br/>
      <div style="border: 0px; text-align:center; background: blue;">
        <a href="https://www.facebook.com/hymsoft" title="Ir a mi Facebook" target="_blank"><img src="http://i.imgur.com/0Vl1TBC.png"> </a>
        <a href="https://twitter.com/Hymsoft?lang=es" title="Ir a mi Twitter" target="_blank"><img src="http://i.imgur.com/wberWUx.png"> </a>
        <a href="https://www.instagram.com/hymsoft/" title="Ir a mi Instagram" target="_blank"><img src="http://i.imgur.com/qtngZH6.png"> </a>
      </div>
      <!-- fin pie -->
    </div>
  </body>
</html>

webpage4.html

Código: [Seleccionar]

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Página 4 - curso aprenderaprogramar.com</title>
  </head>
  <body>
    <div id="page">
      <!-- cabecera -->
      <div id="header" style="text-align:center">
        <h1>Curso aprenderaprogramar.com</h1>
        <h2>El enunciado eran 3 páginas asi que...</h2>
      </div>
      <!-- fin cabecera -->
      <!--contenedor -->
      <div id="wrapper">
        <!-- menu -->
        <div id="menu">
          <a href="webpage1.html">Inicio</a> -
          <a href="webpage2.html">Ciudad donde nací</a> - 
          <a href="webpage3.html">Ciudad donde crecí</a> - 
          <a href="#">Ciudad donde vivo</a>
          <hr>
        </div>
        <!-- fin menu -->
        <!-- cuerpo -->
        <div id="cuerpo" style="text-align:center">
          <img src="imagenes/en_construccion.png" alt="en construccion" width="500px">
        </div>
        <!-- fin cuerpo -->
      </div>
      <!-- fin contenedor -->
      <!-- pie -->
      <div id="footer">
        <hr>
        <a href="webpage1.html">Inicio</a> -
        <a href="webpage2.html">Ciudad donde nací</a> - 
        <a href="webpage3.html">Ciudad donde crecí</a> - 
        <a href="#">Ciudad donde vivo</a>
      </div>
      <br/>
      <div style="border: 0px; text-align:center; background: blue;">
        <a href="https://www.facebook.com/hymsoft" title="Ir a mi Facebook" target="_blank"><img src="http://i.imgur.com/0Vl1TBC.png"> </a>
        <a href="https://twitter.com/Hymsoft?lang=es" title="Ir a mi Twitter" target="_blank"><img src="http://i.imgur.com/wberWUx.png"> </a>
        <a href="https://www.instagram.com/hymsoft/" title="Ir a mi Instagram" target="_blank"><img src="http://i.imgur.com/qtngZH6.png"> </a>
      </div>
      <!-- fin pie -->
    </div>
  </body>
</html>

Ogramar · « **Respuesta #1 en:** 13 de Agosto 2016, 15:56 »

Buenas Hugo, enhorabuena por tu ejercicio y por compartir ese texto y esas fotos. Yo vivo en España y algún día espero poder viajar a ese gran país. Personalmente tengo gran aprecio por Argentina, me parece un país que a pesar de sus problemas económicos destaca por su belleza y por su gente, que demuestra siempre cultura y educación. Un abrazo!

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias: