Internet Applications Development Lecture 5 L. Obead Alhadreti.

Slides:



Advertisements
Similar presentations
The Web Wizards Guide to HTML Chapter Four All About Hyperlinks.
Advertisements

HTML III. Learning Objectives HTML Links Structuring Pages with Frames Introduction to Cascading Style Sheets (CSS)
Internet Programming Practicum Credits : 4 Information System Study Program 1Internet Programming Practicum Lecturers : Kurniawan, S.Kom., M.M. Module.
XP 1 Developing a Basic Web Site Tutorial 2: Web Site Structures & Links.
External Site Links by Awnya Boam. Links are found… …almost everywhere on the internet. They allow users to travel from one site to another.
Creating hyperlinks with the tag Skills: using the tag IT concepts: tag, attribute This work is licensed under a Creative Commons Attribution-Noncommercial-Share.
HTML Introduction (cont.) 10/01/ Lecture 8, MAT 279, Fall 2009.
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.
CIS101 Introduction to Computing Week 06. Agenda Your questions Resume project HTML Project Two This week online Next class.
CIS101 Introduction to Computing HTML Project Two.
Lecture Navigation. What is Navigation? Hypertext – creates links Process of linking from a page to: –Another page in the same website –Another page on.
CM143 - Web Week 2 Basic HTML. Links and Image Tags.
1 Linking Web Pages Why is Hypertext Hyper? Storyboarding Page Links (Site Map) Path to Files Various Links Click Here :( Page Footers.
CIS101 Introduction to Computing Week 06. Agenda Your questions Resume project HTML Project Two This week online Next class.
1 Linking Web Pages Why is Hypertext Hyper? Storyboarding Page Links (Site Map) Sequential and Indexed-Sequential Designs Hierarchical Design Custom Design.
Creating hyperlinks with the a tag Skills: using the a tag IT concepts: none This work is licensed under a Creative Commons Attribution-Noncommercial-
Announcement #1 1 Lecture 9. Announcement #2  Midterm exam will be on Oct. 12 (Tuesday)  pm – 1.45 pm  Exam will cover all materials till Oct.
Lecture 13. A Very Brief Introduction to HTML and XHTML, part II Instructor: Jie Yang Department of Computer Science University of Massachusetts Lowell.
FIRST COURSE Creating Web Pages with Microsoft Office 2007.
Introduction to Web Development in HTML Web module day 1 IS 201.
HTML Links and Anchors.
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.
Review: How do you change the border color of an image?
Should have seen something like this last week What does do? stands for table row and starts a new row in the table.
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.
Agenda Links External and Internet Links Anchor Tag Text Hyperlinks Image Hyperlinks Images Image Attributes: src, alt, width, height, align, border.
Hyperlinks. Linking pages…Hyperlinks 2 Lecture 8  Hyperlink “A clickable HTML element that will direct the web browser to display a different Web page.
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.
Lesson 9: Using Excel with the Internet Microsoft Office Excel 2003 Lesson 9 Using Excel with the Internet.
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.
Linking web pages Wah Yan College (Hong Kong) Mr. Li C.P.
Making a Game Linking Slides. To link slides: 1.Prepare your storyboard 2.Complete all slides 3.Link the slides.
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 software. Two types of web software Browser software – used to search for and view websites. Web development software – used to create webpages/websites.
1 Hyperlinks and Action Buttons This PowerPoint document will help you learn about ______ and __________ buttons.
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.
1 Creating the Header Page The header frame always displays on the AHS Web site The image (screagle.gif) that will go in the header is contained on the.
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.
Internet Applications Development Lecture 4 L. Obead Alhadreti.
Internal and External Links Web Design – Section 3-6 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development.
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 Links HTML uses a hyperlink to another document on the Web.
1 Creating the Home Page. 2 Creating a Table Table attributes  Two rows and two columns  No border  Left-aligned Change the vertical alignment of the.
HTML Comprehensive Concepts and Techniques Second Edition Project 2 Creating a Web Site with Links.
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.
Hyperlink ● Anchor tag and its attributes ● Four Types of URL ─ ─ Absolute addressing ─ Relative addressing ─ Intrapage ● Attributes -- link, vlink,
Session: 4. © Aptech Ltd. 2Creating Hyperlinks and Anchors / Session 4  Describe hyperlinks  Explain absolute and relative paths  Explain how to hyperlink.
HTML Lesson 2. Internal Hyperlinks  Internal Hyperlink is a link that links to another page within a website.  Make another page using notepad++: page2.html.
© ExplorNet’s Centers for Quality Teaching and Learning 1 Objective % Understand advanced production methods for web-based digital media.
Internet Applications Development Lecture 6 L. Obead Alhadreti.
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.
Blended HTML and CSS Fundamentals 3 rd EDITION Tutorial 2 Creating Links.
Hypertext Links - Part 2.
Hyperlink Anchor tag and its attributes Four Types of URL
Web software.
Web Design and Development
Hyperlink Anchor tag and its attributes Four Types of Hyperlink
Hyperlink Anchor tag and its attributes Four Types of URL
1st Rotation 2nd Rotation 3rd Rotation 4th Rotation
HTML Links.
Pertemuan 1b
Lesson 4: Hyperlinks.
Hyperlinks Anchor Tags.
Presentation transcript:

Internet Applications Development Lecture 5 L. Obead Alhadreti

Lecture Outline: Links with HTML.

How do we move from a web page to another ?! We can move between web pages by clicking on a hyperlink. A hyperlink (or link) is a word, group of words, or image that you can click on to jump to a new destination. Hyperlinks are the spirit of the Web. If the web is a spider as a whole, these links are the threads that make up this network and link between millions of addresses. The question now is: How to insert a hyperlink?

Links inserted using the a (anchor) tag: href (Hypertext Reference) attribute: href specifies the address you would like to link to. text/image

Example: home page Display: home page

Example: Display:

There are several options for hyperlinks: it can be a link to another site, another page within the site itself, a place in the same page (up or down), or an address.

1 st Type : Insert a hyperlink to an external web site. Example: Uqu Display: Uqu

Example: Display:

2 nd Type : link refers to an existing file in the same website (i.e. a local file), whether html file, image, or otherwise: Example: times table Display: times table

Example: first image Display: first image

3 rd Type : the link refers to a place within the same page,( for example at the beginning or at the end of the page or any other place you want) To link to a place within your existing page, firstly, a name must be given to the anchor using the name attribute. example: top

Secondly, we create the links by placing the hash symbol followed by the name of the anchor in the href of the new link. example: top

Fth Type : the link refers to address, using example: ahmed Display: ahmed

Questions ? Be active !