1 Week Four– Advance HTML 2 Dr. Fadi Safieddine. 2 Lecture Content Basic HTML Tables Using Email based Feedback form Creating and Using Image Maps Nested.

Slides:



Advertisements
Similar presentations
Common Tags Always include the … tags Comments placed inside tags HTML documents –HEAD section Info about the document Info in header not generally rendered.
Advertisements

Introduction to HTML Part 2
Table (TABLE) Contains TABLE ROWS (TR) Contains TABLE DATA (TD) Data can contain anything Text Lists Other tables Pictures …
Session 3 Intermediate HTML Matakuliah: M0114/Web Based Programming Tahun: 2005 Versi: 5.
 2001 Prentice Hall, Inc. All rights reserved. Outline 1 Table1.html 1 2
Web-based Application Development Lecture 9 February 7, 2006 Anita Raja.
Introduction to Web Site Development Steven Emory Department of Computer Science California State University, Los Angeles Lecture 4: Tables and Frames.
1 Introduction to XHTML: Part 2 Outline Introduction Basic XHTML Tables Intermediate XHTML Tables and Formatting Basic XHTML Forms More Complex XHTML Forms.
Computing Concepts Advanced HTML: Tables and Forms.
 2008 Pearson Education, Inc. All rights reserved. 1 Introduction to HTML.
 2003 Prentice Hall, Inc. All rights reserved. Chapter 5 - Introduction to XHTML: Part 2 Outline 5.1 Introduction 5.2 Basic XHTML Tables 5.3 Intermediate.
Outline IS400: Development of Business Applications on the Internet Fall 2004 Instructor: Dr. Boris Jukic Table, Forms, Metatags and Frames.
INTRODUCTION TO WEB DEVELOPMENT AND HTML Lecture 06: Tables - Spring 2011.
1 XHTML Tables A table is a matrix of cells, for displaying content in rows and columns The cells can include almost any element Some cells display row.
1 Advanced Frame Options Using NORESIZE  By default, users may resize frames unless you specify the NORESIZE attribute in the tag  Examples:
Updated on: September 4, 2010 CIS67 Foundations for Creating Web Pages Professor Al Fichera.
 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML.
Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.
 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML.
Introduction to XHTML September 13, Components of website development
1 Essential HTML coding By Fadi Safieddine (Week 2)
Dr. Nuha El-KhaliliInternet Programming ( ) HTML Hyper Text Markup Language The language of web pages Maintained by the W3C
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.
 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML Pt. 2.
Images (1) Three most popular formats – Graphics Interchange Format (GIF) – Joint Photographic Experts Group (JPEG) – Portable Network Graphics (PNG) –
1 HTML Advanced Features Dr. Awad Khalil Computer Science Department AUC.
HTML: Tables & Frames Internet Technology1. HTML: Tables Table tags ► surround the entire table ► header row (text is boldfaced) ► surround each row ►
 2004 Prentice Hall, Inc. All rights reserved. Chapter 5 - Introduction to XHTML: Part 2 Outline 5.1 Introduction 5.2 Basic XHTML Tables 5.3 Intermediate.
Copyright 2007, Information Builders. Slide 1 Understanding Basic HTML Amanda Regan Technical Director June, 2008.
Chapter 2 XHTML: Part II The Web Warrior Guide to Web Design Technologies.
Chapter 9 Table Basics Key Concepts Copyright © 2013 Terry Ann Morris, Ed.D 1.
 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML.
CSCE 102 – Chapter 6 (Web Design and Layout) CSCE General Applications Programming Benito Mendoza Benito Mendoza 1 By Benito Mendoza.
 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 5 - Introduction to XHTML: Part 2 Outline 5.1 Introduction 5.2 Basic XHTML Tables 5.3 Intermediate.
1 HTML Frames
 2004 Prentice Hall, Inc. All rights reserved. Introduction to XHTML: Part 2 Outline frameset Element 5.10 Nested frameset s.
 2003 Prentice Hall, Inc. All rights reserved. Introduction to HTML: Frames Outline 1 Introduction 2 frameset Element 3 Nested frameset s 4 Web Resources.
