29.8.07

106: Week Two Computer Lab

Today's class will seek to introduce you to your blog, some of the features of Blogger, and to the basics of HTML that you will need to compose your posts.

Creating Your Blogger Account

All of you should have received an email invitation last night to join a Blogger blog. Find this email.

In order to join the blog, you will have to create a Google identity. Some of you might already have gmail accounts, and therefore already have a Google identity. MAKE SURE THAT YOUR GOOGLE IDENTITY CANNOT BE TRACED BACK TO YOUR REAL IDENTITY. Sorry to scream, but its very important to us that you remain anonymous. Do not create a user identity that involves your real name or your Purdue name. For instance, I have four online identities:

  • marccsantos: I use this identity for web design discussions. I want people to know my real name and identify it with my comments and my work
  • mcsantos: I use this identity for academic discussions and for Purdue accounts.
  • santosis: I use this identity primarily for social groups
  • insignificantwrangler: this is actually my primary online identity

For this assignment, I might use either of the latter identities. We'll walk through this process in class.

Blogger Features

One reason we chose to use Blogger in this class concerns its numerous available and accessible features. We're going to play with a few now.

  • First, from the dashboard, chose to "View Blog." It is possible that a team member from another class has already begun making changes.
  • Go back to the dashboard, and select "settings." You'll notice a number of options under the main tabs. The "basic" set of options includes a title field and a description field. Modify those now (remember that for your first project we want the group to create and justify an interesting and original title!). For now, anything better than "Blog #" will do.
  • The Publishing tab will allow you to give your blog a new URL. Don't change this until you have discussed the change with your group! Like your title, you should be playful with your URL.
  • Chances are you won't be using the Formatting tab right away, but this tab gives you the option of manipulating how many posts appear on one page, time and date format as well as some other advanced settings.
  • We're not going to worry about the rest of the tabs under "Settings" today.
  • Instead, choose the main tab "Template." Over the course of the semester, we'll discuss more and more ways for you to customize the design of your blog and to add elements, widgets, and functions. Today, I want to show you how to add a Blog Roll and input some entries. You'll want to make sure that this blog roll has at least three entries for each member of your group by the time you put up the first project post.
  • When you click the "Template" tab, you should get the Page Elements screen. Here we are going to choose to add a page element
  • We are going to add a link list. We'll walk through this in class.
  • If time permits, I'll talk about the Pick New Template tab.

Now that we've poked around some of the features of Blogger, let's deal with the nitty-gritty--how to post.

Posting to Blogger

For the rest of today, we'll make a practice post. At the end of the class we'll delete it, so don't worry about writing anything of high quality, we just want to familiarize ourselves with HTML. HTML is the basic code used to categorize content on the web. All content appears between tags that classify it and instruct a web browser on how to format it. We'll be learning the essential tags by answering some simple questions.

First, let's see a list of the basic tags. Tags open before an element and close, using a backslash, after the element:

  • <p> x </p> - the paragraph tag, this is the tag you'll use for most content
  • <h#> x </h#> - the header tag, numbered according to importance. An h1 tag, for instance, is like a thesis statement--only one per page!
  • <ul> x </ul> - the unordered list tag, this "opens" a list, you open a list before tagging list items. When you have finished your list, your close this tag. List
  • <li> x </li> - the list item tag
  • So, a completed list looks like this:
    <ul>
    <li> Tom Brady </li>
    <li> Joe Montana </li>
    <li> Dan Marino </li>
    </ul>
  • <blockquote> x </blockquote> - the blockquote tag does exactly what its name implies: it sets off a block of text as a quote (adjusting margins, color, font, etc.)

These are all the structural tags we'll need today. Virtually every piece of information in your syllabus will fit into the above categories. We can add some semantic tags to our list:

  • <strong> x </strong> - the strong tag appears as bold face. Use this for information that needs to be loud.
  • <em> x </em> - the emphasis tag appears as italics. Use this for information that needs to be differentiated.
  • <cite> x </cite> - the cite tag appears as italics (by default it appears exactly as the emphasis tag). Anything that would receive italics according to MLA citation should get the cite tag (any major publication--a book, a movie, a tv series, an album, etc.). The em tag is reserved for stress and emphasis, not for citation.

Now, let's put some of these tags to use.

  1. Write a breif paragraph, using the <p> tag, on the last good movie you saw. Remember to use the cite tag for the movie title
  2. Write a second paragraph on the main character of the movie
  3. Now lets make a list of three movies similar to the one you watched
  4. Now write a paragraph on whether you'd recommend the movie to other people
  5. Now lets use blogger to insert a picture. Open a new tab or window and find a picture of your movie on the web. Make sure you click on the image to get its unique URL. Back in Blogger, click on the small landscape image right above the text box you are writing in. Input the URL of the image. Once you hit "Upload," the code for your image will appear in an "img" tag at the top of your post. You will have to copy all this code (unitl the />) and paste it where you want the image to appear

That's it for today, press publish and you can see what your post looks like. You can always edit a post after you post it by choosing "Edit Posts" from the "Posting" tab or by pressing the small pencil icon at the bottom of every post. We'll delete the post you just put up so you and your group can start with a clean slate.

No comments: