I am designing a website and for the home page I have created boxes in Fireworks for each little section. They are small 400 x 300 px, 300 x 300 px and smaller for example. Since I would like for my site to load as fast as possible, and would like for my site to be SEO-friendly, should I refrain from using the images and just try to create the boxes myself using CSS? The boxes (gifs) are set as the background for each div then I type text on top. Is that bad for SEO? I'm a newbie at this and want to make sure I am building my site the right way. I've been reading tons and tons of books but so many questions keep popping up and then I keep questioning myself as I design the site. The reason I have created the boxes in Fireworks is because I wanted them to have a certain texture and look which goes along with my site. But if it is a bad thing to use images as the background then I will try to recreate them in CSS. I'm not sure how but I can look that up. Thanks.
The short answer is "not necessarily." I'd have to see an example to say anything concrete. But others may have a different opinion. My concern would be more for style and ease of use, and avoiding looking like a site designed in 1999.
If the images are just for visual enhancement then they should be backgrounds applied via css - they have no place in the html. Depending on the content, single box images may present a problem when the user resizes text though.
Thanks for your replies. So I was creating div containers with CSS and using the boxes as the background. If the user increases the text size on the screen, the text could be outside the box then? What if I place the text in a separate div container inside the div container box? Would the text still be all over the screen? If I set it in pixels vs. ems would that matter? I feel so clueless.
If you have a div set to a particular size, and text within does not fit (either by too much text, or the user resizing the text) then the text will overflow out the bottom of the div. If this could be a possibility with your design, then the boxes can be made fluid in height by not specifying a height and using top and bottom (or repeating) background images.
Centauri, thank you so much for your help. Now this totally affects how I will do my page. I am going to have to rethink how I do my layout. Just when I fix one problem another one arises. Argh!
Bookmarks