Voice Automated Web Application

Download Full-Text PDF Cite this Publication

Text Only Version

Voice Automated Web Application


Computer Science and Engineering Mangalmay Institute of

Engineering and Technology Greater Noida, India

Suchi Sharma Computer Science and Engineering Mangalmay Institute of Engineering

and Technology Greater Noida, India

Esha Bhardwaj Computer Science and Engineering Mangalmay Institute of Engineering

and Technology

Abstract Automation in voice- controlled systems have changed the way of interaction of human with computer and other systems. Speech recognition systems allow user to interact with the computer and make hands-free requests with the help of natural language processing. User make hands- free request to computer and computer process the request of the user and respond accordingly. After so many researches and development in the field of machine learning and speech recognition, we are able to interact with voice controlled or voice automated systems and devices.

A voice automated web application will be more helpful for the human. This type of web application can be of great interest for the people, as its hands-free feature will grabs user interest towards it. It can be more useful for the visually disabled people as it can be controlled and operated by ones voice. Thus, voice controlled web application be very advantageous to control and operate the functionalities of web application.

Keywords- Speech Recognition Systems, Voice Recognition Systems, Speech-to-Text, Text-to-Speech, Word Error Rate, Recognition Rate, IBM Watson, Google API, Amazon Alexa.


    Automation of websites using voice commands require many technologies for its implementation. Voice automation is based on NLP (natural language processing). We integrate voice recognition system in our websites to understand the voice commands and respond accordingly to perform the functionality that we want to be executed over our websites. Today, after so many researches and development in the voicerecognition websites are not voice automated. Only a very few websites are available that are using voice automation for websites, if available they are not implemented at its strength. It needs to be implemented over websites to support a wide range of functionality. It can be used to voice based control over all functionality that we do with the help of mouse and keyboard.

    Its implementation can be done using many technologies for creating the websites. It require a functionality that listen to the voice commands and act in response to that particular commands. For this we are using annyang.js (a javascript library) that allow user to control the site with voice commands. This library is based on natural language processing. This library is used to navigate through the site. We can used HTML5s speech recognition functionality to fill form forms in websites, this changes the traditional way of filling the form with typing.

    We can easily fill forms and submit them, this automated the website as we can control and use website as hands free. In our website we are going to use these Annyang.js and HTML5s speech recognition system to create voice automated website.


    The UI (User Interface) is developed using the HTML5 (hypertext markup language) and CSS3 (cascading style sheets). HTML5 is the core technology that is used for the development of webpage. It is used to design the components of the webpage and to design the structure of the website. It is used to create webpage comprising if text, image, audio and video components. It is used to link various webpage together using hyperlinks. HTML5 is used to create login or sign up form or any other type of forms in our webpage. It can also be used to create the graphics in webpage.

    CSS3 is the language for enhancing the user interaction of the webpage. It play very important role for creating a interactive website. It enhances the user experience over the website, by creating transition and animation over websites. It represents the components of html is interactive way. It is used for creating enhanced and eye-catching webpage. Both HTML5 and CSS3 are very core and important technologies that are used for creating websites. They are considered as the building blocks of any webpage or website.


    The core part of this voice automated web application is controlling of website using voice commands. For implementing this we use Annyang.js (a javascript library) that is based on natural language processing that takes voice as input convert it to text and further use this converted text as a command to execute the functionalities over website.

    This javascript library is used to convert voice input to text. As the above syntax show that the speech or voice is converted into text and this text is used The above syntax is the implementation of annyang.js. After the loading of the webpage annyang.js is also loaded. An object is created containing the key and value pair. The key contains the voice commands and the value contains the function, the function contain the code or functionality that will be executed in response to the voice command of the key. Then annyang.js is started, if the voice commands given by user matches with any of the voice commands in the key of the object then the corresponding function will get executed otherwise nothing will happen. The else part of the code will be executed if there are some error in the code.


    if (annyang) {

    var commands = {

    'hello': function() { alert('Hello world!'); }

    }; annyang.addCommands(commands); annyang.start();



    for writing function corresponding to that voice commands. This function will be to control and navigate over the website.


    HTML5s speech recognition can be used to fill login, signup or any other form without typing. We can fill the forms hands-free with just our voice. This reduces our effort of filling forms.

    This will help user to fill up forms in an interactive way without the effort of using the traditional way of typing and filling the form. It is the feature of the HTML5 that is used to do so. This feature works in almost all browsers either it is phone or pc.


    Voice automation of web application changes the traditional way using websites. It enhances the website with the speech recognition that enhances the user interaction and reduces the human efforts with the implementation of speech recognition. We can control and navigate the website using the voice commands, we can fill the html forms and other forms over the website just by voice commands and it reduces the efforts of typing using the traditional way of typing and filling the forms. This advance feature in website allow user to interact with the website in very interactive way.


  1. W3C, Introduction to web accessibility. Retrieved from https://www.w3.org/TR/2018/REC- WCAG21-20180605/

  2. IBM's speech recognition breakthrough matters for AI and IoT. Retrieved from https://www.techrepublic.com/articl e/why-ibms- speech- recognitionbreakthrough-matters-for- ai-and-iot/

  3. Sundin (Jan 28, 2018). Using voice to control a website with Google Home, part 1/3. Retrieved from https://www.mendeley.com/guides/ web-citation-guide/

  4. Agarwal (Feb 19, 2016). How to Add Speech Recognition to your Website. Retrieved from https://www.labnol.org/software/ad d-speeh-recognition-to- website/19989/

Leave a Reply

Your email address will not be published. Required fields are marked *