Pausing in a screen reader for accessibility
accessibility, css, html, screen-readers
Solution
If you format your code semantically, it should work fine. By the looks of your HTML structure, you're using a `<br>` tag for presentational purposes. This is not what line breaks are meant for, and thus is not a semantic use of markup.
You specifically want each line to be separate, so you should put them in wrapping block level tags. You could wrap each line in a `p` or `div` tag, and then the screen reader will separate them properly.
Problem
I have been using the Mac OSX's built in screen-reader for testing my site, I know it's not the best but it's all I have for now. But I'm finding it isn't pausing at the end of elements... which makes sense; but I'm finding myself placing hidden periods to make things readable: ``` <div class="breakdown"> <strong>35</strong> New<span class="visuallyhidden">.</span><br> <strong>4</strong> Overdue<span class="visuallyhidden">.</span> </div> ``` I feel really dirty doing this, but if I dont then either it ruins the design, or it is read in a continuous sentence which is not comprehensible. Does anyone have an experience of this kind of thing to offer?