1. Computer problem? Tech Support Guy is completely free -- paid for by advertisers and donations. Click here to join today! If you're new to Tech Support Guy, we highly recommend that you visit our Guide for New Members.

Which DOCTYPE should I use?

Discussion in 'Web Design & Development' started by toptemp, Sep 1, 2004.

Thread Status:
Not open for further replies.
Advertisement
  1. toptemp

    toptemp Thread Starter

    Joined:
    Aug 15, 2004
    Messages:
    39
    How am I supposed to choose the correct DOCTYPE for my site http://toptiertemplates.com. I would like to validate the page but cannot do so before I know that I have the correct one.
     
  2. dimamo1983

    dimamo1983

    Joined:
    Jun 16, 2003
    Messages:
    93
    ummm... i don't see any frames and it's more than strict can handle ====> Transitional 1.0

    but you'll have to change all the tags from upper case to lovercase first, as required by XHTML 1.0 specs

    good luck with that...

    dima
     
  3. toptemp

    toptemp Thread Starter

    Joined:
    Aug 15, 2004
    Messages:
    39
    So what should I use exactly (I'm kind of new to this)

    i.e:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    is this good?
     
  4. dimamo1983

    dimamo1983

    Joined:
    Jun 16, 2003
    Messages:
    93
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

    <head>

    <title>Welcome to the Ohio State University Challenge X team website</title>

    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"></meta>
     
  5. toptemp

    toptemp Thread Starter

    Joined:
    Aug 15, 2004
    Messages:
    39
    My problem is that whenever I change my doctype to that, in my editor, all my divs are not aligned where they should be... what should i do here? Is it something to do with the tag attributes that I need to change?
     
  6. dimamo1983

    dimamo1983

    Joined:
    Jun 16, 2003
    Messages:
    93
    are the divs not aligned in the editor or on the page (when you view it)? if it's the page, which browser are you using? are you sure you've closed every one of them? (happened to me yesterday... spent about two hours "fixing" misallignment of divs just to find out that i forgot to close one of them and had to redo everything)
     
  7. toptemp

    toptemp Thread Starter

    Joined:
    Aug 15, 2004
    Messages:
    39
    I am pretty sure that I have I.E v.6, and when I view the page with the new doctype, the text does not align how I'd like it to. I want it to have padding on both sides of the text but that's not happening anymore.
     
  8. toptemp

    toptemp Thread Starter

    Joined:
    Aug 15, 2004
    Messages:
    39
    I tell it to have padding in this code:

    <style type="text/css"><!--
    .header {font-family:Opium , sans-serif; font-size: 48pt; COLOR:#ffffff; padding-left:10; padding-right:5; font-weight:100 }
    .text {font-family:Verdana,sans-serif; font-size: 11px; color:#404040; padding-left:20; padding-right:10 }
    .text1 {font-family:Verdana,sans-serif; font-size: 9px; color:#404040; padding-left:20; padding-right:10 }
    .news {font-family:Verdana, sans-serif; font-size: 10px; color:#ffffff; padding-left:20; padding-right:5; font-weight:100; }
    a:link{text-decoration: none; color: #9E0B0E}
    a:visited{text-decoration: none; color: #9E0B0E}
    a:hover{text-decoration: none; color: #FD8620}
    a:active{text-decoration: none; color: #9E0B0E}
    --></style>
     
  9. dimamo1983

    dimamo1983

    Joined:
    Jun 16, 2003
    Messages:
    93
    have you tried to view it in Firefox? IE can't render most of the stuff correctly. I remember about some issue with its padding or margin rendering... It was one of them that IE can't do correctly so you have to use another one instead (margins instead of padding)... i'm not a big expert myself here, just trying to learn it as well... takes me way too much time and nerves to get it to display correctly in all browsers... :(

    so, i guess, try substituting margins instead of padding and also don't forget that you have to specify the units, even though usually it is not the problem
     
  10. Big-K

    Big-K

    Joined:
    Nov 22, 2003
    Messages:
    6,052
    As I remember, the <div> tag isnt supported in xhtml, but I may be wrong. And your going to have to change everything except for the section of the DOCTYPE and content to lowercase. It also requires a title tag and head tag(with title under the head).
     
  11. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    I strongly suggest you use XHTML 1.0 Strict and conform to it.

    For IE's sake, you need to have the doctype on the first line of the html file.

    Here's an example.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    <title>XHTML 1.0 Strict</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta http-equiv="Content-Style-Type" content="text/css"/>
    <meta http-equiv="Content-Script-Type" content="text/javascript"/>
    <link rel="stylesheet" type="text/css" href="main.css"/>
    <link rel="stylesheet" type="text/css" media="print" href="print.css"/>
    <script type="text/javascript" src="file.js"></script>
    </head>
    <body>
    <div id="main">
    <div>Some Content</div>
    <div>Some More Content</div>
    </div>
    </body>
    </html>
    

    Keep css in external files. <link> tag.
    Provide a print style sheet if needed.

    Keep javascript in external files except when it's necessary to have the script inline. If you do keep scripts inline, get rid of <!-- and //-->. This is XHTML, let's not worry about dinosaur browsers. Same goes for inline stylesheets with <!-- and -->.

    Avoid using lots of <br /> tags. Use css to separate your content.

    When viewing your page, put javascript:alert(document.compatMode) in the addressbar and hit enter. If it says "Quirks mode", you don't have your doctype and char encoding set properly.

    Do not use an XML declaration unless you choose to serve the page as application/xhtml+xml.

    Make tagnames and attribute names lower case. <html> not <HTML>


    Also, width="40" is not valid. You need to have a unit like px. width="40px".

    All the attribute values need to be in quotes.

    Specify all your widths, heights,borders, background colors, aligns, margins via css and not via tag attributes.

    Avoid p tags. Don't use them. Forget they existed.

    You can check your page for errors at http://validator.w3.org

    As for the <div id="main"> that everything is encased in, that allows you to use <br /> for separation purposes when it's really necessary. You do not have to encase the whole page in a main div like the example. That will be up to you.

    Also, scripts don't always have to go in the head of the document.

    Also, it is bad form to use tables to position and form the layout of your page. Tables are for tabular data only. However, you can do whatever you want, just know that tables are not meant for that.

    Also, only use a text editor to code your page. Notepad, Metapad, EditPlus, UltraEdit, XEmacs, Gvim, crimson editors etc. Do not use front page or dreamweaver. They will just booger up your code.
     
  12. Big-K

    Big-K

    Joined:
    Nov 22, 2003
    Messages:
    6,052
    Half of that goes completely against how I learned it(w3schools). When I recoded my webpage(it still has some errors that i havnt fixed) I left it as a table layout, used plenty of <br /> tags, and use the <p class=""> tag whenever I put in formatted text. I also use the <p> tag for aligning headers to the center. It just doesnt work for me in css. If it was conformed to the standards you just listed, that would make more work not less.
     
  13. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    You can still use P tags.
    You can still use Tables for layouts.
    You can still use break tags.

    However, they are not recommended.

    Putting everything inside p tags and having a billion nested p tags is not recommended. For one it's a mess, but depending on the browser, if you use p tags (especially in XHTML served as application/xhtml+xml, you can cause a margin collapse, which is per spec, but undesired. So it's good to avoid them. There are billion situations on the subject, but you'll find out yourself sooner or later.

    Using a million break tags to separate everything is not recommended.

    e.g.

    Code:
    <div>
    <div>bla bla bla</div>
    <br />
    <br />
    <br />
    <br />
    <div>bla bla bal</div>
    </div>
    
    A better way to do that would be to use

    Code:
    <div>bla bla bla</div>
    <div>bla bla bla</div>
    
    and just use css to separate them more. ( if you needed to).

    Here's a non-glamorous example.

    As for w3cschools, it's a great site, but there are a lot of tutorials based on old html styles and coding.

    Just keep in mind that just because a page validates, doesn't mean it's right.

    My suggestions are really flags that say "Hey, maybe I should go to w3c.org and see what's recommended". Basically it comes down to, make the page validate and following all recommendations that you agree are not bogus and ultimately test in lots of browsers.
     
  14. Sponsor

As Seen On
As Seen On...

Welcome to Tech Support Guy!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.

Join over 733,556 other people just like you!

Thread Status:
Not open for further replies.

Short URL to this thread: https://techguy.org/268981

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice