-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
86 lines (66 loc) · 4.39 KB
/
index.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
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<meta name="language" content="Spanish"> <!-- esto es para indicar idioma -->
<meta name="description" content="Sitio sobre los colores de los gatos y su personalidad."> <!-- esto es para que aparezca descripcion del sitio cuando se comparta enlace -->
<meta name="keywords" content="gato, gatos, color de mi gato, tuxedo, gato naranjo, gato tigre, mascotas"> <!-- esto es para que los motores de busqueda relacionen mi sitio con estos keywords -->
<meta name="author" content="catalina pimentel"> <!-- esto es para indicar autoria -->
<meta name="format-detection" content="telephone=yes"/> <!-- esto es para que detecte desde mobile un telefono y se pueda llamar -->
<link rel="stylesheet" href="stylesheet.css" type="text/css"/>
<title>FURRY FRIENDS</title>
</head>
<body id="container" bgcolor="#000000" style="font-family:sans-serif">
<!-- BANNER PRINCIPAL WEB// -->
<header id="container" align="center">
<img src="imagenes-index/header.png" alt="Banner header de la web con 3 gatitos y titular Furry Friends" align="middle" style="display:block" />
</header>
<!-- menu// -->
<section class="container" align="center" style="background-color:#ffffff">
<a href="index.html">INICIO</a> /
<a href="clasificacion.html">COMO SE CLASIFICAN LOS GATOS</a> /
<a href="mis-gatos.html">MIS GATOS</a> /
<a href="noticias.html">NOTICIAS</a> /
<a href="hablemos.html">HABLEMOS</a>
</section>
<!-- descripcion sitio// -->
<main class="container">
<h1 style="color:#00ffff">QUE ES FURRY FRIENDS?</h1>
<h1>FURRY FRIENDS es un sitio que busca representar los distintos tipos de pelaje de los gatitos y como esto se relaciona con sus personalidades. Y como hay muchos tipos de chalecos (jojojo) que tienen estos amiguitos, poco a poco iré subiendo más y más colores y formas que vaya descubriendo.</h1>
</main>
<!-- CONTENIDO// -->
<article class="container" style="text-align:center">
<p>
La personalidad de un gatito nunca es igual a la de otro gatito, y aunque a veces tienen manchas o colores que no se repiten entre ellos mismos, también a veces hay gatitos que aunque se vean exactamente iguales, nunca actuan de la misma manera.
A lo largo del desarrollo de este sitio, ire presentando situaciones de ese tipo y respondiendo como se relacionan los colores de los gatos con su personalidad.
</p>
</article>
<!-- ASIDE// -->
<aside id="container">
<div id="columna-izquierda">
<img src="imagenes-index/index-00.jpg" alt="Fotografia de gato blanco y negro también llamado tuxedo" />
<h4 style="color:#999999">Por que gatitos? Porque es un animal que si bien es solitario, también es un gran amiguito :3. El de la imagen es un tuxedo cat, tiene ese nombre porque parece que usara un traje frac. Quieres conocer mas?</h4>
<br />
<a href="clasificacion.html"><h4>Conoce los distintos pelajes aqui >></h4></a>
</div>
<div id="columa-derecha">
<img src="imagenes-index/index-01.jpg" alt="Fotografia de gato naranjo" />
<h4 style="color:#999999">Si quieres conocer lo que dicen otros sobre el tema, visita los links de interés seleccionados en el link de Noticias.</h4>
<br/>
<a href="noticias.html"><h4>Lee las noticias ahora! >></h4></a>
</div>
</aside>
<div style="clear:both"></div>
<!-- Section con video// -->
<section>
<h1>VIDEO DESTACADO</h1>
<p style="text-align:left">En esta ocasión destaco este video que cuenta sobre los gatitos de color solido y los manchados, con una explicación desde la genética. Esta en inglés pero es muy fácil de entender.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/x9HTjpa0mUw" frameborder="0" allowfullscreen></iframe>
</section>
<div style="clear:both"></div>
<!-- Tag footer que finaliza el sitio// -->
<footer id="container-footer">
Sitio desarrollado por Catapim<br/>Ingeniería Informática Uniacc<br/>Marzo 2017
</footer>
</body>
</html>