I revamped my curriculum and I'm still ironing out the details of how I want to do things, but I did create a TON of resources this summer to go with my materials. We also shifted to using Repl, a coding site, where students code in-browser. I can have them turn in projects through that, do bellringers, etc. It's working really well for us.
Here's a walkthrough video. I wanted to show you what it looks like and how to use with the kids. I will say that it always starts with a skeleton HTML file (with an embedded script that we delete), a script. js file (which we delete), and a blank css page. When I begin the class, I made the kids delete everything but the index file and then even all the content of the index file before we type everything in. At this point, they use the skeleton file and just make edits. But, you can drag and drop in other html files (if you drag in an index.html file, you will have to tell it to REPLACE the current one) and you can drag in image files from the computer as well.
I deliver materials (mostly just the links) in Canvas. I don't run it through modules or anything (yet, maybe eventually). But, here is a link to my bellringers file (which I add to as my kids need more practice). We do some of these whole class together to practice from the unit or they get 20 minutes to try to work on it and then we do it together. I don't grade any of them (I hand out stickers sometimes, though). We do a ton of practice, including self-graded practice quizzes I made on Google Forms.
Links:
- Coding the Web Textbook (work in progress)
- Bellringers and Class Activities Packet
Self-Grading Google Practice Quizzes (Coding the Web)--
- Lesson 1: Basics
- Lesson 2: Layout
- CTW Complete It #1 (1-2)
- CTW Complete It #2 (1-3)
- Printable Coding Practice (1-3; do on paper answer key on back)
- Lesson 3: Lists and Entity Codes
- Lesson 3-5: HTML Tags and Colors
- Lesson 4-5: Styles
- CTW Spot the Errors #1
- Lesson 6: (comprehensive): Classes
- Lesson 7: Images
- Lesson 7B (more): Images
- CTW Spot the Errors #2
- Lesson 8-9: Comments and Links
- Lesson 10-11: Layout and Tables
- CTW Complete It #3 (1-11)
- CTW Spot the Errors #3
- CTW Block or Inline?
I did do a hand-coding quiz the other day... they were relying too much on guessing on codes and not looking it up (they are allowed a notes page for quizzes AND for work... and some weren't even getting them out!). We practiced hand coding every day for a week because it was driving me nuts. But, they are doing much better now.
Anyway, this is a rambling post today... but I wanted you to know 1) we all struggle, 2) you are not alone, and 3) here's a resource that might help you. Oh, and if you managed to get this far... here are my "teacher recap" videos for my chapters, in case you need any help figuring out how to use some of the code.
Have a great weekend!
Thank you for this! I'm definitely going to try it all. I've really let the coding go in my classes and now feel as if I don't know anything. So hard to keep up when we teach so many other classes. Don't know how you do it unless you don't sleep 🙂 you are amazing!
ReplyDeleteYou are amazing, thank you for sharing all of this! I am so grateful for you, you have been supporting my classroom since I started and this is my 17th year! :)
ReplyDeleteDo you still use an html validator for Web Design? I noticed that when students create their web pages using Repl they have coding errors that don't seem to show up as errors on Repl.
ReplyDelete