Internet Explorer 8 vs web page coding

[zappaDPJ]

An increasingly large part of my work is based on website design and build. In the past I've focused on the design, layout and quality assurance, leaving the coding to employees. Due in part to the recession and also my desire to learn something new I've recently started coding the sites myself. I've always been able to hand code in HTLM but I'm now using Dreamweaver to create HTLM/CSS based code. While it's far too early in the day to consider myself a particularly skilled coder I do know enough to recognise when there is a problem.

I'm sure everyone with any knowledge of web page coding will be aware of the need to validate their code across as many browsers as possible. I've just upgraded the browser on my workstation from IE7 to IE8 and I'm astounded at just how many websites are not displaying correctly including most of my own. I can even find graphical anomalies on IDNet's site.

Admittedly IE8 does contain a compatibility button which fixes some of the problems (all of them on IDNet's site) but I have to ask why on earth Microsoft has chosen to create a web browser that's incapable of resolving basic HTML/CSS coded websites correctly. It's particularly annoying that every single site I've viewed so far has a border placed around hypertext links on activation. That indicates a broken browser, not broken code. It also appears in many cases that certain information contained in one element is not being interpreted correctly in another if the second element is a child of the first.

The bottom line is why bother creating a browser that breaks almost every website ever written?

[zappaDPJ]

Hmmm, why did I just quote myself?

[Quoted post deleted]

Actually I retract that, the compatibility button doesn't remove the borders around hyperlinks but it does play merry hell if clicked while make a forum post!

[kinmel]

I.E. is the most used browser and most I.E. users are ignorant of the various web design codes.

By wilfully failing to adhere to the recognised protocols, Microsoft hope to browbeat website designers into making their sites IE compatible.

Once this is achieved, then to the masses it is the other browsers that are "broken" and not IE.  Why would you then change to a browser that was not compatible with IE ?

World domination doesn't come east you know.

[zappaDPJ]

Having just read some of the replies made by the IE development team to bug reports raised during the testing phase I'd say you are 100% right.

[psp83]

Personally i dont have many issues with IE7 or IE8.

My problem is IE6, i HATE that browser. You tell a div to have padding-right: 20px or margin-right: 20px and IE6 always adds half or double the pixels! so it breaks your design as IE6 thinks your divs are bigger than the container, bloody annoying.

We've tested all our sites at work and they work in FF2, FF3, IE6, 7, 8, Opera & Safari.

[zappaDPJ]

Yeah that is really annoying, it took me a while to work out why some of my sites where breaking in IE6 and even longer to fix them.

I still can't work out why IE8 is rendering clicked hyperlinks with a border. I doesn't happen on every site and it's far more obtrusive on dark sites but it looks quite bad on any site imo.

I've attached a couple of examples.

[attachment deleted by admin]

[Rik]

Fairly typical MS behaviour unfortunately. The pay lip service to standards, then enforce their own.

[psp83]

As Rik has said, the dotted border is a typical IE thing. A client asked us to remove it from IE and my response was "i would love to re code IE but i dont think you could afford the price" lol.

EDIT: You should only get that when you click on a link or hover over one.

[Ann]

Dreamweaver is a nightmare.. WYSIWYG it is not.. I use it for our work website and often have to go into the HTML to see what's going on.

[psp83]

I use Zend mostly, But use dreamweaver (in source code viewer) when working on projects that have more than one person on it.

HTML view > Design View.

[Sebby]

Dreamweaver is a nightmare.. WYSIWYG it is not.. I use it for our work website and often have to go into the HTML to see what's going on.

Surely that's the fault of the browser, though?

[Ann]

Sometimes it's the coding.  It adds heights into tables and things although they look as though they are fine but when you look in the browser there's a great empty space at the bottom.  You then have to go into the HTML and delete the height tag and it resets.  Sometimes it is the browser such as when it decides to centre things which Dreamweaver assumes will be left oriented in a table.  Telling it to left things fixes that although it ought maybe to be unnecessary.  Sometimes it also adds extraneous tags which are a mess and I don't like messes so I try to tidy it up.

[psp83]

Sometimes it's the coding.  It adds heights into tables and things although they look as though they are fine but when you look in the browser there's a great empty space at the bottom.  You then have to go into the HTML and delete the height tag and it resets.  Sometimes it is the browser such as when it decides to centre things which Dreamweaver assumes will be left oriented in a table.  Telling it to left things fixes that although it ought maybe to be unnecessary.  Sometimes it also adds extraneous tags which are a mess and I don't like messes so I try to tidy it up.

Use notepad and type it all by hand = no problems then 

[zappaDPJ]

As Rik has said, the dotted border is a typical IE thing. A client asked us to remove it from IE and my response was "i would love to re code IE but i dont think you could afford the price" lol.

EDIT: You should only get that when you click on a link or hover over one.

I general that does seem to be the case, a click on the hyperlink gives a guaranteed border but it also occasionally occurs under other circumstances that I can't quite pin down, perhaps a previously visited link after using the 'Back' button.

As for Dreamweaver, it serves a purpose but I'd agree that it doesn't always correctly rendering the code but then the same can be said for many of the browsers that are in use. I use it because it was the editor of choice for my employees but if I'm honest I don't like it enough to use it correctly. I still generally edit the source in HTML View and use Design View to check my container box parameters are doing what was expected. When I have some free time I'll look around for something more suited to the way I like to work, probably Notepad  

[EDIT] I was just about to submit that and saw psp's new reply. It's agreed then Notepad IS the HTML editor of choice 

[Rik]

It can't make a mistake.

[psp83]

I use Zend Developer (not cheap) but its good for PHP and MySQL and not so good for (X)HTML unless you know what your doing with (X)HTML

The other editor i use is notepad++, its much better than the windows basic notepad and its free 

I never use design view and i hardly use the "auto insert" features in most programs like dreamweaver, i like to have full control over how i format my code and what styles goes in my tables/divs etc.

Another tip is to use a program like "texter", basically its a program where you make shortcuts to code blocks your tend to use all the time, eg, contact form layout.. read more about it here : http://lifehacker.com/software/texter/lifehacker-code-texter-windows-238306.php

[Rik]

Thanks, Paul. 

[Lance]

I think i know who to ask next time i need help with some coding for this place!

[psp83]

I think i know who to ask next time i need help with some coding for this place!

Who, Rik? lol.

Seriously though, if i'm not busy and you need(ed) help, i would lend a hand.

Been building websites for 11yrs.

[Ann]

Notepad is what I use I for my own website but that's a fairly simple one.  At work we have to use Dreamweaver and use the corporate template so we get no choice.

[Cookie]

Yeah that is really annoying, it took me a while to work out why some of my sites where breaking in IE6 and even longer to fix them.

I still can't work out why IE8 is rendering clicked hyperlinks with a border. I doesn't happen on every site and it's far more obtrusive on dark sites but it looks quite bad on any site imo.

I've attached a couple of examples.

I'm fairly new to this web programming lark but I initially got borders around my link images when I clicked on them in Firefox and Opera as well IE7.  I got rid of it by setting the border attribute for the image to zero, although a tidier way would be to use a CSS rule.

This is nothing more than a guess but 'border' is a deprecated attribute according to the W3C standards. Perhaps Microsoft have gone a bit overboard with their standards compliance and stopped supporting the border attribute in IE8 (assuming its been used in your code examples of course).   Or I might be barking up the wrong flag pole completely 

I've got into the habit of running all my XHTML code through the W3C validators http://validator.w3.org/#validate_by_input and http://jigsaw.w3.org/css-validator/#validate_by_input.  You'd be surprised at the number of sites that don't meet these standards. 

Cheers

Martin 

[Sebby]

Good point, Martin. I firmly believe that all sites should conform to web standards, although it's not always possible as you have to hack you code so it works in IE!

[psp83]

Good point, Martin. I firmly believe that all sites should conform to web standards, although it's not always possible as you have to hack you code so it works in IE!

It is possible, our sites at work pass w3c checks and thats with IE hacks.

Just use IE css file.

<link href="style/public.css" rel="stylesheet" type="text/css" media="screen" />
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="style/public-ie.css" media="screen" />
<![endif]-->

<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="style/public-ie7.css" media="screen" />
<![endif]-->

And you could also use _ (underscore) infront of your css for IE6, eg.

.blueBox {
width: 325px;
height: 325px;
border: none;
background-color: blue;
padding: 10px;
_padding: 5px;
}

But this way is old and i dont use it myself as i dont think it passes w3c validation anymore.

[psp83]

for the original poster.

try adding these styles to your stylesheet.

a {
  outline: none;
}

:focus {
  -moz-outline-style: none;
}

This should get rid of the dotted borders put around link

[psp83]

code above will work on all links, including this forum if you wanna use it.

[Sebby]

[Lance]

Thanks Paul

[Rik]

Thanks, Paul.

[zappaDPJ]

code above will work on all links, including this forum if you wanna use it.

It certainly does, thank you so much for posting that, I really appreciated it   

[psp83]

no prob, i like to help where i can. plus we've just been paid to fix it on another site so why not share it 

[Rik]

 

Even better. 

[colonelsun]

Had to completely rollback IE 8 as it conflicted with PayPal. I couldn't make any payments on their website as the page loaded incorrectly with clickable buttons over the text, some of the text was missing anyway and the 'PAY' button was nowhere to be seen. A fruitful 30 minutes on Google led me to a Microsoft help page that rolled back the browser to IE 7 without losing my settings and PayPal works for me now.

Personally i thought IE 8 was bloated.

[Sebby]

Did you try compatibility mode?

[colonelsun]

Sebby...yeah tried that and the most important part of the PayPal page wouldn't load, the 'pay' button.

Apart from a few new security add ons i couldn't see the benefits of IE 8, they were completely lost on a regular internet user like me.

[Sebby]

Tbh, I actually quite like IE8, but I would never choose to use IE as my main browser when there are much better alternatives, such as Firefox.

[colonelsun]

Tbh, and i'm nearly choking on my jammy dodger biscuit here, IE 8 seemed a bit faster than IE 7 but i hated the way it looked cluttered around the top of the screen, especially where the URL box was....far too distracting for me.

[Den]

At one time or another I have tried most of the brousers but I keep returning to IE and I truly think that IE8 is the best of the lot but I suppose Firefox would be my second choice. 

[Niall]

Does anyone actually like the new IE8? I've been forced to use it for a couple of things recently. Last night at a party I found myself spending 3 hours fixing someone's network, which only had IE8 installed. That browser is very bloated and sluggish compared to Firefox. For a change I actually gave IE a proper chance, and only installed Firefox on their computers after spending what felt like an ice age waiting for it to load certain websites I was downloading security software from, and installing all updates, etc.

It's horrid

[Rik]

I think so, Niall, but others like it. I guess it will always provoke a love/hate reaction.

[Simon]

I was also installing a router on a friends PC yesterday afternoon, and as the Windows Updates icon was present, I thought I might as well get them up to date, and lo and behold, IE8 appeared!  I only had a very quick glance, and it didn't look much different to IE7 to me, but then, they use Firefox anyway, so hopefully, it won't be an issue.

[Sebby]

I dislike IE, full stop, and won't use it unless I'm forced to (i.e. at work). That said, I do feel that IE8 is the best version yet.

[Simon]

I'm actually on it now, just for testing, and the forum looks fine on it.  

[Rik]

That's a relief.

[Sebby]

Well we have got the compatibility tag in there, so it should be fine.

[Rik]

Phew.

[colonelsun]

With IE 8 you'll find that Microsoft are always asking you to download security patches or updates. Why on earth they didn't just secure IE 7 and clean it up a bit...i don't know. But IE 8 is worringly a heavy download and 10 minutes later i was advised there was a whole clutch of patches for it....hardly inspiring is it?

But it's what you're most comfortable with. I just thank god AOL aren't in the browser market.

[Rik]

They were for a time, of course.

[Niall]

And what a shockingly bad one it was

[Rik]

 

Though my first browser, back when you paid for them, was Netscape.

[colonelsun]

AOL was my first ever ISP and so my first contact with the internet. An AOL rep once told me to stick with the AOL browser because IE had a tendency to fry your hard drive...yes honestly.

After about 6 months, getting used to the internet, solving computer problems myself, i thought it rather daring to close the AOL browser and click on the IE button. You've never seen so much sweat on one person's body before, except perhaps Paula Radcliffe when she stopped for an impromptu pee during the London Marathon and the good old BBC filmed every moment......so i exited the room with my pc in it and simply ran for it. Fifteen minutes later, clutching a cigarette and 2 sets of rosary beads, i entered the room to survey the damage. And IE stared back at me in all it's bewildering glory. There was no burnt hard drive and i never looked back.

I never contacted AOL again apart from their live customer services rep when i had speed issues. And i quickly told her what i thought of her when she suggested my slow broadband speed was due to the fact i had an earring.

[Sebby]

Brilliant!

[Rik]

The classic support call to AOL.

[Gary]

Sebby...yeah tried that and the most important part of the PayPal page wouldn't load, the 'pay' button.

Apart from a few new security add ons i couldn't see the benefits of IE 8, they were completely lost on a regular internet user like me.

Used IE 8 yesterday with paypal, no problems,  was having another play with it as its as fast on my system as FF really, not a lot between them  most odd if its set to compatibility mode all the time you should have no issues, or when you arrive at the site click the compatibility icon, maybe if you did that during the process it would cause an issue as you were changing how the browser appeared to the site during a transaction

[Sebby]

It's funny how IE is a still a bit of a joke (although I still think it's the best version so far).

[Rik]

I discovered yesterday that the 3 dongle doesn't really like to top up via FF, it's much happier with IE.

[Sebby]

Interestingly, you don't see many sites these days that don't work well in FF. A few years back, it was a different story.

[Rik]

It worked when I did the top up from the dongle software, which launched FF. However, when you first top up with a card, they take your money but won't let you apply the top up immediately, requiring 7 days to clear the card. I phoned them and a guy walked me through doing it manually, by FF returned an SSL error, IE worked.

[colonelsun]

Used IE 8 yesterday with paypal, no problems,  was having another play with it as its as fast on my system as FF really, not a lot between them  most odd if its set to compatibility mode all the time you should have no issues, or when you arrive at the site click the compatibility icon, maybe if you did that during the process it would cause an issue as you were changing how the browser appeared to the site during a transaction

Not really sure, and i can't really remember, what i did about the compatability thing during the install of IE 8. I have a hunch i may have simply followed the install instructions so as to not to get into difficulties later. So that strategy really paid off. LOL