Responsive web design

A website should be able to handle view screens of all types and sizes (desktop, tablet, mobile phone).
A responsive web design (where the display is rendered differently based on the screen size) is Google's recommended design method.

The HTML/CSS generated by the UniversalLeagueManager can be viewed standalone, or embedded in an iframe as part of a larger website. When viewed standalone on a mobile phone, the HTML is much more responsive.

Click one of the following links to open a demo league directly (rather than embedded in an iframe):

Demo 1
Demo 2
Demo 3
Demo 4
Demo 5
Demo 6
Demo 7
Demo 8
Demo 9
Demo 10
Demo 11
Demo 12
Demo 13
Demo 14
Demo 15
Demo 16

When one of the above demos is tested by Googlebot the result is "mobile-friendly".

However, when the pages are embedded in an iframe (for example, when forming a subsection of a larger site) the result from Googlebot is "Not mobile-friendly". Embedding in an iframe typically results in the following problems that make viewing on a mobile device awful:

Text too small to read
Links too close together
viewport not set
Content wider than screen

This means the direct links (opening in a new page) shown above are much better for viewing using mobile devices.

Previous page: Demo leagues
Next page: Website testing