Author Topic: Internet Asploder  (Read 5871 times)

0 Members and 1 Guest are viewing this topic.

Offline Firehazard

  • Hero Member
  • Slightly used and mostly confused!
  • *****
  • Male
  • Posts: 1414
    • My FurAffinity
Internet Asploder
« on: October 27, 2007, 04:03:31 pm »
I don't know why I didn't think to ask this here sooner.  I've been working on setting up the website for my comic strip "Mandy", and I have a dummy page or two up on my temp. server, but I'm having some issues with the layout, and getting it to show up correctly in Internet Explorer.

Here's the site.

First is the CSS "max-width" thing I'm using to keep the whitespace within the limit of 840 pixels wide without forcing users to scroll if their window is narrower than that.  Firefox picks it up just fine, but IE doesn't.  Which is weird, because I've seen other sites use it and it works fine.  Is there some trick to getting it to work in IE?

Second is the way IE displays PNGs versus GIFs.  I use a PNG for the center logo and edges, and GIFs for the tiling part because I only need a hundred or so distinct colors on that.  But when they line up side-by-side, the GIFs are noticeably lighter in color.  (This is true in IE 6 and 7.)  Why is this?
Quote from: Savaaha
We have a 27in westinghouse hd flat widescreen TV, Tak has it connected up so its our TV and his comp monitor. We had it since 2009 and its going great.

Art by me.

Offline Nocte

  • Hero Member
  • *****
  • Male
  • Posts: 1689
    • http://unicorn.furtopia.org/
Internet Asploder
« Reply #1 on: October 29, 2007, 06:36:10 pm »
Quote (Firehazard @ Oct. 27 2007, 10:03 pm)
First is the CSS "max-width" thing I'm using to keep the whitespace within the limit of 840 pixels wide without forcing users to scroll if their window is narrower than that.  Firefox picks it up just fine, but IE doesn't.  Which is weird, because I've seen other sites use it and it works fine.  Is there some trick to getting it to work in IE?

Yeah; instead of implementing CSS 2, the folks at Microsoft thought it would be better to put a lot of effort in adding javascript to CSS instead.  This page shows how hack max-width this way.

Quote
Second is the way IE displays PNGs versus GIFs.  I use a PNG for the center logo and edges, and GIFs for the tiling part because I only need a hundred or so distinct colors on that.  But when they line up side-by-side, the GIFs are noticeably lighter in color.  (This is true in IE 6 and 7.)  Why is this?

I would recommend to use PNG there as well.  It's not just for true color images; PNG can also do indexed color, and more efficient than GIF too.

PNG has a couple of great features for color correction, that will ensure a proper reproduction across all devices.  Unfortunately, a lot of other standards (CSS, GIF, JPEG) do not supply such information.  It is assumed that the colors are just passed verbatim to the OS.  So until the glorious day arrives where the entire web is color managed, all browsers ignore this information in PNG.  Well, all of them except for one.  (It is kind of ironic that IE follows the standards to the letter in the one place where this might be a bad idea for now.)

The solution is to use PNGs without this information, or with a gamma set to 0, or not to mix them with GIF.  If you need to blend icons with a background, this is also not a problem if you use transparency.
Drawing tutorial
Avatar information
FEHu3a A+ C D-- H M- P R++ T W-- Z Sm- RLCT a cl++++ d+ e+++ f- h+++ i++ j p sm*

Offline Richard K Niner

  • Sr. Member
  • Indecision incarnate canine
  • ****
  • Male
  • Posts: 341
    • K9 Unit
Internet Asploder
« Reply #2 on: October 29, 2007, 08:21:47 pm »
Usually, when I run into these problems, I just try another approach.  The max-width doesn't really remove any scrolling problems versus other methods, other than in the 835-840px width range (835 is the minimum, thanks to those images at the top)

As such, you can probably get away with using the width property instead.

Offline Firehazard

  • Hero Member
  • Slightly used and mostly confused!
  • *****
  • Male
  • Posts: 1414
    • My FurAffinity
Internet Asploder
« Reply #3 on: November 02, 2007, 12:53:23 am »
Thanks guys.  I'll see if I can make that thing work.

By the way, I beg to very much differ on the PNG color profile thing.  I loaded up my site in Safari on the Mac, and holy crud were those colors ever muddy in the PNGs.  I'd much rather define straight RGB values, which may not display perfectly in print, but will at least be bright enough. *sigh*
Quote from: Savaaha
We have a 27in westinghouse hd flat widescreen TV, Tak has it connected up so its our TV and his comp monitor. We had it since 2009 and its going great.

Art by me.

Offline Richard K Niner

  • Sr. Member
  • Indecision incarnate canine
  • ****
  • Male
  • Posts: 341
    • K9 Unit
Internet Asploder
« Reply #4 on: November 02, 2007, 07:25:18 am »
Quote (Firehazard @ Nov. 02 2007, 12:53 am)
Thanks guys.  I'll see if I can make that thing work.

By the way, I beg to very much differ on the PNG color profile thing.  I loaded up my site in Safari on the Mac, and holy crud were those colors ever muddy in the PNGs.  I'd much rather define straight RGB values, which may not display perfectly in print, but will at least be bright enough. *sigh*

This is the real problem with PNG's gamma correction: it should be monitor-specific, but gamma values are actually OS-specific.

Offline Firehazard

  • Hero Member
  • Slightly used and mostly confused!
  • *****
  • Male
  • Posts: 1414
    • My FurAffinity
Internet Asploder
« Reply #5 on: November 07, 2007, 01:56:49 pm »
Actually I think the real problem is that the newspaper staff adjusted something so that the paper would display like CMYK.  The problem is that it ended up applying to iMovie, the iTunes video player, Preview, Photoshop, and stuff.  But most screen elements are acceptably bright.

Anyway, thanks for the link, Nocte.  I had to add a centered attribute to the DIV also to make it center, and it's still off-centered by one pixel for some reason, but it works.
Quote from: Savaaha
We have a 27in westinghouse hd flat widescreen TV, Tak has it connected up so its our TV and his comp monitor. We had it since 2009 and its going great.

Art by me.