Voice implementation via XHTML+Voice

If you have a browser supporting the voice feature you can create a spoken webpage. Voice browser is a webbrowser that can generate voice output and interpret voice input. The only one voice browser in the world is Opera.

I'm writing this article in english because I need to show you a sample of a spoken webpage. Opera doesn't support slovak language well yet. Therefore, if you try to write something in slovak Opera will be gabbling. To see (and hear) how the spoken webpage works follow this link.

Spoken webpage that starts speaking after loading:

<!DOCTYPE html PUBLIC '-//W3C/DTD XHTML+Voice 1.2/EN' 'http://www.voicexml.org/specs/multimodal/x+v/12/dtd/xhtml+voice12.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:ev='http://www.w3.org/2001/xml-events'>
<head>
  <form xmlns='http://www.w3.org/2001/vxml' id='welcome'>
    <block>
      Welcome to my site!
    </block>
  </form>
</head>
<body ev:event='load' ev:handler='#welcome'>
<h1>Welcome to my site!</h1>
</body>
</html>

Spoken webpage that starts speaking after clicking the button:

<!DOCTYPE html PUBLIC '-//W3C/DTD XHTML+Voice 1.2/EN' 'http://www.voicexml.org/specs/multimodal/x+v/12/dtd/xhtml+voice12.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:ev='http://www.w3.org/2001/xml-events'>
<head>
  <style type='text/css'>
  * {
    margin:0;
    padding:0;
  }
  ul {
    list-style-type:none;
  }
  ul li {
    cursor:pointer;
    float:left;
    display:block;
    padding:0.5em 1em 0.5em 1em;
    border:0.25em solid #ffffcc;
    text-align:center;
    font-weight:bold;
    color:#ffffff;
    background:#003366;
  }
  ul li:hover {
    border:0.25em solid #003366;
    color:#003366;
    background:#ffffcc;
  }
  </style>
  <form xmlns='http://www.w3.org/2001/vxml' id='txt1'>
    <block>
      This is a 1st button.
    </block>
  </form>
  <form xmlns='http://www.w3.org/2001/vxml' id='txt2'>
    <block>
      This is a 2nd button.
    </block>
  </form>
</head>
<body>
<ul>
  <li ev:event='click' ev:handler='#txt1'>Part 1</li>
  <li ev:event='click' ev:handler='#txt2'>Part 2</li>
</ul>
</body>
</html>

From now on you can hear every article on PaBi3.com in it's spoken version. Just click the Voice button button placed between the article and comments.