Responsive what?

A responsive web site changes how it looks, depending on the device you are using.

Currently, basic web sites are all viewable on all devices. A site created 5 years ago is visible and looks the same on all devices, regards of how small the screen might be.

On smart phones the type tends to be too small to read, and mouse-styled navigation hard to manage. The viewer must zoom and slide around the site, to see one page.

The newest web technology (that I used on this web site) is called "responsive"... meaning the site parts change as the device gets smaller. Nothing is lost, but all parts change proportion, to fit the device.

Here is a breakdown looking at my site as an example, which may help clarify.

  • On a wide monitor, there is a purple color background on both sides, and the menu is on a black strip on the left. When the mouse goes over the menu, the menu "lights up" with a rollover.
  • On a tablet, the purple background disappears, the black strip moves to the top of the page, and the menu moves to the top-right of the page in a single dropdown. Since there is not a mouse, we don't need the rollover, but a simple dropdown (which is better for fingers).
  • On a smartphone, the logo and the dropdown navigation are now centered, and lower page elements change size and positioning, too.

You can see this happen, if you are on a computer.

    • Have the browser screen nice and big on your COMPUTER. You will see colored background on sides of the web page.
    • Slowly make the browser screen smaller. When it gets small enough, the left black bar moves to the top of the page, with all the parts it contains, re-arranged and re-configured. This is the TABLET view.
    • Keep making the browser screen smaller. All-of-a-sudden, the elements shift, and this new long narrow configuration is what works best on a SMARTPHONE.

Some businesses need to build (and maintain) two totally separate web sites, one for computers, and one for mobile devices. The "responsive site" solution gives you three versions, and you only have to maintain ONE source for the web site.

Feel free to ask me if this solution is good for you, or for a demonstration.

🙂