SIBILL Workshop: Web Design 1 Course Roadmap (Part 1) Introduction – What is HTML? – HTML Editors – How do I put it all online? Basic Markup Tags – How.

Slides:

Advertisements

Similar presentations

Introduction to HTML. A Web Page is.. An ASCII (text) file.. Whose filename ends with.htm or.html –index.html or cookie-recipe.htm Contains HTML tags.

Advertisements

HTML I. HTML Hypertext mark-up language. Uses tags to identify elements of a page so that a browser such as Internet explorer can render the page on a.

Computers: Tools for an Information Age Writing Your Own Web Page: Using HTML and Web Authoring Tools.

HTML Basics 1450 Technology Seminar Copyright 2003, Matthew Hottell.

HTML. The World Wide Web Protocols Addresses HTML.

1 تقنيات الانترنت عال457 HTML. 2 HTML  HTML – HyperText Markup Language – The Language of Web Pages on the World Wide Web. HTML is a text formatting.

INTRODUCTION TO HYPERTEXT MARKUP LANGUAGE 1. Outline  Introduction  Markup Languages  Editing HTML  Common Tags  Headers  Text Styling  Linking.

Chapter 4 Marking Up With Html: A Hypertext Markup Language Primer.

HTML and Web Page Design Presented by Frank H. Osborne, Ph. D. © 2005 ID 2950 Technology and the Young Child.

Introduction to HTML CPS470 Software Engineering Fall 1998.

HTML Computing Concepts HTML - An Introduction 1.

 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.

 2004 Prentice Hall, Inc. All rights reserved. Introduction to XHTML: Part 1.

Basic HTML UCR Webmasters Support Group Derk Adams.

Introduction to HTML 2004 CIS101. What is the Internet? Global network of computers that are connected and communicate via a series of Protocols Protocols.

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

Marking Up With Html: A Hypertext Markup Language Primer

 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.

Glencoe Digital Communication Tools Create a Web Page with HTML Chapter Contents Lesson 4.1Lesson 4.1 Get Started with HTML (85) Lesson 4.2Lesson 4.2 Format.

© 2005 ComputerPREP, Inc. All rights reserved. HTML 4.0 and Web Page Design Module I.

HYPERTEXT MARKUP LANGUAGE (HTML) Vijaya K Pandey.

