Introducción al contador de visitas html
El contador de visitas HTML permite contabilizar el número de visitantes de tu sitio web o blog, ofreciendo datos que ayudan al análisis de tráfico y la confianza del usuario.
Soluciones sin programación externa
Contadores gratuitos embebidos
Servicios como ContadorVisitasGratis.com y POWR ofrecen widgets listos para insertar mediante un fragmento HTML. Solo debes copiar el código proporcionado y pegarlo en tu página.
- Configuración inmediata
- Sin instalación de bases de datos ni scripts propios
- Opciones de diseño personalizables
Widgets con análisis adicionales
Plataformas como Elfsight presentan contadores con estadísticas en tiempo real, gráficos de visitas por día/semana/mes y configuraciones de estilo avanzadas.
Contador simple con JavaScript
Estructura básica en HTML
<h2>Visitas:</h2>
<div id="visitas">0</div>
<script src="contador.js"></script>
Esta solución usa localStorage para incrementar un valor al cargar la página.
Ejemplo de código en JavaScript
let visitas = localStorage.getItem('visitas') || 0;
visitas++;
localStorage.setItem('visitas', visitas);
document.getElementById('visitas').textContent = visitas;
Implementación robusta con PHP y base de datos
Creación de la tabla SQL
CREATE TABLE visitas (
id INT AUTO_INCREMENT PRIMARY KEY,
ip VARCHAR(45),
fecha DATETIME DEFAULT CURRENT_TIMESTAMP
);
Código PHP en línea HTML
<h2>Total de visitas:</h2>
<?php
$conn = new mysqli('host','usuario','pass','bd');
$ip = $_SERVER['REMOTE_ADDR'];
$conn->query("INSERT INTO visitas(ip) VALUES('$ip')");
$result = $conn->query("SELECT COUNT(*) AS total FROM visitas");
echo '<div><strong>'.$result->fetch_assoc()['total'].'</strong></div>';
?>
Optimización SEO del artículo
Usar strong en términos clave: contador de visitas html, JavaScript, PHP, widget gratuito.
Incluir imágenes con alt text descriptivo:
- alt="Código HTML de contador de visitas simple"
- title="Ejemplo de contador de visitas HTML"
Formato claro con H2 y H3; sin H1.
Recursos de vídeo para ampliar información
Visualmex: AGREGA un contador de VISITAS
Sube W: Como agregar un contador de visitas a mi pagina web
Curso de programación: Insertar contador de visitas
Imágenes del artículo