Creating a web page Lab Assignment Goal Create a simple web page Create the file: inclass.txt in your www directory. Do you remember how to get to your.

Slides:

Advertisements

Similar presentations

HTML. The World Wide Web Protocols Addresses HTML.

Advertisements

Hyper Text Markup Language.  HTML is a language for describing web pages.  HTML stands for Hyper Text Markup Language  HTML is not a programming language,

A guide to HTML. Slide 1 HTML: Hypertext Markup Language Pull down View, then Source, to see the HTML code. Slide 1.

Introducing HTML Skills: create simple Web pages

Hypertext Markup Language. Platform: - Independent  This means it can be interpreted on any computer regardless of the hardware or operating system.

Introduction to HTML CPS470 Software Engineering Fall 1998.

CM143 - Web Week 2 Basic HTML. Links and Image Tags.

COMP101 – Exploring Multimedia and Internet Computing LA2 (Thu 14:00 – 16:50) TA: Jackie Lo.

Creating a Web Page HyperText Markup Language. HTML Documents  Created using any text editor  Notepad  Vi, Pico, or Emacs  If using word-processor,

HTML Lesson 1 TBE 540 Farah Fisher. Prerequisites Before beginning this lesson, the student must be able to… Access web pages and navigate the web Access.

HTMLMR.Mostafa badr1. Lesson 3 HTML Tags Lesson 2 Creating a HTML File Lesson 1: Hyper Text Markup Language (HTML) Basics Get Trained for a Better Future.

COMPUTERS AND INFORMATION SYSTEMS HTML. How the Web Works To access a web site  Enter its address (URL) in the address box of your browser 

 Definition of HTML Definition of HTML  Tags in HTML Tags in HTML  Creation of HTML document Creation of HTML document  Structure of HTML Structure.

HTML Notes Chapters 1--6 Codes used in creating HTML documents are called tags. Tags are always enclosed in left ( ) angle brackets. Tags can be upper.

Tutorial 1: Getting Started with HTML5

Slide 1 Today you will: think about criteria for judging a website understand that an effective website will match the needs and interests of users use.

HTML. We’ll learn … What HTML is What tags are What a basic web page looks like What 3 HTML tags are required What HTML comments look like How to title.

Basic HTML Hyper text markup Language. Lesson Overview  In this lesson, you will learn to:  Create Lists  Horizontal rule (line)  Create a page for.

Today’s Topic Language of web page - HTML (Hypertext Markup Language)

Using HTML to Create a Basic Web Page… By Josh Gallagan.

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.

HTML Structure & syntax

Lecture # 3 HTML and Arrays. Today Questions: From notes/reading/life? From Lab # 2 – Preview of Lab # 2 1.Introduce: How do you make a Web Page?: HTML.

All Web pages are written with some form of HTML (HyperText Markup Language). HTML documents are saved as Text Only files so virtually any computer can.

HTML. WHAT IS HTML HTML stands for Hyper Text Markup Language HTML is not a programming language, it is a markup language A markup language is a set of.

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.

OBJECTIVES  What is HTML  What tools are needed  Creating a Web drive on campus (done only once)  HTML file layout  Some HTML tags  Creating and.

XP 1 HTML Committed to Shaping the Next Generation of IT Experts. 01: Introduction to HTML.

Just Enough HTML How to Create Basic HTML Documents.

HTML I An Introduction to the Language of the Web Terry Bake

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.

Computer Information Technology – Section 3-4. HTML – The Language of the Internet Objectives: The Student will: 1. Look at HTML 2. Understand the basic.

Hypertext Mark-Up Language Web Page Creation HTML.

Lesson 2: Basic HTML Code Basic HTML Code. HTML is an acronym for Hypertext Markup Language. Internet browsers translate the HTML code into texts and.

HTML,DHTML & Javascript/Session1/1 of 39 Introduction and Basic Tags Session 1 of Using HTML, DHTML & JavaScript.

Basic HTML Hyper text markup Language. Lesson Overview  In this lesson, you will learn to:  Write HTML code using a text editor application such as.

HTML Structure & syntax. Introduction This presentation introduces the following: Doctype declaration HTML Tags, Elements and Attributes Sections of a.

McLean HIGHER COMPUTER NETWORKING Lesson 5 HTML Description of HTML web page Creating a simple HTML web page.

Georgia Institute of Technology Making Text for the Web Barb Ericson Georgia Institute of Technology March 2006.

Introducing the World Wide Web Internet- a structure made up of millions of interconnected computers whose users communicate with each other and share.

CPSC 203 Introduction to Computers Lab 66 By Jie Gao.

HTML. Hyper Text Markup Language Markup your text document The markup is the tag Hyper text means you can jump from place to place.

The Teacher Computing HTML HyperText Markup Language.

Web Design Mr. Briggs’ Classes September 6-7, 2011.

