I am going to be uploading the site in the next week or two (after the last finishing touches to some of the artwork, and two more classes)…and I actually saved the first CSS version of my Firefox fix - the one that looks just hunkydory in Firefox but doesn’t work in IE…I might just post that CSS version for you to see. If I do, I will most certainly get back to you and provide you with the link.
And ZipperJJ, yes, the project is take the HTML from Zengarden.com, play by their rules and, using ONLY CSS, modify the exisiting HTML document. A rather lofty goal for a final project, considering most in the class have very limited experience and this class is only 4 sessions of 3 hour classes.
BTW, thank you all for your comments - as a novice, it is good to hear both the good and the bad about the browsers and W3C.
Oh, I agree, it was pretty rotton for MS to claim standards compliance with this in place. It was also pretty smart on a marketing perspective, it helped cement their monopoly. I’m not justifiying their decision in any way; I just find their box model easier to work with.
There are still ongoing arguments over this. HTML tables should be used for tabular data, i.e. like a chart or something along those lines. They should not be used for page formatting. That’s the argument, anyway. I’m not entirely convinced that it’s “right” or “wrong” and that sometimes tables are the only way to make sense of a complex page design.
However, recently I have had to make HTML-based email for a mailing list, and discovered, to my horror, that web based email clients strip out most of the CSS, so that it doesn’t interfere with the code on their webpages. So you have to use HTML only to structure your email. Coupled with spam filters sometimes banning anything with an embedded image in it, or has too many links in the page, or whatever, this particular branch of the web is bringing familiar frustrations back into the fray all over again.
I’ve loathed IE ever since I learned there were alternatives – like Netscape. I hated the way IE did things. Its rendering engine sucked. It was bloated. And nowhere, but nowhere was the evidence of how IE expected the web to operate more evident then designing a web page in Microsoft Frontpage. The code FP generated was – how should I put this? – day-after-mexican-meal-shit in a ten ton vat left out in the sun to bake for two days. IE ate it up, though – displayed that bloated pile of meta-tagged-to-hell garbage flawlessly, three billion unnecessary <font> tags and all.
These days I design from within Dreamweaver with the aim of getting it to look good in Firefox, and everything that comes out of DW looks perfect in FF without any significant changes, CSS and all. (A little tweaking with table spacing and padding is usually all I have to fiddle with) Then I work on IE’s whiny bitching. Coming at it from that angle, IE is the pain in the ass, and from past experience I feel pretty good in the assertion that this is the proper order of consideration.
Did the artwork in Adobe Illustrator, some fiddling with images in Adobe Photoshop, and as mentioned, lots and lots of fiddling to get this to work in both Firefox and in IE. I am hoping to eventually get everything working to do a Las Vegas website, using the same design concepts and basic artwork.
I am sure most of you will be able to look at the CSS and say, “no wonder the idiot had so many problems.” My guess is there are lots of bits of code that are not needed, incorrect, or ass-backwards. Right now, I am afraid to breathe on it for fear it will suddenly appear upside down in French, but I think it will suffice for the final project for this class.
Feel free to rip into the errors or make any comments whatsoever.
Very nice, DMark. As scotandrsn says, it’s a great design concept.
Looking at it on Firefox (and a 12x10 monitor), I can tell you right off you have some border and positioning problems. But I have no doubt you’ll be able to clean everything up fairly quickly.
As for the IE-vs-The Rest, I feel your pain. Like others that have posted, I also work on a web site for a living (amongst other things), and the whole browser detection thing is a pain. Plus, although it doesn’t come into play on this project, “The Rest” aren’t quite as monolithic as some would have you believe. The main Mac browser (Safari), for example, while more compliant with standards than IE, has its own quirks as well.
It doesn’t work if the browser width is a different size than you expect. The background image looks like it’s centered, and the scrolling stuff is left justified. This shows up on both Firefox and IE.
I also question your use of red text and white link text on a (basically) red and white background. It’s hard to read.
Took me a minute to get your concept. I get it now. As a “professional” i think it’s horrible but it’s not a professional site and it was just for fun. As Jane WebSurfer, I’d think “meh…neat…next.” As a professional I am glad to see you’re learning lots, though.
I am royally pissed at your instructor for being all “it must work in Firefox!” and not first stating “it must work at every resolution from 800x600 on up.” This is the biggest effing mistake I see when I get pages submitted to me by “designers” (ie graphic artists who don’t do working HTML).
Is the background layer and overlaying layer messed up for anyone else in IE? I’m using a 1024x768 resolution. It side-scrolls in full screen and the left side of the background isn’t lined up with the left side of the main layer.
Yep, there are a lot of CSS snobs that look down their noses at anyone still using tables for layouts.
On the other hand there are a lot of experienced and knowlegable web authors who embraced CSS early on, grew disenchanted with its layout features, and went back to using tables.
At this time there really isn’t a good choice to make with respect to layout of web pages. Neither tables nor CSS works well for this, and it’s too bad because it really shouldn’t be that hard. Essentially you’re dealing with technology that places text and images on a screen. This isn’t rocket science.
DMark, I’m also impressed with you design, and furthermore I’m impressed that you got it to work in the ZenGarden mold. I’ve actually tried to deconstruct some of those ZenGarden pages and it’s a nightmare.
I really wish that people wouldn’t look at ZenGarden as some sort of ideal use of CSS. What makes ZenGarden so spectacular is the graphic design work that is presented there, not the CSS behind it.
For those unfamiliar with ZenGarden go here and check out some of the other designs on the right column. The idea is that all these spectacular designs are based on the exact same HTML - only the CSS is changed. A great parlor game but really not a good way to go about designing web sites.
I’m not a Microsoft hater, or a Gates hater, but I despise the way IE insinuates itself into your system. You can’t delete the fucker, it’s full of security holes, and even if you keep telling your computer that “YES FERCHRISSAKES I WANT TO MAKE FIREFOX MY DEFAULT BROWSER”, some things still open in IE (usually install programs on CD or program interfaces on the desktop such as ISP control panels).
I’ve used Firefox for a couple of years, and it’s miles ahead of IE. THe only glitch with it is a minor thing where sometimes it interprets my typing an apostrophe as my wishing to open the “find on this page” bar. Apart from that, it’s very pleasant to use.
My only experience of HTML is a seven year-old self-teaching book. On just about the first page it stressed that cross-browser compatibility was your first priority. I doubt that’s changed.
In fairness, that last one isn’t necessarily IE’s fault. When a program opens a web browser, it can be programmed to open IE or to open the default web browser. Opening IE is easy and obvious to program; opening the default browser is somewhat more obscure. Guess which one lazy Windows programmers tend to pick?
Oh great…more centering problems. I swear it is (almost) perfectly centered in both Firefox and IE on my screen, and the one at school (which is smaller).
And yeah, the colors all need to be re-thought…for the time being, I was more concerned about getting the spacing right, and it looks like I can continue being concerned about that.
I swear, this is going to drive me insane…what more can I do other than put “center” in every code field?! Then all that padding to try to make up for the lack of obedience with “center” commands…geez, how hard is it to make a generic site that you simply want to fit, on every screen size, in the middle?
You do bring up a good point though…none of my instructors so far has stressed the fact that not everybody has a wide screen, flat monitor with high resolution. The fact that I didn’t take that into consideration has proven to be yet another joy to contend with down the road…this will never end…
HTML-based email is an abomination in the eyes of God and those who perpetrate it should have their livers shorn and shredded by hungry vultures at a minimum anyway. Email is a text-only medium and all HTML email should be shredded as spam at the server level to speed up bandwidth, since all cognizant end users shred the damn stuff on the end-user side with our own client-side spam filters anyway. (At least I do. Anything with a HTML or XML or IMG tag goes straight into the trash, unseen unread and unmourned)
Hmm, I haven’t done a whole lot of work with web design, but I sat across from somebody who did, so that should be close enough. He was old-school, the ‘type every character and tag in by hand in emacs’ kind of guy, and as far as I could tell he only used CSS for setting up his fonts. Of course, he also wrote an entire thousands-of-lines web-application to be dynamically generated in-browser in javascript; I don’t think that thing used either CSS or tables for layout in that…
Well, back to the point. He detested the fact that the browsers behave differently; and they definitely do, right down to putting things in different places even if you tell it exactly which pixel to put them on. In those cases, IE usually got it ‘more wrong’, but it was basically a crapshoot either way. The assertion he made on the subject is that however long it took you to write your web page, you’d take at least that long again going back and making it browser compatible.
All this is very sad, because I think (from a computer science point of view) that as a programming language Javascript rocks beyond all reason. Too bad it’s trapped in those craptacular browsers…
I used to feel this way, but mostly because the most common HTML viewers at the time (Outlook, Outlook Express, etc.) relied on the IE rendering engine and were thus open to all kinds of exploits. It’s better now, though - my Thunderbird renders HTML mail just fine and does a lot more to protect me from my email than the crap 8 years ago did. HTML no longer bogs down the browser/email client like it did 8 years ago, too.
The benefits of HTML email are significant: rich text display, hyperlinks, etc.
Besides, isn’t HTML text-only anyhow? I mean, after you omit the images.
I reject the notion that stripping out HTML email somehow speeds up your email delivery - If I bounced all 5 or so HTML-formatted emails I get in a given day, it does nothing to stem the flow of the 100+ spam messages I get (Assuming I’m not filtering spam via SpamAssassin or GMail.) And with DSL on the cheap, you can’t exactly argue about the cost of receiving an extra 500 bytes per message while downloading MP3s (assuming you are in fact downloading MP3s ;))
No, the email format which should be wrapped around a grenade and shoved up some unspecified billionaire’s ass is RTF. Talk about an abomination. I’m so sick of all these freaking backspaces! No unicode support. No tables. No hyperlinks. Terrible support for colored text. Yeccch.
I would normally agree with you, if you’re talking about the shite that is sent by your sister-in-law with the fluffy bunny images and the music. But in my case, it is a virtual brochure newsletter, and is deliberately designed so that it emulates, and provides samples from, our website.
But even if it wasn’t, HTML email is increasingly popular and often recommended by various people, despite the fact that it does not support CSS and you have to use deprecated tags to make it work. It’s like a backward step in order to go forward.
He was old-school, the ‘type every character and tag in by hand in emacs’ kind of guy, and as far as I could tell he only used CSS for setting up his fonts. Of course, he also wrote an entire thousands-of-lines web-application to be dynamically generated in-browser in javascript; I don’t think that thing used either CSS or tables for layout in that…