Difference between revisions of "Authoring Interactive Media Resources"
| Line 156: | Line 156: | ||
j. Goal Oriented Media | j. Goal Oriented Media | ||
| + | =Example Projects and Asssignments= | ||
| + | Example class structures, projects and assignments: http://imamp.colum.edu/mediawiki/index.php/Authoring_Interactive_Media | ||
| + | =Vocabulary= | ||
| − | + | ==Internet== | |
| + | The Internet is not the same thing as the World Wide Web. The Internet is made up of computers connected together; it is a network of informational systems. | ||
| + | ==WWW== | ||
| + | The World Wide Web is a type of file transfer over the Internet that has the capability to display graphics, sound, video and other media elements in addition to text. Information on the World Wide Web is transferred via HTTP (HyperText Transfer Protocol). | ||
| + | ==FTP== | ||
| + | File Transfer Protocol is a standardized way of transferring files from one machine to another. An FTP client is used to transfer the data. | ||
| + | ==HTTP== | ||
| + | HyperText Transfer Protocol is a standardized way of exchanging documents on the World Wide Web. | ||
| + | ==Browser== | ||
| + | An interpreting program that translates markup and renders it visually using style information. | ||
| + | ==Server== | ||
| + | A computer which provides services for other computers networked to it, or for those computers allowed to connect to it. | ||
| + | ==IP address== | ||
| + | A unique number (like a phone number) used to identify a computer on a network. | ||
| + | ==Markup== | ||
| + | a method of indicating the logical workings (the underlying structure) of a document. | ||
| + | ==SGML== | ||
| + | a complex and well-developed international text processing standard. | ||
| + | HTML(HyperText Markup Language) | ||
| + | a set of directions that instructs another program (a "user agent" or "browser") to structure content. | ||
| + | ==XML== | ||
| + | a language that is not predefined like HTML... it allows authors to develop their own tags and to provide meaning behind the structure. HTML has a set of tags developed by the W3C. With XML an author can not only defines tags, but also the relationships between them. | ||
| + | ==XHTML== | ||
| + | An extension of HTML 4.0 that is compatible with XML. | ||
| + | ==DTD== | ||
| + | a document type definition is a list of all the tags used within a specification and information about them like whether they are block-level or inline elements, what attributes they can take, etc. | ||
| + | ==CSS== | ||
| + | Cascading Style Sheets. A way of indicating how a document should appear visually (i.e., with font and color specifications). | ||
| + | ==Cache== | ||
| + | holds recently accessed data to speed up subsequent access of that same data | ||
| + | ==HTML validator== | ||
| + | a free service on the W3C site that will check HTML code and point out any parts of it that don't comply with the latest recommended specification. | ||
| + | ==Presentation== | ||
| + | A few examples of presentation are changing font color, text alignment (left, right, centered, etc.), or the visual representation of links (i.e. underlined and blue). | ||
| + | ==Proprietary Tags== | ||
| + | tags that are created by a company and which usually do not conform to standards. Be careful when you use these tags since many of them will not work in a competitor's browser (Internet Explorer vs. Netscape for example) | ||
| + | ==URI (Universal Resource Identifier), also known as a URL (Universal Resource Locator)== | ||
| + | The URI is part of a system that can locate an address irregardless of where in the world it physically resides. | ||
Revision as of 21:13, 29 August 2007
Contents
- 1 Concepts and Topics
- 1.1 Review Compression
- 1.2 Algorithms
- 1.3 File formats
- 1.4 Review resolution (covered in DID)
- 1.5 Using Media
- 1.6 About the Web
- 1.7 Standards
- 1.8 Authoring in the current recommended markup language specification (XHTML)
- 1.9 Structure vs. Presentation
- 1.10 Interactivity in a browser
- 1.11 Forms
- 1.12 Linking
- 1.13 Organizing files
- 1.14 Posting to the server on the network
- 1.15 FTP
- 1.16 Introduction to server-side scripting (using PHP)
- 1.17 CSS
- 1.18 XML
- 1.19 DTD
- 1.20 ECMAScript/JavaScript
- 1.21 Accessibility
- 1.22 Information Architecture
- 1.23 Interaction Design
- 1.24 Design and development strategies
- 2 Example Projects and Asssignments
- 3 Vocabulary
Concepts and Topics
Review Compression
Compression is covered in DID, but provide a brief review.
Algorithms
1. lossless 2. lossy
File formats
1. .jpg 2. .gif 3. .png
Review resolution (covered in DID)
a. DPI
Using Media
a. Importance of students using own media b. Alternative Sources 1. Creative Commons 2. Open Source 3. Crediting sources c. Copyright Issues
About the Web
a. Brief history of the Internet b. Internet vs. WWW c. Evolution of markup - where it came from, where it is going. d. Broad context of HTML/XHTML/CSS/XML (how the languages are related and which are used together)
Standards
a. Why it is important to author using standard specifications b. Creators of the standards 1. W3C (XHTML, XML, and CSS) c. Validating 1. DTD d. Well-formed
Authoring in the current recommended markup language specification (XHTML)
a. WYSIWYG editors (such as Dreamweaver) vs. using a text editor b. Syntax - Basic syntax form <element attribute="value"> </element>, and <element attribute="value" /> 1. entities 2. attributes 3. values 4. Block level vs. in-line 1. DIVs vs. Spans 5. Container (“non-empty”) vs. Non-container (“empty”) tags
Structure vs. Presentation
a. XHTML – structure (and what that means) b. CSS – presentation (and what that means) c. Reasons why presentation should be separated from structure
Interactivity in a browser
a. ECMAscript/JavaScript
Forms
a. What they are and how to use them b. Elements 1. Input boxes 2. Check boxes 3. Radio boxes 4. Textarea 5. Select 6. Standard Buttons 1. Submit 2. Reset 7. Graphic Buttons c. Action d. Method 1. Get 2. Post e. adf
Linking
a. Anchor tags 1. Linking to an external page 2. Linking within a page b. Absolute vs. relative paths c. Opening a link in a new window or the same window using the target attribute
Organizing files
a. File naming (and naming conventions) b. Directory structures (examples of ways in which to structure a directory)
Posting to the server on the network
FTP
Introduction to server-side scripting (using PHP)
a. Server-side vs. client-side scripting
CSS
a. Ways in which CSS can be used 1. In-line 2. Embedded 3. Linked (External) 4. Import* (support issues still remain with Import) b. Style Rules 1. Selector 2. Declaration 1. Property 2. Value c. IDs vs. classes d. Box Model 1. content 2. padding 3. border 4. margin e. Positioning 1. Normal Flow 2. Static 3. Relative 4. Absolute 5. Float 6. Multiple columns (2 and 3 column layouts) 7. Clear 8. Z-index 9. Overlapping elements
XML
a. XML declaration b. Comment c. Root element d. Node e. Child node
DTD
ECMAScript/JavaScript
a. Rollovers
Accessibility
Information Architecture
a. Definition b. Components 1. Organization 2. Labeling 3. Navigation Systems 1. Global Navigation 2. Local Navigation 3. Contextual Navigation 4. Searching c. Orientation 1. Where am I? 2. Where can I go? 3. Where have I been? d. User Centered Design 1. Basic steps in user centered design 2. Rapid prototyping with paper 3. User testing e. Supplemental Navigation Systems 1. Sitemaps 2. Indexes 3. Guides f. Iterative Design (Paper > Functional > Version 1 > Version 2 > etc) g. Wayfinding
Interaction Design
a. Levels of Interactivity 1. Access to content 2. Chooosing path through content 3. Environmental changes b. Design strategies
Design and development strategies
a. Scope b. Research c. Proposals d. Documentation e. Project management f. Asset management g. Time management h. Prototypes (paper mockups, sketches, models) i. Iterative design (versioning) j. Goal Oriented Media
Example Projects and Asssignments
Example class structures, projects and assignments: http://imamp.colum.edu/mediawiki/index.php/Authoring_Interactive_Media
Vocabulary
Internet
The Internet is not the same thing as the World Wide Web. The Internet is made up of computers connected together; it is a network of informational systems.
WWW
The World Wide Web is a type of file transfer over the Internet that has the capability to display graphics, sound, video and other media elements in addition to text. Information on the World Wide Web is transferred via HTTP (HyperText Transfer Protocol).
FTP
File Transfer Protocol is a standardized way of transferring files from one machine to another. An FTP client is used to transfer the data.
HTTP
HyperText Transfer Protocol is a standardized way of exchanging documents on the World Wide Web.
Browser
An interpreting program that translates markup and renders it visually using style information.
Server
A computer which provides services for other computers networked to it, or for those computers allowed to connect to it.
IP address
A unique number (like a phone number) used to identify a computer on a network.
Markup
a method of indicating the logical workings (the underlying structure) of a document.
SGML
a complex and well-developed international text processing standard. HTML(HyperText Markup Language) a set of directions that instructs another program (a "user agent" or "browser") to structure content.
XML
a language that is not predefined like HTML... it allows authors to develop their own tags and to provide meaning behind the structure. HTML has a set of tags developed by the W3C. With XML an author can not only defines tags, but also the relationships between them.
XHTML
An extension of HTML 4.0 that is compatible with XML.
DTD
a document type definition is a list of all the tags used within a specification and information about them like whether they are block-level or inline elements, what attributes they can take, etc.
CSS
Cascading Style Sheets. A way of indicating how a document should appear visually (i.e., with font and color specifications).
Cache
holds recently accessed data to speed up subsequent access of that same data
HTML validator
a free service on the W3C site that will check HTML code and point out any parts of it that don't comply with the latest recommended specification.
Presentation
A few examples of presentation are changing font color, text alignment (left, right, centered, etc.), or the visual representation of links (i.e. underlined and blue).
Proprietary Tags
tags that are created by a company and which usually do not conform to standards. Be careful when you use these tags since many of them will not work in a competitor's browser (Internet Explorer vs. Netscape for example)
URI (Universal Resource Identifier), also known as a URL (Universal Resource Locator)
The URI is part of a system that can locate an address irregardless of where in the world it physically resides.
