slide1

Alt1040. Noticias acerca de Internet, diseño, música, cine, opiniones, weblogs y medios

Es uno de los weblogs de tecnología más seguidos de la blogosfera hispana.

slide2

Bitelia. Blog de software, internet y servicios web

Software y aplicaciones para mejorar tu vida, guías de uso, trucos, listas, noticias y todo sobre tecnología.

slide3

Xataka. Publicación de noticias sobre gadgets y tecnología.

Últimas tecnologías en electrónica de consumo y novedades tecnológicas en móviles, tablets, informática, etc.

slide4

Wwwhatsnew. Aplicaciones, marketing y noticias en la web.

Servicios que os pueden ser útiles para dibujar, gestionar tareas, hacer amigos, encontrar restaurantes...

slide5

Fayerwayer. Discusiones y opiniones de lo ultimo en tecnología y gadgets

Con secciones dedicadas a Internet, Software o Redes Sociales es un referente a nivel de tecnología en español.

16 de abril de 2018

WebAuthn, el estándar que apoyan Google, Microsoft y Mozilla para acabar con las contraseñas

WebAuthn Interface

La FIDO Alliance y el World Wide Web Consortium (los consorcios que regulan los estándares en el uso de la web) han alcanzado un hito en el estándar global para ofrecer una autenticación web simplificada pero más robusta para los usuarios a nivel mundial.


Han sido cerca de dos años de intenso trabajo que han dado como fruto el anuncio oficial y la disponibilidad de este nuevo estándar que pone orden y unifica los primeros acercamientos hacia sistemas de identificación biométricos que algunas firmas estaban ya empleando.

WebAuthn define una API web estándar que se puede incorporar en los navegadores y ofrece a los usuarios nuevos métodos para autenticarse de forma segura en la web, en el navegador y en todos los sitios y dispositivos.

Se trata de un componente central del Proyecto FIDO2, que junto con la especificación del Protocolo Cliente a Autenticador (CTAP) de FIDO, permite que un autenticador externo, como una llave de seguridad o un teléfono móvil, transmita credenciales de autenticación sólidas a través de USB, Bluetooth o NFC al dispositivo del usuario.

Google, Microsoft y Mozilla se han comprometido a respaldar el estándar WebAuthn en sus navegadores insignia (Google Chrome, Microsoft Edge y Mozilla Firefox respectivamente) y han comenzado a implementarlo para plataformas Windows, Mac, Linux, Chrome OS y Android.

Además de los principales navegadores, el nuevo estándar será implementado poco a poco por las organizaciones de todo el globo, con la ventaja adicional de que las especificaciones de FIDO2 son totalmente compatibles con la autenticación FIDO, el estándar anterior, con lo que su aplicación será mucho más sencilla para los desarrolladores.

El siguiente paso lo darán los grandes (Microsoft, Google, Facebook y Apple) aplicando el nuevo estándar en sus sistemas y logrando que el usuario solo necesite su huella, rostro o bien un dispositivo móvil para identificarse de forma segura y sin necesidad de recordar complejas contraseñas.


Password Security


Beneficios del proyecto WebAuthn y FIDO2


La API WebAuthn del W3C permite credenciales fuertes, únicas y basadas en claves públicas para cada sitio, eliminando el riesgo de que una contraseña robada de un sitio web pueda ser usado en otro.

  • Autenticación simple » los usuarios simplemente inician sesión usando:

    1- Autenticadores internos o incorporados (como huellas digitales o biometría facial) en PC, laptops y/o dispositivos móviles.

    2- Autenticadores externos (como claves de seguridad y dispositivos móviles) para la autenticación de dispositivo a dispositivo utilizando CTAP.

  • Autenticación más fuerte » la Autenticación FIDO es mucho más sólida y tiene estas ventajas:

    1- Las credenciales de usuario y las plantillas biométricas nunca salen del dispositivo del usuario y nunca se almacenan en servidores.

    2- Las cuentas están protegidas de ataques de phishing, man-in-the-middle y otros mecanismos que usan contraseñas robadas.

  • Los desarrolladores pueden comenzar a crear aplicaciones y servicios que aprovechan la Autenticación FIDO en la nueva página de recursos para desarrolladores de FIDO.

