Identify the browser based on the screenshot

X-Istence

*
Political Access
Joined
5 Dec 2001
Messages
6,498
Okay, so I am developing a website for the company I currently work for, I have included three screen shots, can you identify which browser is which based on the font smoothing it does?

Also, can you based on these screen shots tell me which one I hate developing for the most because the fonts never seem to look right no matter what I do?
 

Attachments

  • sample1.png
    sample1.png
    15.7 KB · Views: 159
  • sample2.png
    sample2.png
    16.6 KB · Views: 161
  • sample3.png
    sample3.png
    12.8 KB · Views: 158
Last edited:

zeke_mo

(value not set)
Staff member
Political Access
Joined
25 Aug 2004
Messages
1,991
opera, firefox, ie

you hate the third one, because nobody likes developing pages for IE

just a guess :p
 

Heeter

Overclocked Like A Mother
Joined
8 Jul 2002
Messages
2,732
Safari, IE, Firefox


You hate Safari.


Heeter
 

Perris Calderon

dealer
Staff member
Political Access
Joined
24 Jan 2002
Messages
12,374
I have no idea but I'm surpised nobody mentioned chrome and opera in there guesses

I've never had trouble with rough fonts in ie so I wouldn't think that was it, though maybe you're talking about without the smooth font feature enabled?

[edit]I did a quick google and see the only browser uses correct font weight would be firefox 3 on a mac so they're all gonna get it wrong?[/edit]

double edit

I see teh zeke suggested opera as he points out below;

vvvvvvvvvvvvvvvvvvvvvvvvvvvvv
 
Last edited:

zeke_mo

(value not set)
Staff member
Political Access
Joined
25 Aug 2004
Messages
1,991
I have no idea but I'm surpised nobody mentioned chrome and opera in there guesses

I've never had trouble with rough fonts in ie so I wouldn't think that was it, though maybe you're talking about without the smooth font feature enabled?
ahrm
 

gonaads

Beware the G-Man
Political Access
Joined
31 Mar 2002
Messages
18,474
IE8, Opera and Safari


X-Istence don't use no Firefox! :p

Umm, Safari?
 

zeke_mo

(value not set)
Staff member
Political Access
Joined
25 Aug 2004
Messages
1,991
you should PM me the answers :p
 

X-Istence

*
Political Access
Joined
5 Dec 2001
Messages
6,498
Safari, IE, Firefox

You hate Safari.

Heeter

Close. You missed one out of three. Safari is actually my favourite browser, followed by Chrome. WebKit is an awesome rendering engine, AND so far has given me the least trouble developing this website. Based on rendering engines, you win a prize :) The only difference between Safari and Chrome is that Safari uses "no file selected" and Chrome uses "No file chosen".

Chrome, IE, Firefox is the order.

IE8, Opera and Safari

X-Istence don't use no Firefox! :p

Umm, Safari?

Nope, entirely wrong. And while I generally don't use Firefox, unfortunately it is required when designing and building a website. Firefox is bloated and slow compared to Chrome and Safari on Windows and Mac OS X respectively.

ie6 ie7 ie8 :D

Yeah, this page does not render correctly in IE 6 :p Completely wrong.

---

IE is actually the browser giving me the most trouble, it does some weird funky stuff to the fonts while attempting to ClearType or font smooth them. Neither FireFox nor Chrome exhibit the same behavior, it causes certain font choices to look bad in IE. I show case the website in Chrome or FireFox and the fonts look just fine and my boss likes it, show it in IE and the fonts just look fuzzy, not sharp, unpleasing and he does not like it. I don't know how to fix it, turning off font smoothing/clear type does absolutely nothing. This issue also comes up when using bold on the font, in Chrome and Firefox it looks good, and the font is readable without a headache, in IE it is fuzzy and causes headaches when look at for too long. Not sure why that is.

Not only that, but if IE 7 is not in strict mode, certain properties just don't work, for example on an image you can give it margin's and padding. Generally used to move the image around, or if it is wrapping text to cause it to have some space around it rather than having the image sit right up against the text. So you put it into strict mode with a XHTML doctype, and suddenly padding and all that jazz works, BUT it changes the way it renders lists, which I am using to create the menu that is located in the header of that page (not in screenshot), so while in Chrome and Firefox there is a gap in between the header items, there is none in IE. So I had to widen the gap for all browsers, just so that IE has a small gap.

