A Normal person without any physical disablity can understand our website by the various sections in which it is divided ,for eg.-how to wear mask properly, sop's, download page for both ios and android users. Now deaf and blind person can also understand any website. A blind person can understand our website by the text to speech convertor which we have incorporated using javascript. A deaf person can understand by text and image combination of the website which
makes it more engaging to read.
As there is less seriousness regarding sop's as everyone sees it but tries to ignore it but ,in our website he/she can easily click on speak button and calmly just listen all the text instead of reading it. As reading some great length of text takes a lot of time and feels boring but when someone reads instead of you then it just saves time and more understandable.
This globe consists of thousands of languages therefore, we have provided user a option of selecting language from the region where he belongs to across the globe in a dropdown menu just beside speech button.
While embedding the text to speech model in our project we face many difficulties and bugs we came across one of the major problem , that is linking the javascript speak functionality with all the written part that we want to read out by assistant in our COVID ADVISORY website. It was a very difficult task for us. We had done several research for it by google searching on websites like- stackoverflow, w3school and many other websites .We had invested a lot of time in that, in which we firstly created a input field in which we were placing all the text present inside a particular section and then using respective javascript code it renders. Then it reads all the innerHTML text inside a section and then using our css we set the input field display to none inside styles.css file so that the frontend still looks good and user gets completely unaware whether this kind of implementation is going on.
After that we made the call of the function advisory by giving argument of the IDs of the sections that we want to read it out. We had also provided several different accents of languages in which we want to read it out.
So to implement to read the website itself was a very challenging task, also , making a good frontend design in a limited time frame was a big challenge itself.
As the UI needed to be interactive and easy to use and understand for every user.
Technologies used
Discussion