Presentation is loading. Please wait.

Presentation is loading. Please wait.

CitiWiki Summer Workshop Day 3: A Wiki Framework Li Xu CS, UMass Lowell.

Published byFrederica Baker Modified over 8 years ago

Similar presentations

Presentation on theme: "CitiWiki Summer Workshop Day 3: A Wiki Framework Li Xu CS, UMass Lowell."— Presentation transcript:

1 CitiWiki Summer Workshop Day 3: A Wiki Framework Li Xu CS, UMass Lowell

2 Day 2 Reflection Q&A Project discussion later today PmWiki Alternative: www.wikispaces.com CitiWiki Workshop 2007 2

3 3 Day 3 Agenda Styling web page using CSS Wiki teaching framework End product

4 CitiWiki Workshop 2007 4 Day 3 Goals Learn to use CSS to style web page Format, layout Learn web and Wiki teaching framework Getting started with end product Use CitiWiki to prototype your project CitiWiki Workshop 2007 4

5 5 CSS Styling Style rules in CSS Selector {declaration} Example: p {color: blue; background-color: white; } XHTML file is a tree structure (tags are strictly enclosing), root is html Selector consists a path to select specific elements in HTML page

6 CitiWiki Workshop 2007 6 Cascading “Outer, upper” element’s style will be inherited by “inner, lower” element, unless specified otherwise

7 CitiWiki Workshop 2007 7 Connecting CSS to HTML Embed style in HTML header <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> My Page p {text-align:right; font-family: Arial, Helvetica, sans-serif;} li {font-weight:bold;}

8 CitiWiki Workshop 2007 8 Connecting CSS to HTML Link style sheet file to HTML Put style commands in style.css file My Page

9 CitiWiki Workshop 2007 9 CSS Beauty CSS Zen Garden http://www.csszengarden.com/ http://www.csszengarden.com/

10 CitiWiki Workshop 2007 10 CSS Exercise Using heading, p, div, list tags Embedding and linking methods CSS layout: CSSEasy.com

11 CitiWiki Workshop 2007 11 Use Web Page Software FrontPage DreamWeaver Check out W3C Standards Specification

12 CitiWiki Workshop 2007 12 Web and Wiki Teaching Framework Course web page (static) Wiki (dynamic and active learning) Student assignments, projects, resources, students Blog, feedback, discussion, collaboration Day 3 Assignment: how you will build one

13 CitiWiki Workshop 2007 13 Course Management Course activities embodies the learning process Assignments Projects Discussion, research Give students guidance Teach students good methodology, discipline and strategy Give teacher feedback and assessment instruments Team, group and class-wide collaborative learning

14 CitiWiki Workshop 2007 14 Participants and Interactions Type IV Type V Type IType II Type III Instructor Individual Student Whole Class

15 CitiWiki Workshop 2007 15 Current Practice Ad-hoc and vary widely by class and instructor “Free hand”, students on their own, use project handout as bible Milestones: specify intermediate project milestones as checkpoints Regular meetings: limited by instructor and student time commitment, generally not scalable Tools and artifact No tools, students keep their TODO lists Instructor does not have accurate info on students progress

16 CitiWiki Workshop 2007 16 What Are Missing The participants and interaction model Type IType II Type III Instructor Individual Student Whole Class Type IV Type V Only limited Type IV student-self management Non-real time Type I instructor- student interaction minimal interactive group learning Lack of tool support Lack of formal archivable artifact

17 CitiWiki Workshop 2007 17 Wiki as Solution A Wiki-based light-weight, simple, flexible, yet powerful course management framework Enable all interactions Support and Capture activities by participant Easy to use and low overhead Allow collective group learning

18 CitiWiki Workshop 2007 18 Why Wiki Web-based content management and sharing Web server runs Wiki engine Web browser as interface for content access and authoring Simple Markup to create Wiki pages Open, low overhead, flexible online sharing and collaboration

19 CitiWiki Workshop 2007 19 The Wiki Framework Use Wiki for course management Build a shared Wiki site Both instructor and students create and access pages Instructor create Wiki page to supplement course materials, post general announcements, guide students, give general help Students create Wiki page for homework and project planning and implementation: Wiki log is part of the project Group or class common pages for collective learning Course activities captured and shared through Wiki pages

20 CitiWiki Workshop 2007 20 Multi-dimensional Interaction Through Wiki Type IV Type V Type IType II Type III Instructor Individual Student Whole Class W W W W

