Visual Tech

design studio

Kevin Duffy kpduffy@bsu.edu

exercise 2
September 27 HTML discussion Text Wrangler HTML writing intro Ex 2 intro

Getting Started Writing HTML

Knowing HTML is important to making solid websites that are meaningful intentional. We are leaning the basic of coding, only really hitting the tip of the iceberg. From a language standpoint, we want to be able to speak & communicate conversationally. So far youve been introduced to some web design basics; conventions for naming and saving, use of the software, viewing a browser locally, and writing basic HTML. I will give you a handout of a hypothetical website. Based on its appearance you will attempt to recreate it by writing the HTML language. Directions It is important that you start to get comfortable with html. In art & design we talk about form and content; the content being the meaning or ideas that the work is about, the content is then the way you say it, the visual language. In web design, HTML is the content. HTML is what you use to create what your site is about. Or think of a paper doll, HTML is the doll, CSS is the different outfits. Later we will discuss CSS, which is where we apply form, styling the site however we feel is appropriate for the content, but for right now we are just concerned with the HTML skeletal structure. Create a root folder on the server for your hypothetical site. Name your root folder with your last name_ex1. Always use meaningful naming conventions as we discussed in class. Use TextWrangler to begin writing your HTML code. Save your HTML file in your root folder as index.html Check your progress as you work by opening your index.html file in a web browser. Each time you make a chnge in TextWrangler & save it, refresh the page in your browser to see the changes. On paper, first try to determine the tags present and structure of the page. Draw diagrams of the content before you start to write the code. Identify the following: the initial HTML tag, head tag, body tag HTML tags we have discussed: images, links, h1-h3, ol & li, ul &li, div, p, etc. Besure to close each opened tag and include the Identify nested tags. Due Name & save files in a folder called lastname-ex2. Upload zipped folder to Dropbox.com and share folder with me. Your folder must be labeled with your last name so I can give you a grade. Deadline Due bythe end of class September 27, 2012.

Resources: http://www.dontfeartheinternet.com/ http://cssforprintdesigners.com/ http://www.w3.org/MarkUp/Guide/ http://www.webpagesthatsuck.com/ view code sourse using firebug for firefox