CGS2822 Web Scripting 1
HTML 5 -- Links and Images
1. HTML is a hypertext markup language, therefore it makes extensive use of links
allowing the user to jump from one web page, or one part of a page to
another, quickly and easily.
2. Images are another feature that is heavily used in web pages. Images can also
serve as links.
3. Protocols. The Internet recognizes several protocols. A protocol is a standard
way of doing something.
3.1. FTP. Stands for File Transfer Protocol.
3.2. File. The file protocol indicates the browser should load a page without
connecting to the internet.
3.3. MailTo. Web pages often contain links that let a user use email. The
mailto protocol is used for sending email from a web page.
3.4. Telnet. This protocol establishes a telnet session. Telnet is an
authenticated protocol that allows a user to access a system and run some
program on the server.
3.5. News. Use this protocol to connect to newsgroups.
3.6. NNTP. This provides access to specific articles in the Usenet news
system.
3.7. Gopher. The gopher protocol is old, and provides access to gopher
servers, not web servers. There are still a few around. Think of gopher as
serving up text only web pages.
4. Default Link Colors.
4.1. Blue for unvisited and purple for visited are the usual default link colors.
4.2. You can set the default link colors in the tag.
CGS2822 Web Scripting 2
HTML 5 -- Links and Images
4.2.1. LINK = unvisited sites.
4.2.2. VLINK = visited sites.
4.2.3. ALINK = active link.
5. Adding Links to a Page.
5.1. The ANCHOR ... container is used to create links on a web page.
5.2. The tag has 3 attributes:
5.2.1. HREF = the actual link to another site. Often a url.
5.2.2. NAME = creates a target for a link within a web page.
5.2.3. TARGET = indicates the file associated with an HREF attribute should
be loaded into a specific frame or location.
5.3. The general format of an tag is
Label to display
Go to PSC!
5.4. Example: Links1.html
5.5. We can combine the Fauxbutton idea with links...
5.6. Example: FauxbuttonLinks.html
6. Links to locations within a page.
6.1. You can use the tag to jump from one location on a page to
another location on the same page if you mark the location with the tag:
tag.
CGS2822 Web Scripting 3
HTML 5 -- Links and Images
6.2. These internal links are called fragments!
6.2.1. The syntax for a fragment is Label
6.2.2. The basic syntax for linking to a fragment is
Label NOTE the # in the string!
6.2.3. There are 3 formats for the tags depending on where the
fragment is located.
6.2.3.1. Tag is in same page as fragment:
6.2.3.2. Absolute Link to a fragment
Suppose http://www.xyz.com has a fragment called hobbies you
would use . . .
6.2.3.3. Fragment is in a different page, but in the same folder.
6.3. Example of linking to fragments: Fragments.html