User:Vtaylor/CIS 89A HTML and CSS

CIS89A Syllabus, /CIS89A Resources/, /CIS89A - Student suggestions/ .. /Welcome to CIS89A/, CIS89A welcome email
 * 1) Getting started - i,1. intro, source, webmaker goggles
 * 2)  HTML basics - 2-3. pln, community,  interesting people, thimble ** find
 * 3) Text : A few words - 4-6. accessibility, privacy, writing for the web, pinterest ** make
 * 4) Links : From here to there - 7. blogs ** share
 * 5) Images : Picture this - 8. creative commons, open free editing applications
 * 6) Multimedia : Sound, light & magic 9. * use
 * 7) Lists : To the point - 10. prezi
 * 8) Tables : Rows and columns 11. safety, scams, javascript, hour of code * protect
 * 9) Forms : Data collection - 12-14. google docs forms * solve
 * 10)  A homepage of your own - 15-16.
 * 11)  Individual Project - one page, site outline
 * 12)  Peer Review - rubrics, self assessment, peer review, goodbye ?? Wed


 * https://thimble.webmaker.org/en-US - Thimble test CSS practice - internal
 * for external CSS stylesheet file - will need to be hosted as https & .css
 * https://wiki.mozilla.org/Webmaker/WebLiteracyMap

CIS89A HTML and CSS Web Page Development

 * HTML - in the beginning, Tim Berners-Lee, WorldWide Web Consortium, history
 * CSS - beyond academic publishing, "brand" website
 * Web Literacy Standard - Mozilla Learn project
 * technologies - consume, create, collaborate
 * Webmaker - remix, make, share
 * cis89a.makes.org - remixes for CIS 89A
 * Choose your own adventure - personal objectives, quizzes to help you decide, map

Building activities / projects - suggestions - weekly report
 * Starters - easier, fun - overview, introduction to Web Literacies
 * Basics - skill building - all Web Literacies competencies
 * Challenges - stretch, more difficult - in depth on one or more Web Literacies
 * Projects - individual, collaboration - activities, teaching kits - based on skill or competency in Web Literacies - #tags

HTML and CSS - Visual Quickstart - textbook

== notes, resources==
 * Ira - http://validator.w3.org/ Wendy Willard text,

HTML Beginner Tutorial assumes that you have absolutely no previous knowledge of HTML or CSS. HTML Intermediate Tutorial
 * Getting Started: What you need to do to get going and make your first HTML page.
 * Tags, Attributes and Elements: The stuff that makes up HTML.
 * Page Titles: Titles. For Pages. A difficult concept, we know…
 * Paragraphs: Structuring your content with paragraphs.
 * Headings: The six levels of headings.
 * Lists: How to define ordered and unordered lists.
 * Links: How to makes links to other pages, and elsewhere.
 * Images: Adding something a bit more than text…
 * Tables: How to use tabular data.
 * Forms: Text boxes and other user-input thingamajigs.
 * Putting It All Together: Taking all of the above stuff and shoving it together. Sort of in a recap groove.


 * CSS Beginner Tutorial - purpose of this guide is to teach the bare essentials - just enough to get started. The CSS Intermediate Tutorial and CSS Advanced Tutorial go into more depth about CSS.


 * Web Writing Style Guide Version 1.0 - open online textbook - Creating a Basic Web Page Is Easy! Time to Style Your Document with CSS. Learning More About Code


 * Cascading Style Sheets (CSS) is a powerful tool that transforms the presentation of a document or a collection of documents, and it’s spread to nearly every corner of the Web—as well as many non-web environments. In this free introduction to Cascade Style Sheets, you’ll learn how CSS makes it possible for you to completely change the way document elements are presented by a user agent. You’ll discover the origins of this specification and how CSS styles work with HTML.


 * https://wiki.mozilla.org/Learning/WebLiteracyStandard
 * https://webmaker.org/en-US/tools - web creation tools - googles, thimble, popcorn - Mozilla, projects https://webmaker.org/. support http://support.mozilla.org/en-US/products/webmaker/thimble - Using this kit, learners will create a fun webpage for their 'alter ego'. The will use the webmaking tool Thimble to code basic HTML and the following CSS properties: positioning values, hex numbers/color, fonts/sizes, class, div.
 * teaching kits - introduce, explain, explore https://vtaylor.makes.org/thimble/evil-twin-the-opposite-of-me
 * mentors - http://support.mozilla.org/en-US/products/webmaker/events-and-help-for-mentors
 * html cheatsheet https://mozteach.makes.org/thimble/html-cheatsheet >>> https://developer.mozilla.org/en-US/docs/Web/HTML/Element
 * CSS cheatsheet https://mozteach.makes.org/thimble/css-cheatsheet >>> https://developer.mozilla.org/en-US/learn/css

