Speech Recognition

How to Enable Speech Recognition in your Site

Nowadays, Google has made Internet Browsing convenient by letting its users use speech recognition. Just by saying something by using your own computer or smartphone’s microphone, Google will then type what you have just said in the search bar. This is a very good feature, provided that your voice can be recognized clearly.

Speech Recognition
Speech Recognition


Is it possible to put this feature in your websites? Well…there’s no doubt that the answer is a big Yes. As long as you’re using Google Chrome or Mozilla Firefox, enabling the speech recognition in your sites is somewhat easy.


Using the HTML5 Web Speech API

By using the Chrome and Firefox-supported CSS script, you can enable the speech recognition feature in your website. Once enabled, anyone who visits your site can use it even without typing. In the past, you can just use the x-webkit-speech attribute in order to do this. As of now, however, you are now required to use the JavaScript-based API if you want to include the speech recognition.


If someone clicks the microphone image inside the speech box, the JavaScript will automatically detect whether the browser that was used to view the site supports the speech recognition feature. If yes, the feature will wait for the transcribed text which will come directly from Google servers before submitting the form. If you’re using the Dictation app on the other hand, it will write the transcribed text to a text area field instead of a speech input box.