130 likes | 276 Views
Writing Web Pages ITW009. Introducing HTML Fiona Stroud 9:30am - 12:30pm. By the end of this session, you should be able to…. Explain the working principles of HTML 4.1 and 5 Encode a simple page in HTML using a text editor Maintain and contribute to a web page
E N D
Writing Web Pages ITW009 Introducing HTML Fiona Stroud 9:30am - 12:30pm
By the end of this session, you should be able to… • Explain the working principles of HTML 4.1 and 5 • Encode a simple page in HTML using a text editor • Maintain and contribute to a web page • Locate HTML training resources
Workshop Overview • Editing Your Practice Page • Basic format • Manipulating lines • Headings • Manipulating text • Making lists • Making links • Images • Colour • Font Manipulation • Tables • Section 1-5 • Section 6 • Section 7 • Section 8 • Section 9 • Section 10 • Section 11 • Section 12 • Section 13 • Section 14
The HTML EnvironmentYou will need - • A browser – • e.g. Firefox or Internet Explorer • An editor - • preferably an ASCII text editor • e.g. Notepad, or... • dedicated HTML editing software • Arachnophilia - a “real” HTML editor, • Time - Lots and lots of time!
HTML: Facts about Tags • Html pages defined by tags, syntax includes less than < and greater than >symbols • HTML tags are usually English words, often with American spelling • Tags generally travel in pairs • opening tag < > • closing tag </ > • Tags can contain 3 types of information- • text structure, • Page & text formatting and • information not visible on the page
Creating a new web page There are 3 tags necessary to create the simplest web page… html <html> </html> head <head> </head> body <body> </body>
To start your page… Go to Notepad… Type the tags shown below <html> </html>
Other Tags required <html> <head> </html> </head> <body> </body> NOW SAVE YOUR FILE AS Yourname.html
Viewing your web page • Open your file in a browser • In menu bar select File, Open file… • To check changes as you work: 1. Save file: CTRL S or from menubar 2. Switch to Browser: Alt+Tab or taskpane 3. Refresh: F5 or from toolbar
Adding page information <html> <head> </head> <title> My first web page</title> <body> </body> </html>
Adding page information <html> <head> <title> My first web page</title> </head> <body> This is a good start </body> NOW SAVE YOUR FILE </html>
Viewing your web page • To view your changes: 1. Save file: CTRL S or from menubar 2. Switch to Browser: Alt+Tab or taskpane 3. Refresh: F5 or from toolbar