Responsive Sites

One of the top buzz words in web design today is “responsive.”  A responsive web site is one that re-sizes itself for the smaller screens of a smart phone and tablet.  A tablet held in the landscape or horizontal position is almost as wide as a desktop screen so tablets are less of an issue than are smart phones such as an IPhone.  The theme I am using, superheros, is a responsive site.  Here is what it looks like on my IMac.

Webpage from WordPress site that is approximately 1600 pixels wide and represents what the site would look like on an IMac.

Webpage from WordPress site that is about 1600 pixels wide and represents what the site would look like on an IMac.

This image is almost 1600 pixels wide on the IMac.  Next it is at 1000 pixels wide.  Notice that the sidebar has disappeared.  It is now at the bottom of the page and not visible in this screen shot.  The menu on the right in the header is starting to collapse.

Webpage from WordPress site that is approximately 1000 pixels wide and represents what the site would look like on a tablet such as the IPad.

Webpage from WordPress site that is about 1000 pixels wide and represents what the site would look like on a tablet such as the IPad.

Here is the site at 500 pixels wide, roughly the screen size of a smart phone.

Webpage from WordPress site that is approximately 500 pixels wide and represents what the site would look like on a smart phone such as the IPhone.

Webpage from WordPress site that is about 500 pixels wide and represents what the site would look like on a smart phone such as the IPhone.

Notice that the menus have disappeared and will appear when you click the Menu button.  The column of information narrows but is very readable.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s