Computer Science 101 HTML. World Wide Web Invented by Tim Berners-Lee at CERN, the European Laboratory for Particle Physics in Geneva, Switzerland (roughly.

What is HTML ? HyperText Markup Language. The authoring language of the Web is currently HTML, which stands for HyperText Markup Language. Future versions.

Chapter 4 Fluency with Information Technology L. Snyder Marking Up With HTML: A Hypertext Markup Language Primer.

Chapter 2 HTML (Hypertext Markup Language) Part I.

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.

ACM 511 HTML Week -1 ACM 511 Course Notes. Books ACM 511 Course Notes.

1 Essential HTML coding By Fadi Safieddine (Week 2)

McGraw-Hill/Irwin Copyright © 2013 by The McGraw-Hill Companies, Inc. All rights reserved. Extended Learning Module F Building a Web Page with HTML.

1 Basic HTML. 2 Part 1: Basic Web Page Production.

Basic HTML Workshop By: Preeda Chunjongkolkul (Pete) Systems Librarian/Webmaster

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.

HTML 4 Foundation Level Course HyperText Markup Language Most common language used in creating Web documents. You can use HTML to create cross-platform.

Course Content - Chapter 2 Introduction to HTML Introduction to a Text Editor as a web authoring tool Instructional Activity: Creating a webpage using.

Exploring the Digital Domain HTML Basics. HTML Hypertext Markup Language Standard (ASCII) text with embedded format codes Most HTML tags are paired Tags.

Explorers Guild April 27, What is HTML? Hypertext Markup Language (HTML) is the basic building block of the World Wide Web page. HTML files are.

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.

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.

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.

Producing Web Pages using HTML The Computer as an Educational Tool: “ The Computer as an Educational Tool: Productivity and Problem Solving” ©Richard C.

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

Introduction to HTML. What is HTML?  Hyper Text Markup Language  A markup language designed for the creation of web pages and other information viewable.

INTRODUCTORY Tutorial 1 Using HTML Tags to Create Web Pages.

CPSC 203 Introduction to Computers Lab 33 By Jie Gao.

Computational Boot Camp HTML Mike Schaffer. 8/23/2002 (MES) HTML What is HTML? HTML stands for HyperText Markup Language HTML is the language for publishing.

HTML HyperText Markup Language ©Richard L. Goldman July 15, 2003.

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.

Web programming Part 1: HTML 由 NordriDesign 提供

WEEK -1 ACM 262 ACM 262 Course Notes. HTML What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML.

HTML Assoc. Prof. Rozinah Jamaludin 28 January 2010.

Basic HTML Programming Technology Education Ellsworth Community Middle School Communication Systems.

Writing Your Own Web Page: Using HTML and FrontPage Chapter 10.

1 2/16/05CS120 The Information Era Chapter 4 Basic Web Page Construction TOPICS: Intro to HTML and Basic Web Page Design.

Your HTML website creating your first html file. Creating an HTML FIle Open note pad from accessories, programs. Write code. Save and view. In 3 Steps.

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

HTML. INDEX Introduction to HTML Creating Web Pages Commands And Tags Web Page.

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.

Week-11 (Lecture-1) Introduction to HTML programming: A web based markup language for web. Ex.

Basic Web Publishing M. Scott Gartner 7/15/98.

Section 4.1 Section 4.2 Format HTML tags Identify HTML guidelines

Marking Up with XHTML Tags describe how a web page should look

Creating a Home Page in HTML

Chapter 4 - Introduction to XHTML: Part 1

Marking Up with XHTML Tags describe how a web page should look

WJEC GCSE Computer Science

Marking Up with XHTML Tags describe how a web page should look

Presentation transcript:

SIBILL Workshop: Web Design 1 Course Roadmap (Part 1) Introduction – What is HTML? – HTML Editors – How do I put it all online? Basic Markup Tags – How does it work? – The minimal HTML page – Essential HTML Tags Lists Text Formatting Images in your Pages Anchors

SIBILL Workshop: Web Design 2 Introduction What is HTML? HyperText Markup Language (HTML) is the standard web publishing language that is understood by web browsers. HTML Specification can be found at World Wide Web Consortium ( ) HTML Editors What You See Is What You Get (WYSIWYG) Editors Netscape Composer Microsoft FrontPage HomeSite Text Editors Notepad NoteTab Light Arachnophilia How do I put it all online? Project submission page at Check your pages at

SIBILL Workshop: Web Design 3 Basic Markup Tags How does it work? HTML tags consists of “ ” HTML tags are usually in pairs End tags has a “/” preceding the element text Each pairs of tags indicate the type of formatting needed The minimal HTML page A minimal HTML page This is a minimal HTML page

SIBILL Workshop: Web Design 4 Basic Markup Tags Essential HTML Tags HTML HEAD TITLE BODY HEADINGS to PARAGRAPHS LINE BREAKS HORIZONTAL RULES

SIBILL Workshop: Web Design 5 Lists Ordered Lists apples oranges watermelons Unordered Lists apples oranges watermelons

SIBILL Workshop: Web Design 6 Lists Mixing Ordered & Unordered Lists apples oranges Sunkist Jaffa California Mandarin watermelons

SIBILL Workshop: Web Design 7 Lists Definition Lists ECP East Coast Parkway CTE Central Expressway PIE Pan Island Expressway

SIBILL Workshop: Web Design 8 Text Formatting Address … Preformatted Text … Blockquote … Bold … Italic … Teletype … Font … Centering …

SIBILL Workshop: Web Design 9 Images in your Pages Accepted formats Graphics Interlace Format (GIF) Joint Photographic Experts Group (JPEG) Possible usages etc…

SIBILL Workshop: Web Design 10 Anchors Primarily Used for linking page sections & pages Also used to point to an address Linking page sections on the same page Table of Contents Section A … … Linking pages Page 2

SIBILL Workshop: Web Design 11 Anchors Linking page sections on different pages toc.html: Table of Contents Chapter 1 Section A chap1.html: Section A … … Pointing to an address Dr. Tan Tin Wee Opening pages in another Browser References

SIBILL Workshop: Web Design 12 Exercise Create a Web Page with links to your favourite Websites Some background images that can be found in the “Backgrounds” folder on your desktop bg1.gifbg2.gifbg3.gif bg4.gifbg5.gifbg6.gif Some hexadecimal values of colors that you might want to use: # – Black#FFFFFF – White #0000FF – Blue#FF0000 – Red #00FF00 – Green#00FFFF – Aqua #8A2BE2 – Blue Violet#FF6347 – Tomato #4169E1 – Royal Blue#F4A460 – Sandy Brown #32CD32 – Lime Green#FFD700 - Gold