A bit of Web Speech API for modern web applications

Below we will talk about technologies for working with voice on the web, such as speech recognition and synthesis. This article will not include code examples or complex technical descriptions, my goal is to show you the capabilities of these technologies and their level of maturity using a simple application as an example, which was developed as part of the study of this topic. You can view the code for this application on GitHub .







What Web Speech API gives us



Many will agree with me that the address on the maps and long searches on the phone are easier to enter by voice. A voice assistant often answers our requests. These technologies are used by many mobile applications, but how often do you see this on sites?

The benefits for mobile users are obvious, but not only for them. The Web Speech API increases the accessibility of a web application for people with disabilities and children. In some cases, the technology can also be useful for desktop users, for example, in web chats.







Try to open the link for an example of how the Web Speech API works in your Google Chrome (I'll tell you about the reasons why I recommend this particular browser later). The page you opened is divided into two parts:







  1. Speech generation - try entering a phrase in the selected language and hitting PLAY.
  2. – START, .


, .







? , , -.









Speech API , ? , , — .







, , , :







  • -


, , .









, , Google Chrome. , Chrome , API. , .













, ( , ) , Web Speech API . Firefox, Edge Safari, , , — .









, , , ?

, Web Speech API , , . , API, — , .







Pocketsphinx Tensorflow. , PWA (Progressive Web Application) — , .







. API . =)







API. , .







— , -. , Web Speech API, .

.







:

Web Speech API








All Articles