HTML!. What is HTML? HyperText Markup Language – Not a programming language – Used to format web pages – Uses markup tags to describe the content of a.

Slides:



Advertisements
Similar presentations
Introduction to Web Design Lecture number:. Todays Aim: Introduction to Web-designing and how its done. Modelling websites in HTML.
Advertisements

Intro to HTML. HTML HTML = HyperText Markup Language Used to define the content of a webpage HTML is made up of tags and attributes Content.
HTML popo.
Introduction to Creating a Web Page using a Simple Text Editor (Notepad) 1  2004 Ecirp Studios
Internet Services and Web Authoring (CSET 226) Lecture # 5 HyperText Markup Language (HTML) 1.
KompoZer. This is what KompoZer will look like with a blank document open. As you can see, there are a lot of icons for beginning users. But don't be.
HTML.
HTML Creating Web pages. HTML Hyper Text Markup Language Not programming, but a markup language using tags to format text in Web browsers.
How To Create A Web Page By: Mikeon Briddy & Darrius Jacobs April 10,2006 Mr. Barnett.
How Tags are used to form your Web Page
Hypertext Markup Language. Platform: - Independent  This means it can be interpreted on any computer regardless of the hardware or operating system.
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.
HTML Basics An Introduction to HTML. What is HTML? Stands for “Hyper Text Markup Language” Composed of “tags” which are surrounded by sideways triangles.
Designing Web Pages Getting to know HTML... What is HTML? Hyper Text Markup Language HTML is the major language of the Internet’s World Wide Web. Web.
Tags through Forms. This element is required for all HTML pages It must be at the top of every page of every website We’ll see later on why it is important.
Computer Sciences Department
HTML Tags. Objectives Know the commonly used HTML tags Create a simple webpage using the HTML tags that will be discussed.
Basic HTML The Magic Of Web Pages. Create an HTML folder  Make a folder in your H drive and name it “HTML”. We will save EVERYTHING for this unit here.
 Using Microsoft Expression Web you can: › Create Web pages and Web sites › Set what you site will look like as you design it › Add text, images, multimedia.
Introduction to HTML. Topics HTML –What is HTML –Parts of an HTML Document –HTML Tags.
Agenda9/11/13  Do Now  Display your name tag and log into your computer  Pre-Assessment Test  Info and Interests  Syllabus and Course Expectations.
McGraw-Hill/Irwin © The McGraw-Hill Companies, All Rights Reserved TECHNOLOGY PLUG-IN T10 Creating Web pages Using HTML.
Web Design Unit Assignment #2: Job Skills Favorite Links Page You will create a HTML web page with links to informational websites about a variety of job.
HTML (HyperText Markup Language)
Understanding HTML Code
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 CSC 121 Computers and Scientific Thinking David Reed Creighton University HTML and Web Pages.
HTML CRASH COURSE. What is HTML?  Hyper Text Markup Language  The language used to make web pages  Written by using tags.
By Brieya. What is HTML Hypertext Markup Language, a standardized system for tagging text files to achieve font, colour, graphic, and hyperlink effects.
Web Programming Basics of HTML. HTML stands for Hyper Text Mark-up Language A mark-up language is different than those that you have learned before in.
G053 Lecture 12 Introduction To HTML Mr C Johnston ICT Teacher
15.1 Fundamentals of HTML.
Just Enough HTML How to Create Basic HTML Documents.
HTML Hyper Text Markup Language. What is an HTML File?  HTML stands for Hyper Text Markup Language  An HTML file is a text file containing small markup.
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.
Introduction to HTML. Slide 1 Hard-Coding What is hard-coding? –Creating the page in a text editor just using HTML A Web designer should know how to hard-
Hypertext Mark-Up Language Web Page Creation HTML.
Enhancing Your Web Site—Adding Links Web Page **YOU MUST HAVE COMPLETED THE 1ST 3 WEB PAGES BEFORE YOU CAN DO THIS ONE. **YOU SHOULD HAVE COMPLETED THE.
Introduction to web development and HTML MGMT 230 LAB.
HTML Basics Objectives: Objectives: Understand what HTML is Understand what HTML is Know basic HTML tags Know basic HTML tags Understand how to view HTML.
Chapter 2 Web Page Design Mr. Gironda. Elements of a Web Page These are things that most web pages use.
HTML HTML: Hypertext Markup Language. The basic language of the World Wide Web. Developed around 1991 at the CERN lab on the French-Swiss border by Tim.
Introducing the World Wide Web Internet- a structure made up of millions of interconnected computers whose users communicate with each other and share.
Web Design. How do web pages work? Webpages are written in a code called HTML. Programs like Internet Explorer read the code, and then show it as a web.
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.
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 Basics. HTML Coding HTML Hypertext markup language The code used to create web pages.
HTML BASIC IST 210: Organization of Data IST210 1.
Web Authoring with Dreamweaver. Unit Objectives  Be able to define keywords: HTML, HTTP (protocol), browser, web server, client/server, tag, attribute,
Spiderman ©Marvel Comics Creating Web Pages (part 1)
Getting Started with HTML. HTML  Hyper Text Markup Language  HTML isn’t a program language, its known as a markup language  A Markup language has tags.
Notes Test #2 will be held one week from this Thursday Check to see if you have a Vision account –Launch Netscape –Point & Click to location and type vision.
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.
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 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.
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.
HTML And the Internet. HTML and the Internet ► HTML: HyperText Markup Language  Language in which all pages on the web are written  Not Really a Programming.
Revised June 2008 Online PD Basic HTML1 Let’s Try It!  Open Notepad oStart > All Programs > Accessories > Notepad oDon’t get WordPad by mistake – won’t.
Let’s Try It! Open Notepad
Online PD Basic HTML The Magic Of Web Pages
INTRO TO WEB DEVELOPMENT html
Web Basics: HTML/CSS/JavaScript What are they?
What is HTML? Acronym for: HyperText Markup Language
Uppingham Community College
HTML Robert McIntosh
HTML.
If You Know Nothing About HTML, This is Where You Start.
What is HTML?.
Understand basic HTML and CSS terminology, concepts, and basic operations. Objective 3.01.
Presentation transcript:

