Hosted by Coach Slanina

Slides:



Advertisements
Similar presentations
Working with Graphics – Lesson 21 Working with Graphics Lesson 2.
Advertisements

Iframes & Images Using HTML.
Introduction to Web Site Development Steven Emory Department of Computer Science California State University, Los Angeles Lecture 3: Hyperlinks and Images.
CIS101 Introduction to Computing HTML Project Two.
Instructor: A. Burns 1 HTML Images. Instructor: A. Burns 2 Inserting a Graphic Images can be displayed in two ways: as inline images or as external images.
AdvWeb-1/12 DePaul University SNL 262 Web Page Design Chapt 10 - Putting Graphics on A Web Page Instructor: David A. Lash.
Marking Up With Html: A Hypertext Markup Language Primer
CIS101 Introduction to Computing Week 06. Agenda Your questions Resume project HTML Project Two This week online Next class.
 2003 Prentice Hall, Inc. All rights reserved. Chapter 4 - Introduction to XHTML: Part 1 Outline 4.1 Introduction 4.2 Editing XHTML 4.3 First XHTML Example.
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.
HTML HTML stands for "Hyper Text Mark-up Language“. Technically, HTML is not a programming language, but rather a markup language. Used to create web pages.
4 HTML Basics 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.
Lesson 6 Links. Creating Folders  For every web site/page, you need to create a separate folder  The computer cannot find links if they are not stored.
Chapter 1 Review Images Links Images II Pictures and Extensions.
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.
Enhancing Your Web Site. More Basic HTML Tags Today you will learn these tags: & add-on (alt, height, width & align) and “href” add-on Add a text link.
XHTML Images. Images are important Purpose: to enhance your web site. Add only when they complement or add additional impact to your message.
Copyright © 2003 Pearson Education, Inc. Slide 4-1 Created by, Stephanie Ludi, Rochester Institute of Technology—NY Basic Web Page Construction Graphics.
Agenda Links External and Internet Links Anchor Tag Text Hyperlinks Image Hyperlinks Images Image Attributes: src, alt, width, height, align, border.
CSCE Chapter 5 (Links, Images, & Multimedia) CSCE General Applications Programming Benito Mendoza 1 By Benito Mendoza Department.
CIT 256 Dreamweaver Intro. Dr. Beryl Hoffman. Start Dreamweaver Start from Start Menu/Adobe Master Collection CS6/ Adobe Dreamweaver CS6 Choose Create.
Images Inserting an image on a web page. chcslonline.org2 ITEMS REQUIRED Go to the course download page on the course website and download the 3 images.
Images (1) Three most popular formats – Graphics Interchange Format (GIF) – Joint Photographic Experts Group (JPEG) – Portable Network Graphics (PNG) –
Images in HTML PowerPoint How images are used in HTML.
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.
1 Lesson 3 Power Techniques HTML and JavaScript BASICS, 4 th Edition Barksdale / Turner.
1 Web Developer Foundations: Using XHTML Chapter 4 Key Concepts.
Chapter 4 BIE1313/BPROG1203 | Web design Prepared by Mohamed Abdulkarim / Mike Ng Ah Ngan.
Introduction to HTML. What is HTML?  Hyper Text Markup Language  A markup language designed for the creation of web pages and other information viewable.
XHTML1 Images N100 Building a Simple Web Page. XHTML2 The Element The src attribute specifies the filename of an image file To include the src attribute.
Copyright (c) 2004 Prentice-Hall. All rights reserved. 1 Committed to Shaping the Next Generation of IT Experts. Adding Graphical Elements Essentials for.
HTML Lesson 3 Hyper Text Markup Language. Assignment Part 2  Set the file name as “FirstName2.htm”  Set the title as “FirstName LastName First Web Site”
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.
Notes Chapter 10—Adding Graphics. There are two kinds of graphics on the Internet: those you can use on your own Web pages, and those you cannot.  Many.
Chapter 2 Designing Web Pages With HTML JavaMethods An Introduction to Object-Oriented Programming Maria Litvin Gary Litvin Copyright © 2003 by Maria Litvin,
Internet Applications Development Lecture 4 L. Obead Alhadreti.
HTML. Adding Background Color The bgcolor attribute lets you change the background color of the Web page. Located in the body tag See common Web Page.
4 HTML Basics 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.
HTML (Hyper Text Markup Language) Lecture II. Review Writing HTML files for web pages – efficient compact – fundamental. Text files with htm extension.
HTML IMAGES. CONTENTS IMG Tag Alt Attribute Setting Width and Height Of An Image Summary Exercise.
HTML Basics. HTML Coding HTML Hypertext markup language The code used to create web pages.
Kevin Murphy Images and Web Pages Masters Project CS 490.
Lesson 6 Links. Creating Folders  For every web site/page, you need to create a separate folder  The computer cannot find links if they are not stored.
HTML CS 105. Page Structure HTML elements control the details of how a page gets displayed. Every HTML document has the following basic structure: … …
Slide 1 Graphics (Characteristics 1) Images have various characteristics that affect performance Size (number of pixels) – Large images can be several.
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.
More HTML Images and Links. Links An anchor tag (a) is used to define a link, but you also need to add something to the anchor tag – the destination of.
ENHANCE YOUR WEBSITE. HOW TO INSERT COLOR??? USE THE TAG: GO TO PICK COLOR WANT BY POINTING: THEN USE THE HEX NUMBER.
Introduction to Programming the WWW I CMSC Winter 2003 Lecture 4.
HTML Basics.
Creating and Linking Web Pages
Section 4.1 Section 4.2 Format HTML tags Identify HTML guidelines
Images in HTML PowerPoint How images are used in HTML
Inserting and Working with Images
DW Tutorial 5 Sessions 5.1 & 5.2 REVIEW
HTML Images CS 1150 Spring 2017.
COMPUTING FUNDAMENTALS
Chapter 2 Adding Web Pages, Links, and Images
Graphics (Characteristics 1)
Basic HTML and Embed Codes
HTML Introduction Lecture 8.
DREAMWEAVER MX 2004 Chapter 4 Working with Images
HTML Images CS 1150 Fall 2016.
Pertemuan 1b
Introduction to HTML.
Lesson 3: Cascading Style Sheets (CSS) and Graphical Elements
Hyperlinks, Images, Comments, and More…
Images in HTML PowerPoint How images are used in HTML
Presentation transcript:

Hosted by Coach Slanina Images & Hyperlinks Trivia Hosted by Coach Slanina

Images Image Code Hyperlinks Link Code 100 100 100 100 200 200 200 200 300 300 300 300 400 400 400 400 500 500 500 500

What does JPEG stand for? Joint Photographic Experts Group What does JPEG stand for? Row 1, Col 1

What tag do you use to insert The <IMG> (IMaGe) Tag What tag do you use to insert an image? 1,2

Linking to another file on the same computer is called a relative Linking to another file on the same computer is called a _____ link. 1,3

To add a hyperlink to your document, use the _____ tags. <A HREF=“ “>…</A> To add a hyperlink to your document, use the _____ tags. 1,4

Graphics Interchange Format What does GIF stand for? 2,1

What attribute do you use in The SRC (SouRCe) attribute What attribute do you use in the image tag? 2,2

Links that allow you to go from one part of your document to target Links that allow you to go from one part of your document to another part of the document are called _____ links. 2,3

What does the “A” stand for in <A HREF=“index.html”> ? Anchor What does the “A” stand for in <A HREF=“index.html”> ? 2,4

Which graphic format uses JPEG Which graphic format uses more colors? 3,1

insert a JPEG of a turkey you have saved on your computer <IMG SRC=“Turkey.jpg”> What would the tag be to insert a JPEG of a turkey you have saved on your computer as “Turkey” ? 3,2

Links that take you to external sites are called _____ links. absolute Links that take you to external sites are called _____ links. 3,3

What does the “HREF” stand for in <A HREF=“index.html”> ? Hypertext REFerence What does the “HREF” stand for in <A HREF=“index.html”> ? 3,4

Which graphic format uses GIF Which graphic format uses less colors? 4,1

Whenever you insert images, you should always specify HEIGHT and WIDTH Whenever you insert images, you should always specify the ____ and ____ attributes. 4,2

You need to have a link on your Web page that takes absolute You need to have a link on your Web page that takes users to the Astros home page, you will need to code a _____ link. 4,3

Using the example below, what will become the link within your NFL Homepage Using the example below, what will become the link within your document or on your Web page? <A HREF=http://www.nfl.com>NFL Homepage</A> 4,4

Which graphic format is JPEG Which graphic format is compressed? 5,1

The _____ text will appear in the blank space as the graphic is ALT (or TITLE for Chrome browser) The _____ text will appear in the blank space as the graphic is loading, and will also “pop up” when the user holds the mouse pointer over the image. 5,2

You need a link from your Paleontology page to your relative You need a link from your Paleontology page to your Favorites page. You need to code a _____ link. 5,3

If you wanted to use a graphic as a link, where would you put between the <A HREF=“ “> tag and the </A> tag If you wanted to use a graphic as a link, where would you put the <IMG SRC> tag? 5,4