LL WEEK 6
Week 6: Critique; Introduction to HTML via the link self-portrait project
45 minutes: Critique of Sketch 2,3,4; Pin up prints to wall or lay out on table
30 minutes: What the heck is HTML? Go to a typical HTML page and choose VIEW>SOURCE. You are seeing the formatting language that makes web pages look the way they do. Here is a great introduction to HTML: http://www.w3schools.com/HTML/
Demonstrate how to add a hyperlink, and local image saved in thesame directory as the .html file:
Open TextEdit. Type, or copy and paste this simple HTML, create a directory on the desktop titled “Wired_week6.”
<HTML>
<BODY>
Hello world!
Click for <A HREF=”http://saic.edu”>SAIC website</A>.
Click for <A HREF=”http://go.artic.edu”>SAIC portal</A>.
</BODY>
</HTML>
Please make all text “plain” by going to the toolbar menu FORMAT>MAKE PLAIN TEXT. Then save the file as “helloworld.html.” Then upload this text into a browser.
Note that any text within the body tags and outside of the anchor tags shows up as plain text on the webpage. Now add a title tag set before the body tags within a HEAD tag set. Save and click the refresh button to reload the newly saved file in your browser. What does the title tag add?
<HTML>
<HEAD><TITLE>Hello out there</TITLE></HEAD>
<BODY>
Hello world!
Click for <A HREF=”http://saic.edu”>SAIC website</A>.
Click for <A HREF=”http://go.artic.edu”>SAIC portal</A>.
</BODY>
</HTML>
HTML/CSS in action in your own blog: How do I change my Wordpress blog’s look and feel? You have to change your theme. Login to your Dashboard, click Appearance, and you will see a range of Themes pop up. You can choose “Preview” to see how the content will look with the new Theme’s CSS attributes.
What and where is my blog’s CSS? If you want to see how your blog text is “styled” just login to your Dashboard, click Appearance, then click Edit CSS. When you host a blog on Wordpress, you actually can’t edit the CSS without paying for an upgrade. Most people who run blogs host their own blogs so they can easily customize the CSS. If you click “View Original Stylesheet” you can glimpse what is going on behind the scenes in your blog theme.
Other things to demo in Wordpress:
Widgets: Adding a Flickr widget, adding a text widget, adding the Blogroll, or links widget
Blogroll: Demonstrate how to add a favorite link to the Blogroll.
10 minutes: Scanning demo, if necessary and requested by the class.
>Sketch 6
Scan, or create a image, or a collage of images from your work this term in this class or in another to use on the splash page (index.html) of your self-authored HTML website. Image should be no larger than 800 x 600 pixels, 72 dpi, saved as a JPG. You may want to incorporate your name? (Example of artist’s website with splash page: bsing.net).
>Reading
Every montage tells another story. WIRED magazine: http://www.wired.com/culture/lifestyle/news/2002/06/53348