Wednesday 28 September 2011

Basic skills 28 September 2011

Before starting on this week's exercise, which is an introduction to assignment 2, you should make sure you are set up to use the Macs in the lab, and check that you can complete some simple tasks.

If you have got this far you have already logged in and are using a browser. If you're not confident about any of the following four tasks, work through this exercise before starting on Lab 2:
  1. Copying and saving text from a web page
  2. Opening an html file in a browser
  3. Editing and modifying an html file
  4. Commenting to give us feedback

Copying and saving text from a web page

  • Open the TextEdit application. This will open a blank document.
  • In the Format menu select Make Plain Text
  • Copy the text below from the web and paste it into your TextEdit document.
    <!DOCTYPE HTML>
    <html>
        <head>
            <title>HTML Hello World</title>
        </head>
        <body>
            <h1>Hullo!</h1>
            <div>
                <img src="http://bit.ly/b1PFic" 
                     alt="Hello World!" />
            </div>
            <h2>h2 heading</h2>
            <p>This is our HTML sample code. 
               It shows several elements:
            </p>
            <ul>
                <li>The html document block.</li>
                <li>The head, which contains 
                    the title of the page.</li>
                <li>The body, 
                    which contains the content.</li>
                <li>An h1 and an h2 header.</li>
                <li>An image.</li>
                <li>A paragraph.</li>
                <li>An unordered list.</li>
            </ul>
        </body>
    </html>
    
  • Did you select Make Plain Text in the Format menu? – If not, do it now!
  • Save the TextEdit document – call it "something.html". (If you are asked whether you want to use ".html" or ".txt", the answer is ".html".)

Opening an html file in a browser

  • Now make a new browser window.
  • Use Open File from the browser File menu to open the document you just saved.

Editing and modifying an html file

  • Edit the document in the TextEdit window.
  • Save it.
  • Reload the page in the browser window.

Commenting to give us feedback

  • Please leave us a comment, using the Comment button below.
  • Comments are moderated so your comment won't appear immediately, but we will read it.
  • Let us know if anything was too hard or too easy.

No comments:

Post a Comment