Please review Weirfires redesign

Just curious Josh,

Why do you think people should use CSS instead of Tables? I think I know what the answer will be, but would like to hear it from you.

 

http://www.hotdesign.com/seybold/

 

No offence web spy but the layout of that css site isn't exactly the greatest.

Does using a css only layout not slow the page load speed down? Just curious.

 

If anything it will speed it up. Losing tables will clean up the code and remove a lot of tags. Having the CSS in separate file will mean it only gets downloaded on the first page view and views on other pages will just use the cached version.

 

That certainly sounds interesting.

I've tried using css to layout all the code before but I kept making a mess of the layout. Are there any css graphical editors that you can use to do this kind of thing?

 

I started my site on css layout / headers and got pissed off with it pretty quickly, so went table mad

CSS Layout though actually will quicken up the load speed AND is more spider friendly IMO - less crap for the spiders and bots to contend with. What do I know though my site was initially designed in FP which I have spent the last three months clearing the crap code.. and Im still not finished!

 

lol Darren.

I pretty much just use notepad basically for the pure convenience that it opens up in less than a second. I'm still thinking about getting an editor for PHP so that my code is automatically displayed nicely but haven't had time to research all the freebies out there.

I'll definitely be looking at ways of coding the pages with css from now on.

 

Well, mainly because tables never where meant for design. They where created for displaying tabular data, such as spreadsheets. But withen the last few years.. people have been using them more and more as design elements. And while they do work, they aren't being used properly. Sort of like using a kitchen knife as a pocket knife, it gets the job done, but it could have been done more effecently.

Also, CSS is better in that it seperates the design from the content. Some old browsers fail to display some table sites, and thus they are unreadable. But with CSS, normally, if the CSS can't be rendered, it just falls back to a plain-text page with no design, thus still being readable.

Also, if you have a complex design, you can have one css file that can be cached, or you can have a bunch of complex tables that are repeated for each page. So CSS can save bandwidth and load times when you are repetivly using the same elements.

I also find CSS easier to code than HTML. I really like CSS's layout, HTML formatting gets messy, tag inside of tag inside of tag, just layers of crap. With CSS its really easy to apply classes that have multiple declirations, but with just one small bit of code (<span class="whatever">text</span> vs <font="Verdana" size="10"><b><u>text</u></b></font>)

There is probably more reasons, but those are the main ones that sold me on CSS

Josh

 

Do you have any basic template sites structured with CSS that I could have a look at Josh?

 

But Josh...

You use tables in your site and not just to display spreadsheets...

While I agree that tables will become a thing of the past, about 8,000,000,000 pages on Google are built with tables. Many of those sites are extremely well done. People do need to learn other methods of display, but at the same time, tables are fine. Bandwidth today is uber cheap, the majority of people have switched to high speed and as far as seperating content etc... who really cares? As long as 90% of people are using IE 5.0 or higher or FF, then they will see the page display just fine.

 

I know, I'm a bad boy


Mainly because I'm lazy and didn't want to take the time to re-write it with CSS.

Weirfire, here is a really simple half-done design that I'm working on for my church: http://www.lifelessgeek.com/ (area51 domain ) Its far from done.. but its a basic example of a two column site with a nav on top type thing Really simple code too.

I still have Dialup, there is no DSL or Cable provider that services this area Its not a majority, its close, but there still are a majority of Dialup users (last I checked)

Who cares? Have you ever tried to make a minor site-wide color change (if you're not using a CMS) withen 1,000 or so files? Do you think it would be easier to change one CSS file, or to edit 1,000 HTML files.


Josh

 

Don't get me wrong Josh, I use css for colours etc... but I still use table td and tr for layout... it works fine... I want to change a colour, I go into my stylesheet, I want to change a layout... well, you know the rest..

 

Nice work,

Some display issues in IE... I am sure you will have the hack necessary for the css to make it work

PS: The issue shows up on your error page...

 

Yeah.. I know, IE doesn't support the min-height: css thingy, which sucks. The problem is that the content is so short it doesn't come down to the end of the page, and IE is too stupid to know what to do I can fix it though, just add a margin-bottom or something.

I was using the color as an example, but layout changes too I could change all the images and widths and height and such in that design from the one css file

Josh

 

Josh buddy,

You could also use a table

 

Thanks for your helpful advice

/me does it his own way

Josh

Edit: There, fixed it.. works fine in SuckIE and Firefox

 

Weirfire, the site doesn't look so bad, but can be improved. I think your idea is to keep it simple, and I agree. Here are my comments in no particular order.

1. Header- I would spice it up, make it real flashy so it really shows of an arty, stylin' graphic design. You can use the same idea you have, but change the text font and put some more blurred out bg images and maybe another gradient over it.

2. Top nav bar- The mouseover stuff is ok. I'd make the cell borders change color, but just 1 or 2px width, so it's a more sublime change. Don't have the text go bold, because that also resizes the inside cell, which I don't like. Maybe have it change color only, from say, off-white to white, so it "brightens up"

3. Main text- The laptop looks jammed in there between the top and bottom red boxes. I would also add some more text. Maybe a short paragraph (2-3 sentences) with a title for each product/service you have. This could take up almost all the above -the-fold space and the bottom example could be scrolled into view. I would also spatter 2 or 3 whitened-photos into the text (maybe a laptop, person and flower) Laptop=techie, you know what you're doing; person=you're human and can empathize with the client, flower= You're a tender caring person who also has design sensibilities. Ok, maybe that's going over the top.

4. Recently done sites- Maybe you can do something to make the red not so harsh. Or maybe it's ok, just make the border narrower. Pump up the font size for the text "recent websites completed" and put a &nbsp; between it and the left border.

5. Contact info- Don't hide your contact info from your client. You can have it on its own page, but have it on the front page as well, maybe even in the header image. I'd put phone number and email up there real prominent.

Those are just my comments on the index page- havn't looked at any others.