introduction n.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
Introduction PowerPoint Presentation
Download Presentation
Introduction

Loading in 2 Seconds...

play fullscreen
1 / 12

Introduction - PowerPoint PPT Presentation


  • 47 Views
  • Uploaded on

Introduction. CSS The Missing Manual. Benefits of CSS. Style sheets offer more formatting choices than are offered in straight HTML

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Introduction' - clover


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.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
introduction

Introduction

CSS The Missing Manual

benefits of css
Benefits of CSS
  • Style sheets offer more formatting choices than are offered in straight HTML
    • EXAMPLE: When you use CSS to add a background image to a page, you are able to decide how many times the image will repeat on the background or whether it will repeat.
  • CSS style sheets/files take up less space than HTML’s formatting options, therefore, the
    • PAGE loads faster
  • Style sheets also make updating your web site easier.
just getting your feet wet with html
Just Getting Your Feet Wet with HTML?
  • Here are some free, on-line, html tutorials to help you familiarize yourself with HTML:
    • HTML DOG (www.htmldog.com/guides/htmlbeginner/)
    • W3Schools (www.w3schools.com/html/)
    • (check our first assignment for more tutorials on xhtml, css, etc.)
how html tags work
How HTML Tags Work
  • Most HTML commands (tags) appear in pairs
    • The starting (opening) tag tells the browser where the instruction begins, conversely, the ending tag tells the browser where the instruction ends. <p> </p>
  • To work, a web page must have these three basic tags
    • <html>--what language is being used
    • <head>--contains the title of the page, instructions for “how” the page should look, and CSS information.
    • <body>--All information that appears inside a browser window (i.e.) headlines, text, pictures, etc.
html is showing its age
HTML is Showing its Age

Although it has served its purpose and will continue to serve web designers, HTML has always been a somewhat sloppy language. Among other things, it allows uppercase, lowercase, or mixed case lettering in tags, and permits unclosed tags.

While this makes HTML easier to code, it makes life more difficult for PDA’s and other hand-held electronic devices.

xml on the other hand
XML—On The Other Hand

Is tag (element) based similar to HTML

Is used to organize data in a clear, concise, and easy to understand process so that different computers, operating systems, and programs can quickly exchange data.

Is limited to a handful of elements (tags), but provides a set of rules for defining your own tags.

XHTML is one example of XML

xhtml
XHTML
  • XHTML is not a revolutionary new language that takes years to learn.
  • XHTML is basically HTML with stricter guidelines.
  • Looking on the web, you get the idea that XHTML and HTML are different languages.
  • XHTML is the future of Web page languages, there will be no future versions of HTML.
    • Consequently: We will use xhtml when creating web pages for this course.
xhtml rules
XHTML Rules
  • Begin the page with a document type declaration.
    • <!DOCTYPE. The most important part of an XHTML page.
  • Tags (elements) and tag attributes must be in lowercase.
  • Quotation marks are required for tag attributes
    • <a href=“http://www.missingmanuals.com”>
  • All tags (even empty tags) must be closed.
    • Line break for example: have no closing tag, so to close the tag, you < /br> or <br />
what does the doctype do
What Does the DOCTYPE do?
  • States the type of document for the page and to which standard the page conforms. (document type declaration = doctype for short.)
    • Points the web browser to files on the Internet that contain definitions for that type of file.
    • Plays a key role in how a Web browser displays CSS.
    • Causes Internet Explorer to have difficulty handling the presentation of a CSS-heavy web page. However, there are a few cures for this issue.
software for css
Software for CSS
  • Free Text Editing Programs:
      • HTML-Kit
      • TextWrangler (Mac)
      • EditPlus
      • skEdit (Mac)
      • BBEdit (Mac)
      • Dreamweaver (both)
      • CoffeeCup
      • Expression Web Designer
          • (see Ch1 and Assignment 1 for more options)
          • You must use some type of text editor for this course.
course requirements
Course Requirements

You must know how to use html.

You must use a text editor to create your documents.

You must use a DocType statement for every page.

You must validate your html and your css prior to turning the document in to me.

Course assignments and textbook tutorials use different documents and are separate assignments. Both must be turned in when indicated.

course syllabus
Course Syllabus

CAS 215 Syllabus

Assignment 1