1 / 20

Math 10126 Introduction to HTML

Math 10126 Introduction to HTML. Gavin Shaddick www.bath.ac.uk/~masgs. Web addresses. URL - U niform R esource L ocator "protocol://address" protocol is something like http, gopher, FTP, telnet address is merely the server and pathname (if any) of a given resource or page

cody-poole
Download Presentation

Math 10126 Introduction to HTML

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Math 10126 Introduction to HTML Gavin Shaddick www.bath.ac.uk/~masgs

  2. Web addresses • URL - Uniform Resource Locator "protocol://address" • protocol is something like http, gopher, FTP, telnet • address is merely the server and pathname (if any) of a given resource or page • For example, http://www.bath.ac.uk

  3. What is HTML? • HTML – “hypertext mark up language” • a format that tells a computer how to display a web page in a browser, e.g Explorer, Netscape. • The documents themselves are plain text files with special "tags" or codes that a web browser knows how to interpret and display on your screen.

  4. Where do you create HTML files ? • Any text editor program capable of creating plain text files e.g. NotePad, emacs, pico. • Word processor, e.g. Word. If you use a word processor program then you must save your files as plain text format. • Dedicated HTML editor or generator, e.g. Frontpage • You cannot guarantee that your document will appear to other people exactly as it does to you.

  5. Tags • HTML is composed of tags. • HTML tags are always enclosed in angle-brackets, < > • Tags typically occur in begin-end pairs. These pairs are in the form <tag> ... </tag>

  6. Begin-end tags

  7. Document tags • The first and last tags in a document should always be the HTML tags <HTML> </HTML> • If you were to load such a page into a Web browser, it wouldn't do anything except give you a blank screen

  8. Heads and titles • HEAD • contain all of the document's header information, e.g. title <HEAD></HEAD> • TITLE • This will appear at the top of the browser's title bar, and also appears in the history list. • Will also go into a bookmark list <TITLE>Document Title</TITLE>

  9. Body • BODY comes after the HEAD structure. • Between the BODY tags, you find most of the stuff that gets displayed in the browser window. <BODY> This appears in the browser window </BODY>

  10. First web page <HTML> <HEAD> <TITLE>Math0126 - HTML</TITLE> </HEAD> <BODY> This appears in the browser window </BODY> </HTML>

  11. Putting it all together

  12. Comment Tags • If you want to leave yourself notes in an HTML document, but don't want those notes to show up in the browser window • <!-- Hi, I'm a comment. --> • you do need an exclamation point after the opening bracket, but not before the closing bracket. • there is no end tag,i.e. </!-- text --> • This is an empty tag

  13. Headings • Used to set apart document or section titles. • There are six levels of headings, from Heading 1 through Heading 6. • Heading 1 (H1) is "most important" and Heading 6 (H6) is "least important." <H1>Heading 1</H1> <H2>Heading 2</H2> <H3>Heading 3</H3> <H4>Heading 4</H4> <H5>Heading 5</H5> <H6>Heading 6</H6>

  14. Paragraphs • The beginning of a paragraph is marked by <P>, and the end by </P>. <P> Paragraphs can often be far too long, wandering on with no clear sense of direction or purpose, boring the reader to sleep and obscuring the point of the message contained within the text. </P> <P> On the other hand, they can be pretty short. </P> <P> Really short. </P>

  15. Line break • If you want to end a line after a certain word, but don't want to start a new paragraph • Use the <BR> tag • There is no </BR> tag – another empty tag <P> If you want to force a line break for some reason, but it doesn't make sense to start a new paragraph, then you can use the line break tag just as I will do at the end of this sentence.<BR> See the forced display on the next line?<BR> How about there?<BR> Or there? </P>

  16. Style tags • Everything between <B> and </B> is boldfaced. • Everything between <I> and </I> is italicized. • Everything between <U> and </U> should be underlined; however, see the note below. • Everything between <TT> and </TT> is in typewriter text

  17. Hyperlinks • HREF stands for "Hypertext REFerence” Have you seen the <A HREF="http://www.bath.ac.uk/"> Bath home page </A> <A HREF=“c:\web\example1”> Click here to see this example </A>

  18. Images • Images are placed in Web documents using the IMG tag, <IMG> • Kept in separate files • Use a SRC attribute - "source" • Can be a web address or a file <IMG SRC="URL of graphic"> <IMG SRC=“c:\web\figures\boatseattle.jpg">

  19. Creating your own home page on BUCS • Run the mkhome command on UNIX server, i.e.mary, midge or ss1 • Creates a basic home page (ie name, postal address, phone & fax numbers and e-mail address). • Home page is called for index.html • Created in a directory called public_html in your UNIX home directory • Also accessible on H drive under public_html

  20. Your homepage on the web • Once you've created your personal home page it will be added to the list of all personal home pages at Bath • URL: http://www.bath.ac.uk/~username/ • index.html be the first page that opens, • This facility is provided as a personal privilege and should not be abused

More Related