1. Take Web Design Presurvey http://go.ncsu.edu/stars_sparcs Username: First initial, last name For example, Omar Estrella -> oestrella Password: Same as above Check out http://tinkerbin.com/http://tinkerbin.com

2. Web Design SPARCS 2012

3. What is a Webpage? What makes up a webpage?

4. What is HTML? HyperText Markup Language A computer language to make webpages A human readable language that tells a web browser how a web page should look

5. HTML & Your Browser HTML CSS Javascrip t

6. HTML Tags Can be many things like images, text formatting, tables, lists, etc. Tags take the form stuff inside The first is the opening tag stating the action you are performing. The second ends the action. Hello, world!

7. Nested Tags What if you want to make text bold and underlined? HTML tags can be nested to “chain” actions Hello, world!

8. HTML Documents HTML documents end in “.html” filename.html My title opens the document contains information not displayed on the web page is the title shown in the browser bar the information that is displayed

9. Formatting Text You can use as many tags at once: Hello, world! CodeTagsWhat it does b Bold i Italic u Underline

10. Formatting Text cont. Headings Heading 1 Heading 2... Heading 6

11. Other Text Tags TagWhat it does This tag gives you a line across the pages (hr stands for horizontal reference) This tag breaks the texts and starts it again on the next line This tag stands for paragraph. It is the same as except it also skips a line.

12. Text Alignment You can align text using the tag Text aligned to right Can be left, center, or right

13. Images Images have their own tags You can manipulate the image like text

14. Making Hyperlinks To link to other websites: Text

15. Lists There are two types of lists Ordered lists Unordered lists

16. Ordered Lists HTML tag: My morning routine Wake up Eat breakfast Go to class My morning routine 1. Wake up 2. Eat breakfast 3. Go to class

17. Unordered List HTML tag: Cake ingredients Eggs Milk Cake mix Butter Cake ingredients Eggs Milk Flour Butter

18. Tables Used to display information in a tabular manner Consists of headers, rows, columns, and cells May have borders, colors, and styles Table Tags: - Table tag - Table row - Table header - Table cell

19. Tables Example Sushi Number of Votes Spicy Tuna 10 Eel 13 Sushi Number of Votes Spicy Tuna14 Eel10

20. CSS Cascading Style-Sheet Define how things are displayed through properties You can add CSS to any HTML tag

21. CSS Example http://www.eatsleepgeek.com/wp-content/uploads/2009/09/sonic- classic.jpg'