creating a IE compatible website...

Discussion in 'Community Discussion' started by Sean7512, Jan 10, 2008.

  1. Sean7512 macrumors 6502a

    Joined:
    Jun 8, 2005
    #1
    I am getting very frustrated right now. I am working on updating our hockey team's website, but I am having trouble with IE (Windows version, of course) rendering it correctly. Firefox and Safari handle it just fine. I am coding everything by hand in HTML.

    www.svchockey.com

    That is the site in question, can anyone please help me out just a little bit? I know that I'm using tables and an iframe, but I am not advanced enough to move to all CSS (I am using CSS for fonts, etc). Before someone says how bad it is, just look at what the old version was, which someone else was doing :p

    http://svchockey.com/old index.html

    Thanks in advance!
     
  2. dreamchrisdream macrumors newbie

    Joined:
    Jan 10, 2008
    Location:
    Knox, Pa
    #2
    Haha, you're right, the new version is wayyy better than the old version. I say screw IE. Put a tab somewhere on the site saying, "Works best in Firefox or Safari" Maybe get some switchers. :)
     
  3. Rodimus Prime macrumors G4

    Rodimus Prime

    Joined:
    Oct 9, 2006
    #3
    sadly until you get the new site working in IE the old site is a better more useful site even as crappy as it is.

    It sucks but it is a numbers game and IE is a very large part of the the market share and the people who will visit the site.

    Also couldn't you just change the text to black and the back ground to white. It would look better on Firefox because right now it looks off with that huge white strip down on the right side of the window.

    You need to have the top bar with the picture going clear across the window.

    Also I would recommend optimizing the for a screen size of 1280x1024 since that is I believe the most common screen resolution.
     
  4. Sean7512 thread starter macrumors 6502a

    Joined:
    Jun 8, 2005
    #4
    Huge white strip? What are you talking about?

    And, I love the idea of forcing people to use FireFox or Safari :D Only in a dream.....
     
  5. Rodimus Prime macrumors G4

    Rodimus Prime

    Joined:
    Oct 9, 2006
    #5
    I did some more checking on the site and if you hit any of the links at the top (like stats ect) you can read them in IE but you can not read any of the information in Firefox or Safari.
    I hate to say it but Windows IE is the best browser right now. The site near useless for the other browsers.

    Just go to black text on a whit background and you should be fine.
     
  6. Sean7512 thread starter macrumors 6502a

    Joined:
    Jun 8, 2005
    #6
    I am aware of that, haha. I have not linked the CSS for the other pages yet, as I'd rather fix the rendering problem before I start linking my CSS to all the pages.
     
  7. Rodimus Prime macrumors G4

    Rodimus Prime

    Joined:
    Oct 9, 2006
    #7
    Here I posted a shot of the window in windows. It looks the same in Safari. It is also covering an example of the problem on any page but the home page.
     

    Attached Files:

  8. Rodimus Prime macrumors G4

    Rodimus Prime

    Joined:
    Oct 9, 2006
    #8
    Like I said change the text. It may not look as pretty off the bat but it would give you a working site that is a huge improvement over the old.

    Then make a test site to work on it until you get it fixed then upload the new one when it is up and working.♠
     
  9. Sean7512 thread starter macrumors 6502a

    Joined:
    Jun 8, 2005
    #9

    Hmm...you think I should go white background with black text for all the pages? The reason I am going with the black background, is because for all the latest news on the homepage, I was going to put the titles in yellow font. And yellow does not show up on white, obviously. If I go white background, I can make titles green? What do you guys think?

    I am also adding RSS feeds once its all set up and done, not that RSS feeds are relevant to this conversation.
     
  10. Sean7512 thread starter macrumors 6502a

    Joined:
    Jun 8, 2005
    #10
    I have changed the site around, can anyone using Windows get a screenshot and please post it for me?

    Thanks a lot!
     
  11. Rodimus Prime macrumors G4

    Rodimus Prime

    Joined:
    Oct 9, 2006
    #11
    Ask and you shall receive. Both screen shots I have posted are off XP SP2. One is Firefox and the one in this post is on IE7.
     

    Attached Files:

  12. Sean7512 thread starter macrumors 6502a

    Joined:
    Jun 8, 2005
    #12
    Can you clear your cache and reload that site? It has been updated, and that is definitely the old version...

    I'm sorry for being a pain, I really appreciate all of your input! :)
     
  13. dcv macrumors G3

    Joined:
    May 24, 2005
    #13
    Here's a screenshot from IE7 on my Windows pc at work

    The whole site is huge; I've got a 19" screen here and still scrolling - even the iframe is too big and needs to be scrolled in both directions.
     
  14. PowerFullMac macrumors 601

    PowerFullMac

    Joined:
    Oct 16, 2006
    #14
    I consider it a feature it dosent work with IE! :D
     
  15. jng macrumors 65816

    jng

    Joined:
    Apr 6, 2007
    Location:
    Germany
    #15
    Only inexperienced people can't design for IE. :p

    This thread also belongs in the web forum...
     
  16. Sean7512 thread starter macrumors 6502a

    Joined:
    Jun 8, 2005
    #16
    Thanks for the screenshot! I can't believe how big it is in IE!! :eek: In Safari on a 17" monitor, there isn't much to scroll at all. Heck, even on my MacBook there is not much scrolling. There is definitely no scrolling in the iFrame on either.

    Yeah, I am very inexperienced with web development. I am a computer programmer major, but I have MUCH better skills doing other computer languages (C++, C, Assembler, Java, C#, etc...) That is why I am asking for a little help ;)

    Thanks though for everyone who has helped thus far!
     
  17. dcv macrumors G3

    Joined:
    May 24, 2005
    #17
    Umm... okay I'm now looking at it in Firefox on my MBP... and it still looks huge and scrolling every which way.

    Why is there some other kind of banner (see attachment) on the right hand side? It's causing the entire page to scroll horizontally and there is a vast expanse of white space beneath it.

    :confused:


    I think the site is just too big overall. It's for a college team, right? So I'm guessing a large proportion of your audience will be [small] portable laptop users. That site's not gonna look good on a small screen. On my 15" widescreen MBP I'm having to make my browser window a fair bit wider than normal to view your site properly. The banner is also taking up around 40% of the viewport height (excluding all the browser chrome).

    Also - and I guess it's probably just work in progress but - the Stats, Recruitment & History pages seem to be displaying another banner (possibly the one from the old site?)


    Make the banner smaller (width and height), maybe take the font size down a point or two and your site will look heaps better.
     
  18. Eraserhead macrumors G4

    Eraserhead

    Joined:
    Nov 3, 2005
    Location:
    UK
    #18
    General comment, the links at the top don't highlight which page is active, take a look at my homepage which does this, and is better in that regard.
     
  19. Sean7512 thread starter macrumors 6502a

    Joined:
    Jun 8, 2005
    #19
    Yeah. in my quest to fix the IE problem, I have temporarily screwed up the FireFox rendering.

    I like your suggestion, and I will take it into consideration. I think I have come to a solution...I just don't know if I have the time to do it today or not
     
  20. Eraserhead macrumors G4

    Eraserhead

    Joined:
    Nov 3, 2005
    Location:
    UK
    #20
    You should use if/else blocks to seperate between your IE code and other code. (so you don't change your "other" code)
     
  21. Sean7512 thread starter macrumors 6502a

    Joined:
    Jun 8, 2005
    #21
    Ok, I feel really stupid asking this especially since I am a computer science major (but, I never really did web development), but there is if/else in HTML??? I never knew that! Ok, but whats the condition, obviously IE or other...but how do I determine that?:confused:

    This can help me immensely!! thanks soo much!!

    Edit...if I put this into my code, will it work correctly?

    <script language="JavaScript">
    if(navigator.appName=="Microsoft Internet Explorer")
    put IE code here
    else
    put other code here
    </script>
     
  22. Eraserhead macrumors G4

    Eraserhead

    Joined:
    Nov 3, 2005
    Location:
    UK
    #22
    Well its more like:

    Code:
    <script type="text/javascript">
    var ua=navigator.userAgent;
    if(ua.indexOf('WebKit')==-1 && ua.indexOf('Gecko')==-1  && ua.indexOf('Opera')==-1){
    //IE Code here
    }else{
    //Non-IE Code here
    }
    </script>
    
    And you can use document.write('<<the html>>'); to write HTML ;)
     
  23. Sean7512 thread starter macrumors 6502a

    Joined:
    Jun 8, 2005
    #23
    WOOOOHOOOOO, after an hour or two at my sister's house (she was a windows comp), I am pleased to say that it correctly renders in IE7 :D I just needed a way to quickly check it all the time, which I had no way of doing before as we only have Macs in the house.

    The only problem now is soo small that I don't care. Between the top header and the nav bar, there is a thin white strip on IE...but oh well.

    I am working on a new header picture to make is not as big height wise, which will lead to less scrolling.

    Thanks to everyone who has helped!

    Can someone confirm that it works in IE6 as well? You may have to refresh the site/clear your cache a few times first.
     

Share This Page