+

... in attesa che ti rispondano gli esperti, lo STAFF da lunedì, ... da qualche anno uso EDGE  e nel suo menu esiste la selezione "Leggi ad alta voce", oppure azionando direttamente la scorciatoia da tastiera Ctrl+Maisc+U...
... comunque penso che quelli che hanno di queste necessità sappiano già da tempo come fare...
.
ciao
.

Grazie, tuttavia vorrei inserire la possibilità di ascoltare l'articolo direttamente nella pagina dell'articolo, appena sotto il titolo ad esempio. Vedo che altri siti stanno inserendo questo strumento.

Metti questo codice in oggetto html. Se ti funziona aggiungi e sostituisci il testo all'interno dell'oggetto html con quello tuo. In ogni caso già i browser sono predisposti a questo. Diversamente se vuoi leggere un determinato articolo della tua pagina bisogna procedere con approcci più complessi.  

<!-- Lettura vocale articolo -->
<div id="articolo">
<h2>Titolo dell’articolo</h2>
<p>Questo è un esempio di contenuto testuale che verrà letto ad alta voce dal browser grazie alla sintesi vocale integrata. </p>
</div>

<button onclick="leggiArticolo()" style="margin-top:10px; padding:8px 16px; font-size:16px;">
Ascolta l'articolo
</button>

<script>
function leggiArticolo() {
const testo = document.getElementById("articolo").innerText;
const sintesi = new SpeechSynthesisUtterance(testo);
sintesi.lang = "it-IT"; // Lingua italiana
sintesi.rate = 1; // Velocità normale
sintesi.pitch = 1; // Altezza voce normale
speechSynthesis.cancel(); // Ferma eventuali letture precedenti
speechSynthesis.speak(sintesi);
}
</script>

Rimanendo sul semplice puoi inserire il testo del tuo articolo nell'oggetto html. Se cambi l'originale devi cambiarlo anche sul codice. Quindi rimani con una lettura semplice senza bisogno di api strane. Certo la sintesi vocale fa un po pena.

Ecco il codice che nasconde il tuo articolo nel codice e ne simula la lettura di quello tuo che si trova sulla pagina.

<!-- Lettura vocale articolo invisibile -->
<div id="articolo" style="position:absolute; left:-9999px; width:0; height:0; overflow:hidden;">
<h2>Titolo dell’articolo</h2>
<p>Questo è un esempio di contenuto testuale invisibile che verrà letto ad alta voce, mentre l’utente guarda l’articolo reale visibile nel sito.</p>
</div>

<button onclick="leggiArticolo()" style="margin-top:10px; padding:8px 16px; font-size:16px;">
Ascolta l'articolo
</button>

<script>
function leggiArticolo() {
const testo = document.getElementById("articolo").innerText;
const sintesi = new SpeechSynthesisUtterance(testo);
sintesi.lang = "it-IT";
sintesi.rate = 1;
sintesi.pitch = 1;
speechSynthesis.cancel();
speechSynthesis.speak(sintesi);
}
</script>

Ovviamente puoi giocare con il codice per un pulsante più moderno. 

Grazie davvero Roberto della tua risposta, ho aggiunto una foto dove c'è un esempio di quello che sto cercando. Non sono un grande esperto di inserimento codici html, esattamente nel programma website come si procede per inserirlo? Posso semplicemente fare un copia ed incolla del codice che hai scritto? 

buongiorno Massimiliano. Ti guido nella maniera più semplice possibile. Ammettiamo che tu hai un testo al cui interno ci sono delle spiegazioni. Metto un esempio di testo per farti capire: QUESTO E' IL MIO TESTO REALE SULLA PAGINA DEL MIO SITO. Deduco che il testo sia in un oggetto testo ma a prescindere di dove sia a te quello che interessa è tutto il contenuto che hai.

Sotto l'oggetto che contiene realmente e visivamente il tuo testo metti un OGGETTO HTML

Ora Fai doppio click sull'oggetto html che hai appena messo sotto il tuo reale testo e su CODICE fai un copia e incolla di questo listato:▼

<!-- Lettura vocale articolo invisibile -->
<div id="articolo" style="position:absolute; left:-9999px; width:0; height:0; overflow:hidden;">
<h2>Titolo dell’articolo</h2>
<p>QUESTO E' IL MIO TESTO REALE SULLA PAGINA DEL MIO SITO</p>
</div>

<button onclick="leggiArticolo()" style="margin-top:10px; padding:8px 16px; font-size:16px;">
Ascolta l'articolo
</button>

<script>
function leggiArticolo() {
const testo = document.getElementById("articolo").innerText;
const sintesi = new SpeechSynthesisUtterance(testo);
sintesi.lang = "it-IT";
sintesi.rate = 1;
sintesi.pitch = 1;
speechSynthesis.cancel();
speechSynthesis.speak(sintesi);
}
</script>

Oa salva il tutto. Prova in anteprima e vedrai che funziona. Ripeto.... la sintesi vocale non è il massimo ma comunque legge il testo del tuo articolo.

Come potrai notare nel codice è riportato in neretto il testo che realmente è sulla tua pagina web. E' semplicissimo, alla portata di tutti. In parole più semplici sostituisci il testo in neretto del codice con quello del tuo reale articolo.

Grazie Robertoi, gentilissimo!