CTN 161 Web Production 2

<link rel=”stylesheet” media=”print” href=”print.css” />

Some Tips for Creating a Print CSS

• Use appropriate fonts
• Use points for printing rather than pixels
• Hide navigation, sidebars or ads
• Adjust margins
• Remove background colors or images
• Use Page break to separate sections such as comments
• Make sure links can be printed

CSS Design Going to Print
http://www.alistapart.com/articles/goingtoprint/

How to Create a simple css print page for your site
http://www.onextrapixel.com/2009/05/05/how-to-create-a-simple-print-css-for-your-site/

Visual QuickStart Guide HTML ,XHTML & CSS
Chapter 14: StyleSheets for Printing page 209-214

Mobile Web Design Lecture  (pdf | ppt )

Visual QuickStart Guide HTML ,XHTML & CSS
Chapter 13: StyleSheets for Handhelds Page 199- 208

• W3C Mobile Web Initiative
  http://www.w3.org/Mobile/
• Mobile Web Best Practices
  http://www.w3.org/2007/02/mwbp_flip_cards.html
• Mobile Web Design Trends
  http://www.smashingmagazine.com/2009/01/13/mobile-web-design-trends-2009/
• 5 Minute Mobile Makeover
  http://perishablepress.com/press/2009/08/02/the-5-minute-css-mobile-makeover/
• Make your mobile site friendly
  http://carsonified.com/blog/features/css/make-your-site-mobile-friendly/
• Mobile Web Design Tips and Techniques
  http://www.cameronmoll.com/archives/000577.html

Exercise 17(pdf)

When it comes to web design, footers are one of the most overlooked parts of a web site.  A site user will often not bother to scroll, but if they can’t find something a footer is one of the first places they go.  Don’t waste the opportunity or the space, create a useful footer for your site.

Example 1 |  http://socialsnack.com/

Example 2 |  http://www.starbucks.com/

Example 3 | http://seattletimes.nwsource.com/html/home/index.html

Example 4 |  http://www.cnet.com/

Resources:

Footers in Modern Web Design
http://www.smashingmagazine.com/2008/04/08/footers-in-modern-web-design-creative-examples-and-ideas/

CSS Based Footers: Modern Solutions
http://www.smashingmagazine.com/2007/01/09/css-based-footers-modern-solutions/

Informative and Useful Footers in Web Design
http://www.smashingmagazine.com/2009/06/17/informative-and-usable-footers-in-web-design/

Is your navigation killing your site traffic, confusing your user and sabotaging your goals?  Could your navigation be more effective at guiding people through your site?

Exercise 16

Lecture (pdf)

Lecture ( pdf )

Javascript.com
http://www.javascript.com/

Javascript Source
http://javascript.internet.com/

Exercise 15 ( pdf )

Dreamweaver CS4

http://www.adobe.com/products/dreamweaver/

Coffee Cup

http://www.coffeecup.com/html-editor/

BBEdit

http://barebones.com/

Crimson Editor

http://www.crimsoneditor.com/

Microsoft Expressions

http://www.microsoft.com/expression/

Not sure what to choose, check out these articles for more suggestions:

25 WYSIWYG Editors Reviewed
http://www.smashingmagazine.com/2008/05/06/25-wysiwyg-editors-reviewed/

35 Useful Source Editors Reviewed
http://www.smashingmagazine.com/2008/05/07/35-useful-source-code-editors-reviewed/

Lecture ( pdf )

Hello:

Just a reminder no class tonight, the College is closed for Veteran’s Day.

• Free images at PixMac
  http://www.pixmac.com/free-pictures
  

• Color Picker
  http://www.colorpicker.com