Using Frames in a Website GMU November 12-13, 2004.
HTML: Tables & Frames Internet Technology.
INT222 - Internet Fundamentals Shi, Yue (Sunny) Office: T2095 SENECA COLLEGE.
Table (TABLE) Contains TABLE ROWS (TR) Contains TABLE DATA (TD) Data can contain anything › Text › Lists › Other tables › Pictures › …
 2003 Prentice Hall, Inc. All rights reserved. Introduction to HTML: Tables Outline 1 Introduction 2 Basic HTML Tables 3 Intermediate HTML Tables and.
CIS234A Lecture 8 Instructor Greg D’Andrea. Review Text Table contains only text, evenly spaced on the Web page in rows and columns uses only standard.
Lecture 6 More Advanced HTML Boriana Koleva Room: C54
Introduction to Web Site Development John Hurley Department of Computer Science California State University, Los Angeles Lecture 4: Favicons Tables and.
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.
20-753: Fundamentals of Web Programming 1 Lecture 6: Advanced HTML Fundamentals of Web Programming Lecture 6: Advanced HTML.
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.
 2003 Prentice Hall, Inc. All rights reserved. Outline Chapter 2 HTML (Hypertext Markup Language) Part II.
Chapter 9 Table Basics Key Concepts Copyright © 2013 Terry Ann Morris, Ed.D 1.
Tables creating a table within a web page. What makes up a table? Columns Rows.
Introduction to XHTML/HTML5 (part 2) Instructor: Sergey Goldman Based on Based on Internet & World Wide Web How To Program (multiple versions) 1.
Introduction to XHTML/HTML5 (part 2)
Organizing Content with Lists and Tables
Yourfriendmanoj.wordpress.com Fb/yourfriendmanoj
Working with Tables: Module A: Table Basics
>> HTML: Tables.
Basic XHTML Tables XHTML tables—a frequently used feature that organizes data into rows and columns. Tables are defined with the table element. Table.
The Web Warrior Guide to Web Design Technologies
Introduction to Web Site Development
Chapter 5 Introduction to XHTML: Part 2
Chapter 7 Tables.
Chapter 5 - Introduction to XHTML: Part 2
4 Introduction to XHTML.
Introduction to HTML: Image Maps
Introduction to XHTML Cont:.
Implementing Tables to Hold Data in HTML
Introduction to HTML.
Basics of Web Design Chapter 9 Table Basics Key Concepts
Presentation transcript:

1 Week Four– Advance HTML 2 Dr. Fadi Safieddine

2 Lecture Content Basic HTML Tables Using based Feedback form Creating and Using Image Maps Nested frameset s Further readings

3 Basic HTML Tables Tables organize data into rows and columns table attributes are: Border Specifies the table’s border width in pixels Summary Describes the table’s contents Caption Describes the table’s content and helps text-based browsers interpret table data Head section (header cell, defined with a thead element). Contains header information such as column names tr element (defines an individual table row) th element (defines the columns in the head section) Table Footer (defined with a tfoot element) Table Body (defined with a tbody element) Data cells (defined with td element)

4 First part of the HTML and the table:

5

6

7

8 HTML Forms Following on last week’s work, we look at feedback form Attribute method Specifies how the form’s data is sent to Web server  method = “post” Specifies how the form’s data is received via Web server  method = “get” Attribute action Specifies the URL of a script on the Web server input Specifies data to provide to the script that processes the form

9

10

11

12 How to use image maps: You can designate certain areas of an image (called hotspots) as links by mapping it. Elements & Attributes of map Attribute id  Identifies the image map Element area  Defines hotspot  Attribute shape and coords  Specify the hotspot’s shape and coordinates  Circle ( shape = “circle” )  Rectangular ( shape = “rect” )  Polygon ( shape = “poly” )

13

14

15

16 frameset Element Allows the browser display more than one document at a time. frameset attributes: cols  Specifies the frameset’s column layout rows  Specifies the number of rows and the size of each row frame  Specifies the documents that will be loaded  Attribute src  Specifies URL of the page to display

17 Nested frameset s frameset s within frameset s

18

19

20 Finally: This will be the last lesson on HTML but this is not the end of HTML. You should not only rely on the lecture slides, further readings are essential. This week you start your assignment and HTML constitute 40% of the over all grade. Next week we look into planning and documenting your website which constitute 60% of your overall grade.