KarlWiki: KairosWorkshop

Revision [1688]

Last edited on 2009-05-15 17:43:02 by KarlS
Additions:
======Kairos Prototyping Workshop======


Revision [1239]

Edited on 2008-10-31 19:49:23 by KarlS
Additions:
~- Cederholm, Dan. (2007). //Bulletproof Web design// (2nd ed.). Berkeley, CA: New Riders.
~- Cederholm, Dan. (2004). //Web standards solutions: the markup and style handbook//. Berkeley, CA: Apress-Friends of ED.
~- Clarke, Andy. (2007). //Transcending CSS: The fine art of web design//. Berkeley, CA: New Riders. (esp. pp. 55-97, 181-269)
~- Keith, Jeremy. (2005). //DOM Scripting: Web design with ""JavaScript"" and the Document Object Model//. Berkeley, CA: Apress-Friends of ED.
~- Snyder, Carolyn. (2003). //Paper prototyping: The fast and easy way to design and refine user interfaces//. San Francisco, CA: Elsevier-Morgan Kaufmann.
~- Stolley, Karl. (2008). //Sustainable Web design: Resources for building better websites//. http://www.sustainablewebdesign.com/
Deletions:
~- Cederholm, Dan. (2007). Bulletproof Web design (2nd ed.). Berkeley, CA: New Riders.
~- Cederholm, Dan. (2004). Web standards solutions: the markup and style handbook. Berkeley, CA: Apress-Friends of ED.
~- Clarke, Andy. (2007). Transcending CSS: The fine art of web design. Berkeley, CA: New Riders. (esp. pp. 55-97, 181-269)
~- Keith, Jeremy. (2005). DOM Scripting: Web design with ""JavaScript"" and the Document Object Model. Berkeley, CA: Apress-Friends of ED.
~- Snyder, Carolyn. (2003). Paper prototyping: The fast and easy way to design and refine user interfaces. San Fransisco, CA: Elsevier-Morgan Kaufmann.
~- Stolley, Karl. (2008). Sustainable Web design: Resources for building better websites. http://www.sustainablewebdesign.com/


Revision [581]

Edited on 2008-05-22 09:07:31 by KarlS
Additions:
----
~- [[http://karlstolley.com/talks/prototyping/nostyles.htm POSH Content-Out Prototyping]] (no positioning, styles)


Revision [580]

Edited on 2008-05-22 07:24:04 by KarlS

No differences.

Revision [579]

Edited on 2008-05-22 00:04:31 by KarlS
Additions:
~- [[https://addons.mozilla.org/en-US/firefox/addon/60?id=60&application=firefox Pederick Web Developer Toolbar]] (for [[http://www.mozilla.com/firefox/ Firefox]])


Revision [578]

Edited on 2008-05-21 23:06:09 by KarlS
Additions:
~- Workshop overview [[http://www.kathiegossett.com/kairos_redesign/index.php?title=CW_2008 here]]
~- XHTML Templates: [[http://karlstolley.com/talks/prototyping/templates/strict.htm Strict (for workshop)]]; [[http://karlstolley.com/talks/prototyping/templates/transitional.htm Transitional]]
~- [[http://karlstolley.com/talks/prototyping/ POSH Content-Out Prototyping]] How-to
Deletions:
~-Workshop overview moved [[http://www.kathiegossett.com/kairos_redesign/index.php?title=CW_2008 here]]


Revision [577]

Edited on 2008-05-20 14:25:58 by KarlS
Additions:
~- Stolley, Karl. (2008). Sustainable Web design: Resources for building better websites. http://www.sustainablewebdesign.com/


Revision [576]

Edited on 2008-05-20 14:08:34 by KarlS
Additions:
Between **scaffolding** and **execution**: production methods that prepare or test ideas for production, and the act of producing the artifact itself.
Between **micro** and **macro** elements: smaller, isolated elements (buttons, menus, paragraphs), and the collection of those micro elements into sections, pages, entire artifacts.
Deletions:
Between **scaffolding** and **execution**
Between **micro** and **macro** elements


Revision [575]

Edited on 2008-05-20 14:06:51 by KarlS
Additions:
~-Absolute content is a free agent; content positioned absolutely has no effect on other page elements, which behave as though the absolutely positioned content no longer exists
~- Cederholm, Dan. (2007). Bulletproof Web design (2nd ed.). Berkeley, CA: New Riders.
~- Cederholm, Dan. (2004). Web standards solutions: the markup and style handbook. Berkeley, CA: Apress-Friends of ED.
~- Keith, Jeremy. (2005). DOM Scripting: Web design with ""JavaScript"" and the Document Object Model. Berkeley, CA: Apress-Friends of ED.
Deletions:
~-Absolute content is a free agent; content positioned absolutely


Revision [574]

Edited on 2008-05-20 11:07:00 by KarlS
Additions:
This portion of the workshop will introduce you to POSH (Plain Old Semantic HTML) content-out prototyping, a method that **avoids using visual tools like Dreamweaver**. Such a move goes against the conventional wisdom of both our field of computers and writing and of consumer technology in general: we have become so accustomed to visual tools playing a part in the workflow of digital discourse that even the thought of abandoning may well be overwhelming. But as will be demonstrated below, POSH content-out prototyping is much simpler than visual tools, and readily adapts to independent revision of content and design, and to extending discourse to technologies like Flash.
Better still, content-out prototyping isn't a throw-away method: from the start, you are working towards the final product of your efforts.
~-Keeping all files together in a single folder (perhaps with sub-folders for CSS files, Javascript, images, etc.)
Deletions:
This portion of the workshop will introduce you to POSH (Plain Old Semantic HTML) content-out prototyping, a method that **avoids using visual tools like Dreamweaver**. Such a move goes against the conventional wisdom of both our field of computers and writing and of consumer technology in general: we have become so accustomed to visual tools playing a part in the workflow of digital discourse that the thought of abandoning them is overwhelming. But as will be demonstrated below, POSH content-out prototyping is much simpler than visual tools, and readily adapts to independent revision of content and design, and to extending discourse to technologies like Flash.
~-Keeping all files together in a single folder (perhaps with sub-folders for CSS files, images, etc.)


Revision [571]

Edited on 2008-05-20 09:48:33 by KarlS

No differences.

Revision [570]

Edited on 2008-05-20 09:48:10 by KarlS
Additions:
~-Workshop overview moved [[http://www.kathiegossett.com/kairos_redesign/index.php?title=CW_2008 here]]
Deletions:
~-Content moved [[http://www.kathiegossett.com/kairos_redesign/index.php?title=CW_2008 here]]


Revision [565]

Edited on 2008-05-19 11:50:48 by KarlS
Additions:
Designer Andy Clarke (2007) advocated a "content-out" approach to Web development, which encourages authors to think about the structure of their discourse //apart from// visual design. This is the main idea behind developing websites that are styled with CSS: CSS alone can't do much of anything; only when CSS is coupled with a richly structured document does a compelling design emerge. (Putting CSS over the top of an ugly, table-based webpage is sometimes described as "putting lipstick on a pig.")
~-Selecting a text editor
~-Selecting a baseline browser: Firefox
~-Installing the Web Developer toolbar for Firefox
~-Keeping all files together in a single folder (perhaps with sub-folders for CSS files, images, etc.)
~-Use XHTML 1.0 Transitional or XHTML 1.0 Strict (preferred) DOCTYPE
~-Set character set to UTF-8 (allows copying of text with //smart quotes//, e.g., from Word)
~-Link to Yahoo! reset CSS (creates baseline styles across all browsers, which vary)
~-Create