About this site
This is a demo site that shows how we can use server side together with responsive web design techniques to optimize the experience. The site uses three techniques:
- Responsive images - A device with a small screen will get a smaller image, a device with a larger screen gets larger images.
- Ads - Smaller ads are displayed on smaller screen, larger ads are displayed on larger screens. Look at the Google adsense ad at the top of the site.
- Conditional Content Inclusion - The Twitter and Facebook social widgets are not included for small screens. Try to load the site in a small browser window versus on a large browser window.
Try to resize the window and reload the site at different sizes to see how it all works!
Device detection
| Capability | Value |
|---|---|
| Is mobile? | Nope |
| Device | generic web browser |
| Viewport width | 600 |
| Resolution width | 800 |
| Pointing method | mouse |
Feature detection
| Capability | Value |
|---|---|
| Screen width | px |
| Touch screen | |
| CSS animations |
RESS capabilities
| Capability | Value |
|---|---|
| Width | 1440 |
| ImageVersion | 770 |