<DIV> and browser compatability

Discussion in 'CSS' started by Dakait, Mar 1, 2006.

  1. #1
    I wana use "Pure CSS" for my site. It has many benefits.
    "Pure CSS" needs use of <DIV> which is not compatible with many browsers.

    How to overcome this problem??
     
    Dakait, Mar 1, 2006 IP
  2. hooperman

    hooperman Well-Known Member

    Messages:
    646
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    108
    #2
    Hi Dakait,

    strictly speaking, css doesn't need divs - you can style anything you want with css.

    Browsers don't have a problem with divs, it's what you do with them that confuses them. This is quite a big subject (and can be really frustrating). If you're serious about using css there are some good resources out there.

    Not sure whether there are some resources listed here but this is a good place to start:

    http://www.westciv.com/style_master/academy/hands_on_tutorial/index.html
     
    hooperman, Mar 1, 2006 IP
  3. ray1983

    ray1983 Peon

    Messages:
    83
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Hmm i always thought that DIV's are more compatible with the most (modern) browsers than the old <table> way.
     
    ray1983, Mar 1, 2006 IP
  4. jestep

    jestep Prominent Member

    Messages:
    3,659
    Likes Received:
    215
    Best Answers:
    19
    Trophy Points:
    330
    #4
    if you look at the market share of browsers, about 98% are division compatible. The rest are normally PDA's and other small browsers that aren't going to handle tables any better.
     
    jestep, Mar 1, 2006 IP
  5. the_pm

    the_pm Peon

    Messages:
    332
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Handheld/mobile browsers understand <div>s just fine. They disregard many different styles within CSS, but they render <div>s perfectly (small screen style sheets are your friend).

    Browser recognition of the <div> element is 100%, and has been for years.
     
    the_pm, Mar 1, 2006 IP
  6. MamboCube

    MamboCube Peon

    Messages:
    242
    Likes Received:
    9
    Best Answers:
    0
    Trophy Points:
    0
    #6
    is it better to use divs on your website for SEO?
     
    MamboCube, Mar 1, 2006 IP
  7. the_pm

    the_pm Peon

    Messages:
    332
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Search engines reward tidy markup and proper use of structural elements to a small degree. It may or may not help your ranking, but it will never hurt it. Use proper markup for the sake of your visitors. That's the important thing.
     
    the_pm, Mar 1, 2006 IP
  8. MamboCube

    MamboCube Peon

    Messages:
    242
    Likes Received:
    9
    Best Answers:
    0
    Trophy Points:
    0
    #8
    completely agree with you, but you can have proper markup using tables.

    thanks for the advice!
     
    MamboCube, Mar 1, 2006 IP
  9. the_pm

    the_pm Peon

    Messages:
    332
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    0
    #9
    Oh absolutely! You wouldn't use anything but tables for tabular data, spreadsheet information, etc.! Tables are very useful and an integral HTML component.
     
    the_pm, Mar 1, 2006 IP
    Colleen likes this.
  10. Tam

    Tam Peon

    Messages:
    89
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #10
    Absolutely, the real benefit of CSS layouts is that you can create a web page with content exactly where you want search engines to see it (key content at the top in their own DIVs, other content lower down in other DIVs). You can then use CSS to move those divs to where you want visitors to see it, without moving any of your html code (search eninges look at the code and extract what they want to know).

    You will find that there are quite a few CSS templates which are coded in this manner (such as 3 column layouts with center content first in the HTML code). You just cannot do this with table based layouts.

    I hope I explained that properly!
     
    Tam, Mar 2, 2006 IP
  11. hooperman

    hooperman Well-Known Member

    Messages:
    646
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    108
    #11
    In what way does this provide an seo benefit?

    Although I've seen this theory before (keywords at the top = better ranking) I've not seen any proof.
     
    hooperman, Mar 2, 2006 IP
  12. MamboCube

    MamboCube Peon

    Messages:
    242
    Likes Received:
    9
    Best Answers:
    0
    Trophy Points:
    0
    #12
    that is an idea i had for a previous site, where the nav on the left was very long, and that was all the spiders were picking up.

    Might try this after all,

    Is it frowned upon though?
     
    MamboCube, Mar 2, 2006 IP
  13. Tam

    Tam Peon

    Messages:
    89
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #13
    An excellent reason to do this with CSS.

    The theory is that your page (which has the main content at the top of the html document) will fair better than a site that has the main content after other content (such as side nav bars). And of-course, with other content at the top of the document, your page could be considered less important for the main content below it.

    It was hard to come up with a brilliant example of this, but take tamdigital.com (the first example I could come up with, and only a 2 column layout, 3 columns is easily achievable though) - the main content is placed first in the html document before the header and left column, but repositioned to the right and below the header with css. In addition, the page degrades nicely - in other words, without CSS it is still flowing and functional.

    In no way is it frowned upon. Search engines have no use for css so they do not bother with it - they'll see the document in its raw form.
     
    Tam, Mar 2, 2006 IP
  14. MamboCube

    MamboCube Peon

    Messages:
    242
    Likes Received:
    9
    Best Answers:
    0
    Trophy Points:
    0
    #14
    i didnt mean by using css, i meant because you are placing the content at the top of the page, yet when the user sees it it will be at the bottom (well after the header, you know what i mean), just seems abit wierd.

    I am very paranoid when it comes to google lol

    ill look into it and will probably end up doing it :)
     
    MamboCube, Mar 2, 2006 IP
  15. Tam

    Tam Peon

    Messages:
    89
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #15
    Just found a good template that uses this concept ... pmob.co.uk/temp/3colfixedtest_sourcenone.htm

    You may need to fiddle quite a bit with the CSS to suit your own design, but it seems to be a good working example (although a quick browser test shows some irregularities with positioning of the footer, but nothing unuseable).
     
    Tam, Mar 2, 2006 IP
  16. Dakait

    Dakait Banned

    Messages:
    287
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    0
    #16
    Dakait, Mar 2, 2006 IP
  17. Dakait

    Dakait Banned

    Messages:
    287
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    0
    #17
    I just come across "sniffer scripts". When a visitor requested the server for a document, then before downloading the document, the sniffer scripts find out the browser used to request and according to the browser and its version the respective file is downloaded. It means there will be more than 1 copy of same doc with few changes in CSS, which means duplicacy for search engines. ....a harm in using it.

    Sniffer scripts are worth to use.. or what?
     
    Dakait, Mar 2, 2006 IP
  18. Tam

    Tam Peon

    Messages:
    89
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #18
    DIVless layouts are possible, but you should check the pros and cons. Since DIVs are fully supported cross browsers, with the only exception of old browsers that don't support CSS, what's the point? ... somerandomdude.net/projects/webdev/divless/

    Google is good for searching on this issue btw. :)

    'Sniffer scripts' are okay, but you are of-course relying on receiving proper header information from surfers. Its often written in javascript, so you are also relying heavily on the visitors' browser allowing this when visiting your site. A server-side script is far better then, and it is perfectly possible to detect browsers with PHP (here is a very good one - techpatterns.com/downloads/php_browser_detection.php).

    The other question is of-course, is it worth the extra coding for the sake of compatibility, or would the use of known CSS hacks be sufficient (I've always gone for the latter as I haven't found any greater benefit from browser detection in CSS based layouts). After all, it equates to less hits on the server to produce the web page with a CSS sheet which serves all browsers.
     
    Tam, Mar 3, 2006 IP
  19. Huvet

    Huvet Member

    Messages:
    16
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    38
    #19
    Hi, I've written a tutorial for friendlybit.com/css/cross-browser-strategies-for-css/ if you want to have a look. That's the methods I use to get things to look the same across browsers. Hope that helps.
     
    Huvet, Mar 3, 2006 IP
  20. mariush

    mariush Peon

    Messages:
    562
    Likes Received:
    44
    Best Answers:
    0
    Trophy Points:
    0
    #20
    Another reason for which I would use divs instead on tables is ads. From what I have tested, Adsense kind of skips the content of tables.

    I have modified a torrent tracker source for a friend of mine (the same source torrentbytes.org or filelist.org uses) and this source uses only tables.
    The ads were placed on top right corner and the only ads Adsense showed were related to "Store passwords", "Login problems", "Password recovery" because on the left there was a small box with the username and the Logout link and the menu that contains words like Home, Profile, Forum, Control Panel and so on.

    The contents of the tables which included words like Microsoft, DVD, DVDRip, American Idol , Lost - general releases on P2P networks, were completely ignored.

    On my sites, I'm using divs because of this.

    I've also read somewhere that in some w3c specifications tables are deprecated and divs are recommended, however I am not sure so don't take it as true.

    Something else that I've noticed is that generally browsers render divs faster.

    Hope it helps..
     
    mariush, Mar 3, 2006 IP