SitePoint Sponsor

User Tag List

Page 1 of 3 123 LastLast
Results 1 to 25 of 57
  1. #1
    SitePoint Addict
    Join Date
    Aug 2007
    Posts
    365
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Designing for IE

    Hey

    I'm am currently developing a web site and haven't had a lot of experience in HTML and CSS.

    I am having trouble getting it working in ie6, and at the moment I have to vire it at work, and then modify it at home, and just cant get things working correctly.

    How do you deal with these types of problems?

    I also cant seam to position the login box in the top right on ie6.

    If you want to see what I have, it can be accessed at http://taliesin.mine.nu:8080 for the next few days..

    Thanks

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,700
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Keep strong divisions between the html/css/javascript.

    Simplify the problem by removing code, so that you're left with a bare minimum of html/css that demonstrates the layout problem that you're facing.

    By the time you reach the simplified example that demonstrates the problem, you may already know what causes it in the first place so you can solve it right there and then.

    If you can't simplify things any further and you still don't know the cause, the simplified version will be incredibly easy to understand when you show it to others, and solutions will be a lot easier for them to find for you.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,276
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    How do you deal with these types of problems?
    Get a copy of IE6 for viewing at home. You're coding blind, and then can see at work. That's no way to develop: you'll have so many bald spots, you might as well just shave it all off.

    There are various things like IETester, evolt IE's, Wine for Linux, Tredosoft Multiple IE's (the one I use for older IE's, though currently only runs on XP, not Vista)... those are emulators, and aren't always exactly the same as a native IE6.

    Then there are separate operating systems: VirtualBox and VirtualPC basically hold a separate copy of Windows, on which you can have a native IE6.

    At the very least, in your case, you could even get a benefit from something like browsershots.org. I don't use them partially because it takes me forever to even see a screenshot, and it forces me to take my robots.txt off my server for that time, but since you're waiting a day anyway, you would be able to take several looks while still at home in IE6.
    It also has the disadvantages of not letting you actually "see" your page, or play with it: no hovering over links, no changing screen size dynamically, no checking of Javascript or Flash etc. Sometimes you won't even get to see "below the fold", as sometimes the whole page isn't seen.

    There's also browsercam.com? org? where you pay to access a virtual machine running the browser you want. This lets you play with the site, but then, you might as well get your own virtual machine (as above).

    But writing for a browser you can't see is just not what you want to even attempt.

  4. #4
    SitePoint Addict
    Join Date
    Aug 2007
    Posts
    365
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for your replies,

    I will look into some of the suggested software. I think going VM is far over the top for what I am working on.

    While it is online, do you have any suggestions on the design so far? I used Sitepoint as a reference of the page..

    Thanks

  5. #5
    SitePoint Addict dnordstrom's Avatar
    Join Date
    Jul 2006
    Location
    Amsterdam
    Posts
    337
    Mentioned
    18 Post(s)
    Tagged
    0 Thread(s)
    I'll probably repeat what the above posters have already said but at least I'll do it in a bulleted list.

    • Standards compliant code
      Not that IE6 gives a sh*t but by coding by the standard at least we can minimize the problems somewhat.
    • Keep it simple
      Like the above poster, I try to do with as little markup as possible to do the job nicely. The keyword here is "nicely"—if I can make the interface/markup either more extensible or more easily extensible, with more code, I'll probably do it. It's a judgement call.
    • Know the browser (i.e. its box model and dark sides)
      This is boring but it's a good idea to read up on IE6 bugs, tips and tricks. There's so much out there, it's overwhelming. More often than not, there's also more than one solution to a problem and we need to pick the one best suited for the situation we're facing.

      It helps to be proactive.
    • Testing
      I use VmWare Fusion to launch a Windows installation on my Mac. From there, I run MultipleIE to test in IE6. As mentioned (and I've seen it happen), it's not 100% so every now and then I ask my colleagues to test it in their browsers too. When I get a new MacBook Pro I'll run a separate virtual machine for IE6 alone.

      I'm a bit of a cowboy in that I can do a lot before I decide to test it in other than my development browser. If I mess up, it can mean a lot more time debugging so testing often is recommended. If only I had a bigger monitor and a newer computer...

      Ideal situation for testing: editor on one huge monitor, and Firefox+Firebug and VmWare with IE6 on another huge monitor. Mac OS spaces to the rescue!
    • Conditional CSS files
      I hate these. Most of the base themes for the CMS and platforms I use provide separate CSS files for IE6 and IE7. Makes it easier to build but adds more to maintain. If I have enough crap to put in them, I'll consider separate CSS files but for our last project that I built from scratch, there was no need for them.
    • Javascript as last resort
      There's Javascript out there for just about anything. PNG fixes, of course, but also Javascript to make IE6 behave like IE7, which solves a lot of common issues. Adds to the page load time and doesn't work with JS disabled. Not recommended but it does exist and works decently.


    In my opinion, knowing the browser and its potential problems and bugs is most important, something that comes from both experience and research.

    The above posters probably know more than me about the browser perks but I find that a universal way of solving stuff is to search for it, learn all possible solutions and pick the one that suits the project.

    Different projects demand different approaches!
    Daniel Nordstrom. of. Nintera(ctive)
    -- Featured post: Part 2. Writing NI.JS JavaScript
    ----- Follow me on Twitter. Got project? Contact me.
    -------- SitePoint: Community GuidelinesBe A Great Member

  6. #6
    SitePoint Addict dnordstrom's Avatar
    Join Date
    Jul 2006
    Location
    Amsterdam
    Posts
    337
    Mentioned
    18 Post(s)
    Tagged
    0 Thread(s)
    Something else worth mentioning is http://litmusapp.com/.

    Awesome web app I use to test email templates in different clients. Works just as well for browsers.
    Daniel Nordstrom. of. Nintera(ctive)
    -- Featured post: Part 2. Writing NI.JS JavaScript
    ----- Follow me on Twitter. Got project? Contact me.
    -------- SitePoint: Community GuidelinesBe A Great Member

  7. #7
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,276
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    # Testing
    I use VmWare Fusion to launch a Windows installation on my Mac. From there, I run MultipleIE to test in IE6. As mentioned (and I've seen it happen), it's not 100% so every now and then I ask my colleagues to test it in their browsers too. When I get a new MacBook Pro I'll run a separate virtual machine for IE6 alone.
    That's what I did... got two Virtual Boxes on my Linux laptop, one for a native IE6, USB support and sound for JAWS (and FF3 with web visum), and the other has IE7 native, and 6, 5, etc via Tredosoft. 90% of the time I can just have the IE7's VB open and look in the Tredosoft IE6, except for JS and Flash testing (Tredosoft IE's use IE7's JS engine which is different than a real 6's). Yeah, they're real hogs but the trick seems to be, don't have them both open, and Firefox on Linux (hog), and GIMP (hog), and a bunch of large image files (big hogs, Gnome crash!) : )
    I'm a bit of a cowboy in that I can do a lot before I decide to test it in other than my development browser. If I mess up, it can mean a lot more time debugging so testing often is recommended. If only I had a bigger monitor and a newer computer...
    Me too. Starting out, we test every time we add a single line of code. It's a Bad Idea to build all the major chunks of a page in just one browser, but as you get a feel for the bugs, you start doing that more and more (or even, just writing code, and not looking in a browser until you have a lot written)...

    Ideal situation for testing: editor on one huge monitor, and Firefox+Firebug and VmWare with IE6 on another huge monitor. Mac OS spaces to the rescue!
    I have a laptop, so it's marginally "portable" (lawlz) but I specifically needed one with a huge-*ss monitor, mostly for screen width testing (and Firefox's resizer extension is nice for testing "typical" screen sizes).
    # Conditional CSS files
    I hate these. Most of the base themes for the CMS and platforms I use provide separate CSS files for IE6 and IE7. Makes it easier to build but adds more to maintain. If I have enough crap to put in them, I'll consider separate CSS files but for our last project that I built from scratch, there was no need for them.
    Amen. One CSS file means one place to ctrl+f for code.
    # Javascript as last resort
    There's Javascript out there for just about anything. PNG fixes, of course, but also Javascript to make IE6 behave like IE7, which solves a lot of common issues. Adds to the page load time and doesn't work with JS disabled. Not recommended but it does exist and works decently.
    Agreed here too. I won't use PNGfix, but I will use Peterned's CSSShover for dropdown menus, and I used to use CSS Expressions (which are javascript basically) for things like min-width. I've started just giving IE6 crappy widths (the smallest I support for PCs, usually 768px for 600x800 monitors) and to hell with min-width : )

    I've been tempted by Dean Edwards' IE7 fix, and I know that's good JS, but the idea that the user must load all these extra's just to get a working page does go against my hippy idealism that a page should always have its basic, vital functionality with HTML and the back-end alone, and be user-agent agnostic. Which means, it'd better not NEED scripts to work. IE6 is damn old and I don't mind those users getting the page looking like *ss, so long as it works.

    ++ nordstrom, excellent post. Or, I just think it is because it's what I believe, lawlz.

  8. #8
    SitePoint Member Reformator's Avatar
    Join Date
    Oct 2006
    Location
    Belgrade, Serbia
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hopefully soon we won't have to worry about IE.

    It seems that Microsoft has seen that it can't compete with others, at least in the browsers field (IE 7 & 8 are also crappy), and will stop delivering IE. There are rumors that the new version of windows comes without it.

  9. #9
    SitePoint Addict Fre420's Avatar
    Join Date
    Nov 2005
    Location
    Leuven, Belgium
    Posts
    211
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I use firebug lite & IEtester for IE testing.

  10. #10
    SitePoint Wizard bronze trophy conradical's Avatar
    Join Date
    Jan 2005
    Location
    Atlanta
    Posts
    2,354
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)

  11. #11
    SitePoint Wizard
    Join Date
    Apr 2007
    Posts
    1,399
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Seriously, IE6 must be let go! I don't mean we just stop supporting this second but spending development time to fix IE6 will bring the cost of software up!!!

    #1 IE is free!, why won't they upgrade?
    It's because most users of IE6 are not even aware of IE version. If you provide a link or some sort then their chance of upgrading their IE6 will increase!

    #2 How would you display the text?
    You can either use scare tactic or kind words for them to upgrade! scare tactic would involve by saying "Your browser is outdated and vulnerable to many security violations! For best viewing and secured browser, click here to install latest IE.

    Something like that...



    Here's a site dedicated to bring down IE 6
    http://www.bringdownie6.com/bring-down-ie-6.html

  12. #12
    SitePoint Addict yourhostnow's Avatar
    Join Date
    Apr 2005
    Location
    New York
    Posts
    363
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    #1 IE is free!, why won't they upgrade?
    It's because most users of IE6 are not even aware of IE version. If you provide a link or some sort then their chance of upgrading their IE6 will increase!
    See this post on Digg's Blog: http://blog.digg.com/?p=878

    IE6 usage reasons
    I can’t upgrade because my computer runs an old version of Windows (2000, ME, or 98). 7%
    I can’t upgrade because I don’t have administrator access on my computer. 37%
    I can’t upgrade because someone at work says I can’t. 33%
    I don’t feel a need to upgrade. 17%
    I prefer IE6 to other browsers. 7%

    "Giving them a message saying, “Hey! Upgrade!” in this case is not only pointless; it’s sadistic."

    "We’re committed to developing to Web standards and building new ways to help you discover the best of the Web. Keeping an eye on what technologies folks use and why they’re being used is a big part of it."




  13. #13
    SitePoint Wizard
    Join Date
    Apr 2007
    Posts
    1,399
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by yourhostnow View Post
    See this post on Digg's Blog: http://blog.digg.com/?p=878

    IE6 usage reasons
    I can’t upgrade because my computer runs an old version of Windows (2000, ME, or 98). 7%
    I can’t upgrade because I don’t have administrator access on my computer. 37%
    I can’t upgrade because someone at work says I can’t. 33%
    I don’t feel a need to upgrade. 17%
    I prefer IE6 to other browsers. 7%

    "Giving them a message saying, “Hey! Upgrade!” in this case is not only pointless; it’s sadistic."

    "We’re committed to developing to Web standards and building new ways to help you discover the best of the Web. Keeping an eye on what technologies folks use and why they’re being used is a big part of it."



    This only strenthens my point! Let say IE6 traffic consists of 10%. Then from that only about 0.007% can't upgrade from IE6 because of their OS doesn't support later version of IE. That's 0.007%! As far as not having admin rights and other junk.. Especially some admin who forbids them to upgrade is just plain stupid. Seriously though any admin who knows what they are doing is probably encouraging many users to upgrade the user due to security vulnerability. Especially that browser is probably the #1 way of getting virus, so why shouldn't the user upgrade to latest version to prevent that? It's not just "Hey Upgrade!", it's more like "Hey your front door has been busted open and need to replace w/ sturdier door" Well, this is my 2 cent but I'm betting half of the people who uses IE6 doesn't even know how to upgrade.

  14. #14
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,276
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Especially some admin who forbids them to upgrade is just plain stupid.
    Or overworked and understaffed.

    Imagine, if like all the other tasks done on the office/hospital/library/space station computers, you had to manually install anything on every single machine in the (200+?) machine network.

    If that's the setup, then I can easily imagine other tasks that have more priority than upgrading an internet browser.

    I know damned sure that if I were admin of a high school network, no way in hell I'd let the kids have ANY privileges nor would I let the little rats download ANYTHING (heck I remember how kids would set the Home page of the teacher's browser to goatse for teh lawlz). Even if that meant more work for me when they needed some upgrade.

    *edit taliesinnz your page is no longer online (you warned of this though)... is there any way you can put another version online somewhere? OR, maybe just as good, post HTML and CSS here?

  15. #15
    Mazel tov! bronze trophy kohoutek's Avatar
    Join Date
    Aug 2004
    Location
    Hamburg, Germany
    Posts
    4,248
    Mentioned
    30 Post(s)
    Tagged
    0 Thread(s)
    If you don't want to install any software, the most convenient way to test your site in browser versions you don't have is using Sandbox.
    Be aware, though, that form elements are not working well in IE6 as of now.
    Maleika E. A. | Rockatee | Twitter | Dribbble



  16. #16
    SitePoint Addict
    Join Date
    Aug 2007
    Posts
    365
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks guys for all your help, I downloaded IE tester which does ie5 through to 7.

    I have fixed the problem I was having by setting the height of the div to 1%. and It sits nicely in the top corner

    I know IE6 is not complient to recent standards, however as the majority of my audience will not be computer people I find that I have to have basic support for IE. Though I see no point trying to make it pixel-perfect with the standards, I still need it usable.

    Since my dev machiene has a corrupt hard drive ( trying to rebuild it in my spare time). I been hosting it from the laptop ( which happens to drop back into sleep mode)

    Quote Originally Posted by Stomme poes View Post
    Or overworked and understaffed.
    *edit taliesinnz your page is no longer online (you warned of this though)... is there any way you can put another version online somewhere? OR, maybe just as good, post HTML and CSS here?
    I have set it to disable sleep mode, so you can access the page here http://taliesin.mine.nu:8080/Article

    Thanks for your help

  17. #17
    SitePoint Wizard mPeror's Avatar
    Join Date
    Mar 2005
    Location
    Saudi Arabia
    Posts
    1,724
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I basically stopped supporting IE6, even though I can. It's just not worth the trouble.

    Facebook dropped support for IE6, I don't see why we can't. If we all do the same, soon everyone will just HAVE to upgrade. If they can't, then that's their problem to deal with really, not ours.

  18. #18
    Who is Mr Blonde? Mr Blonde's Avatar
    Join Date
    Sep 2006
    Location
    Gold Coast, QLD
    Posts
    359
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Mate, I highly recommend keeping this page close at all times while you're still developing your HTML/CSS skills:

    http://www.positioniseverything.net/explorer.html

    Saved me countless times.
    Heavens Rejects : Online Clothing Store
    Alternative Clothing : Mr Blonde
    Front end development : By the Webfella

  19. #19
    SitePoint Addict
    Join Date
    Aug 2007
    Posts
    365
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Mr Blonde View Post
    Mate, I highly recommend keeping this page close at all times while you're still developing your HTML/CSS skills:

    http://www.positioniseverything.net/explorer.html

    Saved me countless times.
    Thanks, this look real interesting ill read through it when I get time.

    Quote Originally Posted by mPeror
    basically stopped supporting IE6, even though I can. It's just not worth the trouble.
    I know, I wouldn't do it if I didn;t have to. However a lof of people still use the ie which comes with xp.

  20. #20
    SitePoint Zealot
    Join Date
    Oct 2008
    Posts
    175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Always want to test different browsers, especially IE, IE6 IE7 IE8 should use different code to debug, so I hope so IE can be compatible with future Oh, we do not have such trouble.

    Apart from the usual feeling of nothing more than hands to do a direct way

  21. #21
    SitePoint Addict
    Join Date
    Aug 2007
    Posts
    365
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you guys are interested you can login with

    email:test
    password:test

  22. #22
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by yourhostnow View Post
    See this post on Digg's Blog: http://blog.digg.com/?p=878

    IE6 usage reasons
    I can’t upgrade because my computer runs an old version of Windows (2000, ME, or 98). 7%
    I can’t upgrade because I don’t have administrator access on my computer. 37%
    I can’t upgrade because someone at work says I can’t. 33%
    I don’t feel a need to upgrade. 17%
    I prefer IE6 to other browsers. 7%

    "Giving them a message saying, “Hey! Upgrade!” in this case is not only pointless; it’s sadistic."

    "We’re committed to developing to Web standards and building new ways to help you discover the best of the Web. Keeping an eye on what technologies folks use and why they’re being used is a big part of it."



    - I have a feeling being up all night has made me stupid - but the figures for Home / Office use ... 141% & 124% ???
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  23. #23
    SitePoint Addict Fre420's Avatar
    Join Date
    Nov 2005
    Location
    Leuven, Belgium
    Posts
    211
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by TheOriginalH View Post
    - I have a feeling being up all night has made me stupid - but the figures for Home / Office use ... 141% & 124% ???
    You can have (& use) different browsers on the same computer.

    I browse the web with Firefox (mostly), Opera, Safari & IE

  24. #24
    SitePoint Member
    Join Date
    Jul 2009
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I use IETester - saves me a lot of messing about most work/testing is done in firefox

  25. #25
    SitePoint Member
    Join Date
    Jul 2009
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    IE is not being shipped in the eu with Windows 7 , be interesting to see how that pans out eventually


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •