frontenderos icon

Podcast

Newsletter

#160 El framework de la accesibilidad web

Usando el elemento abbr con el atributo title

El framework de la accesibilidad web

Así como antes crypto no significaba dinero digital de alta fluctuación, framework no necesariamente significaba tecnología, sino literal marco de trabajo sobre el que se construye algo. Y cuando se trata de accesibilidad primero tienes que tener un marco teórico para entender los problemas y sus soluciones. Usa este framework para que puedas comenzar a solucionar problemas de accesibilidad.

Usando el elemento abbr con el atributo title

Hay inconsistencias en cuanto a cómo se muestran las abreviaciones con el elemento abbr y su atributo title, y si quieres consistencia, quizás lo mejor es, o no usarlas, o usarlas de una manera diferente.

VIDEO 📹️ 
Explorando los limites de JAMStack

El JAMstack no está muerto, porque el término, aunque acuñado por Netlify en un intento de marketing y campaña, siempre fue de la comunidad. En esta entrevista, Zach Leatherman el creador de Eleventy habla del ecosistema y lo que puede ser su futuro.

EL RINCÓN DEL CMS 👩‍💻 
Usando Headless en 2024

Somos frontenderos, si queremos editar un sitio web, lo hacemos desde el HTML. Desafortunadamente, mucha gente no puede usar nuestro mismo método de edición y prefiere usar CMSs, y aunque el rey siga siendo WordPress, hay muchas alternativas ahí afuera, sobre todo si consideramos headless.

HERRAMIENTA 🛠️ 
shadeup

Shadeup, es un lenguaje para escribir shaders para WebGPU en un estilo muy parecido a typescript, si te ha gustado lo que hemos compartido de WebGPU, esto te puede gustar.

NOTICIA 📰 
Nuxt 3.10

Nuxt 3.10 ya salió y trae varias mejoras de desempeño y nuevas características en fase experimental que puedes ir probando.

UN DÍA COMO HOY 🗓️ 

El 18 de febrero de 2013, la cuenta de la cadena de comida rápida estadounidense Burger King fue hackeada y mostró anuncios, fotos y mensajes a favor de su competidora, McDonald's.

La oficina de prensa de la empresa sólo consiguió suspender el perfil de la red más de una hora después.

Tras el incidente, la cuenta ganó unos 30.000 seguidores y el hashtag (la etiqueta) #McDonald's se volvió trending topic en Estados Unidos.

El grupo de hackers Anonymous reclamó la autoría de lo ocurrido.

VACANTE 💼 
Programador full stack

Ubicación: Ciudad de México (Híbrido)
Empresa: ISOL Ingeniería de Soluciones
Requisitos: Desarrollo de aplicaciones con tecnologías Web HTML, CSS, JS al menos 3 años. Desarrollo de aplicaciones con framework React. Desarrollo de API REST, GraphQL y Backend con Node JS, Java. Conocimientos en el desarrollo de aplicaciones web con Atomic Web Design. Al menos un año de experiencia en Docker. 2 años de experiencia trabajando con metodologías ágiles. Entre otros.
Beneficios: Seguro de Gastos Medicos Mayores. Seguro de Vida. Seguro Social. Vale de Despensa. Vacaciones y Aguinaldo de Ley.

Para conocer más y aplicar a esta vacante, ingresa aquí. 🤞 

RESULTADO DEL CHALLENGE DE AYER 🧐 
¡Gracias a los que contestaron el challenge de ayer! Aquí te dejamos nuestra respuesta:

function generarIdUnico(longitud) {
    // Definir los caracteres posibles para el ID
    const caracteres = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
    let idUnico = '';
    
    // Generar el ID de la longitud deseada
    for (let i = 0; i < longitud; i++) {
        const indiceAleatorio = Math.floor(Math.random() * caracteres.length);
        idUnico += caracteres.charAt(indiceAleatorio);
    }
    
    return idUnico;
}

// Ejemplo de uso
console.log(generarIdUnico(8)); // Ejemplo de salida: "aB3dE7gH"
console.log(generarIdUnico(10)); // Ejemplo de salida: "K9s2Df4gH7"
  • La función generarIdUnico acepta un argumento longitud, que determina la longitud del ID a generar.

  • Se declara una variable caracteres que contiene todos los caracteres posibles que se quieren incluir en el ID.

  • Se inicializa una variable idUnico como un string vacío para construir el ID.

  • Se utiliza un bucle for para iterar tantas veces como la longitud especificada del ID.

  • Dentro del bucle, se utiliza Math.random para generar un índice aleatorio que se usa para seleccionar un carácter de la cadena de caracteres. El método Math.floor asegura que el índice sea un entero.

  • El carácter seleccionado se añade a idUnico en cada iteración.

  • Después de completar el bucle, la función retorna el idUnico generado.

CHALLENGE DE HOY ⚔️ 
Crea una función en JavaScript que tome una cadena de caracteres y la comprima utilizando el conteo de caracteres consecutivos. Si la cadena comprimida no es más corta que la original, devuelve la cadena original.

  1. Implementa una función comprimirString que acepte una cadena de caracteres como argumento.

  2. La función debe generar una versión comprimida de la cadena mediante el conteo de caracteres consecutivos.

  3. Si la longitud de la cadena comprimida es igual o mayor que la longitud de la cadena original, la función debe retornar la cadena original.

  4. Considera el caso de que la cadena esté vacía o solo contenga un carácter.

console.log(comprimirString("aabcccccaaa")); // Debería retornar "a2b1c5a3"
console.log(comprimirString("abcdef")); // Debería retornar "abcdef" porque la compresión no reduce la longitud
  • Utiliza un bucle para iterar a través de la cadena y contar los caracteres consecutivos.

  • Concatena el carácter actual y su conteo al resultado de la compresión mientras iteras.

  • Antes de devolver el resultado, compara la longitud de la cadena comprimida con la original.

Comparte tu respuesta en redes sociales y etiquétanos (@frontenderos), compartiremos nuestra respuesta en el issue de mañana. 😎 

Tu feedback nos ayuda a mejorar

Por favor elige una opción y dinos lo que te gustó y lo que no. Leemos todas las respuestas 👀

¿Qué te pareció el email de hoy?

Iniciar Sesión o Suscríbete para participar en las encuestas.

¡Hasta mañana! 🤟