Assignment
You will create a personal web page using HTML. HTML (HyperText Markup Language) is a standard markup language used to format web pages (it is not a programming language). You will upload your HTML code to your UCSC server, and then anyone can view your web page on the internet.
This assignment will be out of 1000 possible points.
Before You Start:
• We highly recommend using a specialized text editor, such as Notepad++ for Windows. Do not use a standard word processor, like Microsoft Word. It will mangle your code in unforeseen ways. And do not use a web page generator (it is easy to tell the difference).
• Open your text editor and start writing your HTML code in a blank document. Be sure to save your file as "index.html" (all lowercase). There is probably a drop-down menu in the save window that will let you choose HTML. Do not save your file as "index.txt".
• To edit your index.html file later, do not double-click on the file on your computer. Instead, either right click on index.html and choose your text editor, or open the text editor first and open index.html from there.
• To preview your index.html file, double-click on you index.html file to open it in your default browser (i.e. Firefox, Chrome, Safari, Internet Explorer, etc.). This is a preview of what your HTML website will look like when you upload it to your UCSC server.
• You may use the professor's example web page as a starting point. Simply go to the website and view the page's source code (sometimes achieved by pressing Control-U on your keyboard). The website has only some of your required items. Be sure to use different content and values than the professor.
• Do not copy-and-paste the professor's source code into your file. This sometimes leads to unseen errors in the code (this becomes very important in the Javascript assignment). Instead, type all your code by hand. This is an important practice for all programmers.
• You can find a list of many HTML tags here. In general, if you do not know the HTML tag for something, a Google search will help (ex. search "centered text html").
• For full credit, you must close all your HTML tags. For example, must eventually close with ,
must eventually close with , etc.
Required Items:
1. Title (this is different than a heading)
2. Headings of two different sizes (ex. h1, h2, h3, etc.)
3. Colored background (other than white)
4. "Mailto" link to your email address
5. Hyperlink to another website (must use a URL, not a file path)
6. Bold text and italic text
7. Centered text
8. Horizontal line (aka "horizontal rule")
9. Ordered list (numbered list) and unordered list (bulleted list)
10. A working picture. Must use http for the link rather than a local reference. (I'll explain this part in class, or you can look at the example page.)
• Note: Your web page must be uploaded to your public_html folder and the index.html must be submitted to Canvas.
Uploading:
1. Download and install a Secure File Transfer Protocol (SFTP) program, such as Cyberduck, which you can download from the Files section of the class portal.
2. To install Cyberduck for Mac, open the Cyberduck zip file to create Cyberduck.app
3. To install Cyberduck for Windows, run the Cyberduck installer
4. Click "Open Connection" in the top left corner
5. Change "FTP (File Transfer Protocol)" to "SFTP (SSH File Transfer Protocol)" and then enter:
o Server:
o Username: your UCSC username
o Password: your UCSC blue password
6. Click "Connect." If an "Unknown Fingerprint" warning comes up, click "Allow"
7. Select the "public_html" folder. Note: Do not delete, rename, or move the public_html folder. It is a special folder created by the UCSC IT department.
8. To upload your website to the internet, simply drag and drop your index.html file from your computer into the public_html window. Remember, anything you upload is publicly available online for anybody. Also, whatever file is named "index.html" becomes your homepage (hence the importance of naming your file index.html).
9. If you want to upload any other files (ex. a picture to include on your website), drag that file to public_html as well. That file can be accessed/referenced (replace "username" with your UCSC username and replace "filename" with the name of your uploaded file, like "cat.jpg")
10. Now visit your website live on the internet (replace "username" with your UCSC username).
11. If you want to update your website, just change your HTML code in your index.html file and drag it into public_html again.
Attachment:- HTML-Assignment.rar