Webサイトで動作する読上げ機能(Web Speech API)について検証しました。最近のブラウザではブラウザに実装されているSpeechSynthesisインタフェースを利用することでテキスト読上げを行うことできます。
音源（OSで提供される音源、オンラインで提供される音源等）により実現できることは異なるようです。また、提供される音源も使用機器(PC、スマホ)/ブラウザ種別により異なります。従って、統一的なインタフェースを提供するには、機能をある程度限定することなると思われます。一方で、ブラウザや機器/OSを限定することができれば（例えばPC/Choromeの場合）、音源によっては読み上げ位置を取得(onboundary)できるため、今どこを読上げているかハイライトする等の機能を実装できます。実際には使用するブラウザを限定できないことが多いですが、限定できる場合にはより豊かな読上げ環境が実現できるかもしれません。
- 検証環境
Chorme/Firefox/Edge/Safari
MacOS/Windows
iOS/AndroidOS