 HTML is hypertext markup language. It is a way for people to display their information with more complex pictures and text displays. Before HTML, messages.

Slides:



Advertisements
Similar presentations
HTML Basics Customizing your site using the basics of HTML.
Advertisements

DRUPAL How to create a website Summer Tech Academy 2010 Mercedes Conde.
Html: getting started HTML is hyper text markup language. It is what web browsers look at on the Internet. HTML documents should be created in a simple.
HTML.
Hypertext markup language.  Client asks for an html file  Server returns the html file  Client parses and displays it  This display is what most people.
Chapter 3 – Designing your web pages Dr. Stephanos Mavromoustakos.
Project 8 Creating Style Sheets.
Checkers: Setting the Board Checkers and chess use an 8 by 8 board. Each box on the board alternates colors with the box next to it. The designer may choose.
Images, Tables, lists, blocks, layout, forms, iframes
Basic Calendar Something that would make your web page look very nice is a basic calendar. A basic calendar shows the currents days of the month. This.
Introduction to HTML Lists, Images, and Links. Before We Begin Save another file in Notepad Save another file in Notepad Open your HTML, then do File>Save.
How to Make a Web Page: A Crash Course in HTML programming.
CIS101 Introduction to Computing Week 05. Agenda Your questions CIS101 Survey Introduction to the Internet & HTML Online HTML Resources Using the HTML.
CIS101 Introduction to Computing
Web Page Development Identify elements of a Web Page Start Notepad
CM143 - Web Week 2 Basic HTML. Links and Image Tags.
There is a certain way that an HTML file should be set up. The HTML section declares a beginning and an ending. Within the HTML, there should be a HEAD.
Basic HTML All About Me - Your Name Information for display.
HTML Basics An Introduction to HTML. What is HTML? Stands for “Hyper Text Markup Language” Composed of “tags” which are surrounded by sideways triangles.
 As you complete the assignment, go in order as the earlier bulleted parts provide an easier opportunity for points than the later.  This project is.
Introduction to HTML. What is HTML? Hyper Text Markup Language A markup language designed for the creation of web pages and other information viewable.
Introduction to HTML. Topics HTML –What is HTML –Parts of an HTML Document –HTML Tags.
Additional Topics. Tutorial #9 Review – Forms Forms Legend and fieldset Fields Text Password Radio buttons, check box, text area, select lists Buttons.
HTML. What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is a markup language A markup language.
INFSCI  Last time we built a doggie web page in class following the instructions in the slide deck: Build Web Page with HTML – see week 3 The topics.
Creating your Webpage with tables. This is a 2 column by 1 row table!
Website Research By Sophie Hiscock. Fan Marvel Website You know this website is Marvel because of the characters from the comics are in the body, which.
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.
Event Handlers CS101 Introduction to Computing. Learning Goals Learn about event handlers Determine how events are useful in JavaScript Discover where.
10 Adding Interactivity to a Web Site Section 10.1 Define scripting Summarize interactivity design guidelines Identify scripting languages Compare common.
What is Museum Box? A Museum box is a way of presenting information that allows you to create a cube project that can be shared with others. You can use.
Understanding HTML Code
Images (1) Three most popular formats – Graphics Interchange Format (GIF) – Joint Photographic Experts Group (JPEG) – Portable Network Graphics (PNG) –
Intro to Dreamweaver Web Design Section 7-1 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development I” Course.
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 HTML محمد احمدی نیا 2 Of 43 What is HTML?  HTML stands for Hyper Text Markup Language  HTML is not a programming language, it.
HTML 4 Foundation Level Course HyperText Markup Language Most common language used in creating Web documents. You can use HTML to create cross-platform.
Copyright 2006 South-Western/Thomson Learning Chapter 17 Creating and Linking Web Pages.
Lecture 2 Building Web Pages 1 Lecture 2  Building Web pages  Languages and programs  HTML - Hyper Text Markup Language  Netscape’s Composer  MicroSoft.
Just Enough HTML How to Create Basic HTML Documents.
Computer Information Technology – Section 3-4. HTML – The Language of the Internet Objectives: The Student will: 1. Look at HTML 2. Understand the basic.
Week 1 – Beginners Content McAfee & Big Fish Games CoderDojo.
Introduction To HTML.  HTML stands for Hyper Text Markup Language.  HTML was developed by Tim Berners-Lee.  HTML is maintained by World Wide Web Consortium(W3C).
LEARNING HTML PowerPoint #1 Cyrus Saadat, Webmaster.
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”
Sahar Mosleh California State University San MarcosPage 1 JavaScript Basic.
HTML GUIDE Press F5 and then Click on the links on the left to get to the section you want Section 1: Getting Started Section 2: Moving Banner Section.
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.
CSE 409 – Advanced Internet Technology 1 DISCUSSION OF BASIC HTML TAGS.
HTML Basics. HTML Coding HTML Hypertext markup language The code used to create web pages.
Spiderman ©Marvel Comics Creating Web Pages (part 1)
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.
Writing Your Own Web Page: Using HTML and FrontPage Chapter 10.
HTML HTML stands for Hyper Text Markup Language. HTML is used in making the base of a Website You can just use an online website maker like weebly.com.
CSS IS A LANGUAGE DESIGNED TO TARGET HTML ELEMENTS AND NODES BY TYPE, CLASS, ID AND VALUE, AND CHANGE THEIR VALUES CSS – change how your HTML looks and.
McGraw-Hill Technology Education © 2004 by the McGraw-Hill Companies, Inc. All rights reserved. Office Word 2003 Working Together 1 Word 2003 and Your.
Creating Web Pages with Links, Images, and Embedded Style Sheets
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.
Tutorial #1 Using HTML to Create Web Pages. HTML, XHTML, and CSS HTML – HyperText Markup Language The tags the browser uses to define the content of the.
HTML Tutorial. What is HTML HTML is a markup language for describing web documents (web pages) HTML documents are described by HTML tags Each HTML tag.
Introduction to HTML Dave Edsall IAGenWeb County Coordinator’s Conference June 30, 2007.
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.
Web Basics: HTML/CSS/JavaScript What are they?
HTML Basics.
Section 4.1 Section 4.2 Format HTML tags Identify HTML guidelines
Section 10.1 YOU WILL LEARN TO… Define scripting
HTML.
Basic HTML and Embed Codes
Computer communications
Presentation transcript:

 HTML is hypertext markup language. It is a way for people to display their information with more complex pictures and text displays. Before HTML, messages over networks were boring with no links or pictures. Today, we can create pages that are informational and aesthetically pleasing.

 Using this wonderful command, an html page can be linked to another page.  It is important to say where the page is.  Also, the user needs something to click on so add something.  Click here to go to the course web site

