Web Page Design Mr. Gironda

Slides:



Advertisements
Similar presentations
HTML Tags and Their Functions
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.
HTML Concepts and Techniques Fourth Edition Project 3 Creating Web Pages with Links, Images, and Formatted Text.
Very quick intro HTML and CSS. Sample html A Web Title.
Adding HTML to Blackboard
© Anselm SpoerriInfo + Web Tech Course Information Technologies Info + Web Tech Course Anselm Spoerri PhD (MIT) Rutgers University
Computer Science 1611 Internet & Web Creating Webpages with Style Hypertext and the HTML Markup Language (continued)
HTML. Creating a Table Attributes: border: indicates the border type of the table Value: 0 (no border), 1, 2, etc. cols: indicates the number of columns.
Creating Tables in a Web Site.  Define table elements  Describe the steps used to plan, design, and code a table  Create a borderless table to organize.
CS105 Introduction to Computer Concepts HTML
HTML Concepts and Techniques Fourth Edition Project 3 Creating Web Pages with Links, Images, and Formatted Text.
HTML Comprehensive Concepts and Techniques Third Edition Project 3 Creating Web Pages with Links, Images, and Formatted Text.
Adding Images & Working with Images Unit 2. TITLE CORNELL NOTES TOPIC: NOTES: Name: Date:08/10/2009 Period : Summary: To display Art To display Photographs.
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.
McGraw-Hill/Irwin Copyright © 2013 by The McGraw-Hill Companies, Inc. All rights reserved. Extended Learning Module F Building a Web Page with HTML.
HTML Comprehensive Concepts and Techniques Second Edition Project 2 Creating a Web Site with Links.
Basic HTML Workshop By: Preeda Chunjongkolkul (Pete) Systems Librarian/Webmaster
9 April 2008 Creating Web Pages with Links, Images, and Formatted Text WEB 101 – HTML Prof: Mariana Mendoza-Botero Escuela de Administración de Empresas.
>> Introduction to HTML: Tables. HTML is used to give websites structure 5 Basic Tags Element = Start-Tag+Content+End-Tag Heading Tags [h1-h6] Paragraph.
9 April 2008 Creating Web Pages with Links, Images, and Formatted Text WEB 101 – HTML Prof: Mariana Mendoza-Botero Escuela de Administración de Empresas.
Creating Web Pages with Links, Images, and Formatted Text
All you ever needed to know…and more!. H.T.M.L. HyperText Mark-up Language Web’s programming language All web browsers Set of instructions Written with.
CS105 INTRODUCTION TO COMPUTER CONCEPTS HTML Instructor: Cuong (Charlie) Pham.
Chapter 4 BIE1313/BPROG1203 | Web design Prepared by Mohamed Abdulkarim / Mike Ng Ah Ngan.
HTML Concepts and Techniques Fifth Edition Chapter 3 Creating Web Pages with Links, Images, and Formatted Text.
1 Creating Links within a Web Page  These links are especially useful on long Web pages  Links at the top of the page point to areas further down the.
Chapter 2 Web Page Design Mr. Gironda. Elements of a Web Page These are things that most web pages use.
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”
HTML Concepts and Techniques Fourth Edition Project 5 Creating an Image Map.
CITY UNIVERSITY / Vysoká Škola Manažmentu.:MG Information Systems :. © Martina Cesalova, 2005 MS FRONTPAGE 2 1.Create a new document 2.Save as L/bsba/IS330/yourfolder,
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.
HTML. Hyper Text Markup Language Markup your text document The markup is the tag Hyper text means you can jump from place to place.
HTML Concepts and Techniques Fifth Edition Chapter 3 Creating Web Pages with Links, Images, and Formatted Text.
HTML CS 105. Page Structure HTML elements control the details of how a page gets displayed. Every HTML document has the following basic structure: … …
1 Start TextEdit. 2 Creating a Home Page  A home page is the main page of a Web site –Visitors usually view the home page first –Identify the purpose.
1 Creating Links Lesson 2. 2 In the center column type : Home | Order Now | Contact Us This is the navigation button which will link to the other pages.
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.
Creating Web Pages with Links, Images, and Embedded Style Sheets
Chapter 4 HTML Tags. HTML is written in something called tags. Tags come in pairs, an opening one and a closing one. The first pair of tags we'll write.
Revision Webpage design HTML.   FACE  Attributes  Marquee  Define the following terms.
Introduction to HTML Hypertext Mark-up Language. HTML HTML = Hypertext Mark-up Language Is just plain simple text marked up by “tags” You can create a.
ENHANCE YOUR WEBSITE. HOW TO INSERT COLOR??? USE THE TAG: GO TO PICK COLOR WANT BY POINTING: THEN USE THE HEX NUMBER.
Part 4 Text & Fonts © UNT in partnership with TEA1IT: Web Technologies - HTML Scripting.
HTML  HyperText Markup Language  The Language used to design web pages  Code mixed with text  Tags enclosed in angle brackets  Single tags  Paired.
What you can see in the picture?
Let’s Try It! Open Notepad
HTML.
HTML Basics.
Extended Learning Module F
LAB Work 01 MBA 61062: E-Commerce
Marking Up with XHTML Tags describe how a web page should look
Survey of Computer Science CSCI 110, Spring 2011 Lecture 23 HTML
Images in HTML PowerPoint How images are used in HTML
HTML GUIDE Press F5 and then
Linking With Graphics INP150: Basic HTML March 25, 2002.
HTML Lesson 2.
Web Page Design Mr. Wilson
COMPUTING FUNDAMENTALS
HTML.
Working with HTML These are the examples you need to go over. Click on the name like HTML5intro.html and it will bring up the page. If you right click.
Enhance your website.
Creating a Web Site with Links
Creating Web Pages with Links, Images, and Formatted Text
5.2.3 Be able to use HTML and CSS to construct web pages
If You Know Nothing About HTML, This is Where You Start.
Enhancing Your Web Site—Adding Links Web Page
Images in HTML PowerPoint How images are used in HTML
Presentation transcript:

Web Page Design Mr. Gironda Chapter 3 Web Page Design Mr. Gironda

After chapter 2 Test Start Chapter 3 from book Pages 79-88

What We Learned: Paragraph of text <p> text </p>

What We Learned: Lists <h2>title</h2> <ul type=“square”> <li>text </li> </ul> <h2>title</h2> <ol>header <li>text </li> </ol>

What We Learned: Changing Font Color <Font color=“#000066”>Text</Font>

What We Learned: Background design <body background=“……”> This goes in the body tag

What We Learned: Making something Bold <b> text </b>

What We Learned: Italic Text <em> text </em>

What We Learned: Text Links (another page in the same site) <a href=“filename.htm”> text </a> Works the same for an image as well

What We Learned: Link Web Page in another site <a href=“http://www.address.com”> text </a> Works the same for an image as well

What We Learned: Links within the same page Targets- is a named location or anchor within a Web page to which a link can be created. <a name=“target”></a> Then <a href=“#target”> text to link </a> Example: link that takes you back to top of page

What We Learned: Linking Email <a href=mailto:address@dot.com> text </a> Works the same for an image as well

After completing pages 79-88 Open Desert Plants from the Q Drive Open as a notepad file Complete pages 97-117

What We Learned: Aligning Images (Wrapped Text) Add align=“right” inside the image tag Ex: <img src=“agave.jpg” align=“right” alt=“Agave” width=“21” height=“20”/> Can also use: left, top, middle, bottom To end Text Wrapping (put at end of section to be wrapped) <br clear=“right” />

What We Learned: Adding spacing around images Vspace (vertical) adds space above and below Hspace (horizontal) Hspace=“20” adds space on each side This goes inside an Image tag <img src=“picture.jpg” vspace=“20”>

Things to do Apply Your Knowledge 1 In the Lab 1 & 2 HTML Site Make sure you finished pages 79-117 Desert Plants and Plant World Apply Your Knowledge 1 These are in the Q drive, you are just fixing the mistakes. In the Lab 1 & 2 Start from scratch and make these sites HTML Site

Chapter 3 (Desert Plants and Plant World) AYK 1 (Dogs) and ITL 1 & 2 (blood drive and school) Save all files in a folder as (Last name chapter 3) Copy and Paste into R drive HTML Site Save all files in a folder as (Last name HTML) Copy and Paste into the R drive Chapter 3 Online Reviews (Q drive)