Acerca de la Alianza FIDO


La Alianza FIDO (Fast IDentity Online), se creó en julio de 2012 para resolver la falta de interoperabilidad entre las tecnologías de autenticación fuerte y remediar los problemas a los que se enfrentan los usuarios para crear y recordar diversos identificadores de usuario y contraseñas.

La Alianza planea cambiar la naturaleza de la autenticación con el desarrollo de especificaciones basadas en estándares para una autenticación más sencilla y a la vez más fuerte que defina un conjunto abierto, escalable e interoperable de mecanismos que reduzcan la dependencia de las contraseñas.

La autenticación FIDO es más fuerte, privada, y más fácil de usar en la autenticación de servicios online.

Alianza Fido

Acerca del W3C


La misión del World Wide Web Consortium (W3C) es llevar a la Web a su máximo potencial mediante la creación de normas técnicas y directrices para garantizar que la Web permanezca abierta, accesible e interoperable para todos en todo el mundo.

El W3C desarrolla especificaciones bien conocidas como HTML5, CSS y Open Web Platform, además de trabajar en seguridad y privacidad, todas creadas para todo el mundo y provistas de forma gratuita y bajo la exclusiva Política de Patentes del W3C.

W3C

Lee el comunicado de prensa y los testimonios de los miembros del W3C.


2 de abril de 2018

Calendario de publicación para Blogger (II)

Calendario publicación artículos - Blogger
Como ya sabréis la mayoría de vosotros, incorporar un calendario de publicación de artículos en un blog con tecnología Blogger es relativamente sencillo y en el post Calendario con todos los post publicados en Blogger ya daba unas instrucciones concretas para su implementación.


A modo de recordatorio:

  1. Selecciona la entrada Diseño del panel principal de Blogger.
  2. Pulsa sobre el link Añadir un gadget y se abrirá una ventana con diferentes alternativas
  3. Desplazamos el scroll de la nueva ventana hacia abajo hasta llegar a la opción:

    HTML/JavascriptAñadir
    Añade una característica de un tercero u otro código a tu blog.





  4. Introduce el Título del widgets (por ejemplo Calendario)
  5. En la caja Contenido pega el siguiente código:

    <div id='calendar'><strong>Loading...</strong></div>
    <script>
    var conf = {
     bgcolor: '#5692ce', 
     newtab:  1,         // 0:abre link en la misma ventana | 1:abre link en ventana nueva
     start:   1,         // 0:Domingo | 1:Lunes
     days:    "Lunes|Martes|Miercoles|Jueves|Viernes|Sabado|Domingo",
     months:  "Enero|Febrero|Marzo|Abril|Mayo|Junio|Julio|Agosto|Septiembre|Octubre|Noviembre|Diciembre",
     date:    "Ir al mes actual"
    }
    </script>
    <script src='https://cdn.jsdelivr.net/gh/jmacuna/calendar-widget@master/create-calendar.js' type='text/javascript'></script>
    <script src='https://www.tecnoblog.guru/feeds/posts/summary?max-results=1000&alt=json-in-script&orderby=published&callback=createCalendar' type='text/javascript'></script>
    
  6. Por último hacemos click sobre el botón Guardar

Los parámetros de configuración son:

  • bgcolor: color de fondo del calendario.
  • newtab: 0 para abrir el artículo seleccionado en la misma ventana o 1 para abrir el link en una ventana nueva.
  • start: 1 si queremos que el calendario empiece en Lunes o 0 si empieza en Domingo.
  • days: días de la semana. Nota: si ponemos la variable start a cero, el primer día de la semana en la variable days será el Domingo
  • months: meses del año.
  • date: texto que aparece cuando posicionamos el cursor encima de la fecha actual (parte inferior del calendario).
  • Tenemos que escribir la url de nuestro blog en el último script, dónde aparece https://www.tecnoblog.guru resaltado en negrita.

Puedes ver el ejemplo funcionando a continuación.


