-
Notifications
You must be signed in to change notification settings - Fork 4
/
index.html
314 lines (281 loc) · 12.5 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
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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="Trackula es un proyecto que pretende concienciar a la ciudadanía de cómo tus datos fluyen por la red y cómo algunas empresas se lucran de ello. Además de consejos de cómo evitar que esto ocurra, te proporcionamos un plugin para que lo veas con tus propios ojos.">
<meta name="keywords" content="privacidad, privacy, seguridad, security, personal data, mydata, cookies, lightbeam">
<meta name="author" content="TRACKULA">
<title>Trackula</title>
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom fonts for this template -->
<link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- Custom styles for this template -->
<link href="css/grayscale.css" rel="stylesheet">
</head>
<body id="page-top">
<a href="https://addons.mozilla.org/en-US/firefox/addon/trackula/" id="download-btn" class="btn-primary btn-lg" target="_black">Descarga el plugin</a>
<!-- Navigation -->
<nav class="navbar navbar-expand-lg navbar-light fixed-top" id="mainNav">
<div class="container">
<a class="navbar-brand js-scroll-trigger" href="#page-top"><img src="img/logo.svg" alt="Logo de Trackula" style="height:25px;" /></a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
Menu
<i class="fa fa-bars"></i>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#what">Qué es</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#why">Por qué</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#tools">Herramientas</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#cookie-policy">Privacidad</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#contact">Contacta</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Intro Header -->
<header class="masthead">
<div class="intro-body">
<video poster="img/intro-bg.jpg" autoplay loop>
<source src="vids/trackula.mp4" type="video/mp4">
<source src="vids/trackula.ogv" type="video/ogv">
<source src="vids/trackula.webm" type="video/webm">
</video>
<h1 class="brand-heading">TRACKULA</h1>
</div>
</header>
<div id="wrapper">
<!-- What Section -->
<section id="what" class="content-section text-center">
<div class="container">
<div class="row">
<div class="col-lg-10 mx-auto">
<h2>Qué es Trackula</h2>
<p>Queremos que conozcas el mundo digital en el que vivimos, el alcance de tus datos y lo que conlleva para tu libertad personal que seas rastreado por la web. Defendemos tu derecho a la privacidad y trabajamos para concienciar acerca del recorrido de tu información. Creemos que esto te interesa seas quien seas.</p>
<p>El plugin de Trackula.org muestra en una visualización interactiva cómo tus datos migran por la red y qué empresas de seguimiento web, o trackers, se conectan a los contenidos que visitas cada día. Lo hacemos sin guardar, vender o enviar tu información a nadie, todo queda en tu ordenador. Nuestra única intención es que seas consciente de esta información oculta y que puedas adquirir una visión crítica sobre esta cuestión. Somos activistas y nacimos en MediaLab Prado.</p>
<img src="img/imagotipo.svg" alt="Logo de Trackula" style="width:100px;padding-top:40px;">
</div>
</div>
</div>
</section>
<!-- Why Section -->
<section id="why" class="content-section text-center">
<div class="container">
<div class="row">
<div class="col-lg-10 mx-auto">
<img src="img/infografia.svg" alt="Infografía que explica el por qué de Trackula" width="80%" />
</div>
</div>
</div>
</section>
<!-- Tools Section -->
<section id="tools" class="content-section text-center">
<div class="container">
<div class="row">
<div class="col-lg-12 mx-auto">
<h2>Herramientas</h2>
<div class="row anti-tracking-tools">
<div class="col-sm-4">
<h5>
<img src="img/light.png" alt="LightBeam" class="tool-icon" />
<br/>
<a href="https://addons.mozilla.org/ur/firefox/addon/lightbeam/" target="_blank">LightBeam</a>
</h5>
<p>Desarrollada para Firefox, permite la visualización de tu historial personal de navegación, con énfasis en los trackers de cada sitio que has visitado.</p>
</div>
<div class="col-sm-4">
<h5>
<img src="img/ShareMeNot.svg" alt="ShareMeNot" class="tool-icon" />
<br/>
<a href="https://alternativeto.net/software/sharemenot" target="_blank">ShareMeNot</a>
</h5>
<p>Previene que los botones de terceras partes insertados en la página (como el ‘Me gusta’ de Facebook) trackeen tu información.</p>
</div>
<div class="col-sm-4">
<h5>
<img src="img/ghostery.svg" alt="Ghostery" class="tool-icon" />
<br/>
<a href="https://www.ghostery.com/" target="_blank">Ghostery</a>
</h5>
<p>Detecta y bloquea cualquier tipo de tecnología que esté siendo usada para rastrear tu información, protegiendo tus datos.</p>
</div>
<div class="col-sm-4">
<h5>
<img src="img/ublock.svg" alt="uBlock" class="tool-icon" />
<br/>
<a href="https://github.com/gorhill/uBlock#installation" target="_blank">uBlock Origin</a>
</h5>
<p>Controla el navegador para bloquear cualquier tipo de envío de información automática y bloquear elementos intrusivos.</p>
</div>
<div class="col-sm-4">
<h5>
<img src="img/gorro.png" alt="Tinfoil" class="tool-icon" />
<br/>
<a href="https://play.google.com/store/apps/details?id=com.danvelazco.fbwrapper&hl=en" target="_blank">Tinfoil for Facebook</a>
</h5>
<p>Genera un entorno aislado en tu móvil para acceder a Facebook protegiendo tu privacidad e historial de búsquedas.</p>
</div>
<div class="col-sm-4">
<h5>
<img src="img/zorro.png" alt="PrivacyBadger" class="tool-icon" />
<br/>
<a href="https://www.eff.org/privacybadger" target="_blank">PrivacyBadger</a>
</h5>
<p>Impide que los anunciantes y las terceras partes de un sitio web rastreen tu información.</p>
</div>
</div>
</div>
</div>
</section>
<!-- Cookie Policy Section -->
<section id="cookie-policy" class="content-section text-center">
<div class="container">
<div class="row">
<div class="col-lg-10 mx-auto">
<h2>Privacidad en esta web</h2>
<p>
Trackula no solo le plantea al usuario el problema de la
privacidad, sino que activamente trata de respetarles en
este aspecto. Por ello, los humanos tras esta web no
recopilan ningún dato personalmente identificativo de
forma directa o indirecta.
</p><p>
Sin embargo, la privacidad es un asunto complicado. Por
el mero hecho de entrar en esta web, existen una serie
de trazas técnicas que es imposible evitar, entre ellas:
habrás realizado una petición DNS a algún servidor fuera
de nuestro control (probablemente de tu proveedor de
servicios, o un DNS público como Google u OpenDNS). En
caso de que tu proveedor no tenga cacheada la respuesta
DNS, éste además habrá hecho una petición a CloudFlare,
que es la proveedora de los servicios de DNS para este
dominio.
</p><p>
El servidor que está poniendo esta página a disposición
de Internet es, actualmente, Netlify, con lo que
Netlify. podría estar registrando los accesos a esta
página, incluyendo la dirección IP del usuario, y
aquellos datos que su navegador proporcione, como la
información sobre el agente de usuario, idiomas
aceptables o sistema operativo.
</p><p>
Teniendo en cuenta las dificultades técnicas, se ha
tratado de minimizar la exposición de información a
terceras partes. En particular, utilizamos un dominio
propio, y no cargamos ningún recurso de terceras
partes. Esto impide que se utilicen la mayoría de
métodos de rastreo de navegadores, salvo aquellos
mencionados arriba por razones técnicas.
</p><p>
Téngase en cuenta que para que esta página llegue a su
destino, múltiples entidades más la han hecho llegar
hasta el dispositivo final. En particular, el proveedor
de acceso a Internet que el usuario utilice, así como
todos los Sistemas Autónomos de Internet que hayan sido
involucrados en la interconexión con el/los proveedor/es
de acceso a Internet en el centro de datos desde el que
se esté sirviendo esto y que es potestad de GitHub.
</p><p>
Netlify y CloudFlare ofrecen estos servicios de forma
gratuita y automática, y Trackula no recibe ningún tipo
de información ni contraprestación, ni tiene vigente
ningún trato con Netlify, CloudFlare o GitHub diferente
a lo disponible libremente en sus respectivas páginas
web.
</p>
</div>
</div>
</div>
</section>
<!-- Legal Section -->
<section id="legal_disclaimer" class="content-section text-center">
<div class="container">
<div class="row">
<div class="col-lg-8 mx-auto">
<h2>Aviso legal</h2>
<p>
Trackula.org es uno de los ocho proyectos de desarrollo
colaborativo seleccionados para su producción en el
taller internacional de visualización de datos
Visualizar'17: Migraciones, proyectos seleccionados,
celebrado en Medialab-Prado, entre el 15 y 30 de
septiembre.
</p>
<p>
Medialab-Prado, situado en la Antigua Serrería Belga de
Madrid, en la Plaza de las Letras, C/ Alameda, 15,
C.P. 28014, es un laboratorio ciudadano de producción e
investigación que explora las formas de experimentación
y aprendizaje colaborativo surgidas de las redes
digitales y acoge, a propuesta de la ciudadanía,
proyectos y actividades directamente relacionados con
las líneas que se desarrollen en cada momento en el
centro, de titularidad del Ayuntamiento de Madrid y
gestionado por la empresa municipal MADRID DESTINO
CULTURA TURISMO Y NEGOCIO, S.A. con CIF número
A-84073105 y domicilio social en Madrid, Calle Conde
Duque, 9-11, 2ª planta, 28015 Madrid
</p>
<p>
MADRID DESTINO únicamente promueve y acoge el proyecto
desarrollado por el grupo de trabajo que participó en el
taller sin acceder a su gestión ni recopilar datos de
carácter personal de usuarios. Las personas interesadas
podrán ponerse en contacto con el grupo de trabajo
Trackula.org a través de la plataforma GitHub, como
usuarios registrados de la misma, y siendo de aplicación
la política de privacidad de dicha plataforma,
disponible en
https://help.github.com/articles/github-privacy-statement/
</p>
</div>
</div>
</div>
</section>
<!-- Contact Section -->
<section id="contact" class="content-section text-center">
<div class="container">
<div class="row">
<div class="col-lg-8 mx-auto">
<h2>Contacta con Trackula en</h2>
<ul class="list-inline banner-social-buttons">
<li class="list-inline-item">
<a href="https://github.com/medialab-prado/trackula" class="btn btn-default btn-lg">
<i class="fa fa-github fa-fw"></i>
<span class="network-name">Github</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</section>
</div>
<!-- Footer -->
<footer>
<div class="container text-center">
<p>Trackula 2017. Some rights reserved.</p>
</div>
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/popper/popper.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
<!-- Plugin JavaScript -->
<script src="vendor/jquery-easing/jquery.easing.min.js"></script>
<!-- Custom scripts for this template -->
<script src="js/grayscale.min.js"></script>
</body>
</html>