feat: comunidad.html, slider 5 diapositivas, botón Derechos y fondos en study cards
- Nuevo comunidad.html con sección de participación en el proyecto y 14 alternativas de software libre organizadas por categoría (navegadores, buscadores, correo, mensajería, almacenamiento, redes sociales, VPN/DNS) - Slider principal ampliado de 3 a 5 diapositivas: slides 4 (jardín japonés) y 5 (bosque aéreo) con layout split texto+botón; slide 2 reemplazada con foto Times Square aérea - CTAs ácido-verde en slides 1-3 enlazando a salud-digital#ciencia, egosurfing y salud-digital#derechos - Sección confirm-section sustituida por botón grande "Derechos" que despliega 8 botones verbales (Conocer/Corregir/Borrar/Limitar/Exportar/Oponerse/Decidir/Reclamar) con right-cards RGPD expandibles - Fondos fotográficos con overlay oscuro en las 4 study cards (estudio-brain, atención, sueño, datos) - 7 fotos nuevas descargadas en img/ Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
hacklab
parent
467820b8b3
commit
3ebcc3e405
16 changed files with 2600 additions and 547 deletions
652
public/comunidad.html
Normal file
652
public/comunidad.html
Normal file
|
|
@ -0,0 +1,652 @@
|
|||
<!doctype html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Comunidad · RESETEA.NET</title>
|
||||
<meta name="description"
|
||||
content="Participa en RESETEA.NET, contribuye al proyecto y descubre alternativas de software libre para proteger tu privacidad y cumplir con los derechos GDPR.">
|
||||
<link rel="stylesheet" href="index.css">
|
||||
<style>
|
||||
/* ── Comunidad local styles ── */
|
||||
.comunidad-hero {
|
||||
padding: 3.5rem 0 3rem;
|
||||
background: linear-gradient(135deg, #1a2b20 0%, #0f1a14 50%, #1a1714 100%);
|
||||
border-bottom: 1px solid rgba(255,255,255,0.06);
|
||||
text-align: center;
|
||||
}
|
||||
.comunidad-hero h1 {
|
||||
font-family: 'Recion', Georgia, serif;
|
||||
font-size: clamp(2rem, 5vw, 3.5rem);
|
||||
color: var(--acid);
|
||||
letter-spacing: 0.06em;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
.comunidad-hero p {
|
||||
font-size: 1.05rem;
|
||||
color: rgba(248,247,244,0.65);
|
||||
max-width: 58ch;
|
||||
margin: 0 auto;
|
||||
line-height: 1.65;
|
||||
}
|
||||
|
||||
/* ── Section blocks ── */
|
||||
.comunidad-block {
|
||||
padding: 4rem 0;
|
||||
border-top: 1px solid var(--border);
|
||||
}
|
||||
.comunidad-block + .comunidad-block {
|
||||
border-top: 1px solid var(--border);
|
||||
}
|
||||
.comunidad-block--alt {
|
||||
background: var(--surface2);
|
||||
}
|
||||
|
||||
.block-eyebrow {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.45rem;
|
||||
padding: 0.3rem 0.9rem;
|
||||
border-radius: 20px;
|
||||
font-size: 0.72rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.1em;
|
||||
text-transform: uppercase;
|
||||
background: rgba(200,255,0,0.10);
|
||||
color: var(--acid-dark);
|
||||
border: 1px solid rgba(200,255,0,0.22);
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.block-title {
|
||||
font-family: 'Recion', Georgia, serif;
|
||||
font-size: clamp(1.6rem, 3vw, 2.2rem);
|
||||
color: var(--acid);
|
||||
letter-spacing: 0.03em;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.block-desc {
|
||||
font-size: 0.97rem;
|
||||
color: var(--muted);
|
||||
max-width: 66ch;
|
||||
line-height: 1.65;
|
||||
margin-bottom: 2.5rem;
|
||||
}
|
||||
|
||||
/* ── Participation cards ── */
|
||||
.participacion-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
|
||||
gap: 1.2rem;
|
||||
}
|
||||
|
||||
.participacion-card {
|
||||
background: var(--surface);
|
||||
border: 1.5px solid var(--border);
|
||||
border-radius: 16px;
|
||||
padding: 1.6rem 1.5rem;
|
||||
box-shadow: var(--shadow-sm);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.75rem;
|
||||
transition: border-color 200ms ease, box-shadow 200ms ease, transform 180ms ease;
|
||||
}
|
||||
.participacion-card:hover {
|
||||
border-color: var(--acid-dark);
|
||||
box-shadow: 0 0 0 1px var(--acid-dark), var(--shadow-md);
|
||||
transform: translateY(-3px);
|
||||
}
|
||||
|
||||
.pc-icon {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 12px;
|
||||
background: rgba(200,255,0,0.10);
|
||||
border: 1px solid rgba(200,255,0,0.20);
|
||||
display: grid;
|
||||
place-items: center;
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.pc-title {
|
||||
font-family: 'Recion', Georgia, serif;
|
||||
font-size: 1.05rem;
|
||||
color: var(--text);
|
||||
letter-spacing: 0.02em;
|
||||
}
|
||||
|
||||
.pc-desc {
|
||||
font-size: 0.87rem;
|
||||
color: var(--muted);
|
||||
line-height: 1.55;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.pc-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
padding: 0.45rem 0.9rem;
|
||||
border-radius: 8px;
|
||||
font-size: 0.82rem;
|
||||
font-weight: 700;
|
||||
background: var(--acid);
|
||||
color: #1a1714;
|
||||
border: 1px solid #9dcc00;
|
||||
box-shadow: 0 2px 0 0 #5a8800;
|
||||
text-decoration: none;
|
||||
transition: transform 90ms ease, box-shadow 90ms ease;
|
||||
align-self: flex-start;
|
||||
}
|
||||
.pc-link:hover {
|
||||
color: #1a1714;
|
||||
text-decoration: none;
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 4px 0 0 #4a7200;
|
||||
}
|
||||
.pc-link--ghost {
|
||||
background: var(--surface2);
|
||||
color: var(--muted);
|
||||
border-color: var(--border);
|
||||
box-shadow: 0 2px 0 0 var(--border-dark);
|
||||
}
|
||||
.pc-link--ghost:hover {
|
||||
color: var(--text);
|
||||
background: var(--surface);
|
||||
border-color: var(--border-dark);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
/* ── Alternativas grid ── */
|
||||
.alt-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||||
gap: 1.2rem;
|
||||
}
|
||||
|
||||
.alt-card {
|
||||
background: var(--surface);
|
||||
border: 1.5px solid var(--border);
|
||||
border-radius: 16px;
|
||||
padding: 1.5rem;
|
||||
box-shadow: var(--shadow-sm);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.7rem;
|
||||
transition: border-color 200ms ease, box-shadow 200ms ease, transform 180ms ease;
|
||||
}
|
||||
.alt-card:hover {
|
||||
border-color: var(--sage);
|
||||
box-shadow: 0 0 0 1px var(--sage), var(--shadow-sm);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.alt-card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.8rem;
|
||||
}
|
||||
|
||||
.alt-logo {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 10px;
|
||||
background: var(--surface2);
|
||||
border: 1px solid var(--border);
|
||||
display: grid;
|
||||
place-items: center;
|
||||
font-size: 1.2rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.alt-name {
|
||||
font-family: 'Recion', Georgia, serif;
|
||||
font-size: 1rem;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.alt-replaces {
|
||||
font-size: 0.70rem;
|
||||
color: var(--muted);
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
|
||||
.alt-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 0.15rem 0.5rem;
|
||||
border-radius: 6px;
|
||||
font-size: 0.68rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.04em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.alt-badge--libre {
|
||||
background: rgba(26,122,74,0.14);
|
||||
color: var(--sage);
|
||||
border: 1px solid rgba(26,122,74,0.28);
|
||||
}
|
||||
.alt-badge--gdpr {
|
||||
background: rgba(200,255,0,0.10);
|
||||
color: var(--acid-dark);
|
||||
border: 1px solid rgba(200,255,0,0.22);
|
||||
}
|
||||
.alt-badges { display: flex; gap: 0.4rem; flex-wrap: wrap; }
|
||||
|
||||
.alt-desc {
|
||||
font-size: 0.85rem;
|
||||
color: var(--muted);
|
||||
line-height: 1.55;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.alt-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 600;
|
||||
color: var(--sage);
|
||||
text-decoration: none;
|
||||
border-bottom: 1px solid transparent;
|
||||
transition: border-color 140ms ease, color 140ms ease;
|
||||
}
|
||||
.alt-link:hover {
|
||||
color: var(--acid-dark);
|
||||
border-bottom-color: var(--acid-dark);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* ── Category separator ── */
|
||||
.alt-category-label {
|
||||
grid-column: 1 / -1;
|
||||
font-size: 0.72rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.12em;
|
||||
text-transform: uppercase;
|
||||
color: var(--sage);
|
||||
margin-top: 1.2rem;
|
||||
padding-bottom: 0.5rem;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
.alt-category-label:first-child { margin-top: 0; }
|
||||
|
||||
@media (max-width: 700px) {
|
||||
.participacion-grid { grid-template-columns: 1fr; }
|
||||
.alt-grid { grid-template-columns: 1fr; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body class="page-dark">
|
||||
|
||||
<main>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
HERO + NAV
|
||||
════════════════════════════════════════════ -->
|
||||
<section class="hero-landing">
|
||||
<div class="container hero-landing-inner">
|
||||
<h1 class="main-title">RESETEA</h1>
|
||||
<div class="landing-nav">
|
||||
<a class="landing-nav-btn" href="egosurfing.html">Egosurfing</a>
|
||||
<a class="landing-nav-btn landing-nav-btn--highlight" href="plantillas.html">Resetea</a>
|
||||
<a class="landing-nav-btn" href="comunidad.html">Comunidad</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">Salud digital</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
HERO COMUNIDAD
|
||||
════════════════════════════════════════════ -->
|
||||
<section class="comunidad-hero">
|
||||
<div class="container">
|
||||
<h1>Comunidad</h1>
|
||||
<p>Un proyecto abierto para recuperar el control digital. Contribuye, reporta y descubre las herramientas libres que sustituyen a las plataformas que te rastrean.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
BLOQUE 1 — PARTICIPACIÓN EN EL PROYECTO
|
||||
════════════════════════════════════════════ -->
|
||||
<section class="comunidad-block" id="participacion">
|
||||
<div class="container">
|
||||
<span class="block-eyebrow">Proyecto abierto</span>
|
||||
<h2 class="block-title">Participa en RESETEA</h2>
|
||||
<p class="block-desc">RESETEA es software libre y no guarda ningún dato tuyo. Si encuentras un error, quieres proponer mejoras o simplemente quieres apoyar el proyecto, aquí tienes los canales.</p>
|
||||
|
||||
<div class="participacion-grid">
|
||||
|
||||
<div class="participacion-card">
|
||||
<div class="pc-icon">🐛</div>
|
||||
<div class="pc-title">Reportar un error</div>
|
||||
<p class="pc-desc">¿Algún enlace roto, una carta GDPR desactualizada o un bug en el generador? Abre un issue en GitHub con el máximo detalle posible.</p>
|
||||
<a class="pc-link" href="https://github.com/resetea-net/resetea/issues" target="_blank" rel="noopener">Abrir issue →</a>
|
||||
</div>
|
||||
|
||||
<div class="participacion-card">
|
||||
<div class="pc-icon">📝</div>
|
||||
<div class="pc-title">Proponer mejoras</div>
|
||||
<p class="pc-desc">¿Falta alguna plataforma? ¿El texto de alguna carta puede mejorarse? Las pull requests son bienvenidas. Lee primero el CONTRIBUTING.md.</p>
|
||||
<a class="pc-link" href="https://github.com/resetea-net/resetea/pulls" target="_blank" rel="noopener">Ver pull requests →</a>
|
||||
</div>
|
||||
|
||||
<div class="participacion-card">
|
||||
<div class="pc-icon">⭐</div>
|
||||
<div class="pc-title">Dar una estrella</div>
|
||||
<p class="pc-desc">La forma más sencilla de apoyar el proyecto. Cada estrella aumenta la visibilidad y ayuda a que más personas recuperen el control de sus datos.</p>
|
||||
<a class="pc-link" href="https://github.com/resetea-net/resetea" target="_blank" rel="noopener">GitHub ↗</a>
|
||||
</div>
|
||||
|
||||
<div class="participacion-card">
|
||||
<div class="pc-icon">🌐</div>
|
||||
<div class="pc-title">Compartir el proyecto</div>
|
||||
<p class="pc-desc">La privacidad digital afecta a todo el mundo. Comparte RESETEA.NET con personas de tu entorno que puedan beneficiarse de recuperar el control de sus datos.</p>
|
||||
<a class="pc-link pc-link--ghost" href="index.html">Volver al inicio</a>
|
||||
</div>
|
||||
|
||||
<div class="participacion-card">
|
||||
<div class="pc-icon">📧</div>
|
||||
<div class="pc-title">Contacto directo</div>
|
||||
<p class="pc-desc">Para consultas legales, colaboraciones con medios o propuestas de organizaciones, puedes escribirnos directamente. Respondemos en menos de 72 h.</p>
|
||||
<a class="pc-link pc-link--ghost" href="mailto:hola@resetea.net">hola@resetea.net</a>
|
||||
</div>
|
||||
|
||||
<div class="participacion-card">
|
||||
<div class="pc-icon">📚</div>
|
||||
<div class="pc-title">Actualizar plantillas legales</div>
|
||||
<p class="pc-desc">Las cartas GDPR deben reflejar la jurisprudencia más reciente. Si eres jurista o conoces resoluciones relevantes de la AEPD, tu aportación es muy valiosa.</p>
|
||||
<a class="pc-link" href="https://github.com/resetea-net/resetea/tree/main/plantillas" target="_blank" rel="noopener">Ver plantillas →</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
BLOQUE 2 — ALTERNATIVAS DE SOFTWARE LIBRE
|
||||
════════════════════════════════════════════ -->
|
||||
<section class="comunidad-block comunidad-block--alt" id="alternativas">
|
||||
<div class="container">
|
||||
<span class="block-eyebrow">Software libre y privacidad</span>
|
||||
<h2 class="block-title">Alternativas que respetan tus datos</h2>
|
||||
<p class="block-desc">Estas herramientas de código abierto sustituyen a las plataformas comerciales que monetizan tu comportamiento. Son auditables, sin rastreo y compatibles con el RGPD.</p>
|
||||
|
||||
<div class="alt-grid">
|
||||
|
||||
<!-- Navegadores -->
|
||||
<div class="alt-category-label">Navegadores</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">🦊</div>
|
||||
<div>
|
||||
<div class="alt-name">Firefox</div>
|
||||
<div class="alt-replaces">Alternativa a Chrome / Edge</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">RGPD friendly</span>
|
||||
</div>
|
||||
<p class="alt-desc">Navegador de la Fundación Mozilla. Bloqueador de rastreadores integrado, sincronización opcional cifrada y extensas opciones de privacidad.</p>
|
||||
<a class="alt-link" href="https://www.mozilla.org/es-ES/firefox/" target="_blank" rel="noopener">mozilla.org/firefox ↗</a>
|
||||
</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">🦵</div>
|
||||
<div>
|
||||
<div class="alt-name">Brave</div>
|
||||
<div class="alt-replaces">Alternativa a Chrome</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">RGPD friendly</span>
|
||||
</div>
|
||||
<p class="alt-desc">Basado en Chromium. Bloquea anuncios y rastreadores por defecto, tiene modo Tor integrado y no envía datos de navegación a ningún servidor.</p>
|
||||
<a class="alt-link" href="https://brave.com/es/" target="_blank" rel="noopener">brave.com ↗</a>
|
||||
</div>
|
||||
|
||||
<!-- Buscadores -->
|
||||
<div class="alt-category-label">Buscadores</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">🔍</div>
|
||||
<div>
|
||||
<div class="alt-name">DuckDuckGo</div>
|
||||
<div class="alt-replaces">Alternativa a Google</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--gdpr">Sin rastreo</span>
|
||||
</div>
|
||||
<p class="alt-desc">No crea perfil de usuario, no almacena historial de búsquedas y no personaliza resultados. Disponible como buscador por defecto en Firefox y Brave.</p>
|
||||
<a class="alt-link" href="https://duckduckgo.com" target="_blank" rel="noopener">duckduckgo.com ↗</a>
|
||||
</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">🌍</div>
|
||||
<div>
|
||||
<div class="alt-name">Startpage</div>
|
||||
<div class="alt-replaces">Alternativa a Google</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--gdpr">RGPD friendly</span>
|
||||
</div>
|
||||
<p class="alt-desc">Muestra resultados de Google sin identificarte. Empresa neerlandesa bajo legislación europea. Certificado ISO 27001 y cumplimiento RGPD explícito.</p>
|
||||
<a class="alt-link" href="https://www.startpage.com" target="_blank" rel="noopener">startpage.com ↗</a>
|
||||
</div>
|
||||
|
||||
<!-- Correo electrónico -->
|
||||
<div class="alt-category-label">Correo electrónico</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">📬</div>
|
||||
<div>
|
||||
<div class="alt-name">ProtonMail</div>
|
||||
<div class="alt-replaces">Alternativa a Gmail</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">Cifrado extremo a extremo</span>
|
||||
</div>
|
||||
<p class="alt-desc">Servidor en Suiza, cifrado extremo a extremo, sin lectura de correos para publicidad. Plan gratuito disponible.</p>
|
||||
<a class="alt-link" href="https://proton.me/mail" target="_blank" rel="noopener">proton.me/mail ↗</a>
|
||||
</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">📨</div>
|
||||
<div>
|
||||
<div class="alt-name">Tutanota</div>
|
||||
<div class="alt-replaces">Alternativa a Gmail / Outlook</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">RGPD compliant</span>
|
||||
</div>
|
||||
<p class="alt-desc">Empresa alemana, código abierto, cifrado de extremo a extremo en correos, calendarios y contactos. Cumple el RGPD por diseño.</p>
|
||||
<a class="alt-link" href="https://tuta.com" target="_blank" rel="noopener">tuta.com ↗</a>
|
||||
</div>
|
||||
|
||||
<!-- Mensajería -->
|
||||
<div class="alt-category-label">Mensajería</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">💬</div>
|
||||
<div>
|
||||
<div class="alt-name">Signal</div>
|
||||
<div class="alt-replaces">Alternativa a WhatsApp</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">Sin metadatos</span>
|
||||
</div>
|
||||
<p class="alt-desc">El estándar de oro en mensajería cifrada. Código abierto, sin publicidad, sin venta de datos, sin metadatos de contactos. Protocolo Signal usado por ProtonMail.</p>
|
||||
<a class="alt-link" href="https://signal.org" target="_blank" rel="noopener">signal.org ↗</a>
|
||||
</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">📱</div>
|
||||
<div>
|
||||
<div class="alt-name">Element (Matrix)</div>
|
||||
<div class="alt-replaces">Alternativa a Slack / Discord</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">Descentralizado</span>
|
||||
</div>
|
||||
<p class="alt-desc">Protocolo Matrix descentralizado. Autoalojable, cifrado extremo a extremo opcional, sin bloqueo de proveedor único. Ideal para organizaciones.</p>
|
||||
<a class="alt-link" href="https://element.io" target="_blank" rel="noopener">element.io ↗</a>
|
||||
</div>
|
||||
|
||||
<!-- Almacenamiento y documentos -->
|
||||
<div class="alt-category-label">Almacenamiento en la nube y documentos</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">☁</div>
|
||||
<div>
|
||||
<div class="alt-name">Nextcloud</div>
|
||||
<div class="alt-replaces">Alternativa a Google Drive / Dropbox</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">Autoalojable</span>
|
||||
</div>
|
||||
<p class="alt-desc">Suite completa de productividad: archivos, calendarios, contactos, vídeo y más. Autoalojable en tu servidor o contratado a un proveedor europeo.</p>
|
||||
<a class="alt-link" href="https://nextcloud.com" target="_blank" rel="noopener">nextcloud.com ↗</a>
|
||||
</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">📄</div>
|
||||
<div>
|
||||
<div class="alt-name">CryptPad</div>
|
||||
<div class="alt-replaces">Alternativa a Google Docs</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">Cifrado de conocimiento cero</span>
|
||||
</div>
|
||||
<p class="alt-desc">Suite ofimática colaborativa con cifrado extremo a extremo. El servidor nunca puede leer tu contenido. Sin cuenta requerida para documentos temporales.</p>
|
||||
<a class="alt-link" href="https://cryptpad.fr" target="_blank" rel="noopener">cryptpad.fr ↗</a>
|
||||
</div>
|
||||
|
||||
<!-- Redes sociales -->
|
||||
<div class="alt-category-label">Redes sociales y contenido</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">🐘</div>
|
||||
<div>
|
||||
<div class="alt-name">Mastodon</div>
|
||||
<div class="alt-replaces">Alternativa a X / Twitter</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">Descentralizado</span>
|
||||
</div>
|
||||
<p class="alt-desc">Red social federada sin algoritmo de recomendación manipulador. Cada servidor tiene sus propias normas. Sin publicidad, sin perfil conductual.</p>
|
||||
<a class="alt-link" href="https://joinmastodon.org" target="_blank" rel="noopener">joinmastodon.org ↗</a>
|
||||
</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">🎥</div>
|
||||
<div>
|
||||
<div class="alt-name">PeerTube</div>
|
||||
<div class="alt-replaces">Alternativa a YouTube</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">Sin rastreo</span>
|
||||
</div>
|
||||
<p class="alt-desc">Plataforma de vídeo federada. Sin algoritmo de recomendación adictivo, sin publicidad personalizada, sin perfil de usuario guardado.</p>
|
||||
<a class="alt-link" href="https://joinpeertube.org/es/" target="_blank" rel="noopener">joinpeertube.org ↗</a>
|
||||
</div>
|
||||
|
||||
<!-- VPN y DNS -->
|
||||
<div class="alt-category-label">VPN y DNS privados</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">🔒</div>
|
||||
<div>
|
||||
<div class="alt-name">ProtonVPN</div>
|
||||
<div class="alt-replaces">VPN sin logs, código abierto</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--libre">Código abierto</span>
|
||||
<span class="alt-badge alt-badge--gdpr">Sin logs</span>
|
||||
</div>
|
||||
<p class="alt-desc">VPN auditada independientemente. Sin registros de actividad, servidores en suiza, plan gratuito disponible. Código cliente auditado públicamente.</p>
|
||||
<a class="alt-link" href="https://protonvpn.com/es/" target="_blank" rel="noopener">protonvpn.com ↗</a>
|
||||
</div>
|
||||
|
||||
<div class="alt-card">
|
||||
<div class="alt-card-header">
|
||||
<div class="alt-logo">🌐</div>
|
||||
<div>
|
||||
<div class="alt-name">NextDNS</div>
|
||||
<div class="alt-replaces">DNS privado y bloqueador</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alt-badges">
|
||||
<span class="alt-badge alt-badge--gdpr">RGPD compliant</span>
|
||||
</div>
|
||||
<p class="alt-desc">DNS cifrado con bloqueo de rastreadores y publicidad a nivel de red. Configurable sin instalar nada. Plan gratuito con 300.000 consultas mensuales.</p>
|
||||
<a class="alt-link" href="https://nextdns.io" target="_blank" rel="noopener">nextdns.io ↗</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
CALL TO ACTION
|
||||
════════════════════════════════════════════ -->
|
||||
<section class="comunidad-block">
|
||||
<div class="container" style="text-align: center;">
|
||||
<h2 style="font-family: 'Recion', Georgia, serif; color: var(--acid); font-size: clamp(1.4rem, 2.5vw, 1.9rem); margin-bottom: 0.75rem;">
|
||||
El primer paso es recuperar tus datos
|
||||
</h2>
|
||||
<p style="color: var(--muted); max-width: 52ch; margin: 0 auto 2rem; line-height: 1.65;">
|
||||
Antes de migrar a alternativas libres, ejerce tus derechos RGPD. Solicita el borrado de tus datos en las plataformas que ya no quieres usar.
|
||||
</p>
|
||||
<div class="hero-actions" style="justify-content: center;">
|
||||
<a class="btn primary" href="plantillas.html">Generar carta GDPR</a>
|
||||
<a class="btn ghost" href="salud-digital.html#derechos">Ver mis derechos</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<p>RESETEA.NET · Software estático · Sin tracking · Sin cookies · Sin almacenamiento de datos</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -115,8 +115,8 @@
|
|||
<a class="landing-nav-btn landing-nav-btn--highlight" href="concienciacion.html">Concienciación</a>
|
||||
<a class="landing-nav-btn" href="egosurfing.html">Egosurfing</a>
|
||||
<a class="landing-nav-btn" href="plantillas.html">Resetea</a>
|
||||
<a class="landing-nav-btn" href="stats.html">Estadísticas</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">🧠 Salud digital</a>
|
||||
<a class="landing-nav-btn" href="comunidad.html">Comunidad</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">Salud digital</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -3,13 +3,13 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>RESETEA.NET · Egosurfing</title>
|
||||
<meta name="description" content="Busca tu nombre, alias, email o teléfono en la web y descubre dónde aparece tu información personal.">
|
||||
<title>RESETEA.NET · Egosurfing y Tipos de información</title>
|
||||
<meta name="description" content="Busca tu nombre, alias, email o teléfono en la web, descubre dónde aparece tu información personal y aprende qué tipos de datos están expuestos.">
|
||||
<link rel="stylesheet" href="index.css">
|
||||
<style>
|
||||
/* ── Egosurfing-specific ── */
|
||||
/* ── Egosurfing hero ── */
|
||||
.ego-hero {
|
||||
padding: 3rem 0 2.5rem;
|
||||
padding: 3rem 0 2rem;
|
||||
background: var(--bg);
|
||||
text-align: center;
|
||||
border-bottom: 1px solid var(--border);
|
||||
|
|
@ -25,13 +25,9 @@
|
|||
}
|
||||
|
||||
/* ── Barra de búsqueda ── */
|
||||
.search-wrap {
|
||||
max-width: 680px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.search-wrap { max-width: 680px; margin: 0 auto; }
|
||||
.search-bar {
|
||||
display: flex;
|
||||
gap: 0;
|
||||
display: flex; gap: 0;
|
||||
background: var(--surface);
|
||||
border: 2px solid var(--border);
|
||||
border-radius: 14px;
|
||||
|
|
@ -44,191 +40,151 @@
|
|||
box-shadow: 0 0 0 3px rgba(123,63,46,0.12), var(--shadow-md);
|
||||
}
|
||||
.search-input {
|
||||
flex: 1;
|
||||
border: none;
|
||||
outline: none;
|
||||
padding: 1rem 1.2rem;
|
||||
font-size: 1.1rem;
|
||||
background: transparent;
|
||||
color: var(--text);
|
||||
flex: 1; border: none; outline: none;
|
||||
padding: 1rem 1.2rem; font-size: 1.1rem;
|
||||
background: transparent; color: var(--text);
|
||||
font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
|
||||
}
|
||||
.search-input::placeholder { color: var(--subtle); }
|
||||
.search-btn {
|
||||
background: var(--caoba);
|
||||
color: #fff;
|
||||
border: none;
|
||||
padding: 0 1.6rem;
|
||||
font-size: 0.95rem;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
transition: background 140ms ease;
|
||||
background: var(--caoba); color: #fff;
|
||||
border: none; padding: 0 1.6rem;
|
||||
font-size: 0.95rem; font-weight: 600;
|
||||
cursor: pointer; transition: background 140ms ease;
|
||||
font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
|
||||
letter-spacing: 0.02em;
|
||||
white-space: nowrap;
|
||||
letter-spacing: 0.02em; white-space: nowrap;
|
||||
}
|
||||
.search-btn:hover { background: var(--caoba-mid); }
|
||||
.search-btn:disabled { background: var(--border-dark); cursor: not-allowed; }
|
||||
|
||||
/* ── Modos de búsqueda ── */
|
||||
.search-modes {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 0.4rem;
|
||||
margin-top: 0.9rem;
|
||||
flex-wrap: wrap;
|
||||
display: flex; justify-content: center;
|
||||
gap: 0.4rem; margin-top: 0.9rem; flex-wrap: wrap;
|
||||
}
|
||||
.mode-btn {
|
||||
padding: 0.3rem 0.8rem;
|
||||
border-radius: 6px;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
background: var(--surface);
|
||||
color: var(--muted);
|
||||
padding: 0.3rem 0.8rem; border-radius: 6px;
|
||||
font-size: 0.8rem; font-weight: 600; cursor: pointer;
|
||||
background: var(--surface); color: var(--muted);
|
||||
border: 1px solid var(--border);
|
||||
transition: all 120ms ease;
|
||||
font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
|
||||
}
|
||||
.mode-btn.active, .mode-btn:hover {
|
||||
background: var(--caoba-lt);
|
||||
color: var(--caoba);
|
||||
border-color: var(--caoba);
|
||||
background: var(--caoba-lt); color: var(--caoba); border-color: var(--caoba);
|
||||
}
|
||||
.mode-hint {
|
||||
font-size: 0.78rem;
|
||||
color: var(--subtle);
|
||||
margin-top: 0.6rem;
|
||||
text-align: center;
|
||||
font-size: 0.78rem; color: var(--subtle);
|
||||
margin-top: 0.6rem; text-align: center;
|
||||
}
|
||||
|
||||
/* ── Botones de panel debajo del buscador ── */
|
||||
.panel-toggle-row {
|
||||
display: flex; justify-content: center;
|
||||
gap: 0.7rem; margin-top: 1.4rem; flex-wrap: wrap;
|
||||
}
|
||||
.panel-toggle-btn {
|
||||
display: inline-flex; align-items: center; gap: 0.5rem;
|
||||
padding: 0.55rem 1.3rem;
|
||||
border-radius: 10px;
|
||||
font-size: 0.88rem; font-weight: 600;
|
||||
font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
|
||||
cursor: pointer;
|
||||
border: 1.5px solid var(--border);
|
||||
background: var(--surface);
|
||||
color: var(--muted);
|
||||
transition: all 150ms ease;
|
||||
}
|
||||
.panel-toggle-btn:hover {
|
||||
border-color: var(--caoba); color: var(--caoba); background: var(--caoba-lt);
|
||||
}
|
||||
.panel-toggle-btn.active {
|
||||
border-color: var(--caoba); color: var(--caoba);
|
||||
background: var(--caoba-lt);
|
||||
box-shadow: 0 2px 0 0 var(--caoba);
|
||||
}
|
||||
.panel-toggle-btn .ptb-arrow {
|
||||
display: inline-block; transition: transform 200ms ease;
|
||||
}
|
||||
.panel-toggle-btn.active .ptb-arrow { transform: rotate(180deg); }
|
||||
|
||||
/* ── Paneles colapsables ── */
|
||||
.collapsible-panel {
|
||||
overflow: hidden;
|
||||
transition: max-height 350ms ease, opacity 300ms ease;
|
||||
}
|
||||
.collapsible-panel[hidden] { display: none; }
|
||||
|
||||
/* ── Resultados ── */
|
||||
.results-section {
|
||||
padding: 2.5rem 0 3rem;
|
||||
background: var(--surface2);
|
||||
}
|
||||
.results-header {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
gap: 1rem;
|
||||
margin-bottom: 1.5rem;
|
||||
display: flex; align-items: baseline;
|
||||
gap: 1rem; margin-bottom: 1.5rem;
|
||||
}
|
||||
.results-header h2 { margin-bottom: 0; }
|
||||
.results-query {
|
||||
font-size: 0.88rem;
|
||||
color: var(--muted);
|
||||
font-size: 0.88rem; color: var(--muted);
|
||||
background: var(--surface);
|
||||
border: 1px solid var(--border);
|
||||
padding: 0.2rem 0.6rem;
|
||||
border-radius: 5px;
|
||||
padding: 0.2rem 0.6rem; border-radius: 5px;
|
||||
}
|
||||
|
||||
.result-card {
|
||||
background: var(--surface);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 14px;
|
||||
padding: 1.3rem 1.5rem;
|
||||
margin-bottom: 1rem;
|
||||
box-shadow: var(--shadow-sm);
|
||||
border-radius: 14px; padding: 1.3rem 1.5rem;
|
||||
margin-bottom: 1rem; box-shadow: var(--shadow-sm);
|
||||
transition: box-shadow 180ms ease, transform 180ms ease;
|
||||
}
|
||||
.result-card:hover {
|
||||
box-shadow: var(--shadow-md);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
.result-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
|
||||
.result-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.6rem;
|
||||
margin-bottom: 0.4rem;
|
||||
flex-wrap: wrap;
|
||||
display: flex; align-items: center;
|
||||
gap: 0.6rem; margin-bottom: 0.4rem; flex-wrap: wrap;
|
||||
}
|
||||
.result-domain {
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.04em;
|
||||
padding: 0.18rem 0.55rem;
|
||||
border-radius: 5px;
|
||||
background: var(--surface2);
|
||||
color: var(--muted);
|
||||
border: 1px solid var(--border);
|
||||
text-transform: lowercase;
|
||||
}
|
||||
.result-engine {
|
||||
font-size: 0.7rem;
|
||||
color: var(--subtle);
|
||||
font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em;
|
||||
padding: 0.18rem 0.55rem; border-radius: 5px;
|
||||
background: var(--surface2); color: var(--muted);
|
||||
border: 1px solid var(--border); text-transform: lowercase;
|
||||
}
|
||||
.result-engine { font-size: 0.7rem; color: var(--subtle); }
|
||||
.result-title {
|
||||
font-family: 'Recion', 'Georgia', serif;
|
||||
font-size: 1.1rem;
|
||||
color: var(--caoba);
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
margin-bottom: 0.35rem;
|
||||
line-height: 1.3;
|
||||
font-size: 1.1rem; color: var(--caoba);
|
||||
text-decoration: none; display: block;
|
||||
margin-bottom: 0.35rem; line-height: 1.3;
|
||||
}
|
||||
.result-title:hover { text-decoration: underline; color: var(--caoba-mid); }
|
||||
.result-url {
|
||||
font-size: 0.74rem;
|
||||
color: var(--sage);
|
||||
word-break: break-all;
|
||||
margin-bottom: 0.5rem;
|
||||
display: block;
|
||||
font-size: 0.74rem; color: var(--sage);
|
||||
word-break: break-all; margin-bottom: 0.5rem; display: block;
|
||||
}
|
||||
.result-snippet {
|
||||
font-size: 0.9rem;
|
||||
color: var(--muted);
|
||||
line-height: 1.55;
|
||||
margin-bottom: 0.9rem;
|
||||
}
|
||||
.result-actions {
|
||||
display: flex;
|
||||
gap: 0.4rem;
|
||||
flex-wrap: wrap;
|
||||
font-size: 0.9rem; color: var(--muted);
|
||||
line-height: 1.55; margin-bottom: 0.9rem;
|
||||
}
|
||||
.result-actions { display: flex; gap: 0.4rem; flex-wrap: wrap; }
|
||||
.result-action {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 0.28rem 0.75rem;
|
||||
border-radius: 6px;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
border: 1px solid transparent;
|
||||
cursor: pointer;
|
||||
transition: all 120ms ease;
|
||||
display: inline-flex; align-items: center;
|
||||
padding: 0.28rem 0.75rem; border-radius: 6px;
|
||||
font-size: 0.75rem; font-weight: 600;
|
||||
text-decoration: none; border: 1px solid transparent;
|
||||
cursor: pointer; transition: all 120ms ease;
|
||||
font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
|
||||
background: none;
|
||||
}
|
||||
.result-action--rtbf {
|
||||
background: var(--caoba-lt);
|
||||
color: var(--caoba);
|
||||
border-color: #e0c4b8;
|
||||
}
|
||||
.result-action--rtbf { background: var(--caoba-lt); color: var(--caoba); border-color: #e0c4b8; }
|
||||
.result-action--rtbf:hover { background: #e8cfc6; border-color: var(--caoba); }
|
||||
.result-action--gdpr {
|
||||
background: var(--sage-lt);
|
||||
color: var(--sage);
|
||||
border-color: #c0d9c8;
|
||||
}
|
||||
.result-action--gdpr { background: var(--sage-lt); color: var(--sage); border-color: #c0d9c8; }
|
||||
.result-action--gdpr:hover { background: #d2eeda; border-color: var(--sage); }
|
||||
.result-action--visit {
|
||||
background: var(--surface2);
|
||||
color: var(--muted);
|
||||
border-color: var(--border);
|
||||
}
|
||||
.result-action--visit { background: var(--surface2); color: var(--muted); border-color: var(--border); }
|
||||
.result-action--visit:hover { background: var(--border); color: var(--text); }
|
||||
|
||||
/* ── Estado vacío / carga / error ── */
|
||||
.search-state {
|
||||
text-align: center;
|
||||
padding: 3rem 1rem;
|
||||
color: var(--muted);
|
||||
}
|
||||
.search-state .state-icon {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 0.8rem;
|
||||
}
|
||||
.search-state { text-align: center; padding: 3rem 1rem; color: var(--muted); }
|
||||
.search-state .state-icon { font-size: 2.5rem; margin-bottom: 0.8rem; }
|
||||
.search-state h3 { color: var(--text); margin-bottom: 0.4rem; }
|
||||
.spinner {
|
||||
width: 36px; height: 36px;
|
||||
|
|
@ -243,53 +199,38 @@
|
|||
/* ── OSINT Dorking panel ── */
|
||||
.dork-section { padding: 2.5rem 0 3rem; }
|
||||
.dork-tip {
|
||||
font-size: 0.82rem;
|
||||
color: var(--muted);
|
||||
font-size: 0.82rem; color: var(--muted);
|
||||
background: var(--caoba-lt);
|
||||
border-left: 3px solid var(--caoba);
|
||||
padding: 0.55rem 1rem;
|
||||
border-radius: 0 8px 8px 0;
|
||||
margin-top: 0.9rem;
|
||||
border-radius: 0 8px 8px 0; margin-top: 0.9rem;
|
||||
}
|
||||
/* Tabs de categoría */
|
||||
.dork-tabs {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.3rem;
|
||||
display: flex; flex-wrap: wrap; gap: 0.3rem;
|
||||
border-bottom: 2px solid var(--border);
|
||||
padding-bottom: 0;
|
||||
margin: 1.2rem 0 0;
|
||||
padding-bottom: 0; margin: 1.2rem 0 0;
|
||||
}
|
||||
.dtab {
|
||||
padding: 0.45rem 0.85rem;
|
||||
border: 1px solid transparent;
|
||||
border-bottom: none;
|
||||
border: 1px solid transparent; border-bottom: none;
|
||||
border-radius: 7px 7px 0 0;
|
||||
background: none;
|
||||
color: var(--muted);
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
background: none; color: var(--muted);
|
||||
font-size: 0.75rem; font-weight: 600; cursor: pointer;
|
||||
transition: all 120ms ease;
|
||||
font-family: system-ui, sans-serif;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
bottom: -2px;
|
||||
white-space: nowrap; position: relative; bottom: -2px;
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
.dtab:hover { background: var(--surface2); color: var(--text); }
|
||||
.dtab.active {
|
||||
background: var(--surface2);
|
||||
border-color: var(--border);
|
||||
border-bottom-color: var(--surface2);
|
||||
color: var(--caoba);
|
||||
background: var(--surface2); border-color: var(--border);
|
||||
border-bottom-color: var(--surface2); color: var(--caoba);
|
||||
}
|
||||
/* Grid de dorks */
|
||||
.dork-pane { display: none; padding-top: 1.1rem; }
|
||||
.dork-pane.active { display: block; }
|
||||
.dork-items {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
|
||||
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||||
gap: 0.55rem;
|
||||
}
|
||||
.dork-item {
|
||||
|
|
@ -298,57 +239,38 @@
|
|||
grid-template-rows: auto auto;
|
||||
gap: 0.2rem 0.5rem;
|
||||
padding: 0.6rem 0.8rem;
|
||||
background: var(--surface);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 9px;
|
||||
box-shadow: var(--shadow-sm);
|
||||
background: var(--surface); border: 1px solid var(--border);
|
||||
border-radius: 9px; box-shadow: var(--shadow-sm);
|
||||
transition: box-shadow 150ms ease, border-color 150ms ease;
|
||||
}
|
||||
.dork-item:hover { box-shadow: var(--shadow-md); border-color: var(--border-dark); }
|
||||
.dork-item-desc {
|
||||
font-size: 0.76rem;
|
||||
color: var(--text);
|
||||
font-weight: 600;
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
align-self: center;
|
||||
font-size: 0.76rem; color: var(--text); font-weight: 600;
|
||||
grid-column: 1; grid-row: 1; align-self: center;
|
||||
}
|
||||
.dork-item-query {
|
||||
font-family: 'Courier New', monospace;
|
||||
font-size: 0.72rem;
|
||||
color: var(--caoba);
|
||||
background: var(--caoba-lt);
|
||||
padding: 0.12rem 0.4rem;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
display: block;
|
||||
font-family: 'Courier New', monospace; font-size: 0.72rem;
|
||||
color: var(--caoba); background: var(--caoba-lt);
|
||||
padding: 0.12rem 0.4rem; border-radius: 4px;
|
||||
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
|
||||
grid-column: 1; grid-row: 2; display: block;
|
||||
}
|
||||
.dork-run-btn {
|
||||
grid-column: 2;
|
||||
grid-row: 1 / 3;
|
||||
align-self: center;
|
||||
padding: 0.3rem 0.7rem;
|
||||
border-radius: 6px;
|
||||
grid-column: 2; grid-row: 1 / 3; align-self: center;
|
||||
padding: 0.3rem 0.7rem; border-radius: 6px;
|
||||
border: 1px solid var(--border);
|
||||
background: var(--surface2);
|
||||
color: var(--muted);
|
||||
font-size: 0.72rem;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
transition: all 120ms ease;
|
||||
background: var(--surface2); color: var(--muted);
|
||||
font-size: 0.72rem; font-weight: 600; cursor: pointer;
|
||||
white-space: nowrap; transition: all 120ms ease;
|
||||
font-family: system-ui, sans-serif;
|
||||
}
|
||||
.dork-run-btn:hover {
|
||||
background: var(--caoba-lt);
|
||||
border-color: var(--caoba);
|
||||
color: var(--caoba);
|
||||
background: var(--caoba-lt); border-color: var(--caoba); color: var(--caoba);
|
||||
}
|
||||
|
||||
/* ── Tipos de información styles ── */
|
||||
.tipos-panel { padding: 2rem 0 2.5rem; border-top: 1px solid var(--border); }
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.dork-items { grid-template-columns: 1fr; }
|
||||
.dork-tabs { gap: 0.2rem; }
|
||||
|
|
@ -367,12 +289,10 @@
|
|||
<div class="container hero-landing-inner">
|
||||
<h1 class="main-title">RESETEA</h1>
|
||||
<div class="landing-nav">
|
||||
<a class="landing-nav-btn" href="tipos.html">Tipos de información</a>
|
||||
<a class="landing-nav-btn" href="concienciacion.html">Concienciación</a>
|
||||
<a class="landing-nav-btn landing-nav-btn--highlight" href="egosurfing.html">Egosurfing</a>
|
||||
<a class="landing-nav-btn" href="plantillas.html">Resetea</a>
|
||||
<a class="landing-nav-btn" href="stats.html">Estadísticas</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">🧠 Salud digital</a>
|
||||
<a class="landing-nav-btn" href="comunidad.html">Comunidad</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">Salud digital</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -400,22 +320,239 @@
|
|||
<button class="mode-btn" data-mode="libre">Búsqueda libre</button>
|
||||
</div>
|
||||
<p class="mode-hint" id="mode-hint">Se busca entre comillas para coincidencia exacta.</p>
|
||||
|
||||
<!-- Botones de panel -->
|
||||
<div class="panel-toggle-row">
|
||||
<button class="panel-toggle-btn" id="btn-tipos" type="button" aria-expanded="false" aria-controls="panel-tipos">
|
||||
Tipos de información <span class="ptb-arrow">▾</span>
|
||||
</button>
|
||||
<button class="panel-toggle-btn" id="btn-avanzada" type="button" aria-expanded="false" aria-controls="panel-avanzada">
|
||||
Búsqueda avanzada <span class="ptb-arrow">▾</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══ RESULTADOS ════════════════════════════════════════════════ -->
|
||||
<section class="results-section" id="results-section" hidden>
|
||||
<!-- ══ PANEL: TIPOS DE INFORMACIÓN ══════════════════════════════ -->
|
||||
<div id="panel-tipos" hidden>
|
||||
<section class="tipos-panel info">
|
||||
<div class="container">
|
||||
|
||||
<section class="hero">
|
||||
<div class="container hero-inner" style="padding:0;">
|
||||
<div class="hero-text">
|
||||
<h1>Tipos de información personal<br>y dónde se te "escapa".</h1>
|
||||
<p>
|
||||
Antes de borrar, hay que entender qué datos existen y cómo se conectan.
|
||||
Este mapa te ayuda a identificar tu exposición: qué datos son "identificadores",
|
||||
cuáles son "atributos", cuáles son "comportamiento" y cómo terminan en compañías,
|
||||
publicidad, brokers y registros públicos.
|
||||
</p>
|
||||
<div class="notice" style="margin-top:1rem;">
|
||||
<strong>Enfoque:</strong> Identifica categorías, fuentes y vínculos, y luego actúa por prioridad.
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-card" aria-label="Resumen práctico">
|
||||
<div class="stats">
|
||||
<div class="stat"><div class="stat-num">3</div><div class="stat-label">Capas de datos</div></div>
|
||||
<div class="stat"><div class="stat-num">8+</div><div class="stat-label">Fuentes típicas</div></div>
|
||||
<div class="stat"><div class="stat-num">1</div><div class="stat-label">Objetivo</div></div>
|
||||
</div>
|
||||
<ul class="steps">
|
||||
<li><span>1</span> Identificadores (quién eres)</li>
|
||||
<li><span>2</span> Atributos (cómo eres)</li>
|
||||
<li><span>3</span> Actividad (qué haces)</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<h2 style="margin-top:2rem;">Mapa de tipos de información personal</h2>
|
||||
<p class="section-desc">
|
||||
No todos los datos "pesan" igual. Los <strong>identificadores</strong> permiten localizarte;
|
||||
los <strong>atributos</strong> te describen; la <strong>actividad</strong> te perfila.
|
||||
Los ecosistemas publicitarios y los data brokers suelen unirlo todo por correlación.
|
||||
</p>
|
||||
<p class="section-desc" style="margin-top:0.5rem;font-size:0.82rem;">
|
||||
Marco legal: <a href="https://eur-lex.europa.eu/legal-content/ES/TXT/HTML/?uri=CELEX:32016R0679#d1e1489-1-1" target="_blank" rel="noopener" style="color:var(--caoba);">RGPD Art. 4 →</a>
|
||||
· <a href="https://www.ftc.gov/reports/data-brokers" target="_blank" rel="noopener" style="color:var(--caoba);">FTC Data Broker Report →</a>
|
||||
</p>
|
||||
|
||||
<div class="grid" style="margin-top:1.5rem;">
|
||||
|
||||
<div class="group">
|
||||
<h3>1) Identificadores directos</h3>
|
||||
<div class="item"><label><input type="checkbox"> Nombre completo y variantes</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Emails (actuales y antiguos)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Teléfonos (móvil/fijo/VoIP)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Direcciones (actuales y previas)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Alias/nicks recurrentes</label></div>
|
||||
</div>
|
||||
|
||||
<div class="group">
|
||||
<h3>2) Identificadores "técnicos"</h3>
|
||||
<div class="item"><label><input type="checkbox"> IP (pública), rangos y patrones</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Dispositivo (ID de publicidad, fingerprint)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Cookies / sesiones / tokens</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Metadatos (fotos, PDFs, documentos)</label></div>
|
||||
</div>
|
||||
|
||||
<div class="group">
|
||||
<h3>3) Atributos personales</h3>
|
||||
<div class="item"><label><input type="checkbox"> Fecha de nacimiento / edad aproximada</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Trabajo / cargo / historial laboral</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Educación / centros / promociones</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Propiedad (vivienda/vehículo), registros y anuncios</label></div>
|
||||
</div>
|
||||
|
||||
<div class="group">
|
||||
<h3>4) Contactos y "grafo social"</h3>
|
||||
<div class="item"><label><input type="checkbox"> Familia / convivientes / relaciones públicas</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Amigos, compañeros, "etiquetados", fotos grupales</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Agenda subida (contact discovery)</label></div>
|
||||
</div>
|
||||
|
||||
<div class="group">
|
||||
<h3>5) Actividad y comportamiento</h3>
|
||||
<div class="item"><label><input type="checkbox"> Historial de navegación / intereses inferidos</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Compras, suscripciones, tickets y reservas</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Ubicación (GPS, Wi-Fi, torres, check-ins)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Contenido publicado (posts, comentarios, reseñas)</label></div>
|
||||
</div>
|
||||
|
||||
<div class="group">
|
||||
<h3>6) Datos "sensibles" (tratamiento especial)</h3>
|
||||
<div class="item"><label><input type="checkbox"> Salud, diagnósticos, seguros, hábitos</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Biométricos (cara/huella/voz) y modelos</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Creencias/ideología/sindical, etc. (si se publica)</label></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Cómo lo guardan -->
|
||||
<h2 style="margin-top:2.5rem;">Cómo lo guardan y conectan las compañías</h2>
|
||||
<p>
|
||||
Lo importante no es solo "qué dato", sino <strong>qué sistema lo almacena</strong> y
|
||||
<strong>qué identificador lo une</strong> con el resto (email, teléfono, cookie, device ID, etc.).
|
||||
</p>
|
||||
<div class="grid" style="margin-top:1.5rem;">
|
||||
<div class="group">
|
||||
<h3>Primera parte (1st-party)</h3>
|
||||
<p class="section-desc">Datos que entregas a un servicio directamente. Suelen estar en CRMs, sistemas de facturación, logs y backups.</p>
|
||||
<div class="item"><label><input type="checkbox"> CRM / soporte (tickets, chats, grabaciones)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Facturación (direcciones, pagos, historial)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Logs (IP, timestamps, user-agent)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Backups y réplicas (borrado no inmediato)</label></div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Terceros (3rd-party)</h3>
|
||||
<p class="section-desc">Trackers, analítica, publicidad, SDKs en apps, CDNs y "social logins". Pueden correlacionar actividad entre sitios.</p>
|
||||
<div class="item"><label><input type="checkbox"> Cookies 3rd-party / píxeles / tags</label></div>
|
||||
<div class="item"><label><input type="checkbox"> SDKs de móvil (ID publicidad, telemetría)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Fingerprinting (señales del navegador)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Enriquecimiento (email→perfil inferido)</label></div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Data brokers y agregadores</h3>
|
||||
<p class="section-desc">Compran, cruzan y re-venden datos. Su fuerza está en correlación: email/teléfono/dirección + registros + actividad.</p>
|
||||
<div class="item"><label><input type="checkbox"> Compras de listas (marketing)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Scraping (perfiles públicos, reseñas)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Registros públicos (según jurisdicción)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Brechas/filtraciones (datos históricos)</label></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Fuentes -->
|
||||
<h2 style="margin-top:2.5rem;">Fuentes típicas de exposición</h2>
|
||||
<p>Piensa en tuberías: donde más se filtra, más impacto tiene el control.</p>
|
||||
<div class="grid" style="margin-top:1.5rem;">
|
||||
<div class="group">
|
||||
<h3>Registros y trámites</h3>
|
||||
<p class="section-desc">Registros públicos, boletines, licencias, directorios profesionales, anuncios legales.</p>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Plataformas y publicaciones</h3>
|
||||
<p class="section-desc">Redes sociales, foros, comentarios, reseñas, repositorios, perfiles públicos, páginas antiguas.</p>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Economía cotidiana</h3>
|
||||
<p class="section-desc">Bancos/seguros (muy regulado), e-commerce, envíos, fidelización, tickets, reservas, soporte.</p>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Telecos y conectividad</h3>
|
||||
<p class="section-desc">Proveedores de internet/móvil, Wi-Fi, logs, servicios de mensajería, servicios en la nube.</p>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Móvil y apps</h3>
|
||||
<p class="section-desc">Permisos, SDKs, analítica, ubicaciones, fotos con metadatos, sincronización de contactos.</p>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Filtraciones</h3>
|
||||
<p class="section-desc">Brechas de datos: emails, teléfonos, direcciones, passwords. Impactan durante años.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Prioridad -->
|
||||
<h2 style="margin-top:2.5rem;">Prioridad práctica (qué tocar primero)</h2>
|
||||
<p>Empieza por los <strong>identificadores de enlace</strong> (email/teléfono/dirección) y por lo que "propaga" a terceros.</p>
|
||||
<div class="grid" style="margin-top:1.5rem;">
|
||||
<div class="group">
|
||||
<h3>Alta prioridad</h3>
|
||||
<p class="section-desc">Email/teléfono, direcciones históricas, perfiles públicos, fotos con metadatos, directorios/brokers, páginas indexadas con tu nombre.</p>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Media prioridad</h3>
|
||||
<p class="section-desc">Historial de compras y suscripciones, cuentas secundarias, contenidos dispersos (comentarios/foros), alias repetidos.</p>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Baja prioridad (pero no ignorar)</h3>
|
||||
<p class="section-desc">Señales técnicas menores o aisladas sin correlación clara. Suelen resolverse con higiene de navegador/dispositivo.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Acciones -->
|
||||
<h2 style="margin-top:2.5rem;">Acciones recomendadas</h2>
|
||||
<div class="grid" style="margin-top:1.5rem;">
|
||||
<div class="group">
|
||||
<h3>Identificadores</h3>
|
||||
<div class="item"><label><input type="checkbox"> Unificar/rotar emails (según caso de uso)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Revisar teléfonos publicados y directorios</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Solicitudes de supresión (GDPR) donde aplique</label></div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Publicaciones e indexación</h3>
|
||||
<div class="item"><label><input type="checkbox"> Retirar en origen (web/foro) primero</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Desindexar (formularios buscador) como refuerzo</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Reducir "señales" (perfiles públicos/SEO personal)</label></div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Dispositivos y trackers</h3>
|
||||
<div class="item"><label><input type="checkbox"> Revisar permisos de apps y SDKs</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Reducir tracking (navegador, bloqueadores, etc.)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Limpiar metadatos en documentos e imágenes</label></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</div><!-- /panel-tipos -->
|
||||
|
||||
<!-- ══ PANEL: BÚSQUEDA AVANZADA ═════════════════════════════════ -->
|
||||
<div id="panel-avanzada" hidden>
|
||||
|
||||
<!-- RESULTADOS -->
|
||||
<section class="results-section" id="results-section">
|
||||
<div class="container">
|
||||
<div class="results-header">
|
||||
<h2>Resultados</h2>
|
||||
<span class="results-query" id="results-query"></span>
|
||||
</div>
|
||||
<div id="results-list"></div>
|
||||
<div id="results-list"><div class="search-state"><h3>Introduce un dato y busca</h3><p>Escribe tu nombre, email, alias o teléfono en el buscador de arriba y pulsa Buscar.</p></div></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══ OSINT DORKING PROFESIONAL ════════════════════════════════ -->
|
||||
<!-- OSINT DORKING -->
|
||||
<section class="dork-section info" id="dorking">
|
||||
<div class="container">
|
||||
<h2>OSINT dorking avanzado</h2>
|
||||
|
|
@ -426,13 +563,12 @@
|
|||
<div class="dork-tip">
|
||||
Escribe tu nombre, email, alias o teléfono en el buscador de arriba antes de lanzar un dork.
|
||||
</div>
|
||||
|
||||
<div class="dork-tabs" id="dork-tabs"></div>
|
||||
<div id="dork-panes"></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══ HERRAMIENTAS OSINT ════════════════════════════════════════ -->
|
||||
<!-- HERRAMIENTAS COMPLEMENTARIAS -->
|
||||
<section class="info alt">
|
||||
<div class="container">
|
||||
<h2>Herramientas complementarias</h2>
|
||||
|
|
@ -490,6 +626,8 @@
|
|||
</div>
|
||||
</section>
|
||||
|
||||
</div><!-- /panel-avanzada -->
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="footer">
|
||||
|
|
@ -512,10 +650,10 @@ const MODES = {
|
|||
|
||||
let currentMode = 'nombre';
|
||||
|
||||
const modeBtns = document.querySelectorAll('.mode-btn');
|
||||
const modeHint = document.getElementById('mode-hint');
|
||||
const egoInput = document.getElementById('ego-input');
|
||||
const egoBtn = document.getElementById('ego-btn');
|
||||
const modeBtns = document.querySelectorAll('.mode-btn');
|
||||
const modeHint = document.getElementById('mode-hint');
|
||||
const egoInput = document.getElementById('ego-input');
|
||||
const egoBtn = document.getElementById('ego-btn');
|
||||
const resultsSec = document.getElementById('results-section');
|
||||
const resultsQuery = document.getElementById('results-query');
|
||||
const resultsList = document.getElementById('results-list');
|
||||
|
|
@ -533,6 +671,25 @@ modeBtns.forEach(btn => {
|
|||
egoInput.addEventListener('keydown', e => { if (e.key === 'Enter') doSearch(); });
|
||||
egoBtn.addEventListener('click', doSearch);
|
||||
|
||||
/* ── Toggle paneles ─────────────────────────────────────────── */
|
||||
(function () {
|
||||
function setupToggle(btnId, panelId) {
|
||||
const btn = document.getElementById(btnId);
|
||||
const panel = document.getElementById(panelId);
|
||||
if (!btn || !panel) return;
|
||||
|
||||
btn.addEventListener('click', function () {
|
||||
const isOpen = !panel.hidden;
|
||||
panel.hidden = isOpen;
|
||||
btn.classList.toggle('active', !isOpen);
|
||||
btn.setAttribute('aria-expanded', String(!isOpen));
|
||||
});
|
||||
}
|
||||
|
||||
setupToggle('btn-tipos', 'panel-tipos');
|
||||
setupToggle('btn-avanzada', 'panel-avanzada');
|
||||
})();
|
||||
|
||||
/* ── OSINT Dorking — categorías ──────────────────────────────── */
|
||||
const DORK_CATEGORIES = [
|
||||
{
|
||||
|
|
@ -677,21 +834,21 @@ const DORK_CATEGORIES = [
|
|||
]
|
||||
},
|
||||
];
|
||||
|
||||
/* ── Renderizar tabs y panes ─────────────────────────────────── */
|
||||
(function initDorks() {
|
||||
/* ── Renderizar tabs y panes (lazy) ─────────────────────────── */
|
||||
let dorksInited = false;
|
||||
function initDorks() {
|
||||
if (dorksInited) return;
|
||||
dorksInited = true;
|
||||
const tabsEl = document.getElementById('dork-tabs');
|
||||
const panesEl = document.getElementById('dork-panes');
|
||||
|
||||
DORK_CATEGORIES.forEach((cat, i) => {
|
||||
/* Tab */
|
||||
const tab = document.createElement('button');
|
||||
tab.className = 'dtab' + (i === 0 ? ' active' : '');
|
||||
tab.textContent = cat.label;
|
||||
tab.dataset.cat = i;
|
||||
tabsEl.appendChild(tab);
|
||||
|
||||
/* Pane */
|
||||
const pane = document.createElement('div');
|
||||
pane.className = 'dork-pane' + (i === 0 ? ' active' : '');
|
||||
pane.id = 'dpane-' + i;
|
||||
|
|
@ -713,7 +870,6 @@ const DORK_CATEGORIES = [
|
|||
panesEl.appendChild(pane);
|
||||
});
|
||||
|
||||
/* Tab switching */
|
||||
tabsEl.addEventListener('click', e => {
|
||||
const tab = e.target.closest('.dtab');
|
||||
if (!tab) return;
|
||||
|
|
@ -723,7 +879,6 @@ const DORK_CATEGORIES = [
|
|||
document.getElementById('dpane-' + tab.dataset.cat).classList.add('active');
|
||||
});
|
||||
|
||||
/* Lanzar dork al hacer clic en Buscar */
|
||||
panesEl.addEventListener('click', e => {
|
||||
const btn = e.target.closest('.dork-run-btn');
|
||||
if (!btn) return;
|
||||
|
|
@ -741,14 +896,29 @@ const DORK_CATEGORIES = [
|
|||
modeHint.textContent = MODES.libre.hint;
|
||||
doSearch();
|
||||
});
|
||||
})();
|
||||
}
|
||||
|
||||
/* Inicializar dorks cuando se abre el panel avanzado */
|
||||
document.getElementById('btn-avanzada').addEventListener('click', function () {
|
||||
/* slight delay to let the panel become visible first */
|
||||
setTimeout(initDorks, 10);
|
||||
});
|
||||
|
||||
/* ── Búsqueda ───────────────────────────────────────────────── */
|
||||
async function doSearch() {
|
||||
const raw = egoInput.value.trim();
|
||||
if (!raw) { egoInput.focus(); return; }
|
||||
|
||||
resultsSec.hidden = false;
|
||||
/* Abrir panel avanzada si está cerrado */
|
||||
const panelAv = document.getElementById('panel-avanzada');
|
||||
const btnAv = document.getElementById('btn-avanzada');
|
||||
if (panelAv && panelAv.hidden) {
|
||||
panelAv.hidden = false;
|
||||
btnAv && btnAv.classList.add('active');
|
||||
btnAv && btnAv.setAttribute('aria-expanded', 'true');
|
||||
initDorks();
|
||||
}
|
||||
|
||||
resultsList.innerHTML = `
|
||||
<div class="search-state">
|
||||
<div class="spinner"></div>
|
||||
|
|
@ -780,15 +950,14 @@ function renderResults(results) {
|
|||
if (!results || results.length === 0) {
|
||||
resultsList.innerHTML = `
|
||||
<div class="search-state">
|
||||
<div class="state-icon">🔍</div>
|
||||
<h3>Sin resultados visibles</h3>
|
||||
<p>No se encontraron menciones públicas. Eso es una buena señal.<br>
|
||||
Prueba variantes de tu nombre o usa los dorks de abajo.</p>
|
||||
Prueba variantes de tu nombre o usa los dorks en "Búsqueda avanzada".</p>
|
||||
</div>`;
|
||||
return;
|
||||
}
|
||||
|
||||
resultsList.innerHTML = results.map((r, i) => {
|
||||
resultsList.innerHTML = results.map((r) => {
|
||||
const rtbfUrl = rtbfLink(r.url);
|
||||
return `
|
||||
<div class="result-card">
|
||||
|
|
@ -823,14 +992,13 @@ function rtbfLink(url) {
|
|||
if (host.includes('bing.')) return 'https://www.bing.com/webmasters/tools/content-removal';
|
||||
if (host.includes('yahoo.')) return 'https://io.help.yahoo.com/contact/index?page=contact';
|
||||
} catch {}
|
||||
/* Para cualquier otro dominio: derecho al olvido Google */
|
||||
return 'https://reportcontent.google.com/forms/rtbf';
|
||||
}
|
||||
|
||||
function showError(msg) {
|
||||
resultsList.innerHTML = `
|
||||
<div class="search-state">
|
||||
<div class="state-icon">⚠️</div>
|
||||
|
||||
<h3>Error en la búsqueda</h3>
|
||||
<p>${esc(msg)}</p>
|
||||
</div>`;
|
||||
|
|
|
|||
BIN
public/img/forest-aerial.jpg
Normal file
BIN
public/img/forest-aerial.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 377 KiB |
BIN
public/img/garden-japan.jpg
Normal file
BIN
public/img/garden-japan.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 313 KiB |
BIN
public/img/study-attention.jpg
Normal file
BIN
public/img/study-attention.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 65 KiB |
BIN
public/img/study-brain.jpg
Normal file
BIN
public/img/study-brain.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 52 KiB |
BIN
public/img/study-data.jpg
Normal file
BIN
public/img/study-data.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
BIN
public/img/study-sleep.jpg
Normal file
BIN
public/img/study-sleep.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 45 KiB |
BIN
public/img/times-square.jpg
Normal file
BIN
public/img/times-square.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 305 KiB |
|
|
@ -2281,8 +2281,10 @@ a:hover { color: var(--caoba-mid); text-decoration: underline; }
|
|||
);
|
||||
}
|
||||
.photo-slide--1 { background-image: url('img/crowd-phones.jpg'); }
|
||||
.photo-slide--2 { background-image: url('img/surveillance.jpg'); background-position: center center; }
|
||||
.photo-slide--2 { background-image: url('img/times-square.jpg'); background-position: center center; }
|
||||
.photo-slide--3 { background-image: url('img/legal-action.jpg'); background-position: center 30%; }
|
||||
.photo-slide--4 { background-image: url('img/garden-japan.jpg'); background-position: center 40%; }
|
||||
.photo-slide--5 { background-image: url('img/forest-aerial.jpg'); background-position: center center; }
|
||||
|
||||
.photo-slide-inner {
|
||||
position: relative;
|
||||
|
|
|
|||
1040
public/index.html
1040
public/index.html
File diff suppressed because it is too large
Load diff
|
|
@ -207,12 +207,10 @@
|
|||
<div class="container hero-landing-inner">
|
||||
<h1 class="main-title">RESETEA</h1>
|
||||
<div class="landing-nav">
|
||||
<a class="landing-nav-btn" href="tipos.html">Tipos de información</a>
|
||||
<a class="landing-nav-btn" href="concienciacion.html">Concienciación</a>
|
||||
<a class="landing-nav-btn" href="egosurfing.html">Egosurfing</a>
|
||||
<a class="landing-nav-btn landing-nav-btn--highlight" href="plantillas.html">Resetea</a>
|
||||
<a class="landing-nav-btn" href="stats.html">Estadísticas</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">🧠 Salud digital</a>
|
||||
<a class="landing-nav-btn" href="comunidad.html">Comunidad</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">Salud digital</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -3,24 +3,126 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Redes sociales y cerebro: lo que dice la ciencia · RESETEA.NET</title>
|
||||
<title>Salud digital, concienciación y derechos GDPR · RESETEA.NET</title>
|
||||
<meta name="description"
|
||||
content="Revisión de la evidencia científica sobre los efectos del uso excesivo de redes sociales en el cerebro: dopamina, atención, depresión, sueño y cambios estructurales.">
|
||||
content="Ciencia sobre el impacto neurológico de las redes sociales, tus derechos GDPR (RGPD), derecho al olvido y cómo ejercerlos gratis y sin abogado.">
|
||||
<link rel="stylesheet" href="index.css">
|
||||
</head>
|
||||
<style>
|
||||
/* ── Estilos de concienciación ── */
|
||||
.rights-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 1.5rem;
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
.right-card {
|
||||
background: var(--surface);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 14px;
|
||||
padding: 1.4rem;
|
||||
}
|
||||
.right-card .art {
|
||||
font-size: 0.72rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.08em;
|
||||
color: var(--caoba);
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.right-card h3 { margin-bottom: 0.6rem; font-size: 1rem; }
|
||||
.right-card p { font-size: 0.85rem; color: var(--muted); line-height: 1.55; }
|
||||
.right-card .tag {
|
||||
display: inline-block;
|
||||
margin-top: 0.8rem;
|
||||
padding: 0.2rem 0.55rem;
|
||||
font-size: 0.72rem;
|
||||
border-radius: 6px;
|
||||
background: rgba(255,61,0,0.12);
|
||||
color: var(--caoba);
|
||||
border: 1px solid rgba(255,61,0,0.25);
|
||||
}
|
||||
.timeline {
|
||||
margin-top: 1.5rem;
|
||||
border-left: 2px solid var(--border);
|
||||
padding-left: 1.5rem;
|
||||
}
|
||||
.timeline-item { margin-bottom: 1.5rem; position: relative; }
|
||||
.timeline-item::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: -1.9rem; top: 0.3rem;
|
||||
width: 10px; height: 10px;
|
||||
border-radius: 50%;
|
||||
background: var(--caoba);
|
||||
}
|
||||
.timeline-item h4 { font-size: 0.95rem; margin-bottom: 0.3rem; }
|
||||
.timeline-item p { font-size: 0.85rem; color: var(--muted); }
|
||||
.myth-block {
|
||||
background: var(--surface);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 14px;
|
||||
padding: 1.2rem 1.4rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.myth-block .myth-label {
|
||||
font-size: 0.72rem; font-weight: 700;
|
||||
letter-spacing: 0.06em; text-transform: uppercase;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
.myth-label.mito { color: #ff6b6b; }
|
||||
.myth-label.realidad { color: var(--acid-dark); }
|
||||
.myth-block p { font-size: 0.88rem; color: var(--muted); }
|
||||
.platform-table {
|
||||
width: 100%; border-collapse: collapse;
|
||||
margin-top: 1.5rem; font-size: 0.85rem;
|
||||
}
|
||||
.platform-table th {
|
||||
text-align: left; padding: 0.6rem 0.8rem;
|
||||
border-bottom: 1px solid var(--border);
|
||||
color: var(--muted); font-weight: 600;
|
||||
}
|
||||
.platform-table td {
|
||||
padding: 0.6rem 0.8rem;
|
||||
border-bottom: 1px solid rgba(38,43,54,0.5);
|
||||
vertical-align: top;
|
||||
}
|
||||
.platform-table tr:last-child td { border-bottom: none; }
|
||||
.badge {
|
||||
display: inline-block; padding: 0.15rem 0.45rem;
|
||||
border-radius: 5px; font-size: 0.72rem; font-weight: 600;
|
||||
}
|
||||
.badge-ok { background: rgba(57,255,20,0.12); color: var(--acid-dark); border: 1px solid rgba(57,255,20,0.2); }
|
||||
.badge-warn{ background: rgba(255,200,0,0.12); color: #ffc800; border: 1px solid rgba(255,200,0,0.2); }
|
||||
.badge-bad { background: rgba(255,61,0,0.12); color: var(--caoba); border: 1px solid rgba(255,61,0,0.2); }
|
||||
@media (max-width: 900px) { .rights-grid { grid-template-columns: 1fr; } }
|
||||
.right-card-link {
|
||||
display: inline-flex; align-items: center; gap: 0.3rem;
|
||||
margin-top: 0.75rem; padding: 0.3rem 0.65rem;
|
||||
border-radius: 7px; font-size: 0.72rem; font-weight: 600;
|
||||
color: var(--muted); border: 1px solid var(--border);
|
||||
text-decoration: none;
|
||||
transition: color 140ms ease, border-color 140ms ease, background 140ms ease;
|
||||
}
|
||||
.right-card-link:hover { color: var(--caoba); border-color: var(--caoba); background: var(--caoba-lt); text-decoration: none; }
|
||||
|
||||
/* ── Intro-section (salud digital from index) ── */
|
||||
.sd-section-divider {
|
||||
border: none;
|
||||
border-top: 2px solid var(--border);
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<section class="hero-landing">
|
||||
<div class="container hero-landing-inner">
|
||||
<h1 class="main-title">RESETEA</h1>
|
||||
<div class="landing-nav">
|
||||
<a class="landing-nav-btn" href="tipos.html">Tipos de información</a>
|
||||
<a class="landing-nav-btn" href="concienciacion.html">Concienciación</a>
|
||||
<a class="landing-nav-btn" href="egosurfing.html">Egosurfing</a>
|
||||
<a class="landing-nav-btn" href="plantillas.html">Resetea</a>
|
||||
<a class="landing-nav-btn" href="stats.html">Estadísticas</a>
|
||||
<a class="landing-nav-btn landing-nav-btn--highlight" href="salud-digital.html">🧠 Salud digital</a>
|
||||
<a class="landing-nav-btn" href="comunidad.html">Comunidad</a>
|
||||
<a class="landing-nav-btn landing-nav-btn--highlight" href="salud-digital.html">Salud digital</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -28,9 +130,193 @@
|
|||
<main>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
HERO DEL ARTÍCULO
|
||||
CONCIENCIACIÓN HERO — Tus derechos digitales
|
||||
════════════════════════════════════════════ -->
|
||||
<section class="article-hero">
|
||||
<section class="hero">
|
||||
<div class="container hero-inner">
|
||||
<div class="hero-text">
|
||||
<h1>Tus derechos digitales.<br>Lo que la ley garantiza.</h1>
|
||||
<p>
|
||||
El RGPD (Reglamento General de Protección de Datos) y la LOPDGDD española
|
||||
te dan derechos concretos y exigibles. No son opcionales para las plataformas:
|
||||
están obligadas a cumplirlos o se enfrentan a sanciones de hasta 20 M€
|
||||
o el 4 % de su facturación global.
|
||||
</p>
|
||||
<div class="hero-actions">
|
||||
<a class="btn primary" href="#derechos">Ver mis derechos</a>
|
||||
<a class="btn ghost" href="#olvido">Derecho al olvido</a>
|
||||
</div>
|
||||
<div class="notice">
|
||||
<strong>Marco normativo:</strong><br>
|
||||
RGPD (UE 2016/679) · LOPDGDD (Ley Orgánica 3/2018, España) · AEPD (autoridad de control ES).<br>
|
||||
Si estás fuera de España/UE, verifica tu marco legal local antes de actuar.
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-card">
|
||||
<div class="stats">
|
||||
<div class="stat"><div class="stat-num">8</div><div class="stat-label">Derechos RGPD</div></div>
|
||||
<div class="stat"><div class="stat-num">30d</div><div class="stat-label">Plazo máximo de respuesta</div></div>
|
||||
<div class="stat"><div class="stat-num">0 €</div><div class="stat-label">Coste de ejercerlos</div></div>
|
||||
</div>
|
||||
<ul class="steps">
|
||||
<li><span>1</span> Identifica al responsable</li>
|
||||
<li><span>2</span> Envía la solicitud</li>
|
||||
<li><span>3</span> Escala a la AEPD si no cumplen</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
SALUD DIGITAL — intro desde index
|
||||
════════════════════════════════════════════ -->
|
||||
<hr class="sd-section-divider">
|
||||
<section class="intro-section">
|
||||
<div class="container intro-inner">
|
||||
|
||||
<div class="intro-left">
|
||||
<span class="intro-label">Salud digital</span>
|
||||
|
||||
<h2 class="intro-title">
|
||||
¿Por qué<br>
|
||||
<em>resetear</em><br>
|
||||
tu huella digital?
|
||||
</h2>
|
||||
|
||||
<p class="intro-desc">
|
||||
Cada clic, cada like, cada segundo de scroll alimenta sistemas diseñados
|
||||
para mantenerte conectado. La ciencia lo confirma: el uso excesivo de redes sociales
|
||||
altera la química cerebral, fragmenta la atención y deteriora el bienestar mental.
|
||||
Recuperar el control empieza por entender lo que está en juego.
|
||||
</p>
|
||||
|
||||
<ul class="intro-bullets">
|
||||
<li>
|
||||
<span class="bullet-icon bullet-icon--caoba"></span>
|
||||
<span><strong>Dopamina secuestrada.</strong> Los algoritmos de recompensa variable activan
|
||||
los mismos circuitos cerebrales que las máquinas tragaperras, generando dependencia involuntaria.</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="bullet-icon bullet-icon--acid"></span>
|
||||
<span><strong>Atención fragmentada.</strong> Los usuarios de TikTok e Instagram cambian de
|
||||
tarea cada 47 segundos. La capacidad de concentración sostenida se deteriora con el uso crónico.</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="bullet-icon bullet-icon--sage"></span>
|
||||
<span><strong>Perfil sin consentimiento.</strong> Tu comportamiento en línea construye un perfil
|
||||
vendido a miles de data brokers para influir en tus decisiones de consumo, políticas y vitales.</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="bullet-icon bullet-icon--caoba"></span>
|
||||
<span><strong>Derecho al olvido.</strong> La ley europea te da el poder de exigir que
|
||||
borren tus datos. Solo hace falta saber cómo ejercerlo.</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="bullet-icon bullet-icon--blue"></span>
|
||||
<span><strong>Sueño interrumpido.</strong> El uso nocturno de pantallas suprime la melatonina
|
||||
y activa el FOMO, reduciendo la calidad del sueño entre un 20 y un 40 %.</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="bullet-icon bullet-icon--acid"></span>
|
||||
<span><strong>Ansiedad social amplificada.</strong> Limitar redes a 30 minutos/día
|
||||
redujo significativamente la soledad y la depresión en 3 semanas frente al grupo control.</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="intro-ctas">
|
||||
<a class="intro-btn intro-btn--primary" href="#ciencia">
|
||||
Leer el artículo científico →
|
||||
</a>
|
||||
<a class="intro-btn intro-btn--ghost" href="#derechos">
|
||||
Conoce tus derechos GDPR
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="intro-right">
|
||||
|
||||
<div class="intro-stat-card">
|
||||
<div class="stat-row">
|
||||
<span class="stat-icon"></span>
|
||||
<div>
|
||||
<div class="stat-val">6h 37m</div>
|
||||
<div class="stat-desc">tiempo medio diario frente a pantallas en adultos españoles</div>
|
||||
<div class="stat-source">Informe Digital 2024 · DataReportal</div>
|
||||
</div>
|
||||
</div>
|
||||
<a class="study-card-link" style="margin-top:0.7rem;" href="https://datareportal.com/reports/digital-2024-global-overview-report" target="_blank" rel="noopener">Ver informe →</a>
|
||||
</div>
|
||||
|
||||
<div class="intro-stat-card">
|
||||
<div class="stat-row">
|
||||
<span class="stat-icon"></span>
|
||||
<div>
|
||||
<div class="stat-val">+61 %</div>
|
||||
<div class="stat-desc">más riesgo de depresión en adolescentes con uso diario intensivo de redes sociales</div>
|
||||
<div class="stat-source">Twenge et al. (2018) · JAMA Pediatrics</div>
|
||||
</div>
|
||||
</div>
|
||||
<a class="study-card-link" style="margin-top:0.7rem;" href="https://jamanetwork.com/journals/jamapediatrics/fullarticle/2737309" target="_blank" rel="noopener">Ver estudio →</a>
|
||||
</div>
|
||||
|
||||
<div class="intro-stat-card">
|
||||
<div class="stat-row">
|
||||
<span class="stat-icon"></span>
|
||||
<div>
|
||||
<div class="stat-val">40+</div>
|
||||
<div class="stat-desc">estudios neurológicos documentan reducción de materia gris en el córtex prefrontal de usuarios intensivos</div>
|
||||
<div class="stat-source">Revisión sistemática · PMC 2024</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="intro-stat-card">
|
||||
<div class="stat-row">
|
||||
<span class="stat-icon"></span>
|
||||
<div>
|
||||
<div class="stat-val">30 días</div>
|
||||
<div class="stat-desc">plazo legal máximo que tienen las plataformas para ejecutar tu solicitud de borrado GDPR</div>
|
||||
<div class="stat-source">Art. 12 RGPD</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="intro-stat-card">
|
||||
<div class="stat-row">
|
||||
<span class="stat-icon">⏰</span>
|
||||
<div>
|
||||
<div class="stat-val">23 min</div>
|
||||
<div class="stat-desc">tiempo medio para recuperar la concentración plena tras una interrupción digital. Cada notificación reinicia el reloj</div>
|
||||
<div class="stat-source">Gloria Mark, UC Irvine · CHI 2008</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="intro-stat-card">
|
||||
<div class="stat-row">
|
||||
<span class="stat-icon"></span>
|
||||
<div>
|
||||
<div class="stat-val">87M</div>
|
||||
<div class="stat-desc">perfiles cosechados sin consentimiento por Cambridge Analytica para manipulación política</div>
|
||||
<div class="stat-source">Testimonio Zuckerberg · Senado EE.UU. 2018</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="intro-cta-hero">
|
||||
<a class="btn-resetea-hero" href="index.html#panel">RESETEA</a>
|
||||
<span class="btn-resetea-sub">Ejerce tu derecho al olvido — gratis, sin abogado, en minutos</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
ARTÍCULO CIENTÍFICO — hero
|
||||
════════════════════════════════════════════ -->
|
||||
<section class="article-hero" id="ciencia">
|
||||
<div class="container article-hero-inner">
|
||||
<span class="article-label">Artículo científico · Salud digital</span>
|
||||
<h1 class="article-title">
|
||||
|
|
@ -43,16 +329,16 @@
|
|||
de redes sociales y plataformas digitales.
|
||||
</p>
|
||||
<div class="article-meta">
|
||||
<span>📅 Actualizado: abril 2025</span>
|
||||
<span>Actualizado: abril 2025</span>
|
||||
<span>⏱ Lectura: ~10 min</span>
|
||||
<span>📚 7 fuentes académicas</span>
|
||||
<span>🔬 Evidencia contrastada</span>
|
||||
<span>7 fuentes académicas</span>
|
||||
<span>Evidencia contrastada</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
CUERPO DEL ARTÍCULO
|
||||
ARTÍCULO CIENTÍFICO — cuerpo
|
||||
════════════════════════════════════════════ -->
|
||||
<section class="article-body">
|
||||
<div class="container">
|
||||
|
|
@ -84,8 +370,6 @@
|
|||
citar encuestas de opinión o correlaciones sin ajuste de variables de confusión.</p>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- ═══ SECCIÓN 1 ═══ -->
|
||||
<h2>1. Dopamina y el bucle de recompensa variable</h2>
|
||||
|
||||
<p>
|
||||
|
|
@ -98,7 +382,7 @@
|
|||
</p>
|
||||
|
||||
<div class="stat-highlight">
|
||||
<span class="sh-val">⚡</span>
|
||||
<span class="sh-val"></span>
|
||||
<div class="sh-text">
|
||||
Los algoritmos de redes sociales utilizan <strong>intermittent variable reward schedules</strong>
|
||||
—el mismo principio que hace adictivas las máquinas tragaperras— para mantener a los
|
||||
|
|
@ -133,8 +417,6 @@
|
|||
de impulsos y la regulación emocional respectivamente.
|
||||
</p>
|
||||
|
||||
|
||||
<!-- ═══ SECCIÓN 2 ═══ -->
|
||||
<h2>2. Fragmentación de la atención y deterioro cognitivo</h2>
|
||||
|
||||
<p>
|
||||
|
|
@ -187,8 +469,6 @@
|
|||
<em>Neuroscience & Biobehavioral Reviews</em> (2024).</p>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- ═══ SECCIÓN 3 ═══ -->
|
||||
<h2>3. Salud mental: depresión, ansiedad y FOMO</h2>
|
||||
|
||||
<p>
|
||||
|
|
@ -247,8 +527,6 @@
|
|||
componente visual como Instagram.
|
||||
</p>
|
||||
|
||||
|
||||
<!-- ═══ SECCIÓN 4 ═══ -->
|
||||
<h2>4. Cambios estructurales en el cerebro adolescente</h2>
|
||||
|
||||
<p>
|
||||
|
|
@ -298,8 +576,6 @@
|
|||
<a href="https://pmc.ncbi.nlm.nih.gov/articles/PMC11804976/" target="_blank" rel="noopener">Ver en PMC ↗</a>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- ═══ SECCIÓN 5 ═══ -->
|
||||
<h2>5. Sueño: el daño invisible</h2>
|
||||
|
||||
<p>
|
||||
|
|
@ -339,8 +615,6 @@
|
|||
redes como fuente de validación.</p>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- ═══ SECCIÓN 6 ═══ -->
|
||||
<h2>6. Lo que puedes hacer: reducción de exposición basada en evidencia</h2>
|
||||
|
||||
<p>
|
||||
|
|
@ -407,12 +681,11 @@
|
|||
para enviar cartas GDPR automáticas a las plataformas y
|
||||
exigir el borrado de tus datos.</p>
|
||||
<p style="margin-top:0.6rem;">
|
||||
<a href="plantillas.html" style="font-weight:700; color: var(--sage);">Ir al panel de acciones →</a>
|
||||
<a href="index.html#panel" style="font-weight:700; color: var(--sage);">Ir al panel de acciones →</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- ═══ REFERENCIAS ═══ -->
|
||||
<!-- Referencias -->
|
||||
<div class="references-section">
|
||||
<h2>Referencias académicas</h2>
|
||||
<p>Todos los estudios citados son de acceso público o están indexados en repositorios
|
||||
|
|
@ -494,27 +767,13 @@
|
|||
|
||||
<div class="sidebar-card">
|
||||
<h4>Índice del artículo</h4>
|
||||
<a class="toc-link" href="#" onclick="document.querySelector('.article-content h2:nth-of-type(1)').scrollIntoView({behavior:'smooth'});return false;">
|
||||
1. Dopamina y recompensa variable
|
||||
</a>
|
||||
<a class="toc-link" href="#" onclick="document.querySelector('.article-content h2:nth-of-type(2)').scrollIntoView({behavior:'smooth'});return false;">
|
||||
2. Fragmentación de la atención
|
||||
</a>
|
||||
<a class="toc-link" href="#" onclick="document.querySelector('.article-content h2:nth-of-type(3)').scrollIntoView({behavior:'smooth'});return false;">
|
||||
3. Depresión, ansiedad y FOMO
|
||||
</a>
|
||||
<a class="toc-link" href="#" onclick="document.querySelector('.article-content h2:nth-of-type(4)').scrollIntoView({behavior:'smooth'});return false;">
|
||||
4. Cambios estructurales cerebrales
|
||||
</a>
|
||||
<a class="toc-link" href="#" onclick="document.querySelector('.article-content h2:nth-of-type(5)').scrollIntoView({behavior:'smooth'});return false;">
|
||||
5. Sueño: el daño invisible
|
||||
</a>
|
||||
<a class="toc-link" href="#" onclick="document.querySelector('.article-content h2:nth-of-type(6)').scrollIntoView({behavior:'smooth'});return false;">
|
||||
6. Qué puedes hacer
|
||||
</a>
|
||||
<a class="toc-link" href="#" onclick="document.querySelector('.references-section').scrollIntoView({behavior:'smooth'});return false;">
|
||||
Referencias académicas
|
||||
</a>
|
||||
<a class="toc-link" href="#ciencia">Inicio del artículo</a>
|
||||
<a class="toc-link" href="#derechos">Los 8 derechos RGPD</a>
|
||||
<a class="toc-link" href="#olvido">Derecho al olvido</a>
|
||||
<a class="toc-link" href="#proceso">Proceso paso a paso</a>
|
||||
<a class="toc-link" href="#mitos">Mitos y realidades</a>
|
||||
<a class="toc-link" href="#plataformas">Comportamiento plataformas</a>
|
||||
<a class="toc-link" href="#aepd">La AEPD</a>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-card">
|
||||
|
|
@ -549,10 +808,9 @@
|
|||
<div class="sidebar-card">
|
||||
<h4>Más en RESETEA.NET</h4>
|
||||
<ul>
|
||||
<li><a href="concienciacion.html">Guía GDPR y derechos digitales</a></li>
|
||||
<li><a href="tipos.html">Tipos de información expuesta</a></li>
|
||||
<li><a href="egosurfing.html">Cómo hacer egosurfing</a></li>
|
||||
<li><a href="stats.html">Estadísticas de privacidad</a></li>
|
||||
<li><a href="egosurfing.html">Egosurfing y tipos de información</a></li>
|
||||
<li><a href="comunidad.html">Comunidad de privacidad</a></li>
|
||||
<li><a href="index.html#panel">Panel de eliminación</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
|
@ -562,11 +820,440 @@
|
|||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
LOS 8 DERECHOS RGPD
|
||||
════════════════════════════════════════════ -->
|
||||
<section id="derechos" class="panel">
|
||||
<div class="container">
|
||||
<h2>Los 8 derechos del RGPD</h2>
|
||||
<p class="section-desc">
|
||||
Todos son gratuitos, aplicables sin abogado, y las plataformas deben responder en
|
||||
un máximo de <strong>30 días</strong> (ampliable a 90 en casos complejos, con notificación previa).
|
||||
</p>
|
||||
<div class="rights-grid">
|
||||
|
||||
<div class="right-card">
|
||||
<div class="art">Art. 15 RGPD</div>
|
||||
<h3>Derecho de acceso</h3>
|
||||
<p>Puedes solicitar una copia de todos los datos que una empresa tiene sobre ti,
|
||||
el origen de esos datos, con quién los comparte y cuánto tiempo los conserva.</p>
|
||||
<span class="tag">Descarga tu historial</span>
|
||||
<a class="right-card-link" href="https://eur-lex.europa.eu/legal-content/ES/TXT/HTML/?uri=CELEX:32016R0679#d1e2330-1-1" target="_blank" rel="noopener">Ver Art. 15 RGPD →</a>
|
||||
</div>
|
||||
|
||||
<div class="right-card">
|
||||
<div class="art">Art. 16 RGPD</div>
|
||||
<h3>Derecho de rectificación</h3>
|
||||
<p>Si tus datos son inexactos o están incompletos, tienes derecho a que se corrijan
|
||||
sin demora. Incluye datos inferidos o desactualizados.</p>
|
||||
<span class="tag">Corrige errores</span>
|
||||
<a class="right-card-link" href="https://eur-lex.europa.eu/legal-content/ES/TXT/HTML/?uri=CELEX:32016R0679#d1e2392-1-1" target="_blank" rel="noopener">Ver Art. 16 RGPD →</a>
|
||||
</div>
|
||||
|
||||
<div class="right-card">
|
||||
<div class="art">Art. 17 RGPD</div>
|
||||
<h3>Derecho al olvido (supresión)</h3>
|
||||
<p>Puedes pedir que borren tus datos cuando ya no sean necesarios, hayas retirado
|
||||
el consentimiento o el tratamiento sea ilícito. Es el más potente contra redes sociales.</p>
|
||||
<span class="tag">El más usado</span>
|
||||
<a class="right-card-link" href="https://eur-lex.europa.eu/legal-content/ES/TXT/HTML/?uri=CELEX:32016R0679#d1e2407-1-1" target="_blank" rel="noopener">Ver Art. 17 RGPD →</a>
|
||||
</div>
|
||||
|
||||
<div class="right-card">
|
||||
<div class="art">Art. 18 RGPD</div>
|
||||
<h3>Derecho a la limitación</h3>
|
||||
<p>Mientras se resuelve una disputa sobre tus datos puedes pedir que congelen su
|
||||
tratamiento: los conservan pero no los usan ni comparten.</p>
|
||||
<span class="tag">Pausa temporal</span>
|
||||
<a class="right-card-link" href="https://eur-lex.europa.eu/legal-content/ES/TXT/HTML/?uri=CELEX:32016R0679#d1e2445-1-1" target="_blank" rel="noopener">Ver Art. 18 RGPD →</a>
|
||||
</div>
|
||||
|
||||
<div class="right-card">
|
||||
<div class="art">Art. 20 RGPD</div>
|
||||
<h3>Derecho a la portabilidad</h3>
|
||||
<p>Puedes recibir tus datos en formato estructurado y legible por máquina (JSON, CSV)
|
||||
para llevártelos a otro servicio. Muy útil antes de borrar una cuenta.</p>
|
||||
<span class="tag">Descarga antes de irte</span>
|
||||
<a class="right-card-link" href="https://eur-lex.europa.eu/legal-content/ES/TXT/HTML/?uri=CELEX:32016R0679#d1e2501-1-1" target="_blank" rel="noopener">Ver Art. 20 RGPD →</a>
|
||||
</div>
|
||||
|
||||
<div class="right-card">
|
||||
<div class="art">Art. 21 RGPD</div>
|
||||
<h3>Derecho de oposición</h3>
|
||||
<p>Puedes oponerte a que procesen tus datos para marketing directo o perfilado
|
||||
publicitario. En ese caso no necesitas justificación: es un derecho absoluto.</p>
|
||||
<span class="tag">Anti-publicidad</span>
|
||||
<a class="right-card-link" href="https://eur-lex.europa.eu/legal-content/ES/TXT/HTML/?uri=CELEX:32016R0679#d1e2523-1-1" target="_blank" rel="noopener">Ver Art. 21 RGPD →</a>
|
||||
</div>
|
||||
|
||||
<div class="right-card">
|
||||
<div class="art">Art. 22 RGPD</div>
|
||||
<h3>No a decisiones automatizadas</h3>
|
||||
<p>Derecho a no ser sometido a decisiones basadas solo en tratamiento automatizado
|
||||
(scoring, algoritmos) que produzcan efectos significativos sobre ti.</p>
|
||||
<span class="tag">Anti-algoritmo</span>
|
||||
<a class="right-card-link" href="https://eur-lex.europa.eu/legal-content/ES/TXT/HTML/?uri=CELEX:32016R0679#d1e2562-1-1" target="_blank" rel="noopener">Ver Art. 22 RGPD →</a>
|
||||
</div>
|
||||
|
||||
<div class="right-card">
|
||||
<div class="art">Art. 77 RGPD</div>
|
||||
<h3>Derecho a reclamar</h3>
|
||||
<p>Si una empresa no respeta tus derechos, puedes presentar una reclamación ante
|
||||
la AEPD (España) de forma gratuita. La AEPD puede imponer multas millonarias.</p>
|
||||
<span class="tag">Escala a la AEPD</span>
|
||||
<a class="right-card-link" href="https://www.aepd.es/es/derechos-y-deberes/derechos" target="_blank" rel="noopener">Ver AEPD →</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
DERECHO AL OLVIDO
|
||||
════════════════════════════════════════════ -->
|
||||
<section id="olvido" class="info alt">
|
||||
<div class="container">
|
||||
<h2>Derecho al olvido: qué es realmente</h2>
|
||||
<p>
|
||||
Nació con la sentencia del TJUE <strong>Google Spain vs. AEPD (2014)</strong>
|
||||
y quedó codificado en el Art. 17 RGPD (2018). Opera en dos planos diferentes que a menudo se confunden:
|
||||
</p>
|
||||
<div class="grid" style="margin-top:1.5rem;">
|
||||
<div class="group">
|
||||
<h3>1. Supresión en origen</h3>
|
||||
<p class="section-desc">Pedir a la plataforma que borre tu cuenta y tus datos.</p>
|
||||
<div class="item"><label><input type="checkbox"> Cuenta en red social, foro o directorio</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Datos en data brokers / people search</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Perfiles en servicios de terceros</label></div>
|
||||
<div class="notice" style="margin-top:0.8rem;font-size:0.8rem;">
|
||||
<strong>Resultado:</strong> Los datos se eliminan del sistema del responsable
|
||||
(y de sus backups en el plazo comprometido). Pero si Google ya los indexó,
|
||||
pueden seguir visibles en resultados de búsqueda.
|
||||
</div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>2. Desindexación en buscadores</h3>
|
||||
<p class="section-desc">Pedir a Google/Bing que dejen de mostrar una URL en resultados asociados a tu nombre.</p>
|
||||
<div class="item"><label><input type="checkbox"> Formulario "Derecho al olvido" de Google (UE)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Formulario de eliminación de Bing (Microsoft)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Desindexación de contenido obsoleto</label></div>
|
||||
<div class="notice" style="margin-top:0.8rem;font-size:0.8rem;">
|
||||
<strong>Límite:</strong> Desindexar no borra el contenido del servidor original.
|
||||
Es la vía correcta cuando el propietario del sitio no coopera.
|
||||
</div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Cuándo te pueden denegar</h3>
|
||||
<p class="section-desc">El derecho al olvido no es absoluto. Puede denegarse si:</p>
|
||||
<div class="item"><label><input type="checkbox"> Hay interés público legítimo (cargos públicos, condenas recientes)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> La información tiene relevancia periodística o histórica</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Existe obligación legal de conservar los datos (contabilidad, etc.)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Los datos figuran en registros públicos obligatorios</label></div>
|
||||
<div class="notice" style="margin-top:0.8rem;font-size:0.8rem;">
|
||||
<strong>Nota:</strong> Si te deniegan, puedes escalar a la AEPD.
|
||||
La plataforma debe justificar la denegación por escrito.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
PROCESO PASO A PASO
|
||||
════════════════════════════════════════════ -->
|
||||
<section id="proceso" class="info">
|
||||
<div class="container">
|
||||
<h2>Proceso para ejercer un derecho: paso a paso</h2>
|
||||
<p>Sin abogado, sin coste. Solo necesitas identificarte y especificar qué pides.</p>
|
||||
<div class="timeline">
|
||||
<div class="timeline-item">
|
||||
<h4>1. Identifica al responsable del tratamiento</h4>
|
||||
<p>Busca la política de privacidad del servicio. El "Responsable del tratamiento"
|
||||
debe atenderte. Suelen tener un DPO (Delegado de Protección de Datos)
|
||||
o un correo específico tipo <em>privacy@dominio.com</em>.</p>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<h4>2. Envía la solicitud por escrito</h4>
|
||||
<p>Usa el canal oficial si existe (formulario de privacidad, correo al DPO).
|
||||
Incluye: nombre completo, contacto, qué derecho ejerces (Art. X RGPD),
|
||||
qué datos concretos te afectan, y copia de tu DNI si lo exigen.</p>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<h4>3. Guarda acuse de recibo</h4>
|
||||
<p>Haz captura de pantalla o guarda el email de confirmación.
|
||||
El plazo de 30 días empieza desde que el responsable recibe tu solicitud.</p>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<h4>4. Espera la respuesta (máx. 30 días)</h4>
|
||||
<p>Pueden ampliar a 90 días en casos complejos, pero deben notificártelo
|
||||
dentro de los primeros 30. El silencio ya es una infracción.</p>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<h4>5. Si no responden o deniegan injustificadamente</h4>
|
||||
<p>Presenta reclamación ante la <strong>AEPD</strong> de forma gratuita en
|
||||
<em>sedeagpd.gob.es</em>. Adjunta: solicitud enviada + acuse + respuesta
|
||||
(o prueba del silencio). La AEPD puede investigar e imponer sanciones.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice" style="margin-top:1.5rem;">
|
||||
<strong>Genera tus cartas en segundos:</strong><br>
|
||||
En <a href="plantillas.html">Plantillas legales</a> encuentras cartas pre-redactadas
|
||||
para cada plataforma. Solo rellenas tus datos una vez y copias el texto generado.
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
MITOS Y REALIDADES
|
||||
════════════════════════════════════════════ -->
|
||||
<section id="mitos" class="info alt">
|
||||
<div class="container">
|
||||
<h2>Mitos y realidades</h2>
|
||||
<p style="margin-bottom:1.5rem;">Lo que las plataformas quieren que creas vs. lo que dice la ley.</p>
|
||||
|
||||
<div class="myth-block">
|
||||
<div class="myth-label mito">Mito</div>
|
||||
<p>"Al aceptar los Términos y Condiciones cediste todos tus derechos sobre tus datos."</p>
|
||||
<div class="myth-label realidad" style="margin-top:0.8rem;">Realidad</div>
|
||||
<p>El consentimiento puede retirarse en cualquier momento (Art. 7.3 RGPD).
|
||||
Aceptar T&C no equivale a renunciar a derechos que la ley declara irrenunciables.</p>
|
||||
</div>
|
||||
|
||||
<div class="myth-block">
|
||||
<div class="myth-label mito">Mito</div>
|
||||
<p>"Si borro mi cuenta, mis datos ya están borrados."</p>
|
||||
<div class="myth-label realidad" style="margin-top:0.8rem;">Realidad</div>
|
||||
<p>Las plataformas suelen conservar datos hasta 90 días o más en backups tras el cierre.
|
||||
Además, los datos pueden haber sido compartidos con anunciantes y socios.
|
||||
Hay que solicitar explícitamente la supresión completa y pedir confirmación por escrito.</p>
|
||||
</div>
|
||||
|
||||
<div class="myth-block">
|
||||
<div class="myth-label mito">Mito</div>
|
||||
<p>"El RGPD solo aplica si la empresa tiene sede en Europa."</p>
|
||||
<div class="myth-label realidad" style="margin-top:0.8rem;">Realidad</div>
|
||||
<p>El RGPD aplica a cualquier empresa que trate datos de residentes en la UE,
|
||||
independientemente de dónde esté ubicada (Art. 3 RGPD).
|
||||
Meta, Google y X deben cumplirlo porque tienen usuarios europeos.</p>
|
||||
</div>
|
||||
|
||||
<div class="myth-block">
|
||||
<div class="myth-label mito">Mito</div>
|
||||
<p>"Ejercer mis derechos es complicado y necesito un abogado."</p>
|
||||
<div class="myth-label realidad" style="margin-top:0.8rem;">Realidad</div>
|
||||
<p>El proceso es gratuito y puedes hacerlo directamente.
|
||||
Solo necesitas identificarte y especificar qué pides.
|
||||
Si la empresa no cumple, la AEPD puede actuar de oficio.</p>
|
||||
</div>
|
||||
|
||||
<div class="myth-block">
|
||||
<div class="myth-label mito">Mito</div>
|
||||
<p>"Los datos 'anonimizados' ya no son datos personales."</p>
|
||||
<div class="myth-label realidad" style="margin-top:0.8rem;">Realidad</div>
|
||||
<p>Solo si la anonimización es verdaderamente irreversible.
|
||||
Los datos "pseudonimizados" (re-identificables con información adicional)
|
||||
siguen siendo datos personales bajo el RGPD.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
TABLA PLATAFORMAS
|
||||
════════════════════════════════════════════ -->
|
||||
<section id="plataformas" class="info">
|
||||
<div class="container">
|
||||
<h2>Comportamiento real de las grandes plataformas</h2>
|
||||
<p>Basado en experiencias documentadas y resoluciones de la AEPD.</p>
|
||||
<table class="platform-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Plataforma</th>
|
||||
<th>Canal oficial GDPR</th>
|
||||
<th>Tiempo habitual</th>
|
||||
<th>Complejidad real</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>Meta (Instagram / Facebook)</strong></td>
|
||||
<td>Centro de privacidad / formulario en app</td>
|
||||
<td>30 días (backups: 90 d)</td>
|
||||
<td><span class="badge badge-warn">Media</span> — El proceso funciona pero datos persisten en backups</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Google</strong></td>
|
||||
<td>myaccount.google.com / formulario RTBF</td>
|
||||
<td>Semanas–meses para desindexar</td>
|
||||
<td><span class="badge badge-warn">Media</span> — Supresión de cuenta directa; desindexación puede tardar</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>X / Twitter</strong></td>
|
||||
<td>x.com/settings/deactivate</td>
|
||||
<td>30 días de gracia + borrado</td>
|
||||
<td><span class="badge badge-ok">Baja</span> — Proceso sencillo; cuenta en periodo de gracia 30 días</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>LinkedIn</strong></td>
|
||||
<td>Ajustes → Cuenta → Cerrar cuenta</td>
|
||||
<td>Inmediato (datos: 30 d)</td>
|
||||
<td><span class="badge badge-ok">Baja</span> — Directo; datos se purgan en 30 días</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>TikTok</strong></td>
|
||||
<td>App → Ajustes → Eliminar cuenta</td>
|
||||
<td>30 días de reflexión</td>
|
||||
<td><span class="badge badge-ok">Baja</span> — Solo desde móvil; 30 días para cancelar</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Snapchat</strong></td>
|
||||
<td>accounts.snapchat.com</td>
|
||||
<td>30 días + borrado automático</td>
|
||||
<td><span class="badge badge-ok">Baja</span> — Straightforward</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Data brokers</strong></td>
|
||||
<td>Formularios individuales por empresa</td>
|
||||
<td>Semanas–meses</td>
|
||||
<td><span class="badge badge-bad">Alta</span> — Muchos brokers, opt-outs fragmentados, reaparición frecuente</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Foros / sitios web de terceros</strong></td>
|
||||
<td>Email al admin / formulario de contacto</td>
|
||||
<td>Variable o sin respuesta</td>
|
||||
<td><span class="badge badge-bad">Alta</span> — Si no cooperan: escalar a buscadores y/o AEPD</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
AEPD
|
||||
════════════════════════════════════════════ -->
|
||||
<section id="aepd" class="info alt">
|
||||
<div class="container">
|
||||
<h2>La AEPD: tu aliada si las plataformas no cumplen</h2>
|
||||
<p>
|
||||
La Agencia Española de Protección de Datos es la autoridad de control competente en España.
|
||||
Puedes presentar una reclamación de forma gratuita si una empresa no atiende tus derechos.
|
||||
</p>
|
||||
<div class="grid" style="margin-top:1.5rem;">
|
||||
<div class="group">
|
||||
<h3>Cuándo acudir a la AEPD</h3>
|
||||
<div class="item"><label><input type="checkbox"> La empresa no responde en 30 días</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Deniegan sin justificación suficiente</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Sospechas uso ilícito de tus datos</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Recibes spam sin haber dado consentimiento</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Has sufrido una brecha de datos</label></div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Cómo presentar la reclamación</h3>
|
||||
<div class="item"><label><input type="checkbox"> Accede a sedeagpd.gob.es</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Sección "Reclamaciones y denuncias"</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Adjunta: solicitud + acuse + respuesta (o silencio)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> La AEPD puede requerir a la empresa y sancionar</label></div>
|
||||
<div class="actions" style="margin-top:0.8rem;">
|
||||
<a href="https://sedeagpd.gob.es/sede-electronica-web/" target="_blank" rel="noopener">Sede AEPD</a>
|
||||
<a href="https://www.aepd.es/es/derechos-y-deberes/conoce-tus-derechos" target="_blank" rel="noopener">Conoce tus derechos</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Sanciones posibles (RGPD)</h3>
|
||||
<div class="item">
|
||||
<label>Infracciones graves</label>
|
||||
<div class="actions" style="font-size:0.8rem;color:var(--muted);">
|
||||
Hasta 20.000.000 € o el 4 % de la facturación global anual
|
||||
</div>
|
||||
</div>
|
||||
<div class="item" style="margin-top:0.8rem;">
|
||||
<label>Infracciones menos graves</label>
|
||||
<div class="actions" style="font-size:0.8rem;color:var(--muted);">
|
||||
Hasta 10.000.000 € o el 2 % de la facturación global anual
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice" style="margin-top:0.8rem;font-size:0.8rem;">
|
||||
La AEPD ha multado a Meta, Google y Vodafone, entre otras.
|
||||
El historial de resoluciones es público en su web.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
LOPDGDD
|
||||
════════════════════════════════════════════ -->
|
||||
<section id="lopdgdd" class="info">
|
||||
<div class="container">
|
||||
<h2>LOPDGDD: la ley española que complementa el RGPD</h2>
|
||||
<p>La Ley Orgánica 3/2018 adapta el RGPD al ordenamiento español y añade disposiciones específicas:</p>
|
||||
<div class="grid" style="margin-top:1.5rem;">
|
||||
<div class="group">
|
||||
<h3>Aspectos clave</h3>
|
||||
<div class="item"><label><input type="checkbox"> Edad mínima de consentimiento: 14 años</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Derecho al olvido en redes sociales (Art. 94)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Derecho al olvido en búsquedas de internet (Art. 93)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Protección frente al acoso en redes (Art. 48)</label></div>
|
||||
<div class="item"><label><input type="checkbox"> Acceso a datos de menores por parte de padres/tutores</label></div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Art. 93 y 94 LOPDGDD</h3>
|
||||
<div class="item">
|
||||
<label>Art. 93 — Olvido en búsquedas</label>
|
||||
<div class="actions" style="font-size:0.8rem;color:var(--muted);margin-top:0.3rem;">
|
||||
Los motores de búsqueda deben atender solicitudes de desindexación en España.
|
||||
Base: RGPD + LOPDGDD + sentencia Google Spain (TJUE 2014).
|
||||
</div>
|
||||
</div>
|
||||
<div class="item" style="margin-top:0.8rem;">
|
||||
<label>Art. 94 — Olvido en redes sociales</label>
|
||||
<div class="actions" style="font-size:0.8rem;color:var(--muted);margin-top:0.3rem;">
|
||||
Derecho a exigir la supresión de datos facilitados durante la minoría de edad
|
||||
o cuando el consentimiento fue retirado posteriormente.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<h3>Recursos oficiales</h3>
|
||||
<div class="item">
|
||||
<label>AEPD — Agencia Española de Protección de Datos</label>
|
||||
<div class="actions"><a href="https://www.aepd.es/" target="_blank" rel="noopener">aepd.es</a></div>
|
||||
</div>
|
||||
<div class="item" style="margin-top:0.8rem;">
|
||||
<label>Sede electrónica AEPD</label>
|
||||
<div class="actions"><a href="https://sedeagpd.gob.es/sede-electronica-web/" target="_blank" rel="noopener">sedeagpd.gob.es</a></div>
|
||||
</div>
|
||||
<div class="item" style="margin-top:0.8rem;">
|
||||
<label>Derechos y deberes (AEPD)</label>
|
||||
<div class="actions"><a href="https://www.aepd.es/es/derechos-y-deberes/conoce-tus-derechos" target="_blank" rel="noopener">Conoce tus derechos</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ══════════════════════════════════════════
|
||||
CTA FINAL
|
||||
════════════════════════════════════════════ -->
|
||||
<section class="info alt">
|
||||
<div class="container" style="text-align:center;padding:3rem 0;">
|
||||
<h2>¿Listo para actuar?</h2>
|
||||
<p style="color:var(--muted);margin:1rem 0 2rem;">
|
||||
Ahora que conoces tus derechos, genera las cartas legales para cada plataforma<br>
|
||||
y sigue el checklist para eliminar tu huella digital paso a paso.
|
||||
</p>
|
||||
<div class="hero-actions" style="justify-content:center;">
|
||||
<a class="btn primary" href="plantillas.html">Generar cartas GDPR</a>
|
||||
<a class="btn ghost" href="index.html">Panel de eliminación</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<p>RESETEA.NET · Software estático · Sin tracking · Sin cookies · Sin almacenamiento de datos</p>
|
||||
<p>RESETEA.NET · Salud digital y derechos · Estático · Sin cookies · Sin tracking</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
|
|
|||
|
|
@ -158,12 +158,10 @@
|
|||
<div class="container hero-landing-inner">
|
||||
<h1 class="main-title">RESETEA</h1>
|
||||
<div class="landing-nav">
|
||||
<a class="landing-nav-btn" href="tipos.html">Tipos de información</a>
|
||||
<a class="landing-nav-btn" href="concienciacion.html">Concienciación</a>
|
||||
<a class="landing-nav-btn" href="egosurfing.html">Egosurfing</a>
|
||||
<a class="landing-nav-btn" href="plantillas.html">Resetea</a>
|
||||
<a class="landing-nav-btn landing-nav-btn--highlight" href="stats.html">Estadísticas</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">🧠 Salud digital</a>
|
||||
<a class="landing-nav-btn landing-nav-btn--highlight" href="comunidad.html">Comunidad</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">Salud digital</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -204,9 +202,9 @@
|
|||
|
||||
/* Iconos por clave — si la clave no está mapeada, se usa un emoji neutro */
|
||||
const ICONS = {
|
||||
instagram:'📸', facebook:'👤', twitter_x:'🐦', linkedin:'💼',
|
||||
tiktok:'🎵', snapchat:'👻', microsoft:'🪟', apple:'🍎',
|
||||
google:'🔍', amazon:'📦', reddit:'🤖', discord:'💬',
|
||||
instagram:'IG', facebook:'FB', twitter_x:'X', linkedin:'LI',
|
||||
tiktok:'TK', snapchat:'SC', microsoft:'MS', apple:'AP',
|
||||
google:'GG', amazon:'AM', reddit:'RE', discord:'DC',
|
||||
};
|
||||
|
||||
function animateCount(el, target, ms) {
|
||||
|
|
@ -233,7 +231,7 @@
|
|||
const pct = maxTotal > 0 ? Math.max(2, Math.round((total / maxTotal) * 100)) : 0;
|
||||
|
||||
/* icon_key viene del servidor whitelistado (a-z_), pero igual lo escapamos */
|
||||
const icon = ICONS[esc(p.icon_key)] || '🔹';
|
||||
const icon = ICONS[esc(p.icon_key)] || '';
|
||||
|
||||
/* p.name viene de la whitelist del servidor, pero escapeamos de todas formas */
|
||||
return `<div class="provider-row">
|
||||
|
|
@ -256,7 +254,7 @@
|
|||
function renderPrivacy() {
|
||||
return `<details class="privacy-block">
|
||||
<summary class="privacy-summary">
|
||||
<span>🔒</span>
|
||||
<span>—</span>
|
||||
<span>Política de privacidad de estas estadísticas</span>
|
||||
<span class="arrow">▶</span>
|
||||
</summary>
|
||||
|
|
@ -329,7 +327,7 @@
|
|||
|
||||
const providersHtml = total > 0
|
||||
? renderProviders(data.providers || [], maxProv)
|
||||
: `<div class="empty-state"><div class="big">📬</div>
|
||||
: `<div class="empty-state"><div class="big">—</div>
|
||||
El desglose por plataforma aparecerá cuando se envíen las primeras solicitudes.</div>`;
|
||||
|
||||
document.getElementById('content').innerHTML =
|
||||
|
|
@ -351,7 +349,7 @@
|
|||
function renderError(msg) {
|
||||
document.getElementById('content').innerHTML =
|
||||
`<div class="empty-state">
|
||||
<div class="big">⚠️</div>
|
||||
<div class="big">!</div>
|
||||
${esc(msg) || 'No se pudieron cargar las estadísticas.'}<br>
|
||||
<small style="color:var(--subtle)">El backend puede estar arrancando. Inténtalo en unos segundos.</small>
|
||||
</div>`;
|
||||
|
|
|
|||
|
|
@ -19,8 +19,8 @@
|
|||
<a class="landing-nav-btn" href="concienciacion.html">Concienciación</a>
|
||||
<a class="landing-nav-btn" href="egosurfing.html">Egosurfing</a>
|
||||
<a class="landing-nav-btn" href="plantillas.html">Resetea</a>
|
||||
<a class="landing-nav-btn" href="stats.html">Estadísticas</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">🧠 Salud digital</a>
|
||||
<a class="landing-nav-btn" href="comunidad.html">Comunidad</a>
|
||||
<a class="landing-nav-btn" href="salud-digital.html">Salud digital</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue