Shows the entire path to the file, including the scheme, server name, the complete path, and the file name itself. Same idea of stating your full name,

Slides:



Advertisements
Similar presentations
PART IV - EMBED VIDEO, AUDIO, AND DOCUMENTS. Find a video on Youtube.com: Search for a video, then look for the Embed code. Copy this code into the HTML/JavaScript.
Advertisements

Cascading Style Sheets
CSS cont. October 5, Unit 4. Padding We can add borders around the elements of our pages To increase the space between the content and the border, use.
HTML5 and CSS3 Illustrated Unit E: Inserting and Working with Links
Links and Comments.
How to Establish a Blog. What is a Blog A blog is a collection of informational articles/ideas intended to update a viewer on new information associated.
HTML Code. What we will cover Basic HTML Body Font Images Hyperlinks Tables Frames.
Hypertext Markup Language (HTML) Created by Sarah Dooley & Amanda Foster Edited and presented by Caroline Hallam September 9, 2014.
CSS (Cascading Style Sheets): How the web is styled Create Rules that specify how the content of an HTML Element should appear. CSS controls how your web.
 Missing (or duplicate) semicolons can make the browser completely ignore the style rule.  You may add extra spaces between the properties/values to.
Images: HTML and CSS. The Bells page without images in Source View and Design View.
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. 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.
WEB DESIGN USING DREAMWEAVER. The World Wide Web –A Web site is a group of related files organized around a common topic –A Web page is a single file.
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.
Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and attributes Create.
XP Dreamweaver 8.0 Tutorial 3 1 Adding Text and Formatting Text with CSS Styles.
Programming in HTML.  Programming Language  Used to design/create web pages  Hyper Text Markup Language  Markup Language  Series of Markup tags 
 The tag to create a link is called, which stands for anchor.  You put the address of the page to link to in quotes after href=, like the following:
WEB DESIGN UNIT 2 Unit 2 Module 2-5. WHAT HAVE YOU LEARNED?  What is the title tag do? Where does it show?  What are the tags that need to be on every.
Enhancing Your Web Site—Adding Links Web Page **YOU MUST HAVE COMPLETED THE 1ST 3 WEB PAGES BEFORE YOU CAN DO THIS ONE. **YOU SHOULD HAVE COMPLETED THE.
Unit 3 Day 6 FOCS – Web Design. Journal Unit #3 Entry #4 Write the source code that would make the following display on a rendered page: Shopping List.
Adding Links Learning Web Design: Chapter 6. Lesson Overview Using the anchor tag Linking to other pages with relative or absolute pathnames Linking to.
Forms and Server Side Includes. What are Forms? Forms are used to get user input We’ve all used them before. For example, ever had to sign up for courses.
LEARNING HTML PowerPoint #1 Cyrus Saadat, Webmaster.
INTRODUCTORY Tutorial 6 Using Links on a Web Page.
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.
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.
HTML BTEC National in Computing Section5. Create Information “HTML: defining HTML, discussing HTML uses and demonstrating HTML basics, HTML structure…..
HTML GUIDE Press F5 and then Click on the links on the left to get to the section you want Section 1: Getting Started Section 2: Moving Banner Section.
Tutorial 3 Adding and Formatting Text with CSS Styles.
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.
HTML Basics. HTML Coding HTML Hypertext markup language The code used to create web pages.
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.
Spiderman ©Marvel Comics Creating Web Pages (part 1)
IN THIS LESSON, WE WILL BECOME FAMILIAR WITH HTML AND BEGIN CREATING A WEB PAGE IN YOUR COMPUTER HTML – the foundation.
Hyperlink ● Anchor tag and its attributes ● Four Types of URL ─ ─ Absolute addressing ─ Relative addressing ─ Intrapage ● Attributes -- link, vlink,
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.
HTML HTML stands for Hyper Text Markup Language. HTML is used in making the base of a Website You can just use an online website maker like weebly.com.
CSS IS A LANGUAGE DESIGNED TO TARGET HTML ELEMENTS AND NODES BY TYPE, CLASS, ID AND VALUE, AND CHANGE THEIR VALUES CSS – change how your HTML looks and.
Creating Web Pages with Links, Images, and Embedded Style Sheets
XP Dreamweaver MX 2004 Tutorial 3 1 Adding and Formatting Text.
1 Introduction to HTML. 2 Definitions  W W W – World Wide Web.  HTML – HyperText Markup Language – The Language of Web Pages on the World Wide Web.
Introduction to HTML Dave Edsall IAGenWeb County Coordinator’s Conference June 30, 2007.
Revised June 2008 Online PD Basic HTML1 Let’s Try It!  Open Notepad oStart > All Programs > Accessories > Notepad oDon’t get WordPad by mistake – won’t.
HTML5 and CSS3 Illustrated Unit E: Inserting and Working with Links.
Online PD Basic HTML The Magic Of Web Pages
Objective % Select and utilize tools to design and develop websites.
Links and Comments in HTML5
Internal and External Links
Internal and External Links
Links and Comments.
Hyperlink Anchor tag and its attributes Four Types of URL
Objective % Select and utilize tools to design and develop websites.
Web Design and Development
Hyperlink Anchor tag and its attributes Four Types of Hyperlink
Intro to CSS Mr. Singh.
Basic HTML and Embed Codes
Links and Comments.
Hyperlink Anchor tag and its attributes Four Types of URL
Intro to Web Development Links
Enhancing Your Web Site—Adding Links Web Page
Links and Comments.
Links and Comments.
Presentation transcript:

