dev101 w1 part 2

Upload: c-n-p

Post on 07-Apr-2018

226 views

Category:

Documents


0 download

TRANSCRIPT

  • 8/6/2019 Dev101 w1 Part 2

    1/27

    The Internet

  • 8/6/2019 Dev101 w1 Part 2

    2/27

    ENIAC

  • 8/6/2019 Dev101 w1 Part 2

    3/27

    ENIAC

  • 8/6/2019 Dev101 w1 Part 2

    4/27

    ENIAC

  • 8/6/2019 Dev101 w1 Part 2

    5/27

    Web Server

    The server serves up

    Web pages and sends

    them to the browser.

    The browser retrieves the page...

    ...and the browser

    displays as an HTML

    page.

    Web Server

  • 8/6/2019 Dev101 w1 Part 2

    6/27

    I need the HTML file lounge.html

    Found it, here you go

    Browsers make

    requests for HTML

    pages or other

    resources, like

    images.

    Each server stores HTML

    files, pictures, sounds and other file

    types.

    Web Server

    Web Server

  • 8/6/2019 Dev101 w1 Part 2

    7/27

  • 8/6/2019 Dev101 w1 Part 2

    8/27

  • 8/6/2019 Dev101 w1 Part 2

    9/27

  • 8/6/2019 Dev101 w1 Part 2

    10/27

  • 8/6/2019 Dev101 w1 Part 2

    11/27

    DOCTYPEHTML tags

    Head tagsBody tagsHeadings

    Paragraphs

    CommentsMeta tags

    XHTML

  • 8/6/2019 Dev101 w1 Part 2

    12/27

    How does this effect you?

    DEV101 will teach you XHTML

    XHTML is a revised version of HTML

    HTML is what the internet is built on In other classes you'll be learning CSS, PHP,

    Javascript, databases and more.

    But for now..

    XHTML

    7/08/2011 DEV101 - XHTML - Week 06 12

  • 8/6/2019 Dev101 w1 Part 2

    13/27

    XHTML DOCTYPE

    The first thing that should be in ANY XHTML document is a doctype

    This tells the web browser which type of XHTML to use.

    There are three types

    Strict

    Transitional

    Frameset

    Spring into HTML and CSS

    7/08/2011 13DEV101 - XHTML - Week 06

  • 8/6/2019 Dev101 w1 Part 2

    14/27

    XHTML DOCTYPE cont.

    DOCTYPE is SGML (Standardized GeneralMarkup Language) not HTML

    Nothing ever goes above this tag

    It must be the first piece of XHTML you write

    Your script will not validate without a doctype.

    In this class ALL scripts must validate

    For DEV101 I expect that you will use thetransitional doctype (for now)

    7/08/2011 DEV101 - XHTML - Week 06 14

  • 8/6/2019 Dev101 w1 Part 2

    15/27

    HTML Head tags

    The information between the head tags() is usually invisible informationabout the page. This is where you put the title ofthe page, JavaScript code, Metadata, and stylesheet information (embedded or linked).

    META Centre, Usyd DW MX Intermediate E-learning Workshop

    7/08/2011 15DEV101 - XHTML - Week 06

  • 8/6/2019 Dev101 w1 Part 2

    16/27

    HTML title tags

    The title tags () are used to tell thebrowser what the page is called. This informationis displayed in the title bar of the users browser.

    Your title for the page

    7/08/2011 16DEV101 - XHTML - Week 06

  • 8/6/2019 Dev101 w1 Part 2

    17/27

    HTML body tags

    The body tags () tell the browserthat all the information between them is whatneeds to be displayed in the browser.

    Your title for the page

    7/08/2011 17DEV101 - XHTML - Week 06

  • 8/6/2019 Dev101 w1 Part 2

    18/27

    The smallest XHTML Doc

    What will it look like?

    Theyre only tags

    7/08/2011 DEV101 - XHTML - Week 06 18

  • 8/6/2019 Dev101 w1 Part 2

    19/27

    The smallest XHTML Doc

    Below is the smallest possible XHTML document

  • 8/6/2019 Dev101 w1 Part 2

    20/27

    HTML heading tags

    The heading tags (.) areused to format and structure the documentinformation. These also indicate to screen readersthe structure of the information.

    Heading 1Heading 2

    Heading 3

    7/08/2011 20DEV101 - XHTML - Week 06

  • 8/6/2019 Dev101 w1 Part 2

    21/27

    HTML paragraph tags

    The paragraph tags (

    ) are used to show differentparagraphs.

    Note: If you require a single return use the
    tag, this tag doesnt require an end tag.

    Heading 1Heading 2Heading 3

    Hello this is a paragraph

    This is a demonstration of a
    single break

    7/08/2011 21DEV101 - XHTML - Week 06

  • 8/6/2019 Dev101 w1 Part 2

    22/27

    HTML comments

    You should always comment your code so other developers are ableto understand what is happening. In HTML comments are surroundby the following,

    Heading 1Heading 2Heading 3

    Hello this is a paragraph

    This is a demonstration of a
    single break

    7/08/2011 22DEV101 - XHTML - Week 06

  • 8/6/2019 Dev101 w1 Part 2

    23/27

    HTML comments

    7/08/2011 23DEV101 - XHTML - Week 06

  • 8/6/2019 Dev101 w1 Part 2

    24/27

    HTML comments

    7/08/2011 24DEV101 - XHTML - Week 06

  • 8/6/2019 Dev101 w1 Part 2

    25/27

    HTML meta tags

    There are a number of different meta tag types: declare document encoding,keywords, description and authorship.

    Your title for the page

    Meta tags provide data about your document This is used by search engines and other automated processes primarily

    These are the most common ones (the ones you should always include)

    7/08/2011 25DEV101 - XHTML - Week 06

  • 8/6/2019 Dev101 w1 Part 2

    26/27

    ACS

  • 8/6/2019 Dev101 w1 Part 2

    27/27

    Essay PreparationInternet Society: http://www.isoc.org/internet/history/Key Figures

    StructureMain Points