21 CitiWiki Workshop 2007 21 Wiki Structure Class announcements: section created by instructor, class-wide project announcements and info Common corner: both instructor and students can create and modify pages, serves as shared knowledge MyWiki: student project wiki, organized by students name, the centerpiece of teaching Wiki Wiki Help: Wiki online documentation for handy reference

22 CitiWiki Workshop 2007 22 User Access Control Fine-grained user access control Users use login name/password to use Wiki Instructor as super user, set site structure, create read-only pages, write student pages Students have sole write control of their own pages, but others can view Common pages shared by all

23 CitiWiki Workshop 2007 23 Activities Enabled MyWiki: focal point of student project Required and graded for project Wiki page reports detailed info on all phases of project: planning and execution “Harry Portter” as virtual student template TODO Class blog Immediate results Questions and Issues to resolve

24 CitiWiki Workshop 2007 24 Activities Enabled MyWiki page as self-guide and introduce discipline in learning process Capture real-time snap shot of whole class Precise assessment, targeted feedback and support Peer learning and group learning: Wiki pages are open and shared

25 CitiWiki Workshop 2007 25 Teaching Practice Use Wiki in a compiler class PmWiki Set up during one afternoon Four project sequence to build a simple compiler for an embedded robot controller Require students to use Wiki extensively in their implementation: write Wiki notes on daily basis

26 CitiWiki Workshop 2007 26 Wiki Setup Each student get assigned account and own MyWiki section Use “Harry Portter” as sample page to illustrate requirements Use Project blog to gather info on class status and identify problems

27 CitiWiki Workshop 2007 27 Collective Learning Common corners to share know-hows and project tips Survey how error handling can be done with the given compiler tools

28 CitiWiki Workshop 2007 28 A Look at the Generic Framework

29 CitiWiki Workshop 2007 29 Questions: Using Wiki at your site What is your project plan? How is your educational objective can be solved by Wiki? What is your hypothesis related to this activity? How do you plan to assess your project?

30 CitiWiki Workshop 2007 30 Review of End Product Guidelines Part I Due August 15, 2007 Written description of your project Your framework Wiki page on CitiWiki

31 CitiWiki Workshop 2007 31 Section A Description How you will use web and Wiki in your project Compare with other possibilities Statement of Expected Outcomes

32 CitiWiki Workshop 2007 32 Section B The Course Profile The Student Profile Relate to selection of project. Relate to hypothesis. Relate to teaching philosophy. Relate to factors that affect teaching and learning.

33 CitiWiki Workshop 2007 33 Section C Develop a Plan Timeline Materials needed for development Support or training needed Technical resources needed Preparation of handouts

34 CitiWiki Workshop 2007 34 Section D Measure the student performance. Link the appropriate assessment to the teaching activity. Collect student feedback. Share outcome with students. Describe plan for addressing poor student performance.

35 CitiWiki Workshop 2007 35 Appendix Surveys Handouts Collected student feedback Guidelines Rubrics Bibliography

36 CitiWiki Workshop 2007 36 October, 2007 Collegial Review/Demo Seminar

37 CitiWiki Workshop 2007 37 End Product Part II October 15, 2007 Combined Part I and II

38 CitiWiki Workshop 2007 38 Section E Narrative summary of findings Reflections Plans for future

39 CitiWiki Workshop 2007 39 Appendix All teaching materials related to this section Tools for assessment Bibliography

40 CitiWiki Workshop 2007 40 End Product Reminders Evaluation

41 CitiWiki Workshop 2007 41 More Questions to Consider? Does use of web and Wiki enhancement assist students in meeting particular learning objectives? If yes, is this an effective approach to teaching this content? Will it add to the student learning experience? Is this assignment/task at a skill-appropriate level for students? What's involved in the development of the web enhancement? (time, hardware/software, training) And many others…

42 CitiWiki Workshop 2007 42 End Product Part 1 – Aug. 15 Planning Component A. Statement of Wiki-Enhanced Teaching Activity B. Course/Student Profile C. Plan for Implementation Timeline Teaching Activity & Prep Required Resources D. Plan for Assessment/Feedback Appendix

43 CitiWiki Workshop 2007 43 End Product – Oct 15, 2007 Complete Project in Final Form Sections A,B,C,D E. Findings & Reflections F. Appendix

44 Discussion CitiWiki Workshop 2007 44

45 Day 3 Assignment Project outline and description on your Wiki blog Create a separate page for your project Prefix with your first name and last name CitiWiki Workshop 2007 45

