topbanner_forum
  *

avatar image

Welcome, Guest. Please login or register.
Did you miss your activation email?

Login with username, password and session length
  • Thursday April 18, 2024, 5:52 pm
  • Proudly celebrating 15+ years online.
  • Donate now to become a lifetime supporting member of the site and get a non-expiring license key for all of our programs.
  • donate

Author Topic: Do websites need to look exactly the same in every browser?  (Read 10029 times)

Edvard

  • Coding Snacks Author
  • Charter Honorary Member
  • Joined in 2005
  • ***
  • Posts: 3,017
    • View Profile
    • Donate to Member
Answer:
http://dowebsitesnee...eineverybrowser.com/
 ;D ;D

I stumbled across that page purely by accident, but it made me think...

A very large amount of blood sweat and tears have been shed in the pursuit of this very goal.
The reasons are many and varied, but is it attainable, feasible, practial or even desirable?
What would be good reasons why not?
Post your thoughts...


P.S. That page looks the same in every browser I've tried.

jgpaiva

  • Global Moderator
  • Joined in 2006
  • *****
  • Posts: 4,727
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #1 on: July 08, 2008, 06:18 PM »
I'm not sure what's the intention of the site, but it does look different in Opera (has a shadow behind the text). :)

f0dder

  • Charter Honorary Member
  • Joined in 2005
  • ***
  • Posts: 9,153
  • [Well, THAT escalated quickly!]
    • View Profile
    • f0dder's place
    • Read more about this member.
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #2 on: July 08, 2008, 07:38 PM »
Even if you didn't include any markup, the result would differ from browser to browser, I'm afraid.

I'm afraid we're not going to see pixel-perfect equality anytime soon, the combined html/xlm/css/blablabla conformance required is just too mindbogglingly complex. And since there isn't a "reference" browser (or even a reference renderer for pure html/xml/css without any scripting), it's hard to say what "correct" is, anyway.

As long as stuff is usable in the major browsers (IE6/FF2 and upwards (newer browsers for more complex AJAX/WEB2 stuff)) and doesn't look way off, I guess we should be satisfied.
- carpe noctem

app103

  • That scary taskbar girl
  • Global Moderator
  • Joined in 2006
  • *****
  • Posts: 5,884
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #3 on: July 08, 2008, 07:53 PM »
By every browser, that would include browsers on mobile devices, as well.

Since that page uses CSS, it would not look the same on my pocket pc, which has pIE 3.0 as its browser, and doesn't support CSS.  :D

The background would be white, the text much smaller and located in the upper left, and no image anywhere on the page.

Now would someone want a page to look exactly the same when viewed on the tiny screen of a mobile device? Probably not. As a matter of fact, the mobile version should have less graphics and a few more options than the regular version.

Some of my blogs, for example, when viewed in a mobile browser, presents a link at the top of the page to give the option of skipping the content and going to the sidebar, and the entire site is a single column, with the sidebar content at the bottom.

With more people using web enabled mobile devices than ever before, it is becoming more important to remember those visitors when designing your site.

A site should look similar enough in every browser to be recognizable as the same website though. Imagine coming here in IE and seeing a nice blue themed forum and a bird mascot, and in Firefox seeing green and a snail. Your first impression after seeing it in IE first would be "I think I am on the wrong site".

But I believe it is ok to have those slight subtle differences in appearance that so many web designers lose sleep over, as long as the basic look is similar enough to retain the identity of the site. Your visitors won't mind that the bottom border is missing on long pages when viewed in IE but not in Firefox, and your loved ones would appreciate the extra time to spend with you that you would have wasted on something so silly. (now, if the footer and its content is missing, that's another story)

app103

  • That scary taskbar girl
  • Global Moderator
  • Joined in 2006
  • *****
  • Posts: 5,884
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #4 on: July 08, 2008, 08:08 PM »
Oh, and the person that designed that page forgot something vital that leads to a really horrible effect when viewed by some people...not all browsers on all OS's support transparency in PNG, such as IE 6 on a 9x system. He should have used a .gif.  ;)

SNAG-00048.pngDo websites need to look exactly the same in every browser?

nite_monkey

  • Member
  • Joined in 2006
  • **
  • Posts: 753
    • View Profile
    • Just Plain Super
    • Read more about this member.
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #5 on: July 08, 2008, 08:59 PM »
I stay away from png images because of how they don't work in ie 6. I try to use gif images instead
[Insert really cool signature here]

app103

  • That scary taskbar girl
  • Global Moderator
  • Joined in 2006
  • *****
  • Posts: 5,884
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #6 on: July 09, 2008, 12:17 AM »
png is fine, as long as it doesn't contain any transparent areas. IE6 has no problems displaying ones that are 100% opaque, and if you go for that option instead of .jpg, you can get a smaller file size with much better quality. And smaller file sizes make faster loading pages.

fenixproductions

  • Honorary Member
  • Joined in 2006
  • **
  • Posts: 1,186
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #7 on: July 09, 2008, 06:17 AM »
Badly written example imho.

Personally I would use APNG for it:
- animation in PNG is supported in Opera 9.5, Firefox 3.0 and Safari (IIRC),
- transparency definitely not supported in IE <= 6.

I would use different "h1" styles:
- simple "h1" for older browsers (IE6),
- "html>body h1" for newer ones (IE7, Opera, Fx).

And at the end try to show "box model" problems ;)

BTW Text shadow is supported in Opera 9.5 only. OK, being honest: I don't know about Safari too.

