# Trip is in denial? CSS vs HTML



## uoba (Oct 15, 2003)

Er... no contest really. 

Although sometimes the pain is hard to bear whilst initially learning CSS, the benefits are huge.

Some points:

-- You will have to learn XHTML whether you like it or not (otherwise you'll be doing the equivalent to using HTML3 against v4!) HTML will be eventually a second class citizen.
-- Learning XHTML is soooo easy. 
-- By learning XHTML and CSS you'll learn to structure your code correctly, making it sometimes 25% of the code you would normally use in HTML, and ...
-- elevate the pain of table code.

Anyone else?


----------



## dlloyd (Oct 15, 2003)

Oh yes, and it will make you stop using Dreamweaver 
I do all my design by handcoding now, with CSS and XHTML. Man, that stuff rocks. I am making my site to the Strict doctype. 
It is sooooo much better than Dreamweaver's glop.


----------



## mr. k (Oct 15, 2003)

dlloyd knows his stuff!
here is a quick rundown - xhtml is = html 4 but all tags need to be closed and lowercase (<br />, not <br> and <p>.....</p>).
Do not use any attributes on elements except for id, class, title, href, rel, alt (yes there are more but this will keep you in the blue).  Don't use tag's like <i> or <b>, use <em> or <strong> and give them a style.
And css is ez!  <link rel="stylesheet" type="text/css" href="./example/style.css"> links your document to a style sheet, and the sheet is a selector { attribute: value; }.
There are more tutorials on css all over the internet you couldn't ever read them all, just go read a few and you will be fine!  Also for the official css standards, go to The W3


----------



## The Memory Hole (Oct 15, 2003)

Here are some very good online tutorials to CSS and pretty much any other type of web code:
http://www.w3schools.com/

All the tutorials and what-not are in the left hand side of the page.


----------



## quiksan (Oct 15, 2003)

i'll weigh in on this subject.  

I LOVE using CSS.  Still haven't crossed over to the xhtml stuff primarily (I work in jsp and java more often for work), but play a little.

check these great sites out though:
www.devshed.com - for the css n00b.  VERY insightful and easy to pickup tutorials.  they get you going on the basics REALLY fast.

www.csszengarden.com - very awesome project.  take the contents of one page, and basically only alter the css document.  look at all the different results you can get by just changing the css!!!  shows just how powerful css can be.


----------



## Sogni (Oct 16, 2003)

Uh, guys... what you said so far in this thread - DreamWeaver MX 2004 does...

And I haven't yet bothered to learn XHTML (not bored enough yet! lol) but I DO use CSS now. With DreamWeaver of course.


----------



## uoba (Oct 16, 2003)

Don't get me started on MX 2004, it may work, but it's dog slow! Plus, it's only catching with what can be very quickly done by hand (and since I've been doing 80% of my code by hand recently, I realised that I work faster than using the new CSS options in MX 2004).


----------



## toast (Oct 16, 2003)

> _Originally posted by Sogni _
> *Uh, guys... what you said so far in this thread - DreamWeaver MX 2004 does... *


 Yes but:

- the code is heavier = more bandwidth = $$$ (do you imagine what this forum would spare in terms of badndwidth if built with CSS ?)
- the code won't validate = browsers understand it in Quirk mode = longer to load (same remark about this forum)
- DWMX costs $$$, professionals know this, pirates don't (not accusing you, obviously)

Less evident reasons:
- you are not learning anything with DWMX, while you are with BBEdit
- how to improve your code if you don't know what it's like ?

I can only weigh on the topic by saying that XHTML and more especially CSS are the future. Those standards make code lighter, faster, accessible, easier to read, cross-platform and this is a non-exhaustive list. Everyone concerned by webdesign knows this. Now, some people know this and stick with tables and obsolete coding anyway. Why ?

- Neither time or will to learn
- No $$$ to buy new programs
- No will to upgrade existing stuff

Of course, I don't consider those reasons as valid myself (reason 2 is the most ambiguous). But still, I can uunderstand those people.

The Web designing community moves slowly. Same for the DTP industry: some people have switched to InDesign, some stick with Quark. They know it's stupid, but either they cannot move, either they don't want to. I'm this last type of guy, I'm a Quark reactionary although I'm a progressist CSS guy on the Web. Schizoid ! 

*Post summary*
Trip, move your bum and learn CSS/XHTML


----------



## toast (Oct 16, 2003)

www.zeldman.com
www.alistapart.com
www.stopdesign.com
www.diveintomark.org
www.glish.com
www.bluerobot.com
www.thenoodleincident.com
...

Look bottom right of my website's front page: www.phnk.com for more.


----------



## cfleck (Oct 16, 2003)

what is the benefit of xhtml vs html?


----------



## Sogni (Oct 16, 2003)

I use code and design view in DW so I'm always aware of what the code is doing - and a lot of the time I'm coding in code-view while I can see the results instantly in design-view (of course not the same as a browser, but close enough without saving all the time).

I also like the fact that DW tells me if I've done a mistake in my code and spell-checks. Plus it tells me about options for a specific tag without the need of a tag dictionary. 

I do not have DW2004 only for a demo I used that is now expired - and while using it I noticed all those new tags, XHTML compatibility, etc.

I will be purchasing Macromedia Studio XM 2004 once I have the money. 

Pirating Software is not something I care about on my Mac. I run my business on my Mac and all the design programs I use are 100% legit. Altho I'll admit to borrowing software from others to try out since I'm not sure if it's something I care about before dropping any money on - like GoLive - nope, don't care about it, good thing I didn't drop any money on it! Actually, that's the only borrowed software I have now that I think of it! heh


----------



## Arden (Oct 17, 2003)

Okay, I'm sure Trip plans to learn XHTML/CSS at some point, but he's just too lazy to do it now... stop badgering him about it.

Sogni, try this.  Design two similar sites, one with DW and one by hand.  Make them somewhat fancy using (X)HTML and CSS, but not necessarily anything really flashy.  Then see which technique you like better, and which produces code you like better.

cf25:  XHTML is the future of HTML.  It provides for stricter control over your code, making tags all lowercase, closing all tags, using style sheets to control formatting instead of tables & tags, etc.  Read more at www.w3.org.


----------



## uoba (Oct 17, 2003)

> _Originally posted by arden _
> *Okay, I'm sure Trip plans to learn XHTML/CSS at some point, but he's just too lazy to do it now... stop badgering him about it.*



He ask us to!    ...

http://www.macosx.com/forums/showthread.php?s=&threadid=37123&perpage=15&pagenumber=2


----------



## Arden (Oct 17, 2003)

I'm pretty sure he was joking... besides, you didn't need to talk about Trip in the title.


----------



## toast (Oct 17, 2003)

"what is the benefit of xhtml vs html?"

Increased semantical coherence. All tags close. Read about that on www.w3.org . Anyway, both resemble each other very much.


----------



## cfleck (Oct 17, 2003)

to me it seems like xhtml is just "complete" html.  are there any added features?  off to the web!


----------



## mr. k (Oct 18, 2003)

basically xhtml is just writing clean html 4 code.  There are a few new elements, and some elements didn't make it from html4 to xhtml1, but the biggest difference is that you need to close all elements, and to close an <img> element, you need to do <img />.  Simple!


----------



## uoba (Oct 18, 2003)

Another factor of XHTML is, it's a big plan to get rid of proprietary (IE-NS-specific) browser code as well. Which is a truly good thing!


----------



## Trip (Oct 18, 2003)

