What is the best way to create this page?

[mellonboyles]

Hello.

I have just discovered this site and find it a great help!
Although I have been doing things the wrong way round (fell into the trap of using Dreamweaver with no knowledge of code), I do know the basics now.

My question is one relating to how I set up a particular style of webpage.

So to cut a long story short….

I am newbie & plunged into creating my first website using all AP elements, only to find out that this is not a good way because of the nature of the AP’s.
After many headaches I decided to do my research a little bit more.

I still have to create another website that I guess should really be built in flash (as suggested by someone). But as I dont know Flash this is not an option. (please see attached design concept).

The only elements I really need at this point would be for the "get a quote" & "about", "contact" bubbles to have rollover states that change colour when the mouse goes over them.

I have been trying to find the best way of doing this without AP elements.

1) Create a Div container with the main image for the background, then insert a table and try to insert the rollover images that way. But after research, I am finding that I should be steering away from tables and moving towards CSS. Which then led me to Idea no 2.

2) Create a Div container with the main image for the background, then insert Div’s and adjust the margins (relative positioning?) to move to the Divs in correct places I need the rollovers. But again I read that this method should only be done for tweaking a web page and not structuring a webpage as may cause problems.

3) Create a Div container with the main image for the background, then insert Div’s in a grid like system (see attached image of my guides where I would place Div’s), But this seems a over complicated way to do it and you end up with divs that have no use & lots of unwanted code.

OR am I right in thinking this works?

4) Apply a relative positioned Div, set background image, then place AP div’s inside RP Div that I would use for my rollovers? If I did this would this then avoid the problem of the AP divs moving in different browsers?

Or have I got this all completely wrong and have to go back to the drawing board again?

Your thoughts would be appreciated :-)

Many thanks in advance

Louisa

[Author]

Posts