That is not to say that the other browsers are not without flaws, Chrome renders text-area boxes wrong. It gives them a bigger width than what I have specified. (Chrome is Sample 1). That may have to do with the ability to resize the text area box using the little grip handle. It makes the form look out of place though, as if I had not cared to make it the same size. I will probably end up submitting a bug report for it. It is an issue with WebKit, hopefully one that will get fixed :-D.

The other issue I have ran into is that all of the browsers use different handling schemes for when an image is missing. Opera, Chrome, Safari all interpolate the value of a missing image based on other knowledge about the page. For example, if you have the same piece of code written on a page, with just different text, but same layout (divs and all) it will make the missing images have the exact same size as the images that do exist, thereby not screwing up the entire formatting of the page. This way if you have 4 div's with images floating in them, two of the images exist and they both are 150 x 150, for the other 2 div's that are supposed to have floating images but don't because they don't exist they will just put placeholders of size 150 x 150 in, EVEN if the width/height is not set in the HTML or CSS. Firefox will just put the Alt text into the document, thereby causing layout issues, and IE will make the picture 100% of whatever container it is in (in my case a div). Will write a test case for this sometime later today to showcase this behaviour.

Sure, missing images is bad, but I believe that the behaviour that WebKit, and Opera exhibit is the right one, this may take more time/code to get to that point but the effect is more pleasing.

The last bit that is annoying is that IE and every other browser entirely disagrees on the box model and how the various parts should be applied, I have the case right now where IE puts a certain element 1 pixel higher than every other browser, which means that instead of having it be flush to the bottom of a div, there is a 1 pixel gap. Now, I have fixed this in such a way that in IE while the element is sitting higher you you won't notice it, but it is rendered correctly in all the other browsers. I can sit and bang my head against the desk all day, but it won't help fix those issues with IE. It is highly annoying stuff like that happens since it means more work for me. (See attached images, I know they are not that great, but mspaint sucks, see how the ie7 one the element is sitting higher than in the webkit screenshot?)
 

Attachments

  • webkit-pxwin.JPG
    webkit-pxwin.JPG
    3.5 KB · Views: 114
  • ie7-pxfail.JPG
    ie7-pxfail.JPG
    3.8 KB · Views: 108

gonaads

Beware the G-Man
Political Access
Joined
31 Mar 2002
Messages
18,474
Is there something wrong with those attachments, or am I dreaming?
 

X-Istence

*
Political Access
Joined
5 Dec 2001
Messages
6,498
Is there something wrong with those attachments, or am I dreaming?

Other than that I only grabbed a small part of the website as I am not allowed to show the website until it launches publicly, no there is nothing wrong with it. The screenshots show the issue with IE.
 

fitz

Woah.. I'm still here?
Political Access
Joined
26 Apr 2004
Messages
4,084
IE has always seemed to treat the box model incorrectly - Last time I did any sort of development was for IE6 - and I HATED dealing with the box models of IE..

edit: seems like things haven't changed too much with IE and box model issues
 

X-Istence

*
Political Access
Joined
5 Dec 2001
Messages
6,498
IE has always seemed to treat the box model incorrectly - Last time I did any sort of development was for IE6 - and I HATED dealing with the box models of IE..

edit: seems like things haven't changed too much with IE and box model issues

It has gotten better, at least a little bit which is really surprising. It still has many issues though, which makes it a pain in the behind to deal with ...
 

Members online

No members online now.

Latest profile posts

hello peeps... is been some time since i last came here.
Electronic Punk wrote on Sazar's profile.
Rest in peace my friend, been trying to find you and finally did in the worst way imaginable.
Terrahertz wrote on Electronic Punk's profile.
Yo fellas!
Electronic Punk wrote on Sazar's profile.
Where are you buddy?
Perris Calderon wrote on Electronic Punk's profile.
Hey EP! All good with me, applying for Microsoft MVP right now, should have done this a while ago.

Notifications don't work, I only found your response by coming back to hunt up some threads, if you want, give me your email address so we can keep in touch easier!

Forum statistics

Threads
61,999
Messages
673,426
Members
5,593
Latest member
moussa021