From now on you are the Creator,

Slides:



Advertisements
Similar presentations
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.
Advertisements

HTML Basics Customizing your site using the basics of HTML.
Internet Services and Web Authoring (CSET 226) Lecture # 5 HyperText Markup Language (HTML) 1.
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.
/k/k 1212 Cascading Style Sheets Part one Marko Boon
1 تقنيات الانترنت عال457 HTML. 2 HTML  HTML – HyperText Markup Language – The Language of Web Pages on the World Wide Web. HTML is a text formatting.
HTML Tags. Bolding Text Or Italics Text Or
Lecture 5. CSS 2 What style will be used when there is more than one style specified for an HTML element? Generally speaking we can say that all the styles.
HTML Programming last updated 9/12/05 at 1:30pm HyperText Markup Language Reference: – HTML BasicsHTML Basics An HTML program is a set of paired tags that.
HTML BASIC
Colour & Image in HTML Wah Yan College (Hong Kong) Mr. Li C.P.
© Maths Support Service 2007 Binary and Hexadecimal Numbers Next Slide AE98FD AE98FD.
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.
THE BACKBONE OF EVERY WEB PAGE HTML Day 1. What will we learn? How to create a basic web page Backgrounds and colors How to link Web sites How to include.
Learning HTML. HTML Attributes HTML elements can have attributes Attributes provide additional information about an element Class – specifies a class.
1 Essential HTML coding By Fadi Safieddine (Week 2)
Web Pages: Creating & Maintaining Body Tags. There have been several versions of HTML since its inception. VersionYear HTML1991 HTML HTML
McGraw-Hill/Irwin Copyright © 2013 by The McGraw-Hill Companies, Inc. All rights reserved. Extended Learning Module F Building a Web Page with HTML.
More Basic HTML. Add spacing (single & double space) Save Refresh Add horizontal rule Add comments Add styles Add headings Add features Add alignments.
15.2 More Basic HTML. More Basic HTML Add spacing (single & double space) Save Refresh Add horizontal rule Add comments Add styles Add headings Add features.
HTML Basic I IST2101. Keep In Mind Programming can be time consuming. Plan ahead!
HTML CRASH COURSE. What is HTML?  Hyper Text Markup Language  The language used to make web pages  Written by using tags.
Programming in HTML.  Programming Language  Used to design/create web pages  Hyper Text Markup Language  Markup Language  Series of Markup tags 
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
Just Enough HTML How to Create Basic HTML Documents.
HTML Basic IST2101. Keep In Mind Programming can be time consuming. Plan ahead!
HTML. Hypertext Markup Language Lesson Objectives 1. We will be able to understand the need for HTML and where it is used 2. We will be edit HTML to.
CREATING WEB PAGES Using…More HTML code! My First \ Web Page.
Paul Mundy Microsoft FrontPage Tips and tricks.
Georgia Institute of Technology Making Text for the Web Barb Ericson Georgia Institute of Technology March 2006.
Basic HTML Hyper text markup Language. Lesson Overview  In this lesson, you will learn to:  Images  Colors.
HTML. Adding Background Color The bgcolor attribute lets you change the background color of the Web page. Located in the body tag See common Web Page.
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.
Images Worksheet. Web template Download the template folder Unzip and save in your documents Rename the folder to “images work” without quotes.
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.
Quick Questions 1. What does HTML stand for? 2. What are the three main languages of the Web? 3. What is the purpose of the tags? 4. Why do we indent different.
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)
HTML CS 105. Page Structure HTML elements control the details of how a page gets displayed. Every HTML document has the following basic structure: … …
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.
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. 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.
1 HTML. 2 Full forms WWW – world Wide Web HTTP – Hyper Text Transfer Protocol HTML – Hyper Text Markup Language.
Revision Webpage design HTML.   FACE  Attributes  Marquee  Define the following terms.
ENHANCE YOUR WEBSITE. HOW TO INSERT COLOR??? USE THE TAG: GO TO PICK COLOR WANT BY POINTING: THEN USE THE HEX NUMBER.
1 R3 R1 R5 R4 R6 R2 B B A A Looking at the Code Under the View menu Select Source.
HTML Help book. HTML HTML is the programming language used to make web pages for the Internet. HTML stands for Hyper Text Markup Language. HTML is made.
HTML Basic IST 210: Organization of Data IST2101.
G053 Lecture 12 Introduction To HTML Mr C Johnston ICT Teacher
Let’s Try It! Open Notepad
HTML Basics.
Hyper text markup Language
HTML GUIDE Press F5 and then
Writing html for websites and blogs
<TAG> <html> <head>
HTML (HyperText Markup Language)
HTML.
Introduction to Web Page Design
5.2.3 Be able to use HTML and CSS to construct web pages
Instructions for creating a template in MS Frontpage
Nerd Website HTML.
Programming for webpages
HTML Text editors and adding graphics
HTML & CSS 7 Languages in 7 Days.
Presentation transcript:

From now on you are the Creator, HTML From now on you are the Creator, Not the USER!!!

The Colour Challenge 1 HTML/CSS colours are defined using a hexadecimal (hex) notation for the combination of Red, Green, and Blue color values (RGB). The lowest value that can be given to one of the light sources is 0 (hex 00). The highest value is 255 (hex FF). Colours!!! With a twist!!! Hex to Decimal

Learning Objectives To understand the use of websites and identify the good areas and any areas that would need improvements in a website. To be able to create a website using the basic HTML tags.

CodeAcademy go to the following website using Google Chrome and sign up: www.codeacademy.com You will need your login details. Will be working from the HTML course. 15 mins.

The First HTML Webpage (Notepad) 7 mins <html> <head> <title>My webpage</title> </head> <body> <p>Hello, my name is …. </p> </body> </html> To Save: File > Save As. type mywebpage.html as your file name. To Open: Find your saved “mywebpage” file and double click.

Adding some style 7 mins Go back to your notepad document and add the following tags: Makes your text bold <strong> </strong> Makes your text italic <i> </i> Makes your text underlined <u> </u> From now on to Save: File > Save.

Using the Heading tags In between the <body> tags insert the following code: <h1> HAPPY NEW YEAR </h1> <h2> HAPPY NEW YEAR </h2> <h3> HAPPY NEW YEAR </h3> <h4> HAPPY NEW YEAR </h4> <h5> HAPPY NEW YEAR </h5> Ext. You can add a marquee to make text animate – <marquee> Text goes in here </marquee> From now on to Save: File > Save.

www.w3schools.com/html/html_colors.asp The Colour Challenge 2 Click ME!!!

Adding colour to your page Changes the PAGE COLOUR and text colour <body bgcolor="#000000" text=“#00ffcc"> Changes your colour of the HEADING 1 TAG <h1><font color=“#FFCC00”> hello </font></h1> Changes the colour of your TEXT for that particular <p> <p><font color=“#FFCC00”> hello </font></p> Click me for more colours!!!

Image <TAG> Find an image from the internet and save it in the same folder as your webpage. <img src ="APS.jpg" width="366" height="84"> This will resize the image Name of the image and the file type for it recognise it as an image.