Jan 7 2009

www.Hccua.org layout upgrades

www.HCCUA.org and iCan Benefit are the websites for my company, The iCan Group, that I have developed and will continue to improve, redesign and maintain. Today HCCUA got a new layout for the plans they offer and the way in which they are displayed. Using some javascript to manipulate some CSS we have hidden divs that considerably minimize the amount of information on the screen at any given time. Only the information relevant to what the user is looking at is displayed now. If you would like to see it in action visit Medical Plans and pick your state. The blue links on the left reveal more information when clicked on. The pricing tabs in the far right box uses the same process but adds some visual manipulation as well. I am still learning javascript but after using it for this I can see the power in it. It was an interesting process taking what our artist mocked up and turning it into a working css layout. There were some hiccups along the way but it wasn’t too terrible besides the cross browser issues which I still have not nailed down 100%. As I learn more I will try to do what I can to make it look right in all browsers.


Nov 7 2008

Brushing up on the basics

This week was a step back towards the standard of the internet, working in HTML and CSS. I am in the process of laying out our sites in tableless style. Tables have their places but when it comes to overall site layout they can be a bit cumbersome. If I havent made changes in a while, it takes a little while to envision what the rows and columns are doing. With divs it much clearer to me and the code of the site looks better. The basics of my CSS style are: use a wrapper div, and a div for each division you need. The wrapper div sets the overall width, padding and margin. For the divs inside in the wrapper div use float to get the desired effects you want. Using the css property “margin:0 auto;” on the wrapper div will give it an auto centering page layout. I am learning more of the design elements but designing the artwork for the page itself still eludes me. I am much more at home with the code. I have had a few challenges mainly involving cross browser issues but I have been able to tweak each until they both are acceptable. The only “hack” im using is a matching columns script to make to div identical heights. The is a lot of power in css, much more so than tables offered. Tables are good if I am using a database to display information, tables are easier to deal with, and loop than the divs I have tried. Once the browsers get a little more compatible in the ways the interpret the css code I can see it really being a powerful and easy way to design/layout a site in no time.