De hecho, me sorprende gratamente que numerosos lectores del blog hayan incorporado este widget a su bitácora.

También sois muchos los que me habéis enviado emails preguntándome si era posible realizar un diseño menos espartano y la respuesta es un SI rotundo.

Sin necesidad de modificar el código del gadget, tan sólo incorporando unas líneas de código o estilos de presentación, podemos personalizar nuestro diseño:

<div id='calendar'><strong>Loading...</strong></div>
<script>
var conf = {
 bgcolor: '#5692ce', 
 newtab:  0,         // 0:abre link en la misma ventana | 1:abre link en ventana nueva
 tooltip: false,      // false:title por defecto | true:tooltip con css3
 start:   1,         // 0:Domingo | 1:Lunes
 days:    "Lunes|Martes|Miercoles|Jueves|Viernes|Sabado|Domingo",
 months:  "Enero|Febrero|Marzo|Abril|Mayo|Junio|Julio|Agosto|Septiembre|Octubre|Noviembre|Diciembre",
 date:    "Ir al mes actual"
}
</script>
<script src='https://cdn.jsdelivr.net/gh/jmacuna/calendar-widget@master/create-calendar.js' type='text/javascript'></script>
<script src='https://www.tecnoblog.guru/feeds/posts/summary?max-results=1000&alt=json-in-script&orderby=published&callback=createCalendar' type='text/javascript'></script>

<style type="text/css">
@font-face {
  font-family: 'Catamaran';
  src: local('Catamaran Regular'), local('Catamaran-Regular'), url(https://fonts.gstatic.com/s/catamaran/v4/o-0IIpQoyXQa2RxT7-5r5TRA.woff2) format('woff2');
}
#contentDate *{font-family:'Catamaran'!important}
#spanLeft, #spanRight, #spanMonth, #spanYear{border:0;cursor:pointer;line-height:20px!important;background-color:#5692ce;padding:0!important}
#spanMonth,#spanYear{background-color:#fff!important;font-size:16px!important;color:#000!important;border:0!important;cursor:text!important;pointer-events:none}
#spanLeft:before{content:'<';font-size:15px;color:#fff;display:inline-block;padding:0 10px!important}
#spanRight:after{content:'>';font-size:15px;color:#fff;display:inline-block;padding:0 10px!important}
#spanLeft:hover, #spanRight:hover{background-color:#515151!important}
#spanLeft img, #spanRight img, #spanMonth img, #spanYear img{display:none}
#contentDate table{margin-bottom:0!important}
#contentDate table tr td{padding:0}
#contentDate table tr td a{width: 28px;display:inline-block}
#contentDate table tr td a[style='text-decoration:none;color:#000;cursor:default;border-radius:100%;border:2px solid #5692ce;cursor:pointer;'], #contentDate table tr td a[style='text-decoration:none;color:#000;cursor:default;border-radius:100%;border:2px solid #5692ce;cursor:pointer;border-radius:100%;border:2px solid #5692ce;cursor:pointer;'] {border:0!important;border-radius:0!important;background-color:#4080cc;color:#fff!important}
#contentDate table tr td a[style='text-decoration:none;color:#000;cursor:default;border-radius:100%;border:2px solid #5692ce;cursor:pointer;'] span {color:#fff!important}
#contentDate table tr td a[style='text-decoration:none;color:#000;cursor:default;border-radius:100%;border:2px solid #5692ce;cursor:pointer;']:hover {background:#515151}
#contentDate table{box-shadow:none!important;font-size:13px!important;width:100%!important}
#contentDate table tr{background:#fff!important}
#contentDate table tr td{text-align:center!important}
#contentDate{width:240px!important; display:inline-block}
#lblToday{background:#fff}
#lblToday a{color:#bd3434!important; font-size:medium; width:auto!important}
</style>


Y obtenemos un resultado asombroso.

Loading...


Si tienes conocimientos técnicos de css (siglas en inglés de Cascading Stylesheets) podrás personalizar el calendario a tu gusto cambiando fuentes de texto, tamaños, colores y un sinfín de propiedades de diseño.