HTML!

What is HTML? HyperText Markup Language – Not a programming language – Used to format web pages – Uses markup tags to describe the content of a page For example, gives you a way to make text bold or underlined. You can also change the color using HTML.

White Space White space is anywhere you do not have HTML. In HTML, unlike some programming languages, white space does not affect the code. It is important to use your white space wisely to help clarify what you are typing. – Other people may read your HTML and want to understand it.

Two Identical Codes Artemis Rules! Artemis is so cool! Week 1: June 25 – June 29 Week 2: July 2 – July 6 Week 3: July 9 – July 13 Week 4: July 16 – July 20 Week 5: July 23 – July 27 Artemis is a program for 9th grade girls to learn more about computer science, technology, and mathematics. It is really fun because you meet cool people and go on awesome field trips! This website gives more information about Artemis. Click on the screenshot below to see a REALLY COOL video! Artemis Rules! Artemis is so cool! Week 1: June 25 – June 29 Week 2: July 2 – July 6 Week 3: July 9 – July 13 Week 4: July 16 – July 20 Week 5: July 23 – July 27 Artemis is a program for 9th grade girls to learn more about computer science, technology, and mathematics. It is really fun because you meet cool people and go on awesome field trips! This website gives more information about Artemis. Click on the screenshot below to see a REALLY COOL video! Which do you think is better? Why?

How do tags work? Most tags come in pairs, start tag and end tag. Text goes in between these pairs of tags Example: This text is bold, but this text is not. Usually, an end tag is the same as a start tag with a forward slash (/) at the beginning.

Unpaired Tags Some commands require only one tag. Examples: This forms a line break. It is the same as pressing enter on your keyboard. This will insert an image. sphere.jpg must be in the folder where your HTML file is kept, or else the browser won't be able to find it.

Important Tags to Begin Layout: – and Signifies the beginning and end of an html document – Signifies the header (at the top of your browser) – Everything within these tags appears on your webpage – This is the largest header – This is the second largest header Formatting – – (or CCCCFF) Sizes work a little bit differently than sizes in Microsoft Word, which you are probably used to. The sizes range from 1 (small) to 7 (huge.) Play around with them to see which is best for your page.

The Color Palette Every color has a hexadecimal code. You can refer to common colors by their names (e.g. red, blue, orange, etc.) To get specific colors search for "hexadecimal color wheel" or "HTML color wheel" on google. – map/style/color/wheel.ht ml

More formatting Inserting links and images – Your Text Here Will give you Your Text Here with a link to google. – To make an image clickable (i.e. turn an image into a link), simply insert the code in between the codes. – Remember, anything you put in between and will be clickable!

Insert video here

If you need help… -Watch and follow along with the above video. -Go to 1/students.html Most of the girls from last year have HTML websites. Click on their websites for some ideas - they also have some more interesting tricks than just the basics listed here.

Ready to plan your OWN?? Your website must have at least 5 webpages (counting the homepage.) Try to make each webpage about something different – Last year the girls included pages about their family, favorite music, hobbies, what they want to be when they grow up, and some of their favorite websites to go to on the Internet Make sure you keep everything PG!

Requirements Your website must have: – 5 web pages – 3 links (besides the other web pages) – 1 picture link – 5 pictures – Extra challenge #1: 1 list – Extra challenge #2: 1 Youtube video (embedded)