2. Review Homepage: Starting point World’s smallest HTML in index.html Viewable in Internet Explorer http://www4.ncsu.edu/~loginID Edit/Save/Reload Editing in Notepad Save changes in Notepad Reload/Refresh web browser
3. Homepage Ideas Who are you? What is your major? Interests? Favorite movies? Links, pictures View Source – remember to stay within CSC200 material!
4. HTML Tags <BODY> The <body> tag sets the standard values for the entire webpage. This tag can change the: Background Solid color, image Text color Color of hyperlinks Link, active link, visited link Background image: Background=“image.gif”
5. HTML Tags (2) <H#> the HEADING tag ranges 1-6 Replace # with 1, 2, 3, … 6 Hierarchy; # is an indication of its dominancy with 1 being the largest size text, 6 the smallest Difference between <H#> and <HEAD>. <H#> covered last lecture and in the Manual! Example: Heading that is centered – <center><h1>Homepage</h1></center>
6. Images <IMG SRC=“image_name.gif”> Make sure the image name is the exact same as it is saved in your www folder. .gif or .jpg format Convert with Paint application Pulling images from your K: drive Needs to know path name Example: <IMG SRC=“http://www4.ncsu.edu/~loginID/photo.JPG”> Or <IMG SRC=“./photo.jpg”> No closing tag needed
7.
8. <A HREF=“…”>…</A> Example: Absolute Hyperlink: Creating a link to internet site <A HREF=“http://ncsu.edu”>NCSU</A> Relative Hyperlink: Creating a link within your account <A HREF=“./page2.html”>About me</A> ./ An abbreviated way to write a path to your account (LINUX) page2.html An example of a file name saved in your www folder, just like your index.html Remember to close link tag! Hyperlinks
9. Content Alignment By default, content aligned to the left. <center>…</center> Example: <CENTER><IMG SRC=“./photo.jpg”></CENTER>
10. Content Alignment (2) align=right Example: <IMG SRC=“./photo.jpg” align=right> Text wrapping Place the image tag within a paragraph to get:
11. Announcements Interactive Lab Quiz 4! Example: http://www4.ncsu.edu/~vjbuchan/csc200example.html Or http://www4.ncsu.edu/~vjbuchan Enter Announcements CSC200 Example webpage Homework None due next week, Oct. 10 Homework 5 works with your index.html file! Don’t wait too long, you’ll need to use a unity lab computer. EVERYONE should get 100%!
