Copy edits, moved files, new file for reminders, clarifications

README.md

@@ -46,7 +46,7 @@ By the end of this workshop, participants will:
 
 -----
 
-Session Leader: Kristen Hackett
+Session Leader: Kristen Hackett  
 Based on previous work by Patrick Sweeney and Patrick Smyth
 
 [![Creative Commons License](https://i.creativecommons.org/l/by-sa/4.0/88x31.png)](http://creativecommons.org/licenses/by-sa/4.0/)

sections/cli-reminder.md

@@ -0,0 +1,12 @@
+## Commands for new folder and file
+
+After opening the terminal:
+
+```bash
+cd ~/Desktop/projects
+mkdir website
+cd website
+code index.html
+```
+
+[<<< Back](create_site.md)

sections/conventions.md

@@ -2,21 +2,13 @@
 
 # Conventions
 
-As we’ve gone through the different components of creating a webpage, you likely have noticed some conventions or industry standards for creating a webpage using HTML. 
-
-**Any guesses?**
+As we’ve gone through the different components of creating a webpage, you likely have noticed some common conventions or industry standards for creating a webpage using HTML. Can you guess any of these?
 
 ## Let's outline them:
-<p>
-    <ul>
-        <li> <strong>Some tags are self-closing, while others require a closing tag.</strong> Self-closing tags are called void tags, and are generally self-closing because you wouldn't need or want to add another element within a tag. </li>
-        <li> <strong>Use lower case.</strong> There is no techical reason to do this, but it is good practice because it makes it easier to scan code. </li>
-        <li> <strong>Your code should be nested.</strong> There is no technical reason for this either—blank space has no meaning in html— however, this also makes it easier to scan the code quickly, which is particularly helpful when you run into errors! </li>
-    </ul>
-</p>
 
-With respect to points 2 and 3, it is good to develop habits that keep with these conventions now, in case you find yourself in a professional coding environment in the future.
-<br/>
-<br/>
+
+- Some tags are self-closing, while others require a closing tag. Self-closing tags are called void tags, and are generally self-closing because you wouldn't need or want to add another element within a tag.
+- Use lower case. While HTML is not case sensitive, it makes scanning code easier, and mades code look more consistent.
+- Your code should be nested.</strong> This is not a technically necessity either—blank space has no meaning in html. However, this also makes it easier to scan the code quickly, which is particularly helpful when you run into errors!
 
 [<<<Back](images.md) | [Next>>>](create_site.md)

sections/create_site.md

@@ -1,66 +1,54 @@
 [<<<Back](conventions.md) | [Next>>>](css_basic.md)
 
-#  ACTIVITY: Create an Institute Site!
+#  Challenge: Create an Institute Site
 
-Using the tags we've just reviewed, and two additional ones (see below) begin creating an introductory page for your future institute. 
+For this challenge, practice using the command line. If you need a reminder of which commands to use to create new folders and files, see [here](cli-reminder.md).
 
-On your desktop, create a new folder called `webite`. Create a `index.html` file inside that folder. This will be the homepage or landing page of your site. 
+Using the tags we've just reviewed, and two additional ones (see below) begin creating an introductory page for your future Institute. 
 
-**Challenge:** Practice using the command line. Commands are written out below if you need help getting started. 
+In your `projects` folder on your desktop, create a new folder called `website`. Create a `index.html` file inside that folder. This will be the homepage or landing page of your site.
 
-## This page should include the following:
-<p>
-    <ul>
-        <li> Doctype </li>
-        <li> Root element </li>
-        <li> Head and a body </li>
-        <li> Title for the page </li>
-        <li> One heading </li>
-        <li> One paragraph </li>
-        <li> One image </li>
-        <li> A menu or navigation bar that links to your `Home` and `About` pages </li>
-    </ul>
-    <strong>Think about the order of your content as you assemble the body of your page.</strong> 
-</p>
+Add HTNL to your `index.html` file. This page should include the following:
+
+- Doctype
+- Root element
+- Head and a body
+- Title for the page
+- One heading
+- One paragraph
+- One image
+- A menu or navigation bar that links to your Home and About pages
+
+Think about the order of your content as you assemble the body of your page.
 
 Don't worry about getting the content just right, as much as using this exercise to review the structure of a webpage, and practice creating a webpage. 
 
 ## Additional Tags
+
 Here are two additional tags that might come in handy in assembling your page:
-<p>
-    <ul>
-        <li> To make a list. This may come in handy when making your menu or navigation bar. </li>
-    </ul>
-</p>
 
-```
-<p>
-    <ul>
-        <li> item 1 </li>
-        <li> item 2 </li>
-        <li> item 3 </li>
+To make a list:
     </ul>
 </p>
+
+```html
+<ul>
+  <li> item 1 </li>
+  <li> item 2 </li>
+  <li> item 3 </li>
+</ul>
 ```
 
-<p>
-    <ul>
-        <li> To make a line break or give space between different elements. </li>
-    </ul>
-</p>
+(This may come in handy when making your menu or navigation bar.)
 
-```
-<br/>
+To make a line break or give space between different elements:
+
+```html
+<br>
 ```
 
-## CHALLENGE
-Finished? Play around with other tags by referring to an [html cheatsheet](http://www.simplehtmlguide.com/cheatsheet.php). 
+## Further Challenge
 
-## Command Line for new folder and file
-After opening the terminal: </br>
-2. $ cd Desktop </br>
-3. $ mkdir website </br>
-4. $ cd website </br>
-5. $ touch index.html
+Finished early? Play around with other tags by referring to this [HTML cheatsheet](http://www.simplehtmlguide.com/cheatsheet.php). 
 
 [<<<Back](conventions.md) | [Next>>>](css_basic.md) 

sections/images.md

@@ -4,17 +4,15 @@
 
 Images are another important component of websites. Sometimes these just help bring your website to life, but other times they can help communicate information to users. 
 
-**Challenge:** What type of tag is the `<img>` tag? *Hint: Compare this tag with your `<p>` tag.*
-
-Images are created with the `<img>` tag. Similar to the `<a>` tag, `<img>` requires an attribute, in this case `src`. The `src` attribute stands for source and communicates secondary information to your browser that identifies and locates the image. 
+Images are created with the `<img>` tag. Similar to the `<a>` tag, `<img>` requires an attribute, in this case `src`. The `src` attribute stands for source and communicates secondary information to your browser that identifies and locates the image. Unlike many other tags, the `<img>` tag does not need to be closed, making it an example of a void tag.
 
 The following element pulls in an image located in the same folder as the `.html` file:
 
 	<img src="scream.jpeg"/>
 
 The same rules apply here as with the `href` tag: if the image is not located in the same folder as the document you are writing in, the image will not be found by the browser. If the browser cannot find an image resource, you will see a broken image icon, such as this one from Chrome:
 
-![Chrome broken image icon](broken.png)
+![Chrome broken image icon](../images/broken.png)
 
 ## Making Images Accessible
 
@@ -34,8 +32,4 @@ Tip: Give the file a simple name. Also, the name **cannot** have spaces.
 
 Using the code above as a reference, add that image into your `index.html` file, re-save the file, and re-open or refresh the page in your browser. Your image should now appear on the page.
 
-## What type of tag is the `<img>` tag? 
-
-The `<img>` is a void tag. 
-
 [<<<Back](links.md) | [Next>>>](conventions.md)