-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathinfo.html
88 lines (71 loc) · 4.56 KB
/
info.html
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
<!DOCTYPE html>
<html lang="es">
<!-- Head con el uso de etiqutas meta (descripción, palabras clave, autor y viewport, para layout multidispositivo), enlaces a fuentes de Google para su uso en la web, uso de normalize.css y el script modernizr-custom.js, relación a la hoja de estilos, favicon y título. -->
<!-- Esta página contiene dos script adicionales, jquery.js y lity.js, que aportan una funcionalidad "lightbox" para el visionado de elementos multimedia en pantalla. -->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Outerhound - Street Photography">
<meta name="keywords" content="photography, streetphotography, outerhound">
<meta name="author" content="Alejandro García">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Heebo&family=Roboto:ital,wght@0,100;0,300;0,400;1,100;1,300&display=swap" rel="stylesheet">
<link rel="stylesheet" href="normalize.css">
<script src="vendor/modernizr-custom.js"></script>
<link rel="stylesheet" href="style.css">
<link rel="icon" type="image/png" href="images/favicon_camera.png">
<link rel="stylesheet" href="dist/lity.css">
<script src="vendor/jquery.js"></script>
<script src="dist/lity.js"></script>
<title>Información | OUTERHOUND - Street Photography</title>
</head>
<body>
<!-- Navegador dentro de header, con vínculos listados-->
<header>
<nav>
<a href="index.html" class="logo">OUTERHOUND</a>
<ul>
<li><a href="index.html">Inicio</a></li>
<li><a href="info.html" class="active">Información</a></li>
<li><a href="photos1.html">Blanco y Negro</a></li>
<li><a href="photos2.html">Color</a></li>
<li><a href="contact.html">Contacto</a></li>
</ul>
</nav>
</header>
<!-- Div que contiene un subtítulo al logo del header. No está incluido en el navegador porque este mensaje puede cambiar en un futuro y no es parte del menú de navegación -->
<div class="subtitulo">
<p>Street Photography</p>
</div>
<!-- Section que contiene el único article de la página. Al haber sólo un article, podría haber optado por no utilizar el section, pero prefiero que haya una jerarquía marcada entre elementos -->
<section>
<!-- Article de tipo flex, que ordena sus elementos hijos en fila, funcionando éstos como bloques -->
<article class="contenedor_flex">
<div class="objeto_flex">
<h1>Alejandro García</h1>
<br/>
<h2>Sobre mí</h2>
<p class="textoinfo">Graduado en <b>Comunicación Audiovisual</b> por la Universidad de Valencia. Actualmente estudio el Ciclo Formativo de Grado Superior de <b>Desarrollo de Aplicaciones Multiplataforma en Florida Universitaria</b>, donde busco ampliar y mejorar mis conocimientos en el desarrollo de programas y páginas web. Las competencias adquiridas hasta el momento me han permitido crear este <em>portfolio online</em> de mi trabajo como fotógrafo callejero.</p>
<br/>
<h2>Miradas callejeras</h2>
<p class="textoinfo">Nuestra mirada moldea el mundo a través de experiencias y expectativas. La fotografía nos ayuda a capturar esos instantes únicos, creando imágenes que sólo tienen sentido al ojo humano. El acto fotográfico se convierte así en un ejercicio de reflexión sobre el pasado, desde un momento presente, con la mirada puesta en el futuro.</p>
<br/>
<a class="instagram" target="_blank" href="https://www.instagram.com/outerhound/"><img src="images/logo_instagram.png" alt="Logo de Instagram" title="Instagram" width="40px" height="40px"></a>
<a href="https://youtu.be/fRfdyJNaeWI" data-lity><img class="play" src="images/play.svg" color="white" width="40px" height="30px" alt="Imagen que representa el botón para reproducir un vídeo" title="Play"></a>
<a href=# target="_blank"><img class="cloud" src="images/cloud.svg" width="35px" height="35px" alt="Icono de descarga" title="Descarga mi CV"></a>
</div>
<div class="objeto_flex">
<img class="foto" src="images/photo_info.jpg" alt="Fotografía de un hombre caminando delante de una tienda de moda" title="Miradas y movimiento. Valencia, 2017" width="450" height="575">
</div>
<div class="objeto_flex">
<p class="leyenda">Miradas y movimiento.</p>
<p class="ciudad">Valencia, 2017</p>
</div>
</article>
</section>
<footer>
<p>© Alejandro García - 2021 | Instagram</p>
<a target="_blank" href="https://www.instagram.com/outerhound/"><img src="images/logo_instagram.png" alt="Logo de Instagram" style="width: 9px;height:9px;"></a>
</footer>
</body>
</html>