HTML HyperText Markup Language (HTML) is the core language of nearly all Web content. Most of what you see on screen in your browser is described, fundamentally, using HTML. More precisely, HTML is the language that describes the structure and the semantic content of a Web document. Content within a Web page is tagged with HTML elements such as, , and so forth. https://developer.mozilla.org/en-US/docs/Web/HTML
 * https://developer.mozilla.org/en-US/docs/Web/HTML/Element

CSS (Cascading Style Sheets) is a language for describing the appearance of web pages. To create good-looking web pages, you need to learn CSS in order to define the appearance and location of the HTML elements within the pages. https://developer.mozilla.org/en-US/learn/css


 * https://tbx.makes.org/thimble/maker-party-your-first-hack-pt-2
 * https://mozteach.makes.org/thimble/xray-goggles-teaching-kit
 * https://dougwalters.makes.org/thimble/sycsd-adult-education-webmaking
 * https://mozteach.makes.org/thimble/ways-of-the-web-teaching-kit
 * https://mozteach.makes.org/popcorn/1boj
 * https://thimble.webmaker.org/project/10274/remix
 * https://mozteach.makes.org/thimble/make-your-own-teaching-kit

== maker map== cis89a.makes.org - remixes for CIS 89A - teaching kit > learning activities - Evil Twin

https://webmaker.makes.org, Teaching kit ? remix > learning


 * Web Literacies - Exploring, Building, Connecting - weekly discussions - competency from each strand
 * Textbook - discussions - HTML topics 1-7, 15-18. CSS, JavaScript
 * Building - Consumer - general knowledge, Builder - regular user, Advanced - power user


 * images - Creative Commons, Flickr - CC-BY-SA

Activities / projects - suggestions - choose your own adventure - weekly report
 * Starters - easier, fun - overview, introduction to Web Literacies
 * Basics - skill building - all Web Literacies competencies
 * Challenges - stretch, more difficult - in depth on one or more Web Literacies

Projects - individual, collaboration
 * activities, teaching kits - based on skill or competency in Web Literacies - #tags

== outline==
 * sequence provided, due dates for assignments/discussion, work ahead and/or more depth
 * consume (12), create (9), collaborate (3)
 * curate, reflect, contribute

personalization
 * what you know
 * what you want to know
 * plan, options > groups
 * students answer student questions

build your own adventure - placement/assessment - self, quiz
 * new here - basic concepts, functionality - required
 * some experience - beyond current level - select one or more areas of interest/focus
 * challenge - depth, breadth, extension

??
 * scoring - focus, interest, depth, exploration

topic
 * I know
 * consume - site, review, highlight, question, discuss
 * create - demonstrate, learning narrative, peer review
 * collaborate - problem, work breakdown, solution
 * thinking thing - sharing, questions, news, funny
 * I wonder - reflection, want to know...

Technologies
 * consume - search, RSS, Twitter
 * create - presentation, share, publish - blog, Prezi, Pinterest, Flickr
 * collaborate - Wikia, Wikispaces

= template=


 * Introduction

Learning outcomes

Keywords

Study notes
 * What

== ==

== Assignments==


 * 1) I know
 * 2) consume - site, review, highlight, question, discuss
 * 3) create - demonstrate, learning narrative, peer review
 * 4) collaborate - problem, work breakdown, solution
 * 5) thinking thing - sharing, questions, news, funny
 * 6) I wonder - reflection, want to know...


 * Web Literacies - Exploring, Building, Connecting - weekly discussions - competency from each strand
 * Textbook - discussions - HTML topics 1-7, 15-18. CSS, JavaScript
 * Building - Consumer - general knowledge, Builder - regular user, Advanced - power user

Building / create - Activities / projects - suggestions - choose your own adventure - weekly report
 * Starters - easier, fun - overview, introduction to Web Literacies
 * Basics - skill building - all Web Literacies competencies
 * Challenges - stretch, more difficult - in depth on one or more Web Literacies