MyWebsite/index.html at develop · MasterJuegos69/MyWebsite · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
<!DOCTYPE html>
<html lang = "es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>David Diaz | Un poco acerca de mí</title>
    <link href="style.css" rel="stylesheet">
</head>
<body>
    <header><!--Introductory content-->
        <div><!--Last updated date-->
            <h1>Hoja de vida</h1><!--Page title-->
            <p role="status" aria-live="polite">
                <strong>Última actualización:</strong>
                <time datetime="2025-06-02">2 de Junio de 2025</time>
            </p>
        </div><!--Open to work-->
        <!--Esta imagen va de primero, sigue el título y debajo de este la fecha de actualización-->
        <img src = "profile_picture.jpg" alt = "Foto de David Diaz"><!--Profile picture-->
    </header>
    <main><!--Dominant content-->
        <section id="contactInformation"><!--Links related to my work-->
            <h2>Enlaces a mis redes de contacto</h2>
            <address>
                <a href = "https://github.com/MasterJuegos69">GitHub</a> |
                <a href = "https://roadmap.sh/u/ddv">Roadmap.sh</a> |
                <a href = "https://www.linkedin.com/in/david-diaz-velasquez">LinkedIn</a>
            </address>
        </section>
        <section>
            <h2>Sobre esta página</h2>
            <p>La presente página web tiene por propósito exponer información de índole personal sobre David Diaz.</p>
        </section>
        <section>
            <h2>Sobre mí</h2>
            <p>
                Hola, mi nombre es David Diaz. Soy un muchacho alegre, activo y curioso, con un gran gusto por la ciencia, la tecnología
                y la ingeniería. Desde pequeño he sentido fascinación por las computadoras, el mundo digital y
                los datos.
            </p>
        </section>
        <section>
            <h2>Mis pasatiempos</h2>
            <ul>
                <li>Aprender desarrollo web</li>
                <li>Jugar videojuegos</li>
                <li>Realizar ejercicio</li>
                <li>Aprender todo tipo de cosas nuevas</li>
            </ul>
        </section>
        <section>
            <h2>Mis tareas pendientes</h2>
            <ol>
                <li>Terminar el laboratorio entregable 3 del curso de programación básica</li>
                <li>Practicar lógica de programación con JavaScript</li>
                <li>Repasar las etiquetas importantes de HTML5</li>
                <li>Repasar el modelo de caja de CSS3</li>
                <li>Repasar los comandos de Git</li>
                <li>Revisar las grabaciones de las clases</li>
                <li>Descansar</li>
            </ol>
        </section>
        <section id="mySchedule">
            <h2>Mi horario</h2>
            <table>
                <caption>Organización para la semana del 1 al 7 de mayo de 2025</caption>
                <thead>
                    <tr>
                        <th>Domingo</th>
                        <th>Lunes</th>
                        <th>Martes</th>
                        <th>Miércoles</th>
                        <th>Jueves</th>
                        <th>Viernes</th>
                        <th>Sábado</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Realizar el laboratorio entregable 1 del curso de programación básica</td>
                        <td>Practicar lógica de programación con JavaScript</td>
                        <td>Repasar las etiquetas importantes de HTML5</td>
                        <td>Repasar el modelo de caja de CSS3</td>
                        <td>Repasar los comandos de Git</td>
                        <td>Revisar las grabaciones de las clases</td>
                        <td>Descansar</td>
                    </tr>
                </tbody>
            </table>
        </section>
        <br>
        <article>
            <h2>Formulario de contácto</h2>
            <p>Con este formulario podrá generar una petición de contacto vía correo electrónico al ingresar su información en los campos de abajo.</p>
            <form>
                <fieldset>
                    <legend>Contáctame</legend>
                    <label for = "personName">Su nombre</label>
                    <input id = "personName" type = "text" name = "personName" placeholder = "Juan" required>
                    <br>
                    <label for = "subject">Describa su motivo de contacto</label>
                    <input id = "subject" type = "text" name = "subject" placeholder = "Oportunidad laboral" required>
                    <br>
                    <label for = "emailAddress">Su dirección de correo electrónico</label>
                    <input id = "emailAddress" type = "email" name = "emailAddress" placeholder = "ejemplo@gmail.com" required>
                    <br>
                    <input type="submit" value="Enviar" onclick = "successMessage()">
                </fieldset>
            </form>
        </article>
    </main>
    <!--<footer>
    </footer>-->
    <script src="app.js"></script>
</body>
</html>