Tasc workshop presentation
- 2. Learn HTML and CSS Learn more about STEM Remix websites from the web GOALS
- 3. Science Technology Engineering Math GOALS
- 4. PARTICIPANTS MOUSE TASC HACKASAURUS/ HIVE (introducHon from Omar and Youssef) hKp://hackasaurus.org/en-‐US/ INTRODUCTIONS
- 5. What is meant by the term hack? Why is learning about the web and hacking important? What exactly is a hack jam? Who created Hackasaurus? What happens when hack jam parHcipants publish their hacked webpages online? What is HTML and CSS? QuesHons
- 6. Hack 1. To cut or chop with repeated and irregular blows 2. To break up the surface of (soil). 3. To alter (a computer program): hacked her text editor to read HTML. 4. To gain access to (a computer file or network) illegally or without authorizaHon: hacked the firm's personnel database. DefiniHon from The Free DicHonary: hKp://www.thefreedicHonary.com/hacking
- 7. Hack a dance move!
- 8. ELEMENTS: I can <em> hear</em> you! ATTRIBUTE: <a href=“hAp://wikipedia.org”>Wikipedia</a> is cool. NO CLOSING TAG: <img src=“hAp://seriouscat.com/serious_cat_is_serious.jpg”> NESTING: a href=“hAp://en.wikipedia.org/wiki/Lolcat”> <img src=”hAp://seriouscat.com/serious_cat_is_serious.jpg”> </a> FULL LIST HERE: hKps://developer.mozilla.org/en/HTML/Element HTML
- 9. STYLE ATTRIBUTE: I can <em style=“color: red”>hear</em> you! SEMICOLONS: I can <em style=“color: red; background: pink”>hear</em> you! hKps://developer.mozilla.org/en/CSS_Reference CHEAT SHEET CSS
- 10. Macintosh: Copy: Command + C Paste: Command + V PC: Copy: CTRL + C Paste: CTRL + V Copy & Paste
- 11. <img width="150" height="150" src="hKp://www.progeKodiogene.eu/DEV/wp-‐ content/uploads/2011/02/tram04-‐150x150.jpg" class="aKachment-‐thumbnail" alt="Tram ProgeKo Diogene" Htle="Tram ProgeKo Diogene" style="opacity: 1; "> Images: jpg, png, gif
- 12. Install hKp://hackasaurus.org/en-‐US/goggles/ Cheat sheets Demonstrate Before: hKp://www.prospectpark.org/environment/wildlife Amer: hKp://poof.hksr.us/pxlixgzq X-‐RAY GOGGLES
- 13. 1. Choose a STEM based website 2. Use goggles to examine html content on page 3. Edit content on page in whatever way you want 4. Publish your new website! HACK A WEBSITE
- 15. hKp://www.prospectpark.org/environment/wildlife hKp://www.ptable.com/ BIODIVERSITY CHEMISTRY hKp://www.space.com/ OUTER SPACE hKp://antoine.frostburg.edu/chem/senese/101/index.shtml
- 16. Share Discussion Badges SHARING