The Ulta-Handy HTML Guide
Upcoming SlideShare
Loading in...5
×
 

The Ulta-Handy HTML Guide

on

  • 709 views

 

Statistics

Views

Total Views
709
Slideshare-icon Views on SlideShare
709
Embed Views
0

Actions

Likes
0
Downloads
2
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    The Ulta-Handy HTML Guide The Ulta-Handy HTML Guide Presentation Transcript

    • The Ultra-Handy Guide to HTML5 By Kurt Richardson, Josh Sved, Ryle Laporte & Nathan Smofsky
    • HTML Basics
      • Hypertext Markup Language
      • Uses “markup tags”
        • Usually follows <opentag>Content</closetag> format
      • Commands describe the website
      • HTML Document is a WEB PAGE
    • Website vs. Webpage
      • A webSITE is a collection of linked pages (HTML documents)
      • A webPAGE is an individual HTML document
    • HTML vs. CSS
      • HTML document is the STRUCTURE of the webpage
        • Eg. how blocks of texts are arranged, what they say
      • CSS document is the design (look) of the page
        • Eg. font size/color, background image/color, etc.
    • !DOCTYPE Declaration
      • Should be the first line in any HTML document (before <html> tag)
      • Indicates to the browser which protocol is to be followed
      • Syntax:
        • < !DOCTYPE    [Top Element]   [Availability]   &quot;[Registration]// [Organization]// [Type]   [Label]// [Language]&quot;   &quot;[URL]&quot;>
    • Basic Format of an HTML Doc
      • <html>
      • <head>
      • Head Content
      • </head>
      • <body>
      • Body Content
      • </body>
      • </html>
    • Basic Format, Continued
      • Composed of <head> and <body>
      • <head> tag is for title and other info
      • <body> tag is where content goes
    • Basic Tags
      • <p> means paragraph
      • <a href=“”> creates a link
      • <h1> means header
      • <img src=“”> creates an image
    • <p>
      • Means PARAGRAPH
      • Basic Syntax:
        • <p>This is the paragraph</p>
      • Uses regular size font
      • Notice how tags must be CLOSED with </whatever>
    • <a href=“”>
      • Creates a LINK
      • Basic Syntax
        • <a href=“www.examplewebsite.com”>This is the link</a>
      • First part is the site you want to link to
      • Second part is the text that will appear in your webpage
    • <h1>
      • Creates a HEADER
      • Basic syntax:
        • <h1>This is our header</h1>
      • Numbers 1-6 can be used
        • 1 is biggest header, 6 is smallest header
      • Text will appear bolded and larger than <p> font
    • <img src=“”>
      • Will insert an image on the page
      • Basic Syntax:
        • <img src=“filename” width=“x” height=“y”/>
    • <meta>
      • Appears in <head> section
      • Information about the site itself
      • Will be used to identify site in searches
      • Basic Syntax:
        • <meta name=“keywords” content=“tutorial, HTML, MPM17”>
    • What is a web server?
      • A physical space (HDD) which stores data that can be accessed over the internet
      • HTML (and supporting) files will be saved here
      • They can then be accessed via a URL
    • URL
      • Uniform Resource Locator
      • A unique address (string of characters) pointing to a file that is accessible via the internet
      • Syntax:
        • http://www.examplesite.com/image
        • (protocol – domain name – specific file)
    • HTTP
      • Hypertext Transfer Protocol
      • Foundation for data communication over the World Wide Web
      • Defines information format and transmission
        • A URL sends an HTTP request from your browser to the server to display the corresponding web page
    • FTP
      • File Transfer Protocol
      • Allows computers to communicate over the internet
      • Supports a wide variety of file formats
      • Popular Clients:
        • FileZilla, FireFTP
    • Accessing Your Web Space
      • Host
        • ftp.imagearts.ryerson.ca
      • Username
        • first initial + last name
      • Password
        • Last 7 of student ID
    • Sources
      • www.w3schools. com
      • Schafer, Steven M. HTML, XHTML, and CSS Bible . Indianapolis: Wiley Publishing, Inc., 2010. Print