HTML5 Speech Input

The new features being introduced by the HTML5 standard are simply astounding. Just as the awe of one feature starts to wear off, I discover another that is even more awesome than the last. The current jaw dropping discovery is largely due to the Speech Input API Specification. Thats right, speech input.

You can add speech input to any input element by simply using the x-webkit-speech attribute.

The following code

<input type="text" x-webkit-speech />

Will yield this

You can do other exciting actions language translations, or the famous voice search for android:

    <script type="text/javascript">
      function startSearch(event) {
        event.target.form.submit();
      }
    </script>

    <form action="http://www.google.com/search">
    <input type="search" name="q" speech required onspeechchange="startSearch">
    </form>

Although this currently only works in Chrome 11 and relies on Google’s voice API, it is anticipated that more browsers will adopt the technology, and users will have the ability to choose which voice API they want to use.

*does the happy dance*

Related posts:

  1. HTML5 Input Lets be honest, HTML5 is the new buzz word. Every blog, tutorial, tweet, article, or post I read contains some...
  2. Sending Text Messages in PHP Recently I’ve had to implement an alert system in PHP were the alerts are sent via a text message. The...
  3. Interacting with the Arduino with C# There are times where you may want to build a nice user interface for your Arduino program to monitor input/output....
  4. Getting to know GD Create dynamic userbars with GD Introduction: Have you ever been on aim and received a message from one of your...

Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Notify me of followup comments via e-mail. You can also subscribe without commenting.


3 Responses to “HTML5 Speech Input”

  1. Philip Matuskiewicz

    This is really awesome!

    Reply |

    • John

      Thanks! I'm glad you liked it.

      Reply |