HTML Links HTML uses a hyperlink to another document on the Web.

Slides:



Advertisements
Similar presentations
WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
Advertisements

CREATED BY : VIRAL M.KORADIYA. Anchor elements are defined by the element. The element accepts several attributes, but either the Name or HREF attribute.
Chapter 2 HTML Basics Key Concepts
INTRODUCTION TO HYPERTEXT MARKUP LANGUAGE 1. Outline  Introduction  Markup Languages  Editing HTML  Common Tags  Headers  Text Styling  Linking.
HTML – A Brief introduction Title of page This is my first homepage. This text is bold  The first tag in your HTML document is. This tag tells your browser.
XP 1 Developing a Basic Web Site Tutorial 2: Web Site Structures & Links.
Developing a Web Site: Links Using a link is a quicker way to access information at the bottom of a Web page than scrolling down A user can select a link.
In this lecture, you will learn: ❑ How to link between pages of your site ❑ How to link to other sites ❑ How to structure the folders on your web site.
External Site Links by Awnya Boam. Links are found… …almost everywhere on the internet. They allow users to travel from one site to another.
Hyperlink & Form Pertemuan 11 Matakuliah: L0182 / Web & Animation Design Tahun: 2008.
Links and Comments.
LIST- HYPERLINK- IMAGES
XP Adding Hypertext Links to a Web Page. XP Objectives Create hypertext links between elements within a Web page Create hypertext links between Web pages.
 2008 Pearson Education, Inc. All rights reserved. 1 Introduction to HTML.
