BarsnStripes.com Redux

Each new website I've developed allows me the opportunity to use all of the new skills I've acquired on previous sites. And so it is with barsnstripes.com redux. The old site was getting a little stodgy and I wanted to increase the sales conversion rate for the site so barsnstripes.com has been reborn.

I have also gotten over my reluctance to use iframes (IE style inline or floating frames) because as far as I can determine, all of the major browsers now support them. So the new barsnstripes.com website features an iframe in which I present all of the various site pages.

I have also made extensive use of div popup panels. I have found that div panels offer a convenient method of presenting more data than would normally fit on the screen without cluttering up a page or necessitating the user to scoll down a very long page.

In essence, here's how div popup panels work. Think of a div panel as a mini-web page that is hidden until the user passes the mouse pointer over a hyperlink. Then the panel appears as if by magic. I stack many div panels on top of one another in a small part of the screen. Its like having a stack of papers. I have a bulleted list of links referring to each panel in the stack. As the user passes the mouse pointer over each link, the corresponding div panel appears as if it has been shuffled to the top of the stack. By using div panels, I can put a large quantity of information in a small space and its still neatly organized.

Div panels work especially well with FAQ's and glossaries.

From a developer's standpoint, div popup panels are easy to implement. I use a small javascipt which hides and displays the panels. But its also possible to do it with stylesheet code. In fact, I use the stylesheet method for the main menu on many of my websites. Its so much easier than rollerover images using javascript.

A div panel is simply a block of html that starts with <DIV>

and ends with </DIV>. The div tag has attributes that specify visibility, width, height, and x and y screen coordinates for location. The hyperlink that pops up the div panel uses the onmouseover event to run a small bit of javascript that changes the div tag attributes.

If you have comments or suggestions about this site, I'd love to hear them. Please send them to mike@smallbizdepot.com