Friday, March 28, 2014

Start of your Website

The code we worked in class on 3/27 is shown below.  This will be the foundation that we will be building off of for the rest of the semester.  Make sure to save your code somewhere for now that you can get at it and keep adding to it week after week.  We are working on an online solution for you, more details to come.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Seahawks Merch</title>
</head>
<body>
    <header>
        <div>
            <h1>We are 12</h1>
            <div>
                <input type="text" />
                <button>shopping cart</button>
            </div>
        </div>
    </header>
<nav>
<ul>
<li><a href="#">Mens</a></li>
<li><a href="#">Womens</a></li>
<li><a href="#">Kids</a></li>
<li><a href="#">Jerseys</a></li>
<li><a href="#">Accesseries</a></li>
<li><a href="#">T-Shirts</a></li>
<li><a href="#">Sweatshirts</a></li>
<li><a href="#">Hats</a></li>
</ul>
</nav>
<section>

    </section>
<section>
<ul>
<li>
<img src="" />
<h3>Shop Mens</h3>
</li>
<li>
<img src="" />
<h3>Shop Womens</h3>
</li>
</ul>
</section>
<footer>
<div>
   <h2>Check out our fans!</h2>
</div>
</footer>
</body>
</html>

Hopefully you can write and understand the mark up above.  If you have any problems don't forget to GTS (Google That S***).  Some people have been using Code Academy and W3Schools to learn more about some of the tags and attributes.  Those are both good places to go through some tutorials and learn extra on your own.  I also heard that Code Academy has an app you can download so you can practice on your commute.

Have a great Spring Break.  Looking forward to seeing everyone the following week.
Posted by at 1 comment:

Tuesday, March 25, 2014

HTML tags and study resources

Hey Gang,

We have been digging into HTML tags lately.  You are going to learn this stuff much better if you practice.  There is a great tutorial on CodeAcademy.com that has great exercises for HTML and CSS.  W3Schools also is a great resource, here is their HTML and CSS exercises.

Remember that you have to close every tag you open and that you can 'nest' HTML.  HTML elements can each have attributes.

So far in class, we have learned the following tags.  ALL of these get 'nested' between the <body> and </body> tags (see below):

Paragraph:
<p>this is a paragraph</p>

Unordered list:
<ul>
  <li>ul stands for 'unordered list'</li>
  <li>li stands for 'list item'</li>
  <li>li elements are 'nested' inside the ul</li>
  <li>li elements have a bullet point in front of them by default</li>
</ul>

Ordered list:
<ol>
  <li>ol is an ordered list.  There will be numbers in front of each li, list item</li>
</ol>

Table:
A table stores data similar to Microsoft Excel.  You can have as many table rows (tr) as you want, and those rows can contain as many table data (td) that you want.
<table>
  <tr>
    <td>row 1 - cell 1</td>
    <td>row 1 - cell 2</td>
  <tr>
  <tr>
    <td>row 2 - cell 1</td>
    <td>row 2 - cell 2</td>
  </tr>
</table>

It is always good to review the basic HTML structure:
<html>
  <head>links to other documents and settings go in here</head>
  <body>
       <p>EVERYTHING you see on an HTML page goes inside the body tag</p>
  </body>
</html>

Some very important tags that we haven't learned yet are:
Anchor links - This is what runs the interwebs!
Images - This is what makes the interwebs look pretty!

Practice makes perfect with HTML, make sure get as much exposure as you can!


Posted by at No comments:

Friday, March 21, 2014

Here goes!

Hey Gang,

Here goes Nerds Who Care spring semester, 2014.  This blog will replace http://nwc2013.blogspot.com/

We are starting our second semester at Yearup.org in Belletown.  We have a great group of enthusiastic students and are looking forward to another semester of embracing our inner nerd.

Muhalo!
Posted by at 2 comments:
Subscribe to: Posts (Atom)