Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Micole Noddle
Micole Noddle
5,797 Points
Posted by Micole Noddle
Micole Noddle
5,797 Points

Is this the proper way to structure the HTML of a website?

I want to make sure I am getting it right...

The order I have (after the title tag) is:

  1. link to "normalize.css" file
  2. link to Google web fonts
  3. link to my main css file
  4. link to the "responsive.css" file
  5. meta tag (for responsive css? can't quite remember! need help there too please!)

then the closing head tag, content inside the body tags (which is not in the code below), and then the link to the JS file right above the closing body tag.

Is this correct?

Also, where is the proper place to put the jQuery link?

Thank you all so much for your help! Code is pasted below.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Browser title here</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link href='http://fonts.googleapis.com/css?family=Bitter:400,700,400italic%7CMaven+Pro:400,500%7COpen+Sans:400italic,700italic,400,700%7CChanga+One' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/responsive.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
  </head>
  <body>

    <script src ="app.js"></script>
  </body>
  </html>

1 Answer

Jamison Imhoff
Jamison Imhoff
12,460 Points
Jamison Imhoff
Jamison Imhoff
12,460 Points
  1. For the most part it looks good (I would probably put both meta tags near each other)
  2. Meta tag looks good for responsive CSS here is a link for quick reference regarding responsive CSS https://css-tricks.com/snippets/html/responsive-meta-tag/
  3. Yes javascript goes before closing body tag (lets the entire page load before javascript works, general practice)
  4. jQuery typically goes right above Javascript ( my understanding )

Hope that helps!

Jamison Imhoff
Jamison Imhoff
12,460 Points

jquery can use the CDN for the link: 

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>

info about jQuery CDN here: http://jquery.com/download/

Micole Noddle
Micole Noddle
5,797 Points
Micole Noddle
Micole Noddle
5,797 Points

The responsive meta tag can be placed inside the title tag? I'm confused by that. Also, as far as where to put the CDN for jQuery--in the jQuery Basics course and the Interactive Web Pages with JS course both Andrew and Dave place the jQuery CDN toward the top of the HTML, above the css. Is this common practice? If so, what is the reason for it? Thanks!