… was when I finally realized that I could *preview* HTML/CSS/Javascript files in my browser by typing in some variation of…

file:///Users/myname/Desktop/folder/folder/folder/index.html

…in a chrome or firefox browser.

There was a time, scarcely less than a year ago, when I had absolutely no idea what to do when an online tutorial gave me a button to download a file package. Now, I can’t believe how straightforward the idea of HTML, CSS, and Javascript files working in sync are.

Essentially:

1) You start with the HTML file — usually named index.html or some variation thereof. You can make sure it starts with a <!doctype html> (go HTML5!), has tags where you put your and tags, has a , and possibly some

’s and

tags.

2) You create a CSS stylesheet (usually named style.css) and call it within the HTML document by writing <link href=”style.css” rel=”stylesheet” /> and putting it between the tags in your HTML.

3) Similarly, you can call your Javascript file (conventionally named script.js) by putting <script src=”script.js”></script> in your HTML — right before your </body> tag, so that the cool extra animation/behavioral effects you’re loading doesn’t interfere with your more essential content.

 

blog comments powered by Disqus
  • Hi, I'm Linda! I enjoy going to tech meetups, learning web development, and blogging about the learning path. Follow me @LPnotes

Subscribe to The Coding Diaries