B CUSP 110B: Digital Thinking: Animation, Video Games, and the Social Web

B CUSP 110C – Digital Thinking

Exercise 2: Set up your personal web-page

In this exercise we will explore and experience:

· Enabling web-page service on your MyUW account

· Transferring files between your desktop client and UW web server

· Reading, understanding, and editing HTML <tags> to customize a personal web-page for yourself.

In the following we will go through these steps:

1. Step 1: gain access to UW NetID content manager from your MyUW main page.

2. Step 2: enable the web service for your account: enabling your Student Web Publishing.

3. Step 3: modify a simple HTML file on your local desktop machine.

4. Step 4: transfer files between your desktop and UW web server

Let’s begin!!

Step 1: Gain access to your UW NetID manager from your MyUW page:

· Open your web-browser and serve to your myUW page:

o http://myuw.washington.edu/

o Proceed and login with your MyUW login and password.

· On the main page of your MyUW, click on Add Content to add in the content manager sub-window for UW NetID:

· You will see a list of content managers you can add to your main page, when you have time (at home) try some of these out. Fun! For now, scroll to find: UW NetID, click on Add to add this content manager to your MyUW main page.

· Now, go back to your MyUW main page (by clicking on MyFrontPage on the top-left corner)

· On your MyUW main page, you will see a new content manager box with titled: UW NetID

Step 2: enabling the web service for your account: enabling Student Web Publishing:

· In the UW NetID content manager sub-window, click on : Change Your UW NetID Password

· This will bring you to your UWNet ID manager page, click on Computing Service

· Under “Inactive Services” you should see “Student Web Publishing”, click on the check box to enable this service (the above screen shot shows the result after the service is enabled).

· You should see a new page of some graphics working and telling you the progress. This may take a while to complete. Now, in the meantime, we can begin creating our main page content.

Step 3: modify a simple HTML file on your local desktop machine.

· Download this zip file to your desktop and unzip the file: you should see a PersonalWebPage folder on your desktop. WARNING: Make sure you remember to unzip the file!! DO NOT work with the zip file!

· Go into the PersonalWebPage folder to see four files:

o index.html,

o MyPhoto.jpg

o MyPrincipal.docx

· Double click on index.html, what do you see? Notice the following 5 bad-items:

1. The title bar: (Someone important’s personal home page):

2. The name of the person is “blah blah blah”

3. The picture of the person: notice this is MyPhoto.jpg

4. The link to this person’s value: notice this is linked to MyPrincipal.docx

5. Notice: this person’s BFF: Big Head is in bold.

· To prepare to customize your own page, go gather the following two items and place them into the PersonalWebPage folder:

o A picture: you want to show as yourself.

o Your MyValue essay from second week of class.

Gather the above as two files, name these anything you want and place them in the PersonalWebPage folder.

· Now, we want to open and edit the HTML text!! Now, open the index.html file with the Notepad++ text editor by right-mouse-button click on the index.html file and select Edit with Notepad++:

· Now, you are seeing the raw text of index.html!

· Notice

o this is a text file with <tags>. Notice that <tags> comes in pairs <beginTab> </endTag>.

o the content between title tag is the title: <title> Title </title>

o <h1> is first level header (<h2> is second level header)

o <p> to start a new paragraph …

· Easy to read this file?!

· Now, customize the content of this file such that the 5 bad-items are corrected.

o Remember to “save” the content as your change the html file!

· At any point, you can double click on the index.html file to examine your changes! Cool?

Step 4: transfer files between your desktop and UW web server

· When you are happy with your editing, you are ready to transfer your personal web-page content to the UW server!

· Let’s verify your personal page is set up: browse to http://students.washington.edu/YourNetID (REMEMBER to replace YourNetID!) to see: (exciting eh?)

· Now, start a file transfer program, WinSCP (in All Programs):

· Open WinSCP (this is the file transfer program), and click on New to begin a new file transfer session

· You want to connect to the web-page server machine (dante.u.washington.edu), with your login and password:

· You should something like the following (left panel is your local machine, and right panel is content on dante)!, for the left panel, go to your desktop and go into PersonalWebPage folder:

· On dante (right panel), go into the public_html folder (the following is a screen shot of my account, yours will look slightly different, but you will have the public_html folder, double click on that to go into that folder):

· Now, you can drag the three files you need from the PersonalWebPage folder (the left panel) over to the right panel! This “dragging” motion is the transferring of files!!

o Notice, when you drag a file from left to right, you are transferring from local desktop to web-server: up-loading a file!

o If you drag files from right to left, you will be transferring a file from the web-server to your local machine: down-loading a file!

· Now, go to http://students.washington.edu/YourNetID (REMEMBER to replace YourNetID!) again to see your personal creation!! Exciting? Send this link to your grandma! J

To Turn In
Nothing! Show Jack your page and make sure he checks your name off.

Wrap Up

In this exercise you have practiced:

· Adding content manager to your MyUW page

· Enabling the UW web-server for your account

· Understanding and editing simple html file

· Transferring files between a local host and web-server

To Turn In Nothing! Show Jack your page and make sure he checks your name off.

Wrap Up

Further reading/information:

To Turn In
Nothing! Show Jack your page and make sure he checks your name off.