Usando Google Speech para elementos HTML con JavaScript
Hace pocos Google implemento la búsqueda por voz en su pagina principal para el dominio en ingles, de la misma manera como en los dispositivos con Android. Como lo dicen en el artículo publicado en Google Docs, esta sería una propuesta para añadir soporte de reconocimiento de voz para HTML5.
Lamentablemente por el momento esta funcionalidad solamente está disponible en el navegador Chrome sin embargo soporta el reconocimiento de voz en varios idiomas incluido el español.
Gracias a esto es posible mejorar muchas aplicaciones, como búsqueda en la web por voz, traducción de voz, videollamadas, etc. En este caso probaremos el ejemplo en un campo de texto para buscar las entradas de un blog en WordPress.
Haciendo el Ejemplo:
- Agregaremos al elemento INPUT la propiedad x-webkit-speech
- Luego el evento onwebkitspeechchange aquí donde hará un llamada a cualquier función, después que ya se haya reconocido la voz.
<form id="searchform" action="https://neysitc.com/" method="get"> <input type="text" name="s" id="s" x-webkit-speech="" onwebkitspeechchange="buscarPorVoz()"> </form>
Agregado la propiedad debería mostrar el icono de un micrófono el campo de texto, la siguiente imagen representa el cambio de los íconos en los eventos que se producen:
Ahora implementamos la función que permitirá enviar el formulario:
<script type="text/javascript"> function buscarPorVoz() { var frm = document.getElementById("searchform"); frm.submit(); } </script>
Es indispensable tener conectado el micrófono (obvio!) para probar el ejemplo.
Pulse para ver la demostración
Esto sería de lujo si se llegara a implementar nativamente para HTML5. ¿Imagínese el provecho que sacaría en sus aplicaciones esta funcionalidad?.
Covi
7 marzo, 2012 at 2:44 am
Genial, lo he visto por primera vez en otra web (aquí http://www.digett.com/services/website-design) y estaba buscando si era alguna librería Javascript o una implementación de Chrome (es el mismo icono que en Android), ya que en el fuente no aparecía. Lo generarán al vuelo con JS imagino si detectan Chrome.
En cualquier caso, gracias porque todo lo que encontraba en Google era noticias sobre el plugin, Android, etc.
Valeria
12 marzo, 2016 at 6:45 pm
x-webkit-speech ya no sirve.