Measure visible screen resolution

Question

Consider this scenario - I'm developing web applications for use on a tv, they will ALWAYS be in full screen. As you may or may not know, each TV has a different 'safe area', because most cut off a certain amount on one or both sides. I'd like to use a web page that displays some sort of visual ruler so that I could easily see a tv's 'visible' screen, to find this 'safe area'. Does a web page like this exist somewhere yet?

If not, what would be an easy way (I'm guessing javascript) to draw an on screen ruler that could be used to find the 'safe area'?

Answer 1

TV safe areas are approx 5% margin from the edge of the screen on new monitors.

When I do projects with this kind of resolution involved I simply add a generic 5% margin on the main container.

Not all monitors have the same safe area... but 5% is enough for all moderns one.

---

Edit:

Look at this as well: http://dev.opera.com/articles/view/creating-web-content-for-tv/#safe-areas

it say exactly what I wrote previously.