HTML HyperText Markup Language. Text Files An array of bytes stored on disk Each element of the array is a text character A text editor is a user program.

HTML Basics. HTML Coding HTML Hypertext markup language The code used to create web pages.

HTML HYPER TEXT MARKUP LANGUAGE. INTRODUCTION Normal text” surrounded by bracketed tags that tell browsers how to display web pages Pages end with “.htm”

+ HTML Hypertext Markup Language. + Introducing HTML HTML is the language used in writing websites Open the “HTML Practice” link on the Daily Log Delete.

HTML: Hypertext Markup Language The language to make web pages 0.

CPSC 203 Introduction to Computers Lab 23 By Jie Gao.

HTML-I Basic HTML Elements. HTML (Hyper Text Markup Language) HTML is a document layout and hyperlink- specification language. i.e. a language used to.

Using HTML. Glogger Glogger is like you own personal web page, you can add… Pictures Text Videos Music, etc… Modify and adjust anything you want Glogger.

HTML. Hyper Text Markup Language Markup your text document The markup is the tag Hyper text means you can jump from place to place Programming language.

Project 02 Creating and Editing a Web Page Concept Map of Unit Creating and Editing a Web Page Key Learning Understand the elements to create a web page.

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.

NOTEPAD++ Lab 1 1 Riham ALSmari. Why Notepad++ ?  Syntax highlighting  Tabbed document interface  Zooming  Indentation code  Find and replace over.

Agenda9/11/13  Do Now  Display your name tag and log into your computer  Pre-Assessment Test  Info and Interests  Syllabus and Course Expectations.

Internet Exploration: HTML Basics

Section 4.1 Section 4.2 Format HTML tags Identify HTML guidelines

BASIC HTML CODING BY cHRIS JACKSON.

Internet Exploration: HTML Basics

HTML HYPERTEXT MARKUP LANGUAGE.

Creating a web page Auxiliary Lab Lecture

HTML Structure.

HyperText Markup Language

Creating a web page.

WJEC GCSE Computer Science

Presentation transcript:

Creating a web page Lab Assignment Goal Create a simple web page Create the file: inclass.txt in your www directory. Do you remember how to get to your www directory? Do you remember how to verify that you are in the www directory? Do you remember how to create the file using xemacs? You must complete this exercise in class during today’s lab session.

ADVICE!!! Use a simple editor! notepad is a simple editor xemacs is a simple editor notepad++ is a simple editor Microsoft Word is NOT a simple editor

Hypertext Markup Language - html In your file, enter these two lines. They are the beginning tag and matching end tag to start a web page. Web pages are create using tags. Most tags come in pairs. A ‘begin’ and a partner ‘end’ tag. The begin and end tags are usually spelled the same, but the end tag also contains a slash.

Hypertext Markup Language - html A web page has a head and a body and note that both sections have beginning and end tags. Enter these tags into your inclass.txt file. Note that body comes after the head, and both are inside the html tags.

Hypertext Markup Language These are my favorite movies. Type some text inside the body.

Hypertext Markup Language My Favorite Movies This is a list of my favorite movies. Create a title! Titles are placed in the head

Hypertext Markup Language Save your work View your web page at Throughout this exercise, save your work periodically View your changes by refreshing your web browser.

Hypertext Markup Language My Favorite Movies This is a list of my favorite movies. Create an unordered list

My Favorite Movies These are my favorite movies. What’s Up Doc? Shrek The Fisher King Inside the list, create each list item.

My Favorite Movies These are my favorite movies. What’s Up Doc? Shrek The Fisher King Create a list of five movies Save and view your work

Hypertext Markup Language – MORE TAGS … creates an ordered list … paragraph tags … header 1 … header 2 … header 6 … strong emphasis See: htmldog.com for more tags and advice on creating web pages.htmldog.com

My Favorite Movies These are my favorite movies. What’s Up Doc? Shrek The Fisher King Enhance the title, by adding h1 header tags

My Favorite Movies These are my favorite movies. What’s Up Doc? Shrek The Fisher King Group your work into a paragraph with the tag

Though most tags come in pairs, some tags are single units. One such tag is the horizontal rule The horizontal rule draws a straight line Hypertext Markup Language – MORE TAGS

These are my favorite movies. What’s Up Doc? Shrek The Fisher King Add a horizontal rule Save and view your page

Create a list of your favorite foods Create an ordered list using the tag. Note that each list item must also contain the tag. Add this list after the horizontal rule.

These are my favorite foods Pizza Create this entire paragraph, Which contains a list of your five most favorite foods.

These are my favorite foods Pizza Enhance the word favorite by using the tag.

Final Step Save your work View your web page Show your instructor your completed work You will receive your 25 points for homework 2, part 4, once your instructor has inspected your work

View Web Pages Look at web pages Most web page browsers allow users to: “view page source” For example look at the source of the web page for the first homework: hw1hw1 Look for these tags in the “hw1” page: Find an unordered list and a list item.