Aprende Cómo combatir la suplantación de identidad de las páginas web. Toma nota y no caigas en un fraude que te perjudique.
Para combatir la suplantación de identidad en páginas web, es crucial tomar medidas preventivas y proactivas. Estas medidas se centran en la protección del usuario y en la seguridad del sitio web.
🔒 Medidas de Protección para el Usuario
Para protegerse de sitios web fraudulentos, los usuarios deben adoptar una serie de precauciones:
Verificar la URL: Antes de ingresar cualquier dato, revisa la URL. Los sitios falsos a menudo tienen errores tipográficos o dominios parecidos al original (ej. «amaz0n.com» en lugar de «amazon.com»).
Buscar el candado de seguridad: Asegúrate de que la URL comience con «https://» y que haya un icono de candado 🔒 en la barra de direcciones. Esto indica que la conexión está cifrada.
No hacer clic en enlaces sospechosos: Evita abrir enlaces de correos electrónicos o mensajes de texto no solicitados, especialmente si solicitan información personal o financiera.
Usar la autenticación de dos factores (2FA): Activa el 2FA siempre que sea posible. Esto añade una capa extra de seguridad, requiriendo un código adicional (enviado a tu teléfono) además de la contraseña.
Instalar software de seguridad: Utiliza un antivirus y un cortafuegos (firewall) para detectar y bloquear sitios web maliciosos.
🛡️ Medidas para Dueños de Sitios Web
Los administradores de sitios web también juegan un papel fundamental para prevenir la suplantación de identidad:
Usar un Certificado SSL/TLS: Implementar un certificado SSL/TLS es esencial para cifrar la comunicación entre el usuario y el servidor, lo que hace más difícil que los atacantes intercepten la información.
Monitorear el tráfico y las amenazas: Utiliza herramientas de monitoreo para detectar actividades sospechosas, como intentos de inicio de sesión fallidos o patrones de tráfico anómalos que puedan indicar un ataque.
Educación al usuario: Informa a tus usuarios sobre las características de tu sitio web oficial (URL, logos, etc.) y adviérteles sobre los peligros del phishing.
Registrar dominios similares: Considera registrar dominios con errores tipográficos comunes o variaciones de tu marca para evitar que los atacantes los utilicen.
Reportar sitios falsos: Si detectas una página web que suplanta tu identidad, repórtala de inmediato a los proveedores de alojamiento y a las autoridades competentes.
¿Dónde Reportar Sitios Web Falsos?
Reportar sitios web falsos es una de las mejores maneras de combatir el fraude en línea y proteger a otros usuarios. Aquí te indico los principales lugares donde puedes hacer una denuncia, desde la forma más rápida hasta la más formal.
1. Al Proveedor de Alojamiento (Hosting)
Esta es a menudo la forma más rápida de conseguir que un sitio web fraudulento sea eliminado. El proveedor de alojamiento (hosting) es la empresa que aloja la página web en sus servidores.
¿Cómo encontrarlo? Utiliza una herramienta de búsqueda WHOIS (por ejemplo, whois.domaintools.com). Simplemente ingresa la URL del sitio falso y el resultado te mostrará el nombre del registrador del dominio y, a menudo, la dirección de correo electrónico para reportar abusos (abuse@...).
Qué incluir: Envía un correo electrónico a esa dirección con la URL del sitio falso y una breve descripción del engaño.
2. A los Motores de Búsqueda y Navegadores
Puedes reportar el sitio directamente a Google, Microsoft y a los desarrolladores de navegadores para que lo marquen como peligroso y adviertan a otros usuarios.
Google: Utiliza la herramienta de Navegación Segura de Google para denunciar un sitio de phishing. Puedes encontrarla buscando en Google «denunciar phishing a Google».
Microsoft (Bing): Accede a su página de «Informe de un sitio web inseguro» para Bing.
Navegadores: Muchos navegadores como Chrome y Firefox tienen una opción para reportar sitios de forma manual o automática cuando detectan una amenaza.
3. A la Empresa o Marca Suplantada
La empresa original tiene el mayor interés en que un sitio falso que utiliza su nombre sea eliminado. Contacta con ellos directamente.
¿Cómo hacerlo? Busca la sección de «Contacto», «Aviso Legal» o «Centro de Seguridad» en el sitio web oficialde la empresa. Muchas compañías grandes, como bancos o plataformas de comercio electrónico, tienen canales dedicados para denunciar este tipo de fraude.
4. A Autoridades y Organismos Oficiales
Si has sufrido una pérdida financiera o has proporcionado información personal sensible, es crucial hacer una denuncia formal ante las autoridades.
En España: Puedes reportar el delito ante el Grupo de Delitos Telemáticos de la Policía Nacional o la Guardia Civil.
En México: Denuncia ante la Policía Cibernética de la Guardia Nacional.
En Colombia: Contacta al Centro Cibernético de la Policía Nacional.
En Estados Unidos: Presenta un reporte en el Centro de Denuncias de Delitos en Internet del FBI (IC3).
General: En la mayoría de los países, busca una unidad especializada en «delitos informáticos» o «ciberdelincuencia» dentro de las fuerzas de seguridad.
Para que tu reporte sea efectivo, siempre incluye la siguiente información:
A continuación, te presento un ejemplo de página web HTML con una imagen animada y un menú de navegación responsive. He incluido comentarios en el código para que sea más fácil de entender:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Página con Imagen Animada y Menú Responsive</title>
<style>
/* Estilos generales */
body {
font-family: sans-serif;
margin: 0; /* Elimina márgenes predeterminados */
}
/* Estilos del encabezado y menú */
header {
background-color: #333;
color: white;
padding: 10px 0;
position: sticky; /* Mantiene el encabezado fijo en la parte superior */
top: 0;
z-index: 100; /* Asegura que el encabezado esté por encima de otros elementos */
}
nav {
display: flex;
justify-content: space-around; /* Distribuye los elementos del menú */
align-items: center;
max-width: 960px; /* Limita el ancho del menú en pantallas grandes */
margin: 0 auto;/*Centra el menú*/
}
nav a {
color: white;
text-decoration: none;
padding: 10px;
}
/*Estilos para el menú hamburguesa (para pantallas pequeñas)*/
.menu-toggle {
display: none; /*Oculto por defecto*/
cursor: pointer;
font-size: 24px;
}
/* Estilos para la imagen animada */
.imagen-animada {
width: 200px;
height: 200px;
margin: 20px auto; /* Centra la imagen */
background-image: url("imagen.gif"); /* Reemplaza con la ruta de tu imagen/gif */
background-size: cover;
animation: rotar 4s linear infinite; /* Ajusta la duración y función de temporización */
}
@keyframes rotar {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* Media query para responsive design */
@media (max-width: 768px) { /* Ajusta el valor según necesites */
nav {
flex-direction: column; /* Los enlaces se apilan verticalmente */
align-items: flex-start; /* Alinea a la izquierda */
display: none;
}
nav.active{
display: flex;
}
.menu-toggle{
display: block; /*Muestro el menú hamburguesa*/
position: absolute; /*Posiciono el menu hamburguesa*/
top: 10px;
right: 10px;
}
nav a{
width: 100%;
text-align: center;
border-bottom: 1px solid white;
}
}
/* Estilos del contenido principal */
main {
padding: 20px;
text-align: center;
}
</style>
</head>
<body>
<header>
<div class="menu-toggle">☰</div>
<nav id="menu">
<a href="#">Inicio</a>
<a href="#">Servicios</a>
<a href="#">Contacto</a>
</nav>
</header>
<main>
<h1>Bienvenido a mi página</h1>
<div class="imagen-animada"></div>
<p>Este es un ejemplo de página web con una imagen animada y un menú de navegación responsive.</p>
</main>
<script>
document.querySelector('.menu-toggle').addEventListener('click', () =>{
document.getElementById('menu').classList.toggle('active');
});
</script>
</body>
</html>
Explicación y mejoras:
meta viewport: Esencial para el responsive design. Asegura que la página se adapte a diferentes tamaños de pantalla.
header, nav, main: Se utilizan elementos semánticos para estructurar el contenido.
flexbox: Se utiliza flexbox para el diseño del menú, lo que facilita la creación de menús responsive.
Media Query: La regla @media (max-width: 768px) aplica estilos diferentes cuando la pantalla tiene un ancho máximo de 768 píxeles (un tamaño común para tablets). Puedes ajustar este valor según tus necesidades.
Menú hamburguesa: Se añade un icono de «hamburguesa» (☰) que aparece en pantallas pequeñas y sirve para desplegar/ocultar el menú.
position: sticky: El encabezado se mantiene fijo en la parte superior al hacer scroll.
z-index: Se usa z-index para asegurar que el encabezado se superponga al resto del contenido.
Imagen animada: Se utiliza background-image y @keyframes para animar la imagen. Asegúrate de reemplazar "imagen.gif" con la ruta correcta a tu archivo GIF o imagen.
Javascript para el menú hamburguesa: He añadido un pequeño script en Javascript para que al hacer click en el menú hamburguesa se muestre o se oculte el menú.
Para usar este código:
Guarda el código como un archivo .html (por ejemplo, index.html).
Crea un archivo GIF o usa una imagen existente y colócalo en la misma carpeta que el archivo HTML. Asegúrate de cambiar la ruta en background-image: url("imagen.gif");.
Abre el archivo index.html en tu navegador.
Este ejemplo te proporciona una base sólida para crear tu propia página web con una imagen animada y un menú responsive. Puedes personalizar los estilos, añadir más contenido y funcionalidades según tus necesidades. Recuerda que para que la animación funcione, la imagen que uses debe ser un .gif o un formato que soporte animación como .apng o .webp animado. Si usas un formato estático como .jpg o .png la animación no funcionará. Si tienes más preguntas, no dudes en consultarme.
Agregar al código anterior un menú hamburguesa responsive.
HTML
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Página con Imagen Animada y Menú Responsive</title>
<style>
/* Estilos generales */
body {
font-family: sans-serif;
margin: 0;
}
/* Estilos del encabezado */
header {
background-color: #333;
color: white;
padding: 10px 0;
position: sticky;
top: 0;
z-index: 100;
display: flex; /* Usamos flexbox para alinear el menú y el toggle */
justify-content: space-between; /* Espacio entre elementos */
align-items: center; /* Centrar verticalmente */
padding: 10px 20px; /* Añadimos padding lateral */
}
/* Estilos del menú */
nav {
display: flex;
/* justify-content: space-around; Ya no es necesario aquí*/
align-items: center;
max-width: 960px;
margin: 0 auto;
}
nav a {
color: white;
text-decoration: none;
padding: 10px;
}
/* Estilos del menú hamburguesa */
.menu-toggle {
display: none;
cursor: pointer;
font-size: 24px;
}
.bar{
display: block;
width: 25px;
height: 3px;
margin: 5px auto;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
background-color: white;
}
/* Estilos de la imagen animada */
.imagen-animada {
width: 200px;
height: 200px;
margin: 20px auto;
background-image: url("imagen.gif"); /* Reemplazar */
background-size: cover;
animation: rotar 4s linear infinite;
}
@keyframes rotar {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
/* Media query para responsive */
@media (max-width: 768px) {
nav {
display: none; /* Ocultamos el menú en pantallas pequeñas */
flex-direction: column;
width: 100%; /*Ocupa todo el ancho*/
background-color: #333; /*Le agregamos un color de fondo para cuando se despliega*/
position: absolute; /*Para que se ponga debajo del header*/
top: 52px; /*Para que se muestre justo debajo del header*/
left: 0;
}
nav.active { /* Estilo para cuando el menú está activo */
display: flex;
}
.menu-toggle {
display: block; /* Mostramos el menú hamburguesa */
}
.menu-toggle.active .bar:nth-child(2){
opacity: 0;
}
.menu-toggle.active .bar:nth-child(1){
transform: translateY(8px) rotate(45deg);
}
.menu-toggle.active .bar:nth-child(3){
transform: translateY(-8px) rotate(-45deg);
}
nav a {
width: 100%; /*Para que los links ocupen todo el ancho*/
text-align: center; /*Centramos el texto*/
padding: 10px;
border-bottom: 1px solid white;
}
}
/* Estilos del contenido principal */
main {
padding: 20px;
text-align: center;
}
</style>
</head>
<body>
<header>
<div class="menu-toggle" id="mobile-menu">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</div>
<nav id="menu">
<a href="#">Inicio</a>
<a href="#">Servicios</a>
<a href="#">Contacto</a>
</nav>
</header>
<main>
<h1>Bienvenido a mi página</h1>
<div class="imagen-animada"></div>
<p>Este es un ejemplo de página web con una imagen animada y un menú de navegación responsive.</p>
</main>
<script>
const menuToggle = document.getElementById('mobile-menu');
const nav = document.getElementById('menu');
menuToggle.addEventListener('click', () => {
nav.classList.toggle('active');
menuToggle.classList.toggle('active'); //Toggle para la animación del menu hamburguesa
});
</script>
</body>
</html>
Cambios y explicaciones importantes:
Estructura del menú hamburguesa: Ahora el menú hamburguesa está compuesto por 3 spans con la clase bar, esto nos permite animar las líneas del menú cuando este se abre o se cierra, dandole un aspecto mucho mas visual.
Flexbox en el header: Se añade display: flex al header para controlar mejor la posición del menú y el botón de hamburguesa. Usamos justify-content: space-between para separarlos a los extremos y align-items: center para alinearlos verticalmente.
Media Query Refinada: Se han ajustado los estilos dentro de la media query para que el menú se comporte correctamente en pantallas pequeñas.
Javascript mejorado: El Javascript ahora utiliza classList.toggle('active') para alternar la clase activetanto en el menú como en el menu hamburguesa. Esto facilita la gestión del estado del menú y es una mejor práctica. También se usa const para declarar las variables que no se van a modificar.
Animación del menú hamburguesa: Se agregaron estilos para que el menú hamburguesa se transforme en una «x» cuando este se abre, esto se logra ocultando la barra de en medio y rotando las barras superior e inferior.
Con estas mejoras, el menú hamburguesa funciona de manera más robusta y ofrece una mejor experiencia de usuario. Ahora, al hacer clic en el icono de hamburguesa en pantallas pequeñas, el menú se despliega suavemente y el icono se transforma en una «x», y al volver a hacer clic, el menú se oculta y el icono vuelve a su forma original. Recuerda reemplazar "imagen.gif" con la ruta de tu imagen.
Añade el código html para el pie de página con el copyright en php.
Añadir un pie de página con copyright en PHP es sencillo y te permite actualizar automáticamente el año. Aquí te presento cómo integrarlo en el código HTML que hemos estado trabajando, y te explico las diferentes maneras de hacerlo, incluyendo una opción para mostrar un rango de años si es necesario:
Estilos CSS: Se han añadido estilos CSS para dar formato al pie de página, incluyendo color de fondo, padding, centrado del texto y un margen superior para separarlo del contenido principal. Se usa flexbox para centrar el contenido del footer y para mostrar las opciones del nav uno al lado del otro. También se agrego un media query para que el footer sea responsive, apilando los elementos verticalmente en pantallas pequeñas.
Contenido Adicional en el Footer: Se agregó un nav para mostrar links al aviso legal o a la politica de privacidad.
Otras opciones y consideraciones:
Rango de años: Si el sitio web se creó en un año anterior al actual, es común mostrar un rango de años:
Este código mostrará «2020» si el año actual es 2020, y «2020 – 2024» si el año actual es 2024.
Archivo separado (recomendado para proyectos más grandes): Para una mejor organización, puedes crear un archivo separado para el pie de página (ej. footer.php) y luego incluirlo en tu archivo principal con <?php include 'footer.php'; ?>.
Esta última opción es la más limpia y mantenible, especialmente si tienes un sitio web con varias páginas. Recuerda que para que el código PHP se ejecute, tu archivo principal debe tener la extensión .php (ej. index.php). Con estas mejoras, tu pie de página estará completo, dinámico y bien estructurado.
Abre el Código Completo de la Página Web de la Demo
Vamos a ver a continuación cómo se hace una Página Web en PHP. Explora la Guía que reproducimos a continuación para crear la página.
Antes de empezar vamos a ver los requisitos que son necesarios para la creación de una Página Web PHP.
Un servidor web con PHP: Necesitarás un entorno donde se pueda ejecutar código PHP. Puedes usar un servidor local como XAMPP, WAMP (en Windows) o MAMP (en macOS), o un servicio de hosting web.
Un editor de texto: Para escribir el código. Puedes usar Notepad++, Sublime Text, Visual Studio Code o cualquier otro editor de código.
Crear el archivo PHP:
Crea un nuevo archivo de texto y guárdalo con la extensión .php. Por ejemplo, index.php. Este será el archivo principal de tu página web.
Escribir el código PHP:
Aquí te presento un ejemplo sencillo de código PHP para una página web:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mi primera página PHP</title>
</head>
<body>
<img src="https://doodom.com/wp-content/uploads/2024/11/cropped-doodom-logo-azul-favicon-1.jpg" alt="DooDom" width="200px" height="200px"
title="Doodom.com"</img>
<h1>¡Hola, mundo desde PHP!</h1>
<?php
// Esto es un comentario en PHP
$nombre = "Usuario"; // Variable para almacenar un nombre
echo "<p>Bienvenido, " . $nombre . "</p>"; // Imprime un mensaje de bienvenida
// Ejemplo de fecha
$fecha_actual = date("d/m/Y");
echo "<p>Hoy es " . $fecha_actual . "</p>";
?>
<p>Este es un párrafo HTML normal.</p>
<ul>
<?php
$frutas = array("manzana", "banana", "cereza");
foreach ($frutas as $fruta) {
echo "<li>" . $fruta . "</li>";
}
?>
</ul>
<p><a href="https://doodom.com/web-site.php" alt="Página Web PHP" title="Página Web PHP" alt="target_blank">Doodom: Página Web PHP</a><p>
</body>
</html>
Explicación del Código
<!DOCTYPE html>, <html lang="es">, <head>, <body> son etiquetas HTML básicas que estructuran la página web.
<?php ... ?> delimita el código PHP.
// Esto es un comentario en PHP introduce un comentario de una línea.
$nombre = "Usuario"; declara una variable llamada $nombre y le asigna el valor «Usuario».
echo "<p>Bienvenido, " . $nombre . "</p>"; imprime (muestra) un párrafo con un mensaje de bienvenida. El operador . se utiliza para concatenar cadenas.
date("d/m/Y") es una función de PHP que obtiene la fecha actual en formato día/mes/año.
El ejemplo con <ul> y foreach muestra cómo iterar sobre un array e imprimir elementos como una lista desordenada. Esto demuestra como PHP puede generar HTML dinámicamente.
Guardar y ejecutar
Guarda el archivo index.php en la carpeta raíz de tu servidor web (por ejemplo, htdocs en XAMPP, www en WAMP). Luego, abre un navegador web y navega a la dirección correspondiente (por ejemplo, http://localhost/index.php si estás usando un servidor local).
Este es un ejemplo muy básico. Para crear páginas web más complejas con PHP, necesitarás aprender:
Manejo de formularios: Para recibir datos del usuario.
Bases de datos: Para almacenar y recuperar información.
Sesiones y cookies: Para mantener el estado del usuario.
Seguridad: Para proteger tu sitio web de vulnerabilidades.
Veamos un ejemplo fácil de JavaScript. Vamos a crear una página web HTML, con un enunciado que nos indique la hora actual.
JavaScript es un lenguaje de secuencias de comandos que te permite crear contenido de actualización dinámica, controlar multimedia, animar imágenes y prácticamente todo lo demás.
Siguiendo con el ejemplo, vamos a ver una pequeña introducción, donde podrás:
Primero descargar el código.
Comprobar el funcionamiento del script-reloj.
Y Ver las líneas de código HTML y JavaScript que lo componen.
Funciones de JavaScript
Los creadores de código, suelen utilizar este método cuando trabajan en proyectos de gran magnitud, ya que así mantienen el script organizado. Además, permite reutilizar el script en varias páginas HTML, algo que los desarrolladores valoran mucho. Puedes crear y modificar el código JavaScript utilizando un editor de texto.
¿Qué aplicaciones usan JavaScript?
Entre las aplicaciones más populares creadas con esta tecnología podemos encontrar a:
Visual Studio Code.
Atom.
WordPress, la Aplicación de Escritorio.
Slack, aplicación de Escritorio.
Github, aplicación de Escritorio.
Twitch, aplicación de Escritorio.
LightTable, Editor de Código Multiplataforma.
Hyper.
Pueden ver el código JavaScript, el ejemplo práctico de una página web HTML con JavaScript, en el que podrás ver la Hora actual en un encabezado de una página web. También tienen la posibilidad de descargar el código mediante un botón. Para ello hagan clic en el enlace que está justo debajo de este párrafo.
Sois creadores de dibujos, descubre la Pizarra de Dibujo, y demuestra tus habilidades. Se trata de un lienzo negro para dibujar lo que quieras.
Es un script para dibujar con el ratón en el ordenador, y de forma táctil en otros dispositivos electrónicos. Se construye sin depender de ninguna librería externa (como pueda ser jQuery), solo Javascript Vainilla y la etiqueta Canvas. Crea tus dibujos a mano alzada, con esta Pizarra de Dibujo.
Haz clic dentro del cuadro para dibujar
Puedes ver también como funciona un Editor de Firma Digital más completo, en el siguiente enlace
La captura de la firma para documentos es ya una realidad en múltiples sectores: correos, paquetería, supermercados, notarías, etc. Con un módulo de firma digital, sus procesos de captura de firma quedan reducidos a un único trabajo: QUE EL CLIENTE FIRME LA TABLETA DE CAPTURA DE FIRMA.
HTML
Declaramos nuestra etiqueta canvas, donde se dibujarán las líneas.
Es importante que miCanvas.width y miCanvas.height tengan el mismo tamaño que los declarados en el CSS, sino la línea se saldrá del lienzo.
//======================================================================
// VARIABLES
//======================================================================
let miCanvas = document.querySelector('#pizarra');
let lineas = [];
let correccionX = 0;
let correccionY = 0;
let pintarLinea = false;
// Marca el nuevo punto
let nuevaPosicionX = 0;
let nuevaPosicionY = 0;
let posicion = miCanvas.getBoundingClientRect()
correccionX = posicion.x;
correccionY = posicion.y;
miCanvas.width = 1200;
miCanvas.height = 1200;
//======================================================================
// FUNCIONES
//======================================================================
/**
* Funcion que empieza a dibujar la linea
*/
function empezarDibujo() {
pintarLinea = true;
lineas.push([]);
};
/**
* Funcion que guarda la posicion de la nueva línea
*/
function guardarLinea() {
lineas[lineas.length - 1].push({
x: nuevaPosicionX,
y: nuevaPosicionY
});
}
/**
* Funcion dibuja la linea
*/
function dibujarLinea(event) {
event.preventDefault();
if (pintarLinea) {
let ctx = miCanvas.getContext('2d')
// Estilos de linea
ctx.lineJoin = ctx.lineCap = 'round';
ctx.lineWidth = 10;
// Color de la linea
ctx.strokeStyle = '#fff';
// Marca el nuevo punto
if (event.changedTouches == undefined) {
// Versión ratón
nuevaPosicionX = event.layerX;
nuevaPosicionY = event.layerY;
} else {
// Versión touch, pantalla tactil
nuevaPosicionX = event.changedTouches[0].pageX - correccionX;
nuevaPosicionY = event.changedTouches[0].pageY - correccionY;
}
// Guarda la linea
guardarLinea();
// Redibuja todas las lineas guardadas
ctx.beginPath();
lineas.forEach(function (segmento) {
ctx.moveTo(segmento[0].x, segmento[0].y);
segmento.forEach(function (punto, index) {
ctx.lineTo(punto.x, punto.y);
});
});
ctx.stroke();
}
}
/**
* Funcion que deja de dibujar la linea
*/
function pararDibujar () {
pintarLinea = false;
guardarLinea();
}
//======================================================================
// EVENTOS
//======================================================================
// Eventos raton
miCanvas.addEventListener('mousedown', empezarDibujo, false);
miCanvas.addEventListener('mousemove', dibujarLinea, false);
miCanvas.addEventListener('mouseup', pararDibujar, false);
// Eventos pantallas táctiles
miCanvas.addEventListener('touchstart', empezarDibujo, false);
miCanvas.addEventListener('touchmove', dibujarLinea, false);
Para llevar esta Pizarra de Dibujo a tu sitio web, haz clic en el enlace de abajo.