app103

  • That scary taskbar girl
  • Global Moderator
  • Joined in 2006
  • *****
  • Posts: 5,884
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #8 on: July 09, 2008, 06:32 AM »
Seriously, if I wanted it to look the same in every browser, I would pretend it was 1994, use very simple HTML, simple design, jpg/gif....and no animations, since pIE 3.0 doesn't support animated gif's beyond showing the first frame as a static image.  :D


f0dder

  • Charter Honorary Member
  • Joined in 2005
  • ***
  • Posts: 9,153
  • [Well, THAT escalated quickly!]
    • View Profile
    • f0dder's place
    • Read more about this member.
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #9 on: July 09, 2008, 06:55 AM »
png is fine, as long as it doesn't contain any transparent areas. IE6 has no problems displaying ones that are 100% opaque, and if you go for that option instead of .jpg, you can get a smaller file size with much better quality. And smaller file sizes make faster loading pages.
PNG won't be smaller than JPEG for the image types JPEG is good at handling... GIF vs. PNG is another issue, imho there's usually not that big different between the two, but I prefer PNG.

It always annoys me when people end up using PNG for photos (unless they very specifically want lossless), or JPEG for screenshots... especially JPEG for screenshots is bad, filesize isn't that great, and the compression artifacts look ugly.
- carpe noctem

fenixproductions

  • Honorary Member
  • Joined in 2006
  • **
  • Posts: 1,186
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #10 on: July 09, 2008, 07:09 AM »
2f0dder
For me 256 (GIF) and 24-bit (PNG) colours palette might be big difference. And also: GIF files presents transparency only (takes one colour from palette) while PNG gives variable opacity with whole alpha channel.

Little info:
http://www.w3.org/QA/Tips/png-gif

f0dder

  • Charter Honorary Member
  • Joined in 2005
  • ***
  • Posts: 9,153
  • [Well, THAT escalated quickly!]
    • View Profile
    • f0dder's place
    • Read more about this member.
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #11 on: July 09, 2008, 07:57 AM »
For me 256 (GIF) and 24-bit (PNG) colours palette might be big difference. And also: GIF files presents transparency only (takes one colour from palette) while PNG gives variable opacity with whole alpha channel.
-fenixproductions (July 09, 2008, 07:09 AM)
True, true - I was thinking in terms of "use on the web", though, since this thread is about browsers. For web use PNG alpha is troublesome, because older browsers don't support it properly. And PNG with more than 8bit colors take a lot of space, and (when talking photographs and the like) is usually better handled by JPEG.
- carpe noctem

Edvard

  • Coding Snacks Author
  • Charter Honorary Member
  • Joined in 2005
  • ***
  • Posts: 3,017
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #12 on: July 09, 2008, 10:41 AM »
Good insights, all...

Especially notable the comments on mobile devices and older systems. I wonder if there is a tool to allow you to see how stuff looks on different platforms? I know there is a tool to see how your webpage looks at different resolutions, and even simulate loading through a dial-up connection, but is there a multi-platform simulation tool?


f0dder

  • Charter Honorary Member
  • Joined in 2005
  • ***
  • Posts: 9,153
  • [Well, THAT escalated quickly!]
    • View Profile
    • f0dder's place
    • Read more about this member.
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #13 on: July 09, 2008, 10:45 AM »
I wonder if there is a tool to allow you to see how stuff looks on different platforms? I know there is a tool to see how your webpage looks at different resolutions, and even simulate loading through a dial-up connection, but is there a multi-platform simulation tool?
For IE, I'm afraid you need multiple vmware guests with different IE versions... unless somebody knows a reliable magic trick to have multiple IE cooperate on one windows install. A single tool that would render using multiple engines could be immensely helpful, but I doubt it exists - besides, rendering is only part of the story, you also need DOM/javascript testing >_<
- carpe noctem

fenixproductions

  • Honorary Member
  • Joined in 2006
  • **
  • Posts: 1,186
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #14 on: July 09, 2008, 02:16 PM »
This site might come handy:
http://browsershots.org/

f0dder

  • Charter Honorary Member
  • Joined in 2005
  • ***
  • Posts: 9,153
  • [Well, THAT escalated quickly!]
    • View Profile
    • f0dder's place
    • Read more about this member.
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #15 on: July 09, 2008, 02:18 PM »
This site might come handy:
http://browsershots.org/
-fenixproductions (July 09, 2008, 02:16 PM)
That site might be interesting if you found some really nasty exploits for various browsers on various OS'es... :] (let's hope they sandbox, and sandbox properly).
- carpe noctem

fenixproductions

  • Honorary Member
  • Joined in 2006
  • **
  • Posts: 1,186
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #16 on: July 09, 2008, 02:23 PM »
2f0dder
About multiple IEs:
http://tredosoft.com/Multiple_IE

It is working good enough to check your website look. Unfortunately: it cripples IE7 installation (no ActiveX, no add-ons) but it is the best solution for one virtual OS (here: WinXp in VirtualPC 2007) after all.

app103

  • That scary taskbar girl
  • Global Moderator
  • Joined in 2006
  • *****
  • Posts: 5,884
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #17 on: July 09, 2008, 02:55 PM »
This might be a good tool for some testing for backwards compatibility:

http://www.delorie.com/web/wpbcv.html

Lashiec

  • Member
  • Joined in 2006
  • **
  • Posts: 2,374
    • View Profile
    • Donate to Member
Re: Do websites need to look exactly the same in every browser?
« Reply #18 on: July 10, 2008, 08:16 PM »
BTW Text shadow is supported in Opera 9.5 only. OK, being honest: I don't know about Safari too.
-fenixproductions (July 09, 2008, 06:17 AM)

It also showed a shadowed text in Konqueror, so I guess Safari would do the same (sharing up to some extent the same engine, and all)