Download ppt "CitiWiki Summer Workshop Day 3: A Wiki Framework Li Xu CS, UMass Lowell."

Similar presentations

Objective 107.02 Understand web-based digital media production methods, software, and hardware. Course Weight : 10%

Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
HCI 201 Week 6 Client Side Image Maps Introduction to CSS.

HCI 201 Week 6 Client Side Image Maps Introduction to CSS.
Outline IS400: Development of Business Applications on the Internet Fall 2004 Instructor: Dr. Boris Jukic CSS: Cascading Style Sheets.

Outline IS400: Development of Business Applications on the Internet Fall 2004 Instructor: Dr. Boris Jukic CSS: Cascading Style Sheets.
XP 1 Working with Cascading Style Sheets Creating a Style for Online Scrapbooks Tutorial 7.

XP 1 Working with Cascading Style Sheets Creating a Style for Online Scrapbooks Tutorial 7.
Working with Cascading Style Sheets. 2 Objectives Introducing Cascading Style Sheets Using Inline Styles Using Embedded Styles Using an External Style.

Working with Cascading Style Sheets. 2 Objectives Introducing Cascading Style Sheets Using Inline Styles Using Embedded Styles Using an External Style.
Tutorial 3: Adding and Formatting Text. 2 Objectives Session 3.1 Type text into a page Copy text from a document and paste it into a page Check for spelling.

Tutorial 3: Adding and Formatting Text. 2 Objectives Session 3.1 Type text into a page Copy text from a document and paste it into a page Check for spelling.
Microsoft ® Expression ® Web An Introduction to the Your Learning Guide to Expression Web tutorial.

Microsoft ® Expression ® Web An Introduction to the Your Learning Guide to Expression Web tutorial.
Chapter 11 Cascading Style Sheets: Part I The Web Warrior Guide to Web Design Technologies.

Chapter 11 Cascading Style Sheets: Part I The Web Warrior Guide to Web Design Technologies.
Cascading Style Sheets Part 1 Library and Information Services, University of St Andrews.

Cascading Style Sheets Part 1 Library and Information Services, University of St Andrews.
XP Tutorial 7New Perspectives on Creating Web Pages with HTML, XHTML, and XML 1 Working with Cascading Style Sheets Creating a Style for Online Scrapbooks.

XP Tutorial 7New Perspectives on Creating Web Pages with HTML, XHTML, and XML 1 Working with Cascading Style Sheets Creating a Style for Online Scrapbooks.
Creating a Basic Web Page

Creating a Basic Web Page
HTML & CSS.

HTML & CSS.
Using Styles and Style Sheets for Design

Using Styles and Style Sheets for Design
Cascading Style Sheets CSS.  Standard defined by the W3C  CSS1 (released 1996) 50 properties  CSS2 (released 1998) 150 properties (positioning)  CSS3.

Cascading Style Sheets CSS.  Standard defined by the W3C  CSS1 (released 1996) 50 properties  CSS2 (released 1998) 150 properties (positioning)  CSS3.
NetTech Solutions Working with Web Elements Lesson 6.

NetTech Solutions Working with Web Elements Lesson 6.
IT 117 - Introduction to Website Development Welcome!

IT Introduction to Website Development Welcome!
Learning Web Design: Chapter 4. HTML  Hypertext Markup Language (HTML)  Uses tags to tell the browser the start and end of a certain kind of formatting.

Learning Web Design: Chapter 4. HTML  Hypertext Markup Language (HTML)  Uses tags to tell the browser the start and end of a certain kind of formatting.
1 WDMD 170 – UW Stevens Point WDMD 170 Internet Languages eLesson: CSS Introduction to Style Sheets (NON-audio version) © Dr. David C. Gibbs 2003-04.

1 WDMD 170 – UW Stevens Point WDMD 170 Internet Languages eLesson: CSS Introduction to Style Sheets (NON-audio version) © Dr. David C. Gibbs
PUBLISHING ONLINE Chapter 2. Overview Blogs and wikis are two Web 2.0 tools that allow users to publish content online Blogs function as online journals.

PUBLISHING ONLINE Chapter 2. Overview Blogs and wikis are two Web 2.0 tools that allow users to publish content online Blogs function as online journals.
Cascading Style Sheets Tom Osman. Keep the content of a webpage separate from the formatting of the page. Structure (of content)  Headings  Sub headings.

Cascading Style Sheets Tom Osman. Keep the content of a webpage separate from the formatting of the page. Structure (of content)  Headings  Sub headings.

Similar presentations

Ads by Google