Lecture 13. A Very Brief Introduction to HTML and XHTML, part II Instructor: Jie Yang Department of Computer Science University of Massachusetts Lowell.
Chapter 2 Introduction to HTML5 Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.
Copyright © 2004 ProsoftTraining, All Rights Reserved. Lesson 9: Frames © 2007 Prosoft Learning Corporation All rights reserved ITD 110 Web Page Design.
Copyright © 2004 ProsoftTraining, All Rights Reserved. Lesson 9: HTML Frames.
HTML Tags. Objectives Know the commonly used HTML tags Create a simple webpage using the HTML tags that will be discussed.
Computer Science 101 HTML. World Wide Web Invented by Tim Berners-Lee at CERN, the European Laboratory for Particle Physics in Geneva, Switzerland (roughly.
Chapter 2: The Client Side: HTML CIS 275—Web Application Development for Business I.
HTML Links and Anchors.
 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML.
Headings, Paragraphs, Formatting, Links, Head, CSS, Images
Links in HTML. Hyperlinks or links Millions of linked web pages make up the World Wide Web Used to connect a web page to another web page on the same.
Basic HTML Hyper text markup Language. Re-cap  … - The tag tells the browser that this is an HTML document The html element is the outermost element.
HTML Essentials HyperText. Why HyperText ? Hypertext is text or pictures which reference other pages which the reader can immediately access Hypertext.
Informatics Computer School CS114 Web Publishing HTML Lesson 2.
Adding Hyperlinks To a Web Page. Hyperlink and Its Add-Ons Main way to connect web pages and move throughout a web site. Uses the Anchor Tag which is.
HTML Overview Part 4 – Tables 1. HTML Tables  Tables are defined with the tag pair.  A table is divided into rows with tag pairs. o tr stands for "table.
Web Design (5) Navigation (1). Creating a new website called ‘Navigation’ In Windows Explorer, open the folder “CU3A Web Design Group”; and then the sub-folder.
Copyright (c) 2004 Prentice-Hall. All rights reserved. 1 Committed to Shaping the Next Generation of IT Experts. Project 4: Creating Hyperlinks Kelly L.
CHAPTER 3 USING HYPERLINKS TO CONNECT CONTENT. LEARNING OBJECTIVES How to use the and anchor tag pair to create a text-based hyperlink. How to use the.
All Web pages are written with some form of HTML (HyperText Markup Language). HTML documents are saved as Text Only files so virtually any computer can.
Linking web pages Wah Yan College (Hong Kong) Mr. Li C.P.
 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML.
1.  Use the anchor element to link from page to page  Configure absolute, relative, and hyperlinks  Configure relative hyperlinks to web pages.
Adding Links Learning Web Design: Chapter 6. Lesson Overview Using the anchor tag Linking to other pages with relative or absolute pathnames Linking to.
Web Design and Development for Business Lecture 3 Hyper Text Markup Language (HTML)
CO1552 – Web Application Development Linking Pages - The Basis of the Web.
XHTML Hyperlinks. Creating Links to Other Web Pages A link, or hyperlink, is a specially formatted Web page object that the user can click to open a different.
Creating Links. The Anchor Element: The anchor tag can be used in three different ways: 1.External link – to link to a web page outside your own website.
XP 1 HTML Tutorial 2: Developing a Basic Web Site.
Chapter 6 Links. 3 Parts of Links 1. Destination: defines what happens when a user clicks the link. 2. Label: this is the text (or possibly an image)
HTML IMAGES. CONTENTS IMG Tag Alt Attribute Setting Width and Height Of An Image Summary Exercise.
Links in HTML What you need to know….. Hyperlinks or links Millions of linked web pages make up the World Wide Web Used to connect a web page to another.
HTML CS 105. Page Structure HTML elements control the details of how a page gets displayed. Every HTML document has the following basic structure: … …
HTML Comprehensive Concepts and Techniques Second Edition Project 2 Creating a Web Site with Links.
Web Technology (NCS-504) Prepared By Mr. Abhishek Kesharwani Assistant Professor,UCER Naini,Allahabad.
REEM ALMOTIRI Information Technology Department Majmaah University.
Links and Images. Links HTML uses a hyperlink to link to another document on the Web A hyperlink can be either text or a picture Links are created with.
Session: 4. © Aptech Ltd. 2Creating Hyperlinks and Anchors / Session 4  Describe hyperlinks  Explain absolute and relative paths  Explain how to hyperlink.
HTML Lab4 Ins.Samia alblwi. O UTLINE : 1-Links 2-Frame.
LINKING WEBPAGES USING HTML HYPERLINKS. Hyperlinks are text strings or images on a webpage which when clicked on, links to another section in the same.
Chapter 5 BIE2313 | Web design. ALL RIGHTS RESERVED No part of this document may be reproduced without written approval from Limkokwing University of.
CHAPTER TWO HTML TAGS. 1.Basic HTML Tags 1.1 HTML: Hypertext Markup Language  HTML stands for Hypertext Markup Language.  It is the markup language.
`. Lecture Overview HTML Body Elements Linking techniques HyperText references Linking images Linking to locations on a page Linking to a fragment on.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 7 TH EDITION Chapter 2 Key Concepts 1 Copyright © Terry Felke-Morris.
HTML And the Internet. HTML and the Internet ► HTML: HyperText Markup Language  Language in which all pages on the web are written  Not Really a Programming.
Links and Comments in HTML5
Web Development & Design Foundations with HTML5 8th Edition
Links and Comments.
Lecture 3 Sarsenova Zhibek.
Introduction to XHTML.
Links and Comments.
Introduction to HTML.
Links and Comments.
Links and Comments.
HTML LINKS
IDT Links in HTML What you need to know….
Presentation transcript:

HTML Links HTML uses a hyperlink to another document on the Web.

The Anchor Tag and the Href Attribute HTML uses the (anchor) tag to create a link to another document. An anchor can point to any resource on the Web: an HTML page, an image, a sound file, a movie, etc. The syntax of creating an anchor: Text to be displayed The tag is used to create an anchor to link from, the href attribute is used to address the document to link to, and the words between the open and close of the anchor tag will be displayed as a hyperlink.

The Anchor Tag and the Href Attribute This anchor defines a link to W3School: Visit W3schools! The line above will look like this in a browser. Visit W3Schools!

The Target Attribute With the target attribute, you can define where the linked document will be opened. The line below will open the document in a new browser window: Visit W3schools!

The Anchor Tag and the Name attribute The name attribute is used to create a named anchor. When using named anchors we can create links that can jump directly into a specific section on a page, instead of letting the user scroll around to find what he/she is looking for. Below is the syntax of a named anchor: Text to be displayed

The Anchor Tag and the Name attribute The name attribute is used to create a named anchor. The name of the anchor can be any text you care to use. The line below defines a named anchor: Useful Tips Section You should notice that a named anchor is not displayed in a special way.

The Anchor Tag and the Name attribute To link directly to the “tips” section, add a # sign and the name of the anchor to the end of a URL, like this: Jump to the Tips Section A hyperlink to the Tips Section from WITHIN the file “html_links.asp” will look like this: Jump to the Tips Section #tips

Basic Notes-Useful Tips Always add a trailing slash to subfolder references. If you link like this: href= you will generate two HTTP requests to the server, because the server will add a slash to the address and create a new request like this:href=

Basic Notes-Useful Tips Named anchors are often used to create “table of contents” at the beginning of a large document. Each chapter within the document is given a named anchor, and links to each of these anchors are put at the top of the document. If a browser cannot find a named anchor that has been specified, it goes to the top of the document. No errors occurs.

Mailto attribute This element is used to provide link to an e- mail address. When you use mailto, it creates a link to an address and calls the attention of the client program for creating new message. Below is the syntax for using mailto attribute: me!

Hyperlink Colors By default, web pages applies color blue to all the text with link. In fact, you can easily recognized a hyperlink text because they are written in blue text with underline. Visited links are colored purple, while active links are red. You can edit the colors in the body tag, simply by inserting the following attributes: