Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • Alvaro Figueroa Tarea3

    Cargado por

    Alvaro Figueroa
    1K vistas12 páginas

    Título original

    Alvaro_Figueroa_tarea3

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    DOCX, PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Denunciar este documento

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    1K vistas12 páginas

    Alvaro Figueroa Tarea3

    Cargado por

    Alvaro Figueroa

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    de 12

    Tarea Semana 3

    Alvaro Figueroa

    Programación Web

    Instituto IACC

    10 de Mayo de 2020
    Desarrollo

    La empresa Mi retail automotor LTDA, es una pyme dedicada a la venta de repuestos de autos,

    ubicada en Santiago y que ha tenido un crecimiento sostenido en los últimos 18 meses.- Dado lo

    anterior, sus dueños han pensado en proyectar sus servicios desde un sitio web, y lograr así, el

    aumento de los clientes en otras regiones.- Para iniciar esta etapa, se le ha solicitado a usted que

    realice el prototipo de la página web, la que será posteriormente publicada en el servidor que

    contratarán.- Para ello, le han proporcionado un banco de videos e imágenes con los que podrá

    presentar el diseño.- Adicionalmente, le han informado que cuentan con un sitio en YouTube, en

    el que se encuentra publicado el video de presentación de la PYME y cuyo enlace es

    https://youtu.be/_u0bH9joTfg (el enlace es referencial a efectos del desarrollo de la tarea).-

    Desarrolle el código necesario para cumplir con lo solicitado, según lo que se detalla a

    continuación:

    1. Incluya una sección Quiénes somos, que contemple la visualización del video de presentación

    de la pyme Mi retail Automotor.

    2. Implemente una galería con 3 imágenes png. Ubique libremente 3 imágenes asociadas a la

    actividad comercial mencionada.

    3. Desarrolle un formulario que permita realizar una encuesta a los visitantes, que incluya los

    siete elementos siguientes: nombre completo, fecha de nacimiento, dirección, teléfono, correo, el

    modelo y marca de su vehículo.


    Para Comenzar mostraré las imágenes de captura de pantalla de la página ya terminada:

    Ahora mostraré las capturas de pantalla de los codigos y explicaré como lo realicé.

    Principal.html

    En este archivo dividí la página en filas y columnas para poder separar y trabajar más comodo,

    para esto utilicé FRAME Y FRAMESET.-

    <!DOCTYPE html>

    <html lang="en" dir="ltr">

    <head>
    <meta charset="utf-8">

    <title>Mi Retail Automotor</title>

    </head>

    <frameset rows="17%,*" frameborder="1">

    <frame id="frmSuperior" name="frmSuperior" src="pagina1.html"> </frame>

    <frameset cols="25%,*,30%" frameborder="0" >

    <frame id="frmIzquierdo" name="frmIzquierdo" src="pagina2.html"> </frame>

    <frame id="frmcentral" name="frmcentral" src="pagina3.html"> </frame>

    <frame id="frmderecho" name="frmderecho" src="pagina4.html"> </frame>

    </frameset>

    <noframes>

    <body>Su navegador no soporta frames</body>

    </noframes>

    </frameset>

    </html>
    Pagina1.html

    En este archivo, utilicé <CENTER> para incluir un título a la página y un fondo al título:

    <!DOCTYPE html>

    <html lang="en" dir="ltr">

    <head>

    <meta charset="utf-8">

    <title></title>

    </head>

    <body background="imagen1.jpg">
    <center> <font size="7" color="black" face="Comic Sans MS"> <big> <i> <b> MI RETAIL

    AUTOMOTOR LTDA.</b> </i> </big> </font> </center>

    </body>

    </html>

    Pagina2.html

    Acá utilice <P> para redactar el párrafo de quienes somos y caracterizarlo.-

    Para agregar el video utilicé <IFRAME> y <DIV ALIGN=CENTER> para insertar el video y

    cetrarlo.-
    <!DOCTYPE html>

    <html lang="en" dir="ltr">

    <head>

    <meta charset="utf-8">

    <title></title>

    </head>

    <body>

    <center> <h3> ¿Quienes Somos? </h3> </center>

    <p style="text-align:justify"> Somos una PYME dedicada a la reparación, desabolladura y

    pintura Automotriz. Con más de 50 años de experiencia en el Mercado, satisfaciendo y

    cumpliendo con las necesidades de cada uno de nuestros Clientes.</p>

    <br><br><br><br><br><br>

    <div align="center">

    <iframe width="300" height="215" src="https://www.youtube.com/embed/_u0bH9joTfg"

    frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-

    picture" allowfullscreen></iframe>

    </div>

    </body>

    </html>
    Pagina3.html

    En este archivo incluí las imágenes utilizndo <IMG> con sus atributos.-

    <!DOCTYPE html>

    <html lang="en" dir="ltr">

    <head>

    <meta charset="utf-8">

    <title></title>

    </head>

    <body background="/Users/alvarofigueroa/Desktop/tarea semana 3/imagen1.jpg">


    <div>

    <img src="imagen2.jpg" width="260" height="230" alt="trabajos bonitos" />

    <img src="imagen3.jpeg" width="260" height="230" alt="Baratos" />

    <img src="imagen4.jpg" width="260" height="230" alt="buenos" />

    <img src="imagen5.jpg" width="260" height="230" alt="lo mejor" />

    </div>

    </body>

    </html>
    Pagina4.html

    En este último archivo incorporé un formulario utilizando <FORM> e <INPUT> como se

    muestra acontinuación:

    <!DOCTYPE html>

    <html lang="en" dir="ltr">

    <head>

    <meta charset="utf-8">

    <title></title>

    </head>

    <body background=imagen1.jpg>

    <form name="formulario" method="post">

    <b>Nombre Completo :</b><br>

    <input type="text" name="nombre" value="" size="30" placeholder="alvaro figueroa

    saldaña"><br><br>

    <b>Fecha de Nacimiento :</b><br>

    <input type="date" name="fecha" value=""><br><br>

    <b>Dirección :</b><br>

    <input type="text" name="direccion" size="30" placeholder="Torres del Paine 601"

    value=""><br><br>

    <b>Teléfono :</b><br>

    <input type="tel" name="telefono" placeholder="912345678" size="10" value=""><br><br>

    <b> Correo : </b><br>

    <input type="email" name="correo" value=""><br><br>


    <b> Marca del Vehículo </b><br>

    <input type="text" name="marca" value="" placeholder="ford"><br><br>

    <b> Modelo del Vehículo </b><br>

    <input type="text" name="modelo" value="" placeholder="raptor"><br>

    <br><br>

    <input type="submit" name="enviar" value="Enviar">

    </form>

    </body>

    </html>
    Bibliografía

    Controles campos de texto. https://lenguajehtml.com/p/html/formularios/controles-campos-de-

    texto

    Creación de un formulario. https://lenguajehtml.com/p/html/formularios/crear-un-formulario

    IACC (2020). Autoría de HTML. Programación Web I. Semana 3.

    Tutorial html, Frame. https://lenguajehtml.com/p/html/formularios/crear-un-formulario

    También podría gustarte