One of the greatest aspects of designing web pages, is that all of the information that you need is available for free. I was asked to do a site that would help a distributor list his products on a password-secured form. Well-Worth New England recently acquired a customer with multiple branches and they requested to have an online ordering form. Because the basket of products offered to them may be different than the basket offered to another customer, a protected page was necessary. Now, I had never done forms or password protected pages before, but with good research and a solid HTML base, it's a fun task to lean new tricks.

Now, without the password, you won't be able to view the form, but I'll let you in on a few of the tricks I found. First, as you can see I put a box with rounded corners around some items. To create this with strict HTML and images would not only be time intensive on my end, but also lengthen the page loading time. There are several ways to go about simplifying this process, many utilizing one small corner image and some CSS. In a place where most code can be taken, it's great to see code being organized and offered.

Another trick I employed was to allow each item box (containing the image and ordering information) to flow like text. Much the same as when you scale a window and the text then reflows down the page, the images on the page would reflow based on the width of the current window. This was done using the "float" attribute, also in CSS.

Of course, I won't give away the password protection method, but I'm sure you can see by now that it's simply a matter of filtering a Google search and testing the code. Granted, the details usually end up being time-consuming and tricky, but do-able nonetheless.