Math 171 - Alexiades
                  Lab 7
          Creating your own web page

You have been using web pages since day one in this course, and we have discussed the Internet,
World-Wide-Web, and HTML in class. Now you know all you need to create your own web page !

A. Here is a template page with some essentials. Follow the steps:
    (THIS HAS NOTHING TO DO with Matlab, of course!)
1. On your machine, create a Lab7 directory (folder) and in it create a text file index.html .
   Pay attention where the file is, you'll need to view it on a browser later.
   Open the file in a PLAIN TEXT editor, and copy/type everything between the dashed lines into it, 
   BUT  ommit the blank space  after each "<" and each "&"
   I had to insert blanks to break the HTML, so that tags show instead of being rentered !

------------------------------------------------------------------
< HTML>< head>
< title> My First Homepage </title>
	</head>
< !-- red on black, cyan   Note: this is a comment -->
< BODY bgcolor="#000030" text="#ff0000" link="#00ffff" 
	vlink="#00ffff" alink="#FF0000">
< !----- black on lightyellow, blue, magenta (commented out)
< BODY bgcolor="#FFFFCC" text="000000" link="#FF0000" vlink="#FF00FF">
	----->
< FONT SIZE="+1">< I> Home Page under Construction </I></FONT>
< HR SIZE="1">
< CENTER> < H1> 
?????? 's Homepage
</H1> </CENTER>
< HR width="70%"> 

< H2> Some Favorite Web Sites: </H2>
< !-- here is a numbered list -->
< OL>
< LI> < a href="http://www.utk.edu/">
	< B> UTK </B> </A>
< P>
< LI> < a href="http://web.utk.edu/~YOUR_NetID">
	< B> My own web page !!! </B> </a>
< /OL>
< HR SIZE="3">

(make this centered, bold, and bigger size)
Math 171 Pages 
< !-- here is an unnumbered list -->
< UL>
< LI> < a href="http://www.math.utk.edu/">
	< B> UTK Mathematics Dept. </B> </A>
< LI> (insert a link to the Math171 course page here)
< LI> < a href="https://www.youtube.com/watch?v=OmJ-4B-mS-Yt"> < B> 
	The Map of Math < /B>< /A>, (video) by Dominic Walliman.
< /UL>
< HR SIZE="3">
< PRE> Preformated text. Type a couple of lines here
	to see what happens, e.g. your name, major, ...
< /PRE>
< HR size="4">

< ADDRESS>
email: & nbsp; < a HREF="mailto:?????@vols.utk.edu">  ?????@vols.utk.edu </A>
</ADDRESS>
< I> & copy;2017 & nbsp;  ????? </I>
& nbsp; < font size="-2"> Last modified:  24 Nov 2017 </font>

< /BODY>
< /HTML>
------------------------------------------------------------------

2. Save the file. To see it on your browser:
   open a new browser (or a new tab), and go to  index.html 
   [or: Lab7/index.html].  There you have it!
   Move/shrink the browser and your editor window side-by-side
   so you can see both, to observe how each HTML directive is rendered.

   Observe that most HTML markup tags come in pairs:
   <html>   ... </html>
   <title>  ... </title>
   <body>   ... </body>
   <center> ... </center>
   <font>   ... </font>
   <h1> ... </h1>	,  <h2> ... </h2>
   <ol> ... </ol>	,  <ul> ... </ul>
   <b>  ... </b>	,  <i>  ... </i>

   The all important Anchor:    <a href=...> ... </a>
   with the web address (URL) specifier:  href="..."

   And some don't have (or do not require) a closing match:
   <br> , <hr> , <p>

   Note that HTML is NOT case sensitive, so <b> is same as <B>,
   and spaces/new lines are ignored.
   
   What draws a separator line ?  What prints italics ?  bold ?

3. In your index.html, replace each "?????" with your name.
   To see the changes, Save (the file in the editor) and 
   Reload (the page on the browser), of course.

4. Fix whatever else needs to be fixed up.
   In particular, replace the "YOUR_NetID" with the real thing.
   Save and reload the page.
   Fix your email address at the bottom. Test it by sending yourself
   a message. Did it work?

5. Change some things, like putting your name in the title, altering some of the SIZE values, etc.  
   Remember to save the file and reload it on the browser after each change.
   Experiment a bit to see how things work.  
   Change the URLs in the unnumbered list to other sites.
6. Want to learn more about HTML tags ? there are many more, and more are created with each new version of HTML...
  Here is a resource for HTML5: HTML Introduction , and another: HTML Beginer's Tutorial.
  ... come back to it later, in your spare time ...
B. Posting page on the UTK server
  Great, now you have a web page but nobody else can access it !
  To "publish" it takes a little bit more work... you need:
    1. UTK Unix account ,   2. SSH to login to it ,   3. SCP to transfer files to it.
  Here is some basic info:   Your Personal Website   but it's best to login to your Unix account...
  • Install PuTTY or WinSCP (on Windows), Fetch (on Mac)
      see   SSH/SFTP clients configure clients OIT Knowledge Base
  • Register for a UNIX account:   UNIX account which eventually leads to:
      "For security reasons you will need to call the HelpDesk at (865) 974-9900 or
      go in person to the OIT Service Center located in the Commons at Hodges Library."
  • login to your UNIX account on   unix.utk.edu   using an SSH client:
      Mac OS-X already has SSH, do: ssh netid@linux.oit.utk.edu
      Win: use WinSCP to connect to unix.utk.edu , then click "Commands", click "Open in PuTTY"
  • transfer your "index.html" file to the web-server using SCP client (WinSCP / Fetch)

    On the server:
      When you login, you will be in your "home dir": pwd will show full path, will be:  /home/Your_NetID
  • See what files are there:  ls -lF
        "index.html" will be there after you transfer it. Check if "public_html" exists.
  • If not, create a directory named "public_html":   mkdir  public_html
      It needs to have permissions:  drwx--x--x ,   check with:  ls -lF ,
      and if it is not, you can set it:  chmod a+x public_html
  • Copy your "index.html" file into the "public_html" dir with name "default.html":   cp   index.html   public_html/default.html
  • Go to the sub-dir public_html:   cd public_html   and   ls -l
      permissions must be: -rw-r--r-- , check it!
  • If not, make it readable by all:   chmod a+r default.html

    The URL of your very own web page will be:
        http://web.utk.edu/~USER   where USER is your NetID
    Click on it. It will fail till you do what you must !
    You'll know you did it right when you can see your page with "http://web.utk.edu/~USER showing in the URL !

  • Don't confuse where what you see is coming from.
      One is the local file "index.html" on your machine, with URL: file:... (which nobody else can see).
      The other is the "published" page, in your public_html/ dir on the server, with URL: http://web.utk.edu/...
      (which the UTK web server serves to the world).

    C. Finally, submit your homepage on Canvas, no, NOT the file, just insert its URL on Canvas !!! so I can admire it...
      Now you can brag to your friends that you created your own web page (...almost) from scratch !

    And when you have some time to spare, check out the many links on Internet - WWW - HTML

    Have fun ! All done !