Microsoft Expression Web - Hyperlinks
Microsoft Expression web tutorial
Microsoft Expression Web - Hyperlinks
In this chapter, we will learn how to use hyperlinks in your website. One of the things that makes the web so extensive is the ability of web pages to link to other web pages. Hyperlinks or links are found in almost all web pages.
Hyperlinks also allow users to click and go to another page, place on a page, image, or other location on the Internet entirely. Here are some of the important features of hyperlinks -
The tools and hyperlink options of Expression Web make it easy to use links hypertext.
Expression Web hyperlink views and reports also make it easier to find and fix broken and bad links.
A hyperlink can be a word, a groupwords or an image that, when clicked, will take you to a new document or to a location in the current document.
In HTML, the tag known as the d tag anchor is used to link to another document. An anchor can point to another html page, an image, a text document or a pdf file among others. Here is the basic code for an anchor tag.
Text to display as a link
In , the "href" attribute is used to address the link to the document, and the words between the opening and closing of the anchor tag will be displayed as Hyperlink.
When you move the cursor over a link in a web page, the arrow turns into a little hand.
A URL is an address that specifies a protocol, a web server and pathof the file.
There are two types of URLs, absolute and relative . An absolute URL contains a full address while a relative URL is missing one or more parts of the address. However, the web browser obtains the missing items in training from the page that contains the url.
Let's take a look at a simple example where we will use both and Relative URLs .
Step 1 - First, open the index.html page and add the following lines in the main content
Example of absolute URL:
Example of relative url:
Home page 2
Here is the full implementation of the page index.html .
< content = " text / html; charset = utf-8 "http-equiv = " Content-Type "/>
Example absolute URL:
Example relative URL:
Home Page 2
Step 2 - Let's go save the webpage and you will see the text in the main content section .
Step 3 - In the Design view, right click on Google and select Hyperlink… from the menu that will open the Insert dialog boxr a hyperlink .
Step 4 - In the Address field, specify the URL of the Google home page and click OK. Likewise, right click on YouTube in the design view and select Hyperlink…
Step 5 - In the Address field, specify the URL of the YouTube home page and click OK. Now right click on "Home page 2" and select Hyperlink ... in the menu that will open the Insert Hyperlink dialog box.
Step 6 - For the relative path select index_2.html in the address field and Expression Web will get the remaining path of the index.html file, as these two files are located in the same directory. Click on OK.
As we can see, these words are now underlined which means that hyperlinks are created.
Step 7 - The default font color is blue and the default font color for hyperlinks is also blue. To change the default hyperlink color, select one of the hyperlinks and navigate to the Format menu and select the Background… menu option.
You will now see the following dialog box.
Step 8 - Let's change the color of the hyperlink to green.
In the following screenshot, you will see that the hyperlink color has changed to green.
Step 9 - Now let's see a preview of this web page in a browser.
If you click Google link, it will direct you tothe Google home page.
Step 10 - Likewise, if you return to the page home page and click on the YouTube link, it will direct you to the YouTube home page. Let's go back to the home page.
Click on the link Page home 2 and you will see that it opens the file index_2.hmtl .