Basically you guys are saying that doing something manually by hand instead of in GoLive (or dreamweaver...which I don't have) is easier, and I just can't understand how that can be! Please enlighten me with specifics.


----------



## Trip (Oct 18, 2003)

Another quick question: can I just design what I need to in GoLive, then take it into TextEdit clean up the code with *some* XHTML code and then change the file type to .xhtml? Will that please some people? Or do I have to go the extra 50 miles and do it all in text edit?


----------



## tree (Oct 18, 2003)

Why do you doublepost? I am always trying to say here that this can polluting the forum for you and the readers.
Regardless from this, more important is that I had a website in the past with a keyboard with a computerdictionary if you clicked the keys. It was easier to make it working nice in dreamweaver.


----------



## uoba (Oct 18, 2003)

Trip, I totally understand your concerns. I wouldn't go near the code up until 4 months ago. Now, I am seriously considering doing everything in BBEdit.

There is no problem with using DW/GL. I still use DWMX. But, the more sophisticated your CSS gets (and the things you can do in CSS are fantastic), the worse it looks in DW/GL's View mode.

Not sure about GoLive, but DWMX and MX2004 have XHTML code built in. Just make sure in preferences that New Document is set to XHTML Compliance, and that Validator is set to XHTML (Transitional). I'm sure GoLive has similar prefs.

As for the file extension, you don't have to change anything, it's still .html.

As has been pointed out, XHTML, at it's simplest, makes all tags lowercase, and makes sure all tags are closed. For example:

<p>Text</p>
<img src="image.gif" />

... instead of:

<P>Text
<IMG SRC="image.gif">


----------



## uoba (Oct 18, 2003)

If you want to test any of your pages for XHTML Transitional compliance, enter your URL into this page:

http://validator.w3.org:8001/

You'll have to make sure you have the right DOCTYPE though. It will tell you what's wrong with the code. Neat!


----------



## Trip (Oct 18, 2003)

I can't afford BBEdit (WAY too expensive!) so I got this neat little editor called WebDesign. I'll look into editing with XHTML in GoLive right now.

In reality: I really don't want to do all the coding by hand. Is that a bad thing to feel? 

[EDIT (for the sake of tree): What am I suppost to do?!?! Tables don't work in XHTML! So how do I get my content to neatly go where I need it to?!]


----------



## cfleck (Oct 18, 2003)

there are no tables in xhtml?  now i'm curious.  do tell!


----------



## Sogni (Oct 18, 2003)

you don't use xhtml as a file extension...
Like I said - DWMX2004 does all of this. Especially for those who don't want to work in straight text.

BTW - I have and sometimes do code in PICO (Mac 'n Linux) or Notepad (Windows) when I don't have access to DW, and in DW I always have code view open and use it all the time. 
Is HomeSite still made as a standalone site? Or did it disappear as it was merged into DreamWeaver?

So maybe DW has more code or does it a little different that others here would prefer - but it works! It should please everyone involved when used with the Code View open (or exclusively in code view).

Donno about GoLive Trip, I didn't like it as a web design tool so I haven't spent much time in it. But I do belive it has a code view too that you can clean up within.


----------



## Sogni (Oct 18, 2003)

Trip:
Hey! that looks like a grate program! Reminds me of DW in Code View! 
Downloading it now! Since I can't afford DWMX2004 atm, this looks like a great alternative until I can! 
Thanks!


----------



## Trip (Oct 18, 2003)

np sogni.
I CAN use tables from GoLive in my XHTML sites, but when I try to validate the site it gives me tons of errors because of the table.

C'mon guys, are tables really THAT bad?


----------



## dlloyd (Oct 18, 2003)

You can still used tables OK in XHTML, but CSS has replaced them . I tried Web Design, it sucks, IMHO. My favorite is skEdit (http://www.skti.org/skHTMLdesc.asp)


----------



## Sogni (Oct 18, 2003)

Tables validate...
http://sergio.nzdigital.com/Untitled-1.php
http://validator.w3.org/check?uri=http://sergio.nzdigital.com/Untitled-1.php

I still don't get what the big Dlio is. 

Oh, and that was using the original DWMX (not the 2004 version).


----------



## uoba (Oct 18, 2003)

Yep, as dlloyd states, tables can happily exist within XHTML, there a just a few fundamental things you need to tighten up/look out for...

There are many depreciated attributes within the <table>, <tr>, and <td> tags, that are depreciated within XHTML. If you've validated your page, then the errors shown are normally quite thorough, so you can pick out where the problem is.

I'll be launching our new site (hopefully tonight!). It's validated as XHTML Transitional but I had to use tables (pretty complicated element that CSS just cannot cover, but saying this, tables wouldn't have either, a healthy mix!)

Show us some of the validation errors if you like?

By the way dlloyd, thank for the skti link, was using TacoEdit, but downloaded this and it's great.


----------



## Sogni (Oct 18, 2003)

DANGIT!!! You are driving me nuts! LOL 

I decided to see validate a website I'm doing for a client - and mind you I had already broken it up (PHP require includes - a template if you will). And it's nitpiking my code! Damnit! LOL 

Looks like I'll be redoing it to XHTML specs.

BTW, if one is not to use tables, what is the alternative? Layers? I haven't done those manually at all - and the way DW does it makes my skin crawl (reminds me of Front Page source code).


----------



## Trip (Oct 18, 2003)

I setup GoLive tables (are they called something different?) and I get errors like "xgrid cannot be identified" or something like that.


----------



## uoba (Oct 18, 2003)

You can use tables Sogni. In XHTML, they are deemed as acceptable. However, in XHTML proper (Strict), they are only allowed for their original purpose, tabled data.

The simple rule is, use tables if needs be, but just do not use any table tag attributes in the code. Style them with CSS.

Thus:


```
<table bgcolor="#999999" border="0" width="300px" height="300px">
```

would be something like:


```
<table id="aTable">
```

with the corresponding CSS in an external CSS file:


```
table#aTable {
          background-color: #999;
          width: 300px;
          height: 300px;
          border: none;
}
```

Alternatively it could be 
	
	



```
table.aTable
```
 which would make it a class (you'd have to 'class' the table HTML rather than 'id' it as I have) and you can use it on any table you like in your pages. Or, if this is the only style your tables will have, just make it the universal table style in CSS with:


```
table    {
```
SAME CSS CODE AS ABOVE

```
}
```


----------



## Sogni (Oct 18, 2003)

*bangs head against brick wall*
Boy, I'm getting a headache! heh 

I was going to ask why this

```
Line 10, column 38:  there is no attribute "bgcolor"  (explain...). 
  <table width="700" border="1" bgcolor="#FFFFFF">
```

Does not validate - but I guess you answered that question...
Man, so EVERYTHING needs to be defined in CSS??? (formatting I mean) Wow! What a pain in the but! 

What about alignment like Center Alignment? 


```
Line 36, column 35:  there is no attribute "align"  (explain...). 
            <td width="84%"><p align="center"><img src="_images/eliminateexpensive
                                     ^
```


----------



## Sogni (Oct 18, 2003)

Err wrong alignment code... hmmm now I can't find it in that page. Anway it does not like 

```
<div align="center"> something here </div>
```


----------



## Sogni (Oct 18, 2003)

> _Originally posted by Trip _
> *I setup GoLive tables (are they called something different?) and I get errors like "xgrid cannot be identified" or something like that. *



I don't think that's normal table code Trip, I haven't seen that reference (xgrid) myself.


----------



## dlloyd (Oct 18, 2003)

You CAN'T center align with CSS  I really hate that


----------



## mr. k (Oct 18, 2003)

You can dlloyd - but I don't think that text-align: center; is in the specifications, but it sure works...  left and right work too.
And sogni - yes - you need to do *everything* that has to do with layout in your css.  the html is supposed to be very minimal, just what you want to be on the screen - not how it should look on the screen.


----------



## Sogni (Oct 18, 2003)

> _Originally posted by dlloyd _
> *You CAN'T center align with CSS  I really hate that *



Oh no, PLEASE don't tell me that!

BTW, anyone recomend a good (possibly even free or very low cost) CSS editor with a WYSIWYG view? I hate making CSS documents "in the dark".


----------



## Sogni (Oct 18, 2003)

> _Originally posted by mr. K _
> *
> And sogni - yes - you need to do *everything* that has to do with layout in your css.  the html is supposed to be very minimal, just what you want to be on the screen - not how it should look on the screen. *



Yeah, I realize this... and I know CSS - I've just been very lazy as far as CSS goes. 

Also, see my previous message about a CSS editor.


----------



## uoba (Oct 18, 2003)

You can to a degree, such as in the body, but I agree it's pretty limiting at present.


----------



## uoba (Oct 18, 2003)

Okay, I've posted a simple table example, maybe too simple, but it helps:

http://c-o2.net/tableEx/index.html

The first page doesn't validate (only for one reason, but if you multiply this one reason by the amount of time someone uses tables in their layout, then you can understand).

The second page does validate, and so does the CSS. If you look at the two page's code, you'll notice the code for the CSS version is smaller. Again, magnify this with the size of a normal layout and you begin to realise how much code you can begin to cut out, making everything faster, and more manageable.

NOTE:
By the way, the center CSS is happily working away in the <td>.


----------



## Darkshadow (Oct 18, 2003)

Hmm...anyone have w3c's validator saying that pages are served as either text/xml, application/xml, or application/xhtml+xml?  Any I've ever checked out always say it's being served as text/html - which isn't a bad thing, if your browser knows xhtml it'll still parse it as xhtml.

I was more or less just curious if anyone has seen any servers actually serving documents as _only_ xhtml rather than html.

If you're wondering what I'm talking about, check out the Extended Validator.


----------



## Sogni (Oct 18, 2003)

YAY!


> This Page Is Valid XHTML 1.0 Transitional!



That was just one page of the site I'm working on. Man XHTML is enough to drive someone nuts! heh 

I'm sure my code is not great, but no complaints from the w3 xhtml validator!


----------



## dlloyd (Oct 18, 2003)

Hydra?
This is planned for a future version of skEdit, BTW.

mr K.: you can use text-align left & right, they are in the specification. You can also use text-align center, and it goes through the validator alright. It just sucks that you can't do align: center & left & right.
The thing is you have to look at it differently. You can't just align an element to the center of the window, you have to align it to the center of whatever the parent element is. 
You _can_ align to the center of the window by aligning to the center of the <body> tag.

-EDIT- 
All these things have already been answered....


----------



## Sogni (Oct 18, 2003)

Uh, so how do I center a table?

dlloyd,
I can't seem to center via the body tag, how is this done?


----------



## mr. k (Oct 18, 2003)

Darkshadow - most web servers send anything with the .html extension as text/html, and that isn't how xhtml strict should be sent.  To fix it ( I don't bother, Maybe if I actually published something to the web I would) just change the file extension to .xhtml or do some php magic or use apache to change the content-type http header.  It can be done, and probably should be to assure the best rendering.


----------



## uoba (Oct 18, 2003)

Sogni

This is the sticking point. You can centre textual elements via the CSS style, but it will not work with tables.

Here's a great link to centre your tables with CSS!:
http://www.granneman.com/webdev/coding/css/centerta/index

The bottom example (Method 3)  is probably the best. Actually, Method 1 works great as well for fixed-width tables.  Method 1, as the site states won't work in IE5.5+. And we're all testing on Safari I guess  So, Method 3 it is then.

I've tested these on the previous example I posted in this thread. It's left with Method 1.


----------



## Darkshadow (Oct 19, 2003)

> _Originally posted by mr. K _
> *Darkshadow - most web servers send anything with the .html extension as text/html, and that isn't how xhtml strict should be sent.  To fix it ( I don't bother, Maybe if I actually published something to the web I would) just change the file extension to .xhtml or do some php magic or use apache to change the content-type http header.  It can be done, and probably should be to assure the best rendering. *



Um...yeah, I realize you can do this with your own server, but I was talking about _other_ servers.

So, has anyone seen any *other* servers serve pages up as xhtml rather than html?


----------



## uoba (Oct 19, 2003)

I haven't!


----------



## Arden (Oct 19, 2003)

Argh, I have so much to say about this but so little time/desire to organize my thoughts on this topic!  More from me later, when it's not a couple hours from sunrise...


----------



## uoba (Oct 19, 2003)

It's nice to see such a debate/discussion happening. Something I wish would happen more in this web tech part of macosx.com. 

There doesn't seem to be as many web-developer-designers around here these days. So, nice to see us all talking.


----------



## mr. k (Oct 19, 2003)

Darkshadow - there also is a php way that will sniff the browser and send moz/opera/safari the application/xhtml+xml content header and any lower browsers text/html, check it at anne vankesteren's site.  It actually sniffs for the http_accept header, and if that is xhtml+xml, then you get the real thing, otherwise text/html.
I thought I said that...


----------



## Darkshadow (Oct 19, 2003)

Yes, I do understand that.  But a php script _won't_ work for a site you're just visiting.  It'll only work if you have access to the site, and can put that script there...have it be accessed...etc, etc.  That's what I meant by saying that you can do it on your own server.

Mine was just a general question...maybe I just phrased it badly.

So...here, I'll try saying it this way.  For any site that you surf to that you see is XHTML, and you're curious and validate it just to see if it validates, have you seen any that properly send it as text/xml, application/xml, or application/xhtml+xml rather than just plain text/html?

I actually haven't (well...ok, other than various ones at W3C, anyway ).

And like I said, it doesn't really hurt it any, most XHTML-aware browsers will parse the page as XHTML rather than plain HTML even if the content type was sent as text/html.

I'm just mainly curious to know how many XHTML pages out there are actually being served as XHTML.


----------



## Sogni (Oct 19, 2003)




----------



## mr. k (Oct 19, 2003)

Yeah, my mistake I misinterpreted your question.  I don't know how you force your browser to parse a site and display it as xhtml+xml, but I'm sure there's some kind of hack you can find somewhere to do it.  And yeah, it really doesn't make that big a difference how you send your pages, just make sure that they are well formed and no biggie.


----------



## toast (Oct 20, 2003)

> _Originally posted by Sogni _
> *Uh, so how do I center a table?*



margin: 0 20%; and you're done !
Stop thinking in non semantic terms. Don't look for a center command but simply think of a 20% margin on both sides...

CSS is just about thinking the Web another way. Check the 'semantics' link in my sig.


----------



## Arden (Oct 20, 2003)

The W3C has a page of the DTD declarations you can use in HTML at http://www.w3.org/QA/2002/04/valid-dtd-list.html.  Try XHTML 1.1, it may return as XHTML+XML.


----------



## Trip (Oct 20, 2003)

Honestly I don't want to do this. Something inside me says I should. But I don't want to. I need to start making money NOW, and the only way I can see doing that is by putting stuff together through GoLive._ Meh, why am I still talking when I can't even draw?!_

Thoughts?


----------



## Sogni (Oct 21, 2003)

Trip, I'd say do what you must and learn when you can... 

As long as what you do works on most/all browsers. 

XHTML 'n CSS is not urgent you learn NOW. I've been told XHTML still has some bugs they're working out... so I donno. I've started converting over a site to XHTML when I heard that so now I'm on the fence on this - right smack dab in the middle of working on that site. 

Altho CSS would compliment whatever you're doing (altho not sure if go-live supports it directly).


----------



## Arden (Oct 21, 2003)

> _Originally posted by Trip _
> *Honestly I don't want to do this. Something inside me says I should. But I don't want to. I need to start making money NOW, and the only way I can see doing that is by putting stuff together through GoLive. Meh, why am I still talking when I can't even draw?!
> 
> Thoughts? *


 Yes, get a SHIT JOB with a REAL PAYCHECK that you can deposit into a REAL BANK ACCOUNT!  Believe me, you'll hate your job in no time flat, but you'll really love having money to spend on stuff you need, or even stuff you want.  And I don't mean apply to design firms and the like; you can still do this, but also apply to the grocery stores, the fast food joints, the department stores, the bookstores, _everywhere_ and pray that they'll look at you and see something they like.


----------



## toast (Oct 22, 2003)

> _Originally posted by Trip _
> *Honestly I don't want to do this. Something inside me says I should. (...) Thoughts? *



You gonna have to do it anyway, now or later. The earlier the better, that's my own point of view. The more you wait the more the technology gets distant from what you know of HTML, the more you wait and stay in your tables, the more you get obsolete and less competitive.

You are not going to attract customers with obsolete coding. Argument number 1 is : you cost bandwidth, we webstandardized people cost less. You cost heavy code editing, we standardized people cost less.

From www.simplebits.com :



> I design and build with web standard and valid code to produce pages that will look great on modern browsers yet still functional and useable on older ones. Utilizing web standards leads to real results:
> 
> Decreased bandwidth and server space
> Improved accessibility to all browsers and devices (including those with disabilities)
> ...



"I need to make money now" is not a valid argument. Read this to understand why: http://www.happycog.com/lectures/dwws/

Note: you wouldn't be here if you were so short on time to learn things, Trip, don't you think so ? Come on, CSS basics are easy, and XHTML is plain sailing !

Another perfect rant is in my signature, it's called Semantics by Mark Pilgrim.


----------



## Arden (Oct 22, 2003)

You're more likely to put off clients with bloated design than make a quick buck.  So you should definitely try to streamline your coding and keep as up-to-date as possible.


----------



## mdnky (Oct 26, 2003)

Everything I'm coding from now own is XHTML 1 Trans or Strict and CSS whenever possible.

I use MX on my Mac, and MX2004 on the Wintel Laptop I am stuck with from work. MX2004 is much better at correctly displaying the CSS layout now. I handcode everything in code view, but a quick look in design view is a nice feature, as with being able to just change text on the fly by looking where I want to do it, instead of scrolling through the code, or just the FTP feature and file management built-in. That's why I use Dreamweaver. I may change to GoLiveCS, as I was really impressed with it at the Design Seminar, but the more I've used MX 2004 the more they seem just on par with each other, esp. since I handcode.

As far as better, it's a personal opinion. Pages I code in this method look the same, regardless if I use Dreamweaver, BBEdit, or a simple text editor. Another point, while the standards practice is a good idea, it's not a fix-all yet. The usability is still not at a level that is acceptable in the business world. Hopefully this will change, cause it's really close. But HTML4 is still here for awhile.


Trip, it's a simple thing, just takes some getting used to.  Another good souce is ALA (A list apart) or the foremost authority, Eric Meyers.  He has some really good books on CSS.  www.meyerweb.com


----------



## toast (Oct 26, 2003)

My web page about this topic
http://www.phnk.com/publishing.html


----------



## uoba (Oct 27, 2003)

Toast, your site brightened up my day... thnx!

Love those alternate styles!


----------



## Arden (Oct 27, 2003)

Do you know of any good sites that have shapes for Photoshop?  I use those more often than brushes.


----------



## toast (Oct 28, 2003)

Look for Adobe Exchange, arden;
Uoba > Thank you ! Nice to have feedback. I like the alternate styles very much, Misprinted Type (Eduardo Recife) is an awesome designer. www.misprintedtype.com


----------



## Cat (Oct 28, 2003)

Getting back to Tables vs. (X)HTML & CSS: Check out this fantastic presentation.  
There's a lot of useful info in it.


----------



## Trip (Nov 9, 2003)

I feel like crap after reading this.

I really want to shoot myself now. I know there is no hope for me now. I really want to go into the creative/design field in the future, but I know now I won't make it. Maybe photography is the thing for me. Maybe I'm just destined to die.

I really am not sure of what I was sure of a month ago.


----------



## Trip (Nov 9, 2003)

Is ANYTHING possible using XHTML and CSS? In other words can I do whatever I could in HTML and then some?


----------



## Darkshadow (Nov 9, 2003)

Quit being down on yourself, Trip.

Remember, you need to think happy thoughts to fly. 

(That's from Peter Pan, for anyone who doesn't get it. )


----------



## Darkshadow (Nov 9, 2003)

XHTML is, for all intents and purposes, HTML 4 moved into an XML compatible form.  So anything you could do with HTML, you can do with XHTML.  Same format and all.


----------



## Trip (Nov 9, 2003)

I've got some big questions here. And I need some BIG help. If anybody has some time on their hands to mess around and help me out please contact me either through PM here or on AIM/iChat: TannerSite

Hey guys, guess what! After 5 pages of discussion and hundreds of links I'm actually looking into XHTML styling! We'll see how it goes from here, I guess.


----------



## mr. k (Nov 9, 2003)

haha we got to ya!  it worked!  maybe we should change the title to something like 'xhtml css discussion' now...


----------



## Trip (Nov 9, 2003)

No, keep it what it is. I like it. 
Plus I still have some good points to argue! Just not tonight...too...tired.

Wow. It's only 8:30 and I'm already wasted.


----------



## toast (Nov 10, 2003)

http://www.phnk.com/publishing.html
Check Dave Raggett's page and enjoy a fast, simple switch from your old-style way of designing (one year ago I worked only in GoLive) to a new one.


----------



## RacerX (Nov 10, 2003)

I don't know about you guys, but I won't make any pages that I can't guarantee that most systems can display. I can remember having to redesign a page that displayed wrong on one client's brother's computer. Another time I remember having to sit in a room as one of my clients showed one of his clients our site on that client's system (Windows 98, IE 4.x) and worrying that the next click would lead to a page that didn't work (actually they all worked, but I hadn't check for that type of system exactly).

Being able to eat and pay rent and bills seems more important then being current. Most people are behind the curve technology wise, and they aren't going to pay for what they can't see and show to others.

Still, nice to see where we are going and what tools I'll be able to use when my clients finally get up to speed. By that point you guys 'll most likely be on to something else I'm sure  , telling us how out of date CSS and the like are.


----------



## uoba (Nov 10, 2003)

We're here for ya good buddy  10-4 Rubber ducky... over. (What was that film!?)


----------



## toast (Nov 10, 2003)

CSS/XHTML being standards, they should not get outdated or obsolete at any time. Plus, standards increase compatibility on all systems/browsers.

Join us


----------



## mdnky (Nov 10, 2003)

Not only that, but it creating a page to be cross browser/platform is possible, with some small compromises.  Just takes some time to learn the tricks.

Win98 and IE4 are antique systems.  While I agree on the keeping accessibility there, sometimes choices have to be made.  They may see the page, but it'll be the same format people who use a PDA or Lynx browser see, plain old standard HTML.  

Of the 25 sites I'm involved with in some manner, I have only seen a version 4 of IE showup on 5, and that was less than 0.25% of the totals.  Lynx was higher.  NN4 showed on 1 at 3%, but that site is very basic so it doesn't matter.


----------



## toast (Nov 10, 2003)

"Win98 and IE4 are antique systems."

No. IE4 is antique because nobody uses it anymore. Which is not the case of Win98.


----------



## RacerX (Nov 10, 2003)

mdnky said:
			
		

> While I agree on the keeping accessibility there, sometimes choices have to be made.



Like I said, the people paying me make the choices. The HTML coding I do works with every browser from Netscape/IE 4.x up. Everyone sees pretty much the same content and layout on all systems.

You maybe right when you said: _"Win98 and IE4 are antique systems."_ But I'm not stupid enough to tell my client's client that in a meeting to try to sell that person on something. My clients ask for as full a range of compatibility as I can deliver. Right now, HTML, PDF 1.2 (1.1 if I can get away with it) and QuickTime 3 cover all my bases. Flash 4 can be used if I make sure that it is not required for presentation of content. Some clients aren't as picky (they have newer systems so as long as they can see my work on their systems they are happy.

There is no way that I would ever tell one of my clients they are _wrong_ in wanting what is easy enough for me to deliver. And I surely wouldn't damage their standing with one of their clients by critiquing the age and functionality of their client's system.

Luckily for me HTML is a standard, and like toast said _"being standards, they should not get outdated or obsolete at any time."_


----------



## Trip (Nov 10, 2003)

Yes but I just created a website the other day, and usually all of my websites work under any browser for any OS. But there were some flaws in the HTML (<spacer> tags) and suprisingly the website would ONLY load under Safari in OS X. I've NEVER had that happen before.

With HTML you never know. Some sites may work and some may not. With CSS and XHTML it will work no matter what (though you may need some work arounds for some things).

-BTW since I'm new to this I'm not positive about this. So if somebody with more knowledge can speak up I'd be greatful.


----------



## mr. k (Nov 10, 2003)

Basically yeah trip - since version 4 browsers the support for xhtml and css has been fairly good, and anything that is goofy (internet explorer...) there is almost always an alternate way to get the same result.


----------



## RacerX (Nov 10, 2003)

Yes, but I, with 20 plus computers in my home, can test my site on a number of different platforms and with different browsers. While developing a site I test and alter pages using the current version of OmniWeb (I have used OmniWeb for years, and I like it... haven't had any problems that I can think of with it). As a base line standard to make sure my sites works with pretty much all the browsers I need to cover, I use OmniWeb 3.0.

Toast posted some sites which are good examples of these new techniques. But lets look at the first three of these in OmniWeb 3.0 (remember, all my sites look exactly the same in OmniWeb 3.0 (other than fonts) as they do on just about any browser today):



			
				toast said:
			
		

> www.zeldman.com
> www.alistapart.com
> www.stopdesign.com


...


----------



## uoba (Nov 11, 2003)

They work exactly as the authors intended methinks. Zeldman particularly states that earlier browsers, whilst he will cater for them, will only allow the presentation to be displayed correctly... perhaps not graphically great, but at least functionally correct with no errors (akin to a text browser).

This is all you could ask for. To design for v4 of browsers is now obselete... (like asking Apple to make sure FCP to work in Mac OS7 or something!)

And this is the point of standards, even if the browser, whether it be a handheld, TV, public access point etc. it ensures that the designer/developer can at the most basic, present the content correctly and logically.


----------



## Arden (Nov 11, 2003)

Methinks OmniWeb 3.0 doesn't like CSS too much.

Trip, you got a sample of that XHTML/CSS (or, maybe, X/C) code you were working on?  We could probably help you figure out what you were doing wrong.


----------



## toast (Nov 11, 2003)

RacerX: you're cheating !  Using an ancient browser nobody uses. I'm sure the nicest of your websites won't work properly in Internet Explorer 3 or Netscape Navigator 2


----------



## RacerX (Nov 11, 2003)

uoba said:
			
		

> They work exactly as the authors intended methinks. Zeldman particularly states that earlier browsers, whilst he will cater for them, will only allow the presentation to be displayed correctly... perhaps not graphically great, but at least functionally correct with no errors (akin to a text browser).
> 
> This is all you could ask for. To design for v4 of browsers is now obselete... (like asking Apple to make sure FCP to work in Mac OS7 or something!)
> 
> And this is the point of standards, even if the browser, whether it be a handheld, TV, public access point etc. it ensures that the designer/developer can at the most basic, present the content correctly and logically.



Funny, with no additional effort on my part I can support todays browsers and those of the past without any problems. 

You see, in the world out side of elitist circles, everyone is a potential customer. In that environment you don't have the luxury of turning away anyone. Those who are still using obsolete technology are potential customers. There money spends the same if they are using an old PC with an old browser just the same is someone with the newest G5 running Safari. 

As a Mac user, I am very much aware of discrimination against those who aren't using what the majority are using. The point of standards is to insure that everyone is included. The moment you need excuses like _now obselete_ and _antique systems_ to dismiss any portion of the internet population, all you've really done is start discriminating against those that aren't up to your elitist levels of browsing the internet. Real people don't always keep up with technology. And just because you want to make HTML a _second class citizen_ I don't want to make those how are only able to view HTML second class citizens.

HTML is a standard. At this point in time it is the *only* _all inclusive_ standard on the internet.

More importantly, HTML guarantees that I get paid. That I can pay my bills. That my wife and I can eat. That I don't lose clients. 

If I put up a site that rendered the way those did when my clients were expecting to see what they paid for, I would lose those clients (after they asked for their money back).

The guarantee I can give at this point is that if someone has a computer bought within the last five years and has changed *nothing* about it from it's default configuration, my pages should render as expected on whatever the default browser for those systems is.

Five years from now, I maybe saying the same thing about CSS, XHTML or XML. Maybe I'll only work in Flash or QuickTime.

As of today, CSS is no where near inclusive enough for what I do. CSS is nice, but until it gets closer to being an _all inclusive_ standard on the internet I'll stick with what I'm guaranteed works for my clients that ask for that level of compatibility.


----------



## RacerX (Nov 11, 2003)

toast said:
			
		

> RacerX: you're cheating !  Using an ancient browser nobody uses. I'm sure the nicest of your websites won't work properly in Internet Explorer 3 or Netscape Navigator 2



OmniWeb 3.0 was released in 1999. That is not cheating.  Originally I have a Mac set up with Navigator 4.0.4 and IE 4.0 and a Windows 98 VPC environment with Communicator 4.5 and IE 4.x for testing my sites. After a while I realized that OmniWeb 3.0 caught all the same problems that all that extra stuff did, so OmniWeb 3.0 became my base line for testing compatibility.



It isn't like OmniWeb 3.1 was all that much better (ca 2000).

(and if you think my sites look bad in IE 3 or Navigator 2, you should see them in Mosaic  )


----------



## RacerX (Nov 11, 2003)

Okay, lets be a little more fair about this. I *know* at least 8 people right now who are using Netscape Communicator 4.7x as their default browser (including paying clients).

Here are those same three pages in Communicator 4.79:


----------



## JohnnyV (Nov 11, 2003)

We should all use frames!! Go Frames!! They work on anything!

ThinkTwisted.com <= the last good frames site


----------



## uoba (Nov 11, 2003)

Where to cast off from RacerX... I am in no different a situation to you... my business has produced sites which both cater for all browsers within a client's spec... and exclusively for one browser within a client's spec.

The question is, who are you designing for? Your client? Or your client's clients? It's the latter which should take priority (unless it's an intranet sort of site!) And, statistics show, that most browsers are IE6, IE5+ and whatever else thereafter. Therefore, designing with XHTML and CSS fall sweetly under these majority browsers. 

Guess what... XHTML works in IE3, 4, NN4 etc. as well. XHTML is HTML. CSS handling, on the other hand, is a different ball game. But when T Berners-Lee  is calling for standardisation, and all those within W3C, you got to take notice.

You are pointing particular attention to the pioneers of standard's sites as to make a example of bad business. Again, Zeldman especially, makes no bones about excluding v4 browsers from the experience, as mentioned previously, all the info on the page is present and legible. They are kindly reminded that life moves on, and the option to upgrade is an easy one.

To expect to sit around on a v4 browser is bad business practice. There's a reason why the likes of Deloitte & Touche, KPMG, Lloyds of London all browse with IE6  Those who lock themselves in to such old version are short sighted. I've dealt with a client who refused to swap 100 workstations for logistic tracking from a v4 browser. This sort of thinking lost them big contracts, and was indicative of there business practice in general... they are begging for scraps now!

So much to say really. But the point of it all is a client, you me, needs to move with the times. If they don't, competitors will.


----------



## uoba (Nov 11, 2003)

One overlooked point raised with particular grace within Zeldman's book... with good CSS implementation (separating content from structure), you can at times reduce code down by over 50%. Put this in bandwidth terms and the client's will have your children.


----------



## RacerX (Nov 11, 2003)

uoba said:
			
		

> Put this in bandwidth terms and the client's will have your children.



Images are the major use of bandwidth with all my clients. My largest pages don't get bigger than 20 k for the HTML. Throw in a few images at 35-80 k and saving up to 10 k while excluding viewers (including some of my clients themselves) isn't going to make any positive headway for me.

One of my sites has 8 Quicktime movies of TV spots that one of my clients did. So far they haven't exceeded their 10 GB monthly limit, and I could provide a better solution by getting the full version of Sorenson then by moving to CSS.

Here is something to think about: The last data I checked had about 3% of internet users still using IE/Netscape 4.x, it also had Mac users at about 2%.

How is your exclusion of 3% of users any different from the sites out there that exclude Mac users? Aren't you doing the very same thing that we complain about? Isn't the justification on the part of sites that exclude Mac users the same as what you guys are saying about those who can't view CSS?

As I pointed out, CSS looks bad in Communicator 4.7. I was written a check for $700 last week from someone whom I know views the work I do for him in Communicator 4.7. If my sites looked like the examples I showed above when he viewed them, I would have had a hard time getting paid.

Sorry, money talks here guys! Besides, from what I can see you guys do more work then I and seem to and reach fewer people with your content. My wife won't even have my children given those terms (we couldn't afford children given those terms). 

Until my clients (and their clients) move past their current systems CSS is still just some up and coming technology.


----------



## Cat (Nov 11, 2003)

While I have not yet mastered the art at all, it seems quite simple to cater to the needs of all kinds of browsers with CSS: hiding CSS, switching CSS, alternate CSS etc. Resorting to JS is also a solution with which I am experimenting. While I have no need at all to serve clients wishes, I expect from my own site to be standards compliant: and I mean compliant with actual, current standards. My site is a mess right now (I know, I know  ), but I am still working on it because I know there are solutions to browser incompatibilities. Otherwise I would break in tears, use tables and give up. What I want to say is that it is definitely possible to design an advanced site with XHTML and CSS while remaining compatible with older browsers. In newer, standards compliant browsers it will look great, in older and less ompliant browsers it will look merely good. 
I am just an amateur and cannot remotely imagine the complexity of professional web design, but I am convinced that Racer X's requirements can be met with CSS design without disappointing his clients.


----------



## uoba (Nov 11, 2003)

They can. NN4 and IE4 do support CSS and XHTML. They can be designed for and catered for.

RacerX, we don't need to exclude Mac users, Mac users have arguably the best standards browsers around. Hence, no problem.

As for exclusion... I've never once mentioned that we do purposely exclude. The general rule is to get in writing from the client, what the cut-off browser is for compatibility. It is in the client's hands to know their market. 

I'm not personally asking of you (as if I could do anything about it anyway!  ) to stop all development until you learn the standards. Just a suggestion that little by little you can increase your knowledge of how a site was meant to be developed in the first place. Also, your argument of client needs and money talks doesn't hold with me, one day a potential client is gonna ask... and can we have this 'standards compliant?' Or, can we view this on my PDA and blah blah blah... At the very least, it's a marketing weapon you can use when things really start to take a hold. US governmental web development contracts are now obliged by law to follow standards, for a reason. This will undoubtedly filter into commercial markets over the coming months and years, thereafter dropping down into SMEs.


----------



## uoba (Nov 11, 2003)

By the way, I am having great teething problems with my own site... as most on here know. At present it'll only work on the latest browsers... my fault for lack of knowledge until recently. It's been painful. But, the fruits of my labour have filtered into recent client work, which I've found actually a hell of a lot quicker to develop now.

My new site will hopefully be up in time for xmas, and yes, will work in NN4 (there's a very simple css trick to cater for all v4 browsers without any complex javascript detection whatsoever.)


----------



## RacerX (Nov 11, 2003)

uoba said:
			
		

> The question is, who are you designing for? Your client? Or your client's clients? It's the latter which should take priority (unless it's an intranet sort of site!) And, statistics show, that most browsers are IE6, IE5+ and whatever else thereafter. Therefore, designing with XHTML and CSS fall sweetly under these majority browsers.



First, isn't it the one's who pay me who take priority?

Second, my sites look great in most browsers. What is the incentive here? I should switch from what works with 99.9% of systems in use on the internet today to something that only works with 97% (and excludes those who are paying me).

The logic in that please? 

If I was a kid living at home with my parents and going to school for this stuff, then CSS looks great. Show me a site that uses both CSS and runs great in Communicator 4.7 that didn't require twice as much time to develop as a site made in plane HTML, and I'll give this another look.

I have bills to pay. Alienating people doesn't pay bills! 

There are no worse business practices then not getting paid!

People transition at their own pace. It doesn't hurt me or any one else to be inclusive in my designs. It *does* hurt me and other people to discriminate.



> I'm not personally asking of you (as if I could do anything about it anyway!) to stop all development until you learn the standards.



When did HTML stop being a standard?



> Also, your argument of client needs and money talks doesn't hold with me, one day a potential client is gonna ask...



I'm a mathematician by training, not a designer. One day a client asked me if I could make a web site. Then someone who saw that site asked me to make theirs. Each time asking for more functionality or something I never did before. I get paid for that! I learn on the fly better then most people, and money is the *only* incentive for me doing web design at all!

You may do it for the _art_ of it, or to forge a new _standard_, I do it to get paid so one day I won't have to do it anymore. *All* I care about is what the client asks for. *All* I do is provide solutions to peoples problems (I'm a computer consultant, not a web designer). The best solutions for their needs is what I provide (there is a lot of research involved). From what you guys have put forth here, CSS isn't a better solution than the *standard* HTML I currently use.

It has potential. Maybe someday soon. Today, for my clients needs (the only thing that matters), no.


----------



## uoba (Nov 11, 2003)

RacerX said:
			
		

> First, isn't it the one's who pay me who take priority?



And wouldn't the client ask the same question of themselves?




> Second, my sites look great in most browsers. What is the incentive here? I should switch from what works with 99.9% of systems in use on the internet today to something that only works with 97% (and excludes those who are paying me).



Unfortunately, I cannot vouch for your sites validity. Do your sites work in Lynx, in PDAs, in Mobile phones? Public access terminals? Readers for the blind? There is the importance of the oncoming standardisations. However, I feel you are missing the point. CSS and XHTML is NOT exclusive. It will work on all modern browsers, including v4.



> If I was a kid living at home with my parents and going to school for this stuff, then CSS looks great. Show me a site that uses both CSS and runs great in Communicator 4.7 that didn't require twice as much time to develop as a site made in plane HTML, and I'll give this another look.



I wish I could, but I don't surf as much as should (or is that a good thing?) As for requiring twice as much time, again, nothing can be more tedious than dealing with nested tables, browser detection javascripts, proprietary code etc. Especially when having to go back and update sites. Separating the content from the structure cuts time drastically. Teething trouble undoubtedly kicks in initially, but like I've said, the benefits are starting to kick in after all the pain of relearning.

As for the kid analogy, hey great... these are the ones who gonna take your paychecks when no one really does use v4 browsers anymore!




> When did HTML stop being a standard?


Unfortunately, as the claim goes, most designers do not make good programmers. Being a mathematician, I can only assume your code is probably better than mine and most designers. This is where the problem has lay. Designers/bad practice in coding leading to HTML being misused (such as layout with tables which where ever only meant for tabled data).




> I'm a mathematician by training, not a designer. One day a client asked me if I could make a web site. Then someone who saw that site asked me to make theirs. Each time asking for more functionality or something I never did before. I get paid for that! I learn on the fly better then most people, and money is the *only* incentive for me doing web design at all!



Same here, protecting the future seems a safe bet as well. Web development has changed since 1997, since 2000 etc. If we didn't keep up to date, we'd truly be out of business (that's the royal we  )... As with your good self, I came from a different background (well, typography, but it wasn't web development!)... and like you, my clients asked for different things. It led us to where we are now. I guess our clients are asking different things of each of us.



> You may do it for the _art_ of it, or to forge a new _standard_, I do it to get paid so one day I won't have to do it anymore. *All* I care about is what the client asks for. *All* I do is provide solutions to peoples problems (I'm a computer consultant, not a web designer). The best solutions for their needs is what I provide (there is a lot of research involved). From what you guys have put forth here, CSS isn't a better solution than the *standard* HTML I currently use.



Horses for courses. 

I have no problem with how you want to do things... I just like to discuss such things. If you don't wanna learn, it doesn't matter. There'll be 1000's of other developers (even fairly decent sized web companies) who know nothing about the changes with XHTML and CSS also. This thing'll take a longer time than the W3C hope. 

Although I found the "inclusive" intentions appealing of CSS/XHTML etc... it was the workflow of the whole plan that appealed most. And I am not shy to announce that it HAS drastically cut my production time down. There'll still be problems with what I do, I'm not the greatest coder, but the simplicity of how my code fits together works great for me.


----------



## mr. k (Nov 11, 2003)

Yeah, the thing about xhtml and css is that it is all compatible with the html standards that came out 10 years ago, so in browsers that don't understand a @import directive or the link element, you can write your pages well so they appear just fine in any browser that isn't able to (or chooses not to) load style sheets.
If you go to one of the above sites on your pda what would you get?  Exactly what omniweb 3.0 gets, relatively unstyled content, logically structured, and quite usable.  But (now I don't have a pda, so this is all speculation) go to a site hard coded in tables and go to it on your pda and you will get some insane horizontal scroll because your pda with a resolution of 400x400 pixels will try to render a site that is coded at 800 pixels wide.  Not to mention that it takes a huge code base to create a web browser to interpret loosely coded nested table style sites (IE 5.2.2 mac is almost 25mb!), and how could a pda possibly have enough room to keep such a bloated codebase on it's flash memory stick?


----------



## RacerX (Nov 12, 2003)

mr. K said:
			
		

> Yeah, the thing about xhtml and css is that it is all compatible with the html standards that came out 10 years ago, so in browsers that don't understand a @import directive or the link element, you can write your pages well so they appear just fine in any browser that isn't able to (or chooses not to) load style sheets.



But that isn't a problem for me right now.

For me, for my client's needs, CSS sure seems like a fix to a non-problem. The problem is that it isn't even an even trade off with HTML at this point. I lose more than I gain by leaving HTML.

The sad thing here is that in all the justifications for CSS I'm seeing a lot of denial of the trade offs. Denial of how severe the trade offs are at this time. Denial of the internet population that it over looks. Denial of the increase in work needed to reach the same people that HTML can.

It would be nice to see you guys deal with these issues directly and honestly. I assume that HTML isn't the best fit for every solution (it can't be). But you guys are working so hard to talk up CSS that you avoid or dismiss any of CSS's short comings to make your point.

I got an idea, why don't you guys drop the _CSS at all costs_ chant and start outlining where it realistically works and doesn't work. I have no problems adding tools to my abilities, but I'm not about to join the _Cult of CSS_.

Please tell me this isn't the only way you can work. You do have alternatives... right? You don't go to a client and say _"I only do CSS!"_ You do let them define what they need and then find the solution that fits their needs and not your religious beliefs... right?



> _If you go to one of the above sites on your pda what would you get?  Exactly what omniweb 3.0 gets, relatively unstyled content, logically structured, and quite usable.  But (now I don't have a pda, so this is all speculation) go to a site hard coded in tables and go to it on your pda and you will get some insane horizontal scroll because your pda with a resolution of 400x400 pixels will try to render a site that is coded at 800 pixels wide.  Not to mention that it takes a huge code base to create a web browser to interpret loosely coded nested table style sites (IE 5.2.2 mac is almost 25mb!), and how could a pda possibly have enough room to keep such a bloated codebase on it's flash memory stick? _



First, why should I care about PDAs when they make up fewer internet users then people who are still using Communicator 4.7/4.8? That is exactly the type of uneven trade off I'm talking about. I don't know anyone who browses with a PDA. I know a lot of people (paying clients) that still use Communicator 4.7. If I knew a couple people that used PDAs for browsing I might take that into account. When I know as many people using PDAs as I know are using Communicator 4.7/4.8, I'll really sit up and take notice.

Funny that you would tout the compatibility of PDAs (a very small group) then IE/Netscape 4.x users (a larger group now then the PDA users).

Also the size of IE isn't to deal with tables. OmniWeb 3.0 is 9.1 MB and deals with tables just fine. Maybe broswers are getting bigger to deal with CSS, XML, XHTML and HTML. And I imagine that browsers spend most of their energy rendering images, not formatting tables.

One other thing that is sad to see in all this. I've been noticing that many of these CSS sites look the same. They all have the same feel. It reminds me of when Flash first came out and every site that used Flash looked like the Macromedia Flash demos. Most of the people I replaced for my clients had one or two templates that they used for everyone. Every site looked the same with different content. I sure hope this isn't something that you guys are doing with CSS (or that CSS is forcing you guys to do). The single hardest part of web design for me takes place before the coding of the site. It is coming up with a site that is unique and special and reflects the clients and not me.

Are there CSS sites that don't have the _Flash_-style design problem?


----------



## uoba (Nov 12, 2003)

Then am afraid you haven't looked hard enough. Do Flash sites all look the same now? No! You have to expect a period of emulation and finding-your-feet when an industry embarks on something new. This is indicative through design history (over-used Photoshop filters anyone? Gradient tinted text in Quark anyone? All early 90s phenomena.)

CSS was thought of way back in around 97. Nobody listened. M$ and Netscape where hell bent on ignoring it for their own proprietary code. 

You seem to believe that there is HTML, then there is XHTML and CSS! You could quite easily incorporate CSS into your very own HTML without any trade-offs. The level of which you did this is upto how far you want to go with it. Whether it be simply not using the <font> tag (which is now depreciated) and styling your type with CSS. Every browser, at its most basic, and I mean every browser... supports this small wonder.

It is hard to create sites that could have been developed with overly complex nested tables, there's no point denying it. That's why XHTML 1 Transitional exists. You can have tables, and all that HTML based structural code quite happily passing as valid XHTML.


----------



## Arden (Nov 12, 2003)

Geez, give it a rest already.  RacerX seems to be a special case among the web designers here.  I can see both sides of the issue:  CSS in all its incarnations (level 1, level 2, even level 3) is the wave of the future and permits for easy (yes, it's actually quite easy to do layout with CSS if you don't use tables and all the old HTML formatting tricks) design creation.

However, the bottom line for creating a site is for whom you are creating it.  If you are creating it for yourself, great, you don't even have to upload it to enjoy it.  If you are creating for "most of the people out there" or companies that embrace looking to the future, then fine, design for that 97%.  But if, like RacerX, you're designing for someone who for some strange reason uses an antiquated browser, then you have to do whatever works.

After all, it's whatever works.

That being said, I do have a suggestion for RacerX (and this is only a suggestion, of course):  Try designing a site that adheres 100% to XHTML/CSS guidelines.  Then test it in your old, outdated browsers and see what you have to fix.  This should give you a good idea of what you can and can't do with CSS and it should help you design sites for your customers that both work and adhere to some form of current standards.

Sure, HTML 4 is a standard... but it is facing serious deprecation in favor of XHTML and CSS, and while you may have to use only HTML for your clients, some day you will have to use only XHTML with CSS styling.  That's the future.


----------



## Cat (Nov 12, 2003)

Racer X: While CSS is incompatible with other browsers, this doesn't mean at all that your content will look like shit in Communicator 4.7. CSS is a standard, just like HTML, compatible with HTML and non-exclusive: it gives you more possibilities and flexibility than plain old HTML 4. It does not necessarily exclude any browser, no matter how old, you can still ues tables and javascript if you so please and the clients require it. What is the single greatest advatage of CSS is the separation of style from content. You can provide different styles to different platforms and browsers: you add potentiality, you do not exclude anyone.
When you are designing beyond the curve you exclude people, but nobody said you have to. With XHTML and CSS you can do exactly the same as in HTML 4 and more. That's the whole point of the W3C standards: backwards compatibility. Even if you go ahead of the curve, you can simply hide too advanced elements for older browsers, without reducing the functionality of your site.

To see what is the power of CSS, try taking a look at CSSZenGarden or at CSS Edge. I do not have the older browsers you mention and I am very curious what you think about them. Also I am very curious about sites you designed.


----------



## toast (Nov 12, 2003)

RacerX,

You're still cheating  Zeldman and ALA were NN4 compatible a year ago. Then they looked at their browser stats, and off they went to CSS.

Look at Happy Cog (Zeldman's) Studios. Their planning form (the document they use to target the customers' demand) has a line saying "Do you need compatibility with older browsers". If checked, they build NN4 fully compatible webistes. Evidence: http://www.happycog.com/ . Try it in NN4, there you are.

You invoke customers as a reason to stick to old programming, I invoke the same argument. You talk of money in the process. Losing a tiny portion of your customer base is losing money, but programming with CSS and XHTML is gaining time and bandwidth, which are money too.

Now, all you are left to do is to have a plain simple cost/benefit substraction. It worked out positive for me, for Zeldman, for many others, it didn't for you. This I can understand that, obviously -- but I'm sure you can also figure why and when switching to CSS is all benefits and almost no hassle.


----------



## RacerX (Nov 12, 2003)

Well, the CSS sites that you posted Cat, didn't work in OmniWeb 3.0 (see images) but I'll go through and read them when I get a chance. Thanks.

Toast, finally a site that I could show to my clients and expect to get paid (see image). My main question is how much extra work would that type of design require verses straight HTML or straight XHTML/CSS?


----------



## mr. k (Nov 12, 2003)

One of the things that I'm most disappointed about right now is how the support for css is very poor.  The newer browsers support it brilliantly - Mozilla, Safari, opera is fairly good, even IE6 is catching up.  But then average users out there still have their copies of IE 5.5, or even IE v4.  For a list of browser statistics head on over to http://www.w3schools.com/browsers/browsers_stats.asp, they have a good list going.  Less then 2% of the browsers out there are NN\IE v4, and almost 95% are flavors of IE.  And none of these browsers fully support css2, the most current standard.  Now I know css isn't a serve all, and there are other options to designing a site, but is table based design really better then css?  What other alternatives are there (please don't say flash)? XUL will become an option maybe ten years from now, and I'm sure other languages will get cooked up, but for awhile now all we have is xml based sgml.  Now maybe the pda example is a little bit far off, but when all of the small communities of users are bunched together (I'm talking about pda's, phones, screen-readers, and people using legacy browsers) I think that css does a better job to serve the masses.  Surely there are downsides to using css, and there are tradeoffs to css as much as any other web based media (mais pas beacuop plus...) but for so much of the web right now css serves the right people in the right places and it isn't a hard thing to learn to do.


----------



## Trip (Nov 12, 2003)

*Claps*

Well said Mr. K. Those were my thoughts exactly as I was coming home from school today. Right on the dot.


----------



## uoba (Nov 12, 2003)

And this thread was to convince you Trip originally


----------



## Trip (Nov 12, 2003)

Well, what can I say?


----------



## Cat (Nov 13, 2003)

[whispers in trips ear:]"If you can't beat them join them"


----------



## Trip (Nov 13, 2003)

Yes,

If you can't beat them...join them! 

I mean, just look at me. Erm, nothing to show right now, but I'm working on something.


----------



## uoba (Nov 13, 2003)

Cool


----------



## mr. k (Nov 13, 2003)

I can't wait -- we can start a new thread for critiquing his new work, and I bet it will be just as effective as this one.


----------



## goynang (Nov 13, 2003)

Question for you all...

Do you have any first hand experience of screen readers (and similar technologies) and if so how well have your sites done with them?

It would be interesting to know how old style HTML sites (as racerX is talking about) do compared with newer xhmtl/css sites. I read plenty telling me that xhtml/css is much more accessible and it looks like it sure should be but I've never actually had first hand experience of it.

Just to be clear, I now work pretty much exclusively in XHTML/CSS and would rather quit than go back to old days of spaghetti code (or perhaps that was just my code!).


----------



## Trip (Nov 13, 2003)

I bet you guys never thought you'd convert me to the ways of XHTML and CSS, well guess what?!

http://www.tannersite.com/

XHTML VALIDATED!

That's right! I finally got around to not only creating a simple portfolio for schools/firms I also got around to working with XHTML/CSS! And I owe it all to you guys! Thanks so much! It works so much faster than before, and it's a lot cleaner and it even works on all of my household computers! 

Special thanks to:

Darkshadow - For showing me the ropes, and helping me get XHTML down!


----------



## goynang (Nov 14, 2003)

Trip, I think you may have become too carried away with getting your code to validate. Sure it might validate now but to be honest that isn't good code on the link you provide.

I don't mean to have a go at you so please don't take this the wrong way.

Your code may technically validate but it doesn't really follow the spirit of what XHTML/CSS is about. You've used inline styles, too many classes, no actual selectable text, empty paragraph tags. None of which are particularly great ideas.

That said, the actual page does look quite nice


----------



## Darkshadow (Nov 14, 2003)

Heh, you're welcome Trip.

Hmm, it's just a test page though, goynang.


----------



## mr. k (Nov 14, 2003)

Give him a break, the first project is never awesome :^)  I think the site looks great trip, good job!
But old way's do die hard.... 


> <div class="table"/><div class="row">


Now, just keep working on improving your skills, you could go places.


----------



## Trip (Nov 14, 2003)

Yea thanks everybody.
I'm still working with the code. I had to figure a lot of it out on my own.

As for the blank paragraph code: how the crap do make spaces between my images?

[EDIT: Later today does anybody have the time to help me go over the code and clean it up with me?]


----------



## uoba (Nov 14, 2003)

Your best friend in CSS will be the margin and padding properties... you could add say, 20px margin to the top and bottom of your images? You could do this to all images, such as:


```
img {
margin: 20px 0;
}
```

I've used shorthand here (you'll do well to learn that as well). This shortens down something like this:


```
img {
margin-top: 20px;
margin-bottom: 20px;
}
```

and this:


```
img {
margin: 20px 0 20px 0;
}
```

You can do this with padding as well. Basically, from the first value (20px) above, this is the top margin, and work round clockwise, thus the following 0 would be the right margin, the next 20px the bottom, and the final 0 the left margin.

If you do just (
	
	



```
margin: 20px 0;
```
) this makes top and bottom 20px and left and right 0.


----------



## uoba (Nov 14, 2003)

If you don't want all images to have these spaces, then just class them (or if there is just one of them, id the image).

Such as:

```
<img class="imgSpc" src="#" alt="" />
```

or:


```
<img id="imgSpc" src="#" alt="" />
```


----------



## uoba (Nov 14, 2003)

By the way, forgot to mention... looks nice. You're code does need to be sharper, but you'll figure it out. I'd suggest buying Zeldman's Designing with Standards at this point. Now that you know what it's all about, this book well speed you along very quickly.

By the way, that Validated! graphic looks vaguely familiar!


----------



## goynang (Nov 14, 2003)

Yep, I agree with uoba - get Zeldman's book.

Another useful resource is...
http://css-discuss.incutio.com/?page=FrontPage

Sorry Trip - didn't mean to be harsh, just wanted to point some stuff out so you could keep moving in the right direction.


----------



## Trip (Nov 14, 2003)

Oh I totally understand you guys. At first I really felt offended by your comments, but I realized THIS IS MY FIRST CSS WEBSITE! So thanks to everybody for the comments! I'll be sure to work on my code!

And uoba: yes I stole that image from you (only not really).


----------



## uoba (Nov 15, 2003)

It's okay, the copyright police will be right over


----------



## Arden (Nov 15, 2003)

Interesting, looks good, Trip.

If you want some more direction in designing with XHTML/CSS, I suggest you examine my site, which soon enough will be www.jabmulti.uni.cc (as soon as the DNS servers resolve, if they haven't already).  My site fully validates except for the DTD declaration, which isn't the first line because the host adds something to the pages... not entirely my fault, but annoying no less.


----------



## Trip (Nov 15, 2003)

2 quick questions that I can seem to find (I havn't even tried to code it myself yet, but whatever):

1. How do I setup a "image" class through CSS and then link to it in the HTML?

2. How do I make an image link to another page/website?


----------



## mr. k (Nov 15, 2003)

ok - the simplest thing to do in the css to affect all your images is to just use the selector img { ... }, which will affect all the <img /> tags in the document.
And to make an image into a link just put it into an anchor, like so: <a href="#"><img src="d" /></a>
also, you could give certain images a certain class, like <img class="icon" />, and call those images into your css like .icon for short.  Also img.icon for long.


----------



## uoba (Nov 15, 2003)

1. As my example earlier with the image (img) css tag. Simply create a link to your CSS file in your HTML file (as you've already done with your page.css file I notice). Within this CSS file, put this code in:


```
img {
      border: none;
      margin: 1em;
}
```

Obviously, change the properties with the { } to whatever you need to. This code will affect ALL <img ... > tags in your code. Here's an example I've done for you:

http://c-o2.net/dev/public/

as for making an image a link... same as you ever did! Use the HTML img tag within your <a href... tag. Thus:


```
<a href="#"><img src="someimage.gif" alt="" /></a>
```

But you knew this already! No need to confuse issues


----------



## uoba (Nov 15, 2003)

Sorry, mr. K... you must've posted whilst I was replying!


----------



## mr. k (Nov 15, 2003)

happens to me all the time uoba, no problem.
And I was looking for some help with this css nav menu I have been working on.  I got it to look decent in safari, but it seems that safari treats the background images applied to the ul wrong.  The menu looks pretty bad in any browser besides safari -- I mainly want to make it work in mozilla, I won't worry too much about mac ie.  I haven't tested it in IE windows for awhile, but at my last test it worked great.
One of the biggest problems that I have is that on the background property for the first and last items the background applied to the li (for the top) needs to be set as ... bottom left; when it should be ... top left;, this makes it work in safari but breaks it in all the other browsers I have tried.  The other big problem is that I couldn't figure out how to make a transparent png with a transparent grey curve be white (and non-transparent, while the other side remained transparent.  Whenever I did a paint can on the bottom where I wanted the white, it obliterated the curve, which was no good.  
I posted a comp at http://kao.sytes.net/menu/, with all the images in here and the photoshop files of the erspective images in here.  Any help I could get with this would be great - I kinda hit a brick wall once I got it to work in safari.
And another thing - in safari 1.0 on panther there is a bug where when you have a li floated left with a transparent background, the transparency gets all messed up.  Are the two images below the menu bar the same color and tone as the background of the menu  bar?  Or are they significantly lighter in Safari 1.1?


----------



## Arden (Nov 15, 2003)

Could you post a screenshot of what you want it to look like?  I'm using IE and NS, as usual, and I can't check it in Safari, but if I can see the end result I can get a better idea of what you might need to do.

Also I suggest you play around with ImageReady and see how it formats your stuff.


----------



## mr. k (Nov 15, 2003)

ok, I posted some (albiet large) good images of what both firebird and safari 1.0 (jaguar) show for the menu.  they can be found on my site; safari and mozilla.
edit: here is what the menu looks like in mozilla (what it should look like...) when I remove the hack I used to get it to work better in safari.  Now in safari it looks exactly like it should look in mozilla... ugH :^)


----------



## RacerX (Nov 15, 2003)

Is this any better/worse? What are you looking for?


----------



## mr. k (Nov 16, 2003)

That looks a lot better racerX - could you give me a quick rundown of how you got it?  did you just do it by hand or use a filter/brush?  Whenever I tried to the background eraser tool it would erase the line, and when I tried the magic wand it would select the line.


----------



## RacerX (Nov 16, 2003)

I created a new layer and used the elliptical marquee tool to make a circle that touched the inner edges of the horizontal and vertical line elements of the original where the original curve started and ended. I filled that with black. I copied that layer and use free transform to change the percent of the new layer to increase its size (I think it was 103%) to get the circle of the new layer too touch the outer edges of the horizontal and vertical line elements of the original where the original curve started and ended. I use a white fill out side of the second layers circle to match the white areas of the original. I used the first new layer I made as a mask to remove both the center of the filled circle in the second new layer and any part of the original that may have edged out a little. Removed the new layer. Removed all but the bottom corner of the circle which matched the original curve (with the white filled corner), then merged down. The final element was saved after transferring it to ImageReady.

I would think you would only ever need to do this once as the other four corners can be generated from your first in other project

I started doing this when curves made in Illustrator and AppleWorks didn't look as nice as I wanted them to when bringing them into Photoshop. I would guess there is an easier way, but this works. I still use the drop shadow technique I started using back in Photoshop 3 today because it gives me a freedom that the drop shadow tool doesn't.

What was funny was that I was already in Photoshop doing some of the same type of touch-ups when I read your post. 

Oh, I still had the original photoshop file.


----------



## Trip (Nov 16, 2003)

Question from the new guy ():

How would I go about making a random image from a list appear whenever somebody hits refresh on my website? You know, like a different picture would show everytime they pressed refresh. Anyone?


----------



## Darkshadow (Nov 16, 2003)

Javascript 

But don't ask me how, I haven't gotten into it much at all.


----------



## mr. k (Nov 16, 2003)

right here trip -- but you need php...
http://www.alistapart.com/articles/randomizer/


----------



## Trip (Nov 16, 2003)

There's no easy way to do it?!


----------



## Arden (Nov 17, 2003)

Actually, there is an easy way to do it.  I don't remember right off the top of my head, but let me dig it out...

```
// This function returns a random number for the variable num, which is specified when you use the function.
// You type rand(x) to use the function, where X is the number of iterations, as you will see later.
// (These comments are for your educational purposes and you can change them as you see fit.)
function rand(num)
{
return (Math.floor(Math.random() *num));
}

// Math.random() gives you a random number between 0 and 1, so you multiply it by the variable num to get something close to the iteration you want.
// Math.floor then rounds that number down, no matter what it is.  It could be 24.999999, it would still become 24.
// And return simply returns the result to the Javascript interpretor.

// I used to use the following code to write a random quotation to the screen.
// You can change the array name (quip in this case) to whatever you like, hopefully something more descriptive like randomImage, randImg, or even img... or broccoliAndLimaBeans, if you like.
// I removed the quotations, but you should replace what I put in with the path to your image.
// (Yeah, I only had 4 quotations... sad, huh? ^_^)
var quip = new Array(3);
quip[0] = "Formerly quotation 1";
quip[1] = "Formerly quotation 2";
quip[2] = "Formerly quotation 3";
quip[3] = "Formerly quotation 4";

// This code will randomly store the value of the ith entry of the array quip into a string called quote.
// Again, you can change the variable names (quip, quote, rand, etc.).
quip.length++;
var i = quip.length -1;
var quote = quip[rand(i)];

// Finally, this will put your image in place.
// Be sure to watch those quotation marks... if you open with single hashes, close with them.  If you use double hashes, close with them.  If your code contains double hashes, use single hashes to contain it, and vice versa.
// If you need to use a single hash and a double has, you can do it the long way ('HTML' + "'" + 'more HTML') or the short way (\' or \").
document.write('<img src="' + quote + '" />');
```
Hope this helps!

You can still see this script in action at my old site, jabber.1accesshost.com at the bottom of the page.


----------



## Arden (Nov 17, 2003)

P.S.  I apologize for making the page so wide, the {code} tags tend to to that.


----------



## mdnky (Nov 17, 2003)

Arden, you need to rid that page of the JS and image maps.  You're undercutting the purpose of CSS/XHTML using them.  The simple mouseovers can be easily accomplished with CSS anyways, so why use JS?


----------



## Darkshadow (Nov 17, 2003)

Javascript and CSS work well together.  Granted, CSS can do a lot of the stuff Javascript was used to do, but there are still good uses for Javascript.


----------



## mr. k (Nov 17, 2003)

So I have been working a little bit more on that menu I had been working on earlier and threw it into the site it's going to go.  The address is here - http://kao.sytes.net/freshsqueeze/new/temp.html.
I only have a few problems left.

Safari 1.0 applies the background top left wrong, and makes the very top of the image on the first and last list items disappear, and also that makes the image too short to cover all the way to the bottom.
I can't figure out how to center the whole menu regardless of how big the text size is.  The menu can take about three command-plus, after which the text gets too big and the menu has to wrap to another line.  I want to center it regardless of how big it is, and whether it wraps or not.
Those are the two biggest issues I am trying to fix, here is what the site that I am 'improving' looks like.


----------



## toast (Nov 18, 2003)

Hey Trip, glad to see a new CSS zealot is on its way to webdesign glory. Check the ALA (A List Apart) link Mr K gave. As usual, Mr K gave the best link around.

A bit o Javascript and CSS can do miracles. Check my place for the power of CSS design switching : www.phnk.com


----------



## Trip (Nov 18, 2003)

Love the site toast! And thanks for the comments! 

Now could somebody quickly help me out? If you're around right now and want to look over my new code send me an IM at: TannerSite (on AIM). I've got a preview webpage that needs some help.


----------



## Arden (Nov 19, 2003)

Well, you were on AIM when I got on, but I hadn't read this yet, so next time we see each other, drop me a line.

MD:  Okay, I'll look into it.  I know there are ways for me to improve the menu, but I made that in Photoshop and Imageready and pretty much left it.  I'll check it out at some point.

My new domain is www.jabmulti.uni.cc (same site, same host, just new domain).


----------



## mr. k (Nov 20, 2003)

Ok, so I almost got this whole menu to go. I would like if someone could check it in Safari 1.1, on panther seeing that I don't have access to it, thanks. It works almost flawlessly in mozilla, and in safari there is just one bug that is getting in the way of really using the menu.  The bug is that safari seems to apply the background: url(...) no-repeat top left; wrong, and if I change it to background: url(...) no-repeat bottom left; it looks right, but then it displays wrong in every other browser.
In IE 5.2.2 mac is doesn't work too well, but I can work on it.  Also in IE 6 PC it doesn't look great -- but it sure will work.
If you could help me with the problem I am having in safari, that would be key, because the problems in IE I sure could be able to fix.
Thanks, here is the url http://kao.sytes.net/freshsqueeze/new/temp.html!


----------



## Arden (Nov 20, 2003)

Try breaking that background definition into smaller pieces, like {background: url(...) top left; background-repeat: no-repeat}.


----------