The command The img command will enable a programmer to place a picture or an image on a page. Be sure to specify the src to say where the file is. Some times placing the width and the height can be helpful too.

 By replacing the text with an image, the page will have a linked picture.  Add some linked pictures with height and width specified to your page.

 HTML review  The  Combining links and pictures

Using Comments The programmer can save them selves a lot of trouble by placing comments inside the code. The comments won’t be seen, they are just for the programmer to keep track of what is going on. Add comments to the code.

 Instead of just starting with the, a programmer can start with a head command. This is a good place to specify choices for the page such as a title.  Title of the document  Add a title to the code.

 To make a bulleted list, use the following style of code:  Coffee Milk  Add a bulleted list to your code.

Styling HTML with CSS A paragraph can have some style. This is a paragraph. Try some different style options for the pages paragraphs.

 Using comments  The head command  Bulleted Lists  Styling HTML with CSS

 Text can have a color in the background.  This is a heading  Use this example to change the background for some of the text on your page.

Using CSS to change the whole page In the section, before the section, there can be some design for the whole page. body {background-color:yellow;} p {color:blue;} Use the style command in the head section to set up a nice background color for the page.

 The embed command can place a file from a location on the page.  It is different from a link because it loads the object onto the current page rather than going to a separate thing. 

 The embed command can be used to access another html page.  If a student submitted an html page as their project 9 assignment, it would be saved as 9.html.   Try embedding a previous project onto the web page.

review CSS background color Using css to change the whole page Using the embed command Gaining access to earlier project

 The embed command can also be used to have the web page play music.  Line link a music file to play for your page. Look for a.mid file to play some music. 

 The page should contain some good information about topics the student is interested in. It should contain pictures on what the student is interested in. It should have music and colors so that a person looking at the page will be impressed.

Making the page professional Web pages should not only look fun, they should have a sleek aesthetic design. Having stuff all over the place and unorganized will make a person reading the page get confused or annoyed. There are a LOT of other people posting web pages on the Internet. Be sure to take care and have the page show some intelligent design.

 Some times we want a person to be able to click things on the page to see things happen. A great way to do this is to add a nice button.  Try the following code on your page.  Click Me!  The code won’t do anything for now.

 Adding music to the page  Making the page interesting  Making the page professional  Using forms to add buttons

Using Forms To Get Names The following code will enable a reader to type in their name. Add it to your page. First name: Last name:

 The following code will enable a person to check boxes. Add a version to your page.  I have a bike I have a car

 The following will enable a user to put in a password without the password being shown. Add it to your page.  Password:

More programming To make the buttons and boxes and text entered do stuff, we will need other programming languages. We can use things like php or javascript to expand on our web page power. To make the best pages will require work and dedication. The best pages of tomorrow will be made of students from today.

 Using form to get names  Using forms to get checks  Form passwords  More programming