My first CSS attempt

[Furr]

well this is it

http://sherrardcorp.co.uk/lemon/

and its taken me two days to work out how to do that!
Body image is a repeating 2 px wide image, with a div tag encompassing all of the data and then each subsequent section in its own div tag. The text is in side layers. I gave up on trying how to get the main image centered and then the text in specific locations because everytime i resized the browser it went wrong.

I don't think i would use CSS for a application intensive site, well not untill im happy using it.

Now i just need to work out how to do the content

Do i need different pages or can i have it so that when links are clicked they replace one tag with another that has been
hidden?

//edit yes i ripped off the arrows from Ribic.. not so much ripped but a hommage, because i like them so much. If i could think something up more original i'll implement that im sure.

 

[Dommers]

Really like your site mate. Good motto as well. Good luck with it!

 

[Maljonic]

I agree, it looks nice. As for needing pages, I guess it's up to you and what you want to do with it. You can get a lot on one page with tabs and z index layer swapping but the page will tend to get quite large in file size, which makes it take longer to load but does look pretty cool once it has.

You could have a few tabs and layers with basic info with links to extended info on other pages?

 

[Furr]

I'll fiddle with it, see what i come up with, might just end up with several different pages since its not going to be a massive subsite, and would prefer to keep the file size small. No point in using a database since im not going to be needing to hold lots of data. So thats the option that seems most sensible.

Have been reading up on how to get it w3c compliant is going to be a massive headache as embedding flash is always a problem.. pitty

//edit, just noticed that in firefox the a:hover and related tags aren't working but they do in Ie?? will fix it in the morning.

 

[Moo]

page not found

 

[Furr]

oh i've moved it to a sub domain

http://lemonpeel.sherrardcorp.co.uk

 

[Shovel]

Not bad at all. You've got a lot of tag nesting, but that's normal when you first move from tables to CSS.

A couple of quick things:
1) You *can* include flash in pages and still validate. A List Apart has it covered, as usual. It's worth noting that the article goes further than you need (when it starts going on about streaming), for your little bubbles I expect that streaming will be unecessary.

2) You're using pixels for width measurements. This is ok-ish, especially while you're learning. However, bump up the text size and watch as your navigation overlaps other content. What you need to do (not necessarily with this site) is to try and use em units for widths, since that will dynamically resize with the text. That takes a bit of careful planning though, so don't worry about it just yet, keep playing the way you are and you'll be alright.

3) Don't use a transitional DOCTYPE - stick to either XHTML 1.0 Strict or HTML 4.01 Strict.

 

[wyrd_fish]

don't use jpegs for simple vector-esk graphics

png will see you right

 

[pingu]

but not everyone can view a png?

 

[JingleBells]

but not everyone can view a png?

You mean alpha transparency in png I think, Internet Explorer AFAIK will display pngs properly, so should any browser tbh.

 

[Shovel]

You mean alpha transparency in png I think, Internet Explorer AFAIK will display pngs properly, so should any browser tbh.

Correct. If you just use it for lossless, opaque images PNG is the best bet. JPG is only really preferable if you've got something very large and need to save on bandwidth.

 

[Furr]

Cheers,

Will change the jpeg to PNG, and get have a fiddle with the flash, Im now using the tutorial guides on W3C to expand my knowledge, Its all quite fun to be honest (apart from when it doesn't work :S)

 

[fatbusinessman]

Correct. If you just use it for lossless, opaque images PNG is the best bet. JPG is only really preferable if you've got something very large and need to save on bandwidth.

Not necessarily true: the relative compression rates of JPEG and PNG depend very much on the characteristics of the image. Given a photograph (or other image with few sharp contrasts and a lot of smooth gradations) JPEG will do a fantastic job of compressing it while a PNG will be absolutely hooge. If you've got an image without much gradation and a lot of sharp contrasts (anything from a Mondrian to a block of text) then PNG will give you a comparable filesize for a lossless compression to JPEG's filesize for slightly lossy compression.

 

[Dommers]

Just a little feedback but the arrow at the top should maybe change for each page, the one saying "This is who we are"