Shows the entire path to the file, including the scheme, server name, the complete path, and the file name itself. Same idea of stating your full name, street #, street name, city, state, zip, and country The location of the absolute URL itself has no bearing on the location of the actual file referenced. No matter where it is in the webpage, it will look the same from any server An absolute URL - points to another web site (like href=" Uses the http protocol

Describes the location of the desired file with reference to the location of the file that contains the URL itself. Similar to “giving directions” to a particular address As if stating “you are here” identifies the reference point: Relative to that file’s location on the server. Absolute URLs do not care where they are located. “In this folder, there is a folder called…” A relative URL - points to a file within a web site (like href="default.htm") Using makes it easy to move your pages from a local system to a server.

href Attribute What does “href” stand for? Hypertext reference What tag is involved with adding the href attribute? The href should include the = sign and the url should have quotations that surround it. Example: title you want shown

Some helpful hints to Links When using links in your own website, you need a relative path: href=“secondpage.html” When going outside of your website, you need an absolute path: href: Why a link will not work: Incorrect path in the href attribute Typed incorrectly

Ensuring Your Link will Work Be sure your link is spelled correctly and/or your tag and attribute is in its correct areas. Check the path in the attribute Best bet: Be sure the website is still working Copy and paste the link right into your code Do not choose a link where the viewer needs to log in unless you “know” they will already have an account or you are directing them to create an account.

What is the difference between a link, an active link, and a visited link color? Active links change color (when directed to do so) when a link is being clicked. Visited links change color (when directed to do so) when a link has been visited. Why would you want to change the color of a link? The blue default color clashes or blends in with the background The active link will let someone know that they are about to click a link The visited link will let someone know that is where they have been before.

To change all the links on a page to a specific color, where would you put the new attribute? In the body tag This includes all changes: active link and visited link They are only separated by a space though defined by their individual attributes. What are the new attributes? Link? link=“…” Active Link? alink=“…” Visited Link? vlink=“…”

Why change all links in the page and not individually different colors? Uniformity and not confusing To change all links in the page: or

Links Within Your Page A new attribute: id= Called an identifier How are we going to use it? We will be adding a “back to top” link at the bottom of your webpage. Because it is a link, what tags and attribute would we use? start and end tags href= href= will always have a pound sign that follows within the quotations of the value

About the ID attribute Can be used to identify a particular element Can also be used in CSS and JavaScript You can add an ID attribute to almost any tag in your html document RESTRICTIONS! The value of the id attribute cannot contain spaces and must be unique on your page You cannot have 2 elements share the same ID It is case sensitive You must remain consistent!

Adding the Link Always add your identifier within your heading 1 (or where ever you want the link to go though must have an element to attach to) Should look something like this: Some Interesting Information Add your link to the bottom of the page before the closing of your body Be sure to add it to its own paragraph Should look something like this: Back to Top