Speech Enabled Input Fields in Chrome

Voice Enabled Input Field ImageMany have heard of Google Voice Search - It allows you to speak through the microphone to populate the input field (something like Siri minus the answer back feature).

In this post, I will discuss how simple it is to enable voice input for a text field in your blog. Of course, speech enabled input is a work in progress and currently works only with Google Chrome . And at times, the results are quite funny but that is not a problem. In the future, we should be seeing more of these interactions and right within the browser itself.

Speech Enable Search




The results will depend on your accent and what you’re saying. Some of my attempts :



"hello" resulted in "hello" [ understand normal language ]


"google" resulted in "google" [ Well they made the stuff ]


"facebook” resulted in “facebook” [ FB is famous ]


"hello Prayag what are you doing" resulted in "hello seattle what are you doing" [ Replaced my name with seattle? ]


Some Arbitrary sound resulted in "new york" [ ?????????????????????? ]


In general, though, regularly-used English words and numbers are parsed surprisingly well given that the system isn’t trained to recognize your particular dulcet tones.


For any normal input field like :



<input type="text" />


Just add the x-webkit-speech='x-webkit-speech' to it like this :



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


You can see the demo Here: (Only for Google Chrome Users)


Written by Prayag Verma

Find me on Twitter

Email Newsletter

Like what you read here in this post ?
Get new posts delivered straight to your inbox

Post a Comment
John Paul said...

I've watched the advert of Apple about Siri on iPhone 4S and I never knew what Siri is until I read this post. That was a cool feature indeed. There is a similar tool blackhat people are using. It's the dragon..Oh I forgot the name. You will speak using your microphone and the software does the writing. Same as the speech enabled input fields in chrome.

Havenn't you noticed. Google is competing to every large companies like Facebook, Twitter and Apple. Looks like Google is trying to rule the world ;P
Google+vsFacebook, Google Buzz Vs Twitter, ios vs Android, etc...

rahul said...

What about internet explorer?

@rahul
As mentioned its only available on Chrome, but the future is bright as Internet Explorer is following a aggressive upgrade strategy (with 72 versions in the pipeline !!! )

Simply awesome.
I found a Speech Input Field in a blog. then started to search about it. Found this one. Soon going to implement it to my website’s search :)