AppleNova Logo vs. WinXP IE

[dfiler]

The logo in the upper left of every page seems to display oddly. The text and drop shadow are pleasing but it is accompanied by a light gray background.

My guess is that the background is meant to be transparent.
IE on XP has the incorrect background while Mozilla does not.

I'm certainly no IE proponent but thought I should mention it anyway as I'm stuck behind XP at work everyday. I suspect the same is true for many fellow fora lurkers.

[EDIT: Oh yeah, almost forgot to mention... the header looks great! (when displayed as intended)]

[Kickaha]

I'm sure MS will appreciate the feedback to fix the bug in IE.

[Gargoyle]

IE can't do .png images with alpha transparency. Stop using it... nuff said! :D

[dfiler]

Stop using IE... you mean stop reading AppleNova?
You see, some of us are not permitted to install software on our work PCs. :(

[Kickaha]

Then you're just going to have to get used to buggy software. :/

I see no reason for any website to kowtow to IE's bugs unless it's something critical, and IE is their target market for some reason.

[dfiler]

Kowtow to MS? I took it as more like giving your users a quality experience.

Me and the rest of the IE users will play the martyr so that applenova can stick it to the man.

:lol:

Seriously though. The ugly graphic doesn't bother me. Somehow, I am more disturbed by the quickness of people to basically say screw you. Then again, this is the internet, what was I expecting. ;)

[Kickaha]

There are standards for a reason. If MS can't provide their customers with a product that adheres to them, then their customers need to look elsewhere for their solution.

It's called a free market.

Oh wait... that's right, MS doesn't want that.

Seriously, any company that can't write to the standards doesn't deserve to succeed. People are *finally* figuring this out, thank god. If MS can't provide a decent product, then users will start to look elsewhere. I'm sorry your employer is short-sighted on this, but really, you need to talk to them, and MS. That's who is at fault, plain and simple.

[Eugene]

For some reason, MS has ignored this bug since...forever. I have no idea why...

[BarracksSi]

Somehow, I am more disturbed by the quickness of people to basically say screw you.

Nah, that's not it -- we're saying that IE is screwing you, and as a user, you deserve better.

Like Kickaha said, it's not your fault at all.

[Brad]

You see, we were faced with a design decision here at AppleNova. We could either make some kick-ass graphics that would display properly for more than 80% of the visitors or we could turn the quality of the graphics to crap, using really ugly dithering to a 8-bit color palette and losing any decent layering support, and cater to that minority of Windows Internet Explorer users. Good browsers have supported full PNG transparency for five years now. Internet Explorer for Windows is the only mainstream one that doesn't, AFAIK.

For obvious reasons we chose the former. The vast majority of our users won't be having any problems at all. Those that are using IE should seriously consider switching to a better alternative. Perhaps I should make an announcement about that or something. There are just too many reasons *not* to use Internet Explorer. Hell, even Microsoft fanboi/zealot Paul Thurrott is recommending users dump Internet Explorer (http://www.winsupersite.com/showcase/ie_no_more.asp)!

I'm sorry that you have no choice but to use Internet Explorer at your place of work. I know that it probably won't do any good, but perhaps it would be worth writing a formal letter to the IT dept. at your office and cite a number of reasons to provide an alternative to Internet Explorer. I'll dig up some sites with some good reasons.

[psgamer0921]

So it's not supposed to look like this?

http://img61.exs.cx/img61/3981/icon.jpg

[Brad]

BusinessWeek: Internet Explorer Is Just Too Risky (http://www.businessweek.com/technology/content/jun2004/tc20040629_7734_tc120.htm)
eWeek: Internet Explorer Is Too Dangerous to Keep Using (http://www.eweek.com/article2/0,1759,1617931,00.asp)
Yahoo News: U.S. Steers Consumers Away From IE (http://story.news.yahoo.com/news?tmpl=story&cid=74&e=3&u=/cmp/20040702/tc_cmp/22103407)
US-CERT: Vulnerability Note VU#713878 (http://networks.org/?src=cert:713878)
Windows Network: IE: Indispensable Business Tool or Horribly Broken Windows Component? (http://www.winnetmag.com/Article/ArticleID/43276/43276.html)
Paul Thurrott: Target IE (http://www.winsupersite.com/showcase/ie_no_more.asp)
Security Focus: Time to Dump Internet Explorer (http://www.securityfocus.com/columnists/249)
Why You Should Dump Internet Explorer (http://channels.lockergnome.com/news/archives/20040615_why_you_should_dump_internet_explorer.pht ml)
USA Today: Tired of Internet Explorer's risks? (http://www.usatoday.com/tech/columnist/edwardbaig/2004-07-07-baig_x.htm)
ZDNet: 2004: Internet Explorer's year of shame (http://news.zdnet.co.uk/internet/security/0,39020375,39160000,00.htm)
CNET: How Internet Explorer could drain your bank account (http://reviews.cnet.com/4520-3513-5142439.html)

And on a very related note:
CNET: Microsoft to abandon standalone IE (http://news.com.com/2100-1032_3-1011859.html?tag=fd_top)

[Brad]

So it's not supposed to look like this?

http://img61.exs.cx/img61/3981/icon.jpgThat's not what we're talking about. This is:

http://www.applenova.com/Images/logo.applenova.png

How it looks (incorrect) in IE for Windows:

http://brad.project-think.com/images-3/AI-incorrect.png

How if looks (correct) in every other browser:

http://brad.project-think.com/images-3/AI-correct.png

The masthead isn't the only thing that suffers, as you can see. Also the forum icons on the left lose their transparency in IE for Windows.

[synotic]

I'd like to just chime and mention that the IE team has known about this forever and if the last couple of years are any indication, they aren't going to fix it any time soon.

As for Kickaha's comment, indeed the PNG specification is an open standard. But anything can be made open and marked as a standard. CSS3 is a standard, XForms is a standard, MNG is a standard. Last I checked most "modern" browsers don't support most of those standards (although Safari is making great strides in CSS3). For a standard to work well it has to be actually usable to a majority of the users you're targeting. For most sites out there (particularly commercial sites), using transparent PNGs is not an option.

However for AppleNova, the situation is different, the majority of users accessing the site are likely to be able to take advantage of the niceties that PNGs offer.

My main point is that while I feel AppleNova is in a perfect position to utilize PNGs, their use shouldn't be passed off "simply using standards". PNGs were employed as a stylistic choice that their target users happened to be able to support. While AppleNova (codewise) is definitely a lot cleaner than a lot of boards out there, it's only gone half way by using things like divs, css and all that fun stuff. Trying to read these forums with Lynx or any other handheld device merely reveals a jumble of text with no organization whatsoever.

Little gems like this, merely used for presentation can be found throughout the site:
<div id="Logo"><a id="LogoLink" href="http://www.applenova.com/"></a></div>While using divs is all nice and well, if you happen to view this page with CSS turned off or a through a text based browsing environment, the logo/title of the site fails to display at all. Disregarding the fact that it's purpose in the page is completely ignored. And:
<div class="smallfont">:confused: This is completely identical to using font tags, might as well use them. It seems a little backwards to utilize XHTML and CSS only to recreate what's been done back then, tables, font tags, nbsps, break returns, 1x1 transparent gifs etc...

OK, OK I know I seem like a snotty web guy nitpicking seemingly pointless fragments of code, but my only point is that if you want to talk about using standards at least employ them on the site. Using PNGs doesn't make you standards compliant ;) Just to prove I'm not being an ass, I wouldn't mind helping out with some of the things I mentioned. HTML and CSS are things I've found very interesting and used a lot so I can get a little carried away when talking about them.

[Brad]

<div class="smallfont">:confused: This is completely identical to using font tags, might as well use them. It seems a little backwards to utilize XHTML and CSS only to recreate what's been done back then, tables, font tags, nbsps, break returns, 1x1 transparent gifs etc...One of the biggest reasons for using CSS is that it removes all need to rely on HTML for styling; CSS separates the style from the base code. As in the case of 'span class=smallfont' versus something like 'font size=2', the CSS allows us to make a single change globally that affects every instance of class=smallfont. That greatly cuts down on the time needed to update parts of the site's code.

What if we decided, for example, that things described as smallfont should be italicized also? We'd have to hunt down and change possibly dozens or even hundreds of instances. CSS allows us to make one change.

The CSShark (http://www.mako4css.com/) sums up what I'm trying to describe pretty well:
Cascading Style Sheets is a means to separate the presentation from the structural markup of a web site. By applying a CSS style you have the ability to keep the structure of your document lean and fast, while controlling the appearance of the content.

HTML was intended as the structural markup language. This language focuses on the roles that the different elements of a document have to play, not how they have to look. CSS has been invented and developed for the Internet. It is not an adapted tool from print or programming, but a means of enhancing HTML.

Since CSS takes care of the presentation, the structure of the document can be static HTML, and the content either contained in the HTML itself, or generated by ASP, ColdFusion, XML and/or other technologies that are being hatched now and we haven't heard about yet.

[synotic]

One of the biggest reasons for using CSS is that it removes all need to rely on HTML for styling; CSS separates the style from the base code. As in the case of 'span class=smallfont' versus something like 'font size=2', the CSS allows us to make a single change globally that affects every instance of class=smallfont. That greatly cuts down on the time needed to update parts of the site's code.

What if we decided, for example, that things described as smallfont should be italicized also? We'd have to hunt down and change possibly dozens or even hundreds of instances. CSS allows us to make one change.That was my point. The naming of it "smallfont". Somewhat like doing "redtext" would be no different than <font color="red">. Just using a span or a div is not semantically any better. What if in a later design you decide to have the user info normal size? What if perhaps it was currently italicized like you mention, so that it was "smallitalictext" and then you didn't want it italicized?

I doubt you'd say that user info should be classified under "small text" but rather what it is... "userinfo". Since there's no <userinfo> tag, you can make your own class that well defines the section. If text is red because it's important, it shouldn't be class="redtext" but rather class="important".

Another thing I noticed was somewhat of the opposite problem... using descriptive tags... for stylistic purposes. For instance, does "Reply to Thread" need to be emphasized? Or is it simply bold for stylistic reasons? While I could possibly see that it might be emphasized structurally as part of the page, why wouldn't the topic of the thread it self be emphasized as <strong>?

If you're simply stylizing text for aesthetics then it's a better idea to use a custom stylistic class like "<span class="darktext">" or even <b>.

Like I said, I get too much into this :)

P.S. with your example of wanting to globally change <font> tags, <font> is an inline element like any other element (span, strong, i). And thus you can classify font tags as well <font class="red" color="green">. I don't know offhand which would overtake the other (although I'm guessing CSS) but if the font tag does then you can of course use !important in your CSS. Of course most likely if you're knowledgeable about using classes in the first place (or even selecting fonts, font { color: red }) then you mostly like won't be using fonts. But this info might be useful for someone maintaining an older site, wanting to change font colors with one line ;)

[Gargoyle]

Stop using IE... you mean stop reading AppleNova?
You see, some of us are not permitted to install software on our work PCs. :(

Complain to the IT dept (or whoever can install software) every day until they install firefox for you. Alternately, if you dig around on the net a bit - i believe there is a haxie to fix it.

However, I recommend you complain to the IT dept. Only by replacing crappy MS software when it doesn't perform well is the only way we are going to get rid of it - or make MS sit up and apply much needed features and updates.

www.paulcourt.co.uk <-- My XHTML test page, using alpha pngs for the nice bubble effect. Apart from a few style names that are obviously directly related to the layout, I think I have managed to totally divorce the content from the layout.

[synotic]

www.paulcourt.co.uk <-- My XHTML test page, using alpha pngs for the nice bubble effect. Apart from a few style names that are obviously directly related to the layout, I think I have managed to totally divorce the content from the layout.I suppose you're presenting this for close inspection? ;) Good job on the site, the code especially. Since it seems like you took the effort to efficiently code the site I'm sure you won't mind my suggestions :)

First of all, I suggest removing your XML prolog at the top of your page. By using an XML prolog it causes IE 6 to switch over to quirks mode, which defeats your use of an XHTML transitional doctype. It also seems to cause problems in other browsers. If you check many of your favorite HTML/CSS sites you'll almost see that they don't use it. More info (http://www.webstandards.org/learn/reference/prolog_problems.html).

Is there a reason you're wrapping your H1 in a DIV? It doesn't seem as if you're styling it. Even if you were you could directly style the h1 itself. It just seems a bit unnecessary.

<br>s: we left those behind with table layouts and 1x1 transparent gifs :p As DIVs are block elements they already start on a new line by default. To distance the divs, use a bottom margin.

Will there ever be more than one "main_item"? If not, it would be preferable to use an ID instead of a class. But it seems like you're doing this throughout your page so you probably have a reason for this.

In your footer, a DIV is simply a generic block, it in itself doesn't describe its contents. You also need to wrap the text within it with a <p> tag like so:

<div id="footer"><p>&copy; PMC Networks 2004</p></div>If you want to take it even further, you might consider replacing your "<div id="footer">" with an <address> tag. An address tag is a means of providing information about a website, its maintainers, addresses, phone numbers etc... It may or may not apply for your particular footer, but I'll let you decide on that one. Using an address would let you forego an additional <p> tag as <address> does describe the content it holds. More info here (http://www.htmlhelp.com/reference/html40/block/address.html).

The javascript. Generally I don't like scripts messing around with my windows. But that's your choice. However it seemed to draw the window about 50 pixels from the top and left of my screen, using Firefox on Windows (sorry, I'm on vacation!). JavaScript definitely is not my forté, but I'd look into it. And what better way to end this post than with a complete pointless validation suggestion? :) According to the validator you're missing a type property for your script. If you want to make sure your site validates simply add a type="text/javascript" to your <script> block.

Like I said, the quality of your code is excellent. But because you posted it here I figured you wouldn't mind some small tips :)

[psgamer0921]

Hmm, never noticed it before...
http://img62.exs.cx/img62/4066/stupidie.th.jpg (http://img62.exs.cx/my.php?loc=img62&image=stupidie.jpg)

[DMBand0026]

I'm less concerned about the logo and more concerned about the spelling of favorite in that poll. The letter 'u' has no place in that word. :grumble: :smokey:

[Brad]

Hmm, never noticed it before...
http://img62.exs.cx/img62/4066/stupidie.th.jpg (http://img62.exs.cx/my.php?loc=img62&image=stupidie.jpg) I had no idea IE mutilated the front page that bad. What is it doing to the fonts? And the borders? Sheesh!

Oh well, I should have expected that from IE. :rolleyes:

I'm less concerned about the logo and more concerned about the spelling of favorite in that poll. The letter 'u' has no place in that word.I'm fixing that now! No idea how that typo slipped by...