How to Promote Your School Program:

Via Web Development

by John Kuzmich, Jr.

Assisted by Paul Lukasiewicz


June 13-16, 2011

Western State College

 

Clinic handout: http://www.kuzmich.com/webdevelopment5.html and http://www.kuzmich.com/Web_Tips.html

 


Courseware Description

 

The syllabus will be mainly supplemental information and the Arnie Abrams textbook, Learn Adobe Dreamweaver CS3 in a Day, is fundamental to the instruction by providing step-by-step procedures along with the data CD for structure and objectivity in making the instruction successful in a three-day workshop. The secret of the courseware is how HTML skills can interlace with blogging techniques in jump starting ones web development skills as a novice. Everything else in the courseware syllabus can be added upon but the fundamentals will provide the foundation in making this workshop an exciting adventure. As you progress from HTML skills to a blogging platform and explore some of the many whistle and bell features beyond the fundamentals as outlined in the next table below. Please be patient with yourself as you fist learn the basics which is more important than learning advanced concepts first. The syllabus and its vast resources will guide you long after the workshop is completed. Fasten your seat belts and together, let's begin the journey of web development..

 

Software/Hardware Resources Available for the Workshop

 

Dreamweaver CS3 and CS4 for creating .HTML files Blogger.Com or Tumblr.Com for creating Blogs
PhotoShop CS3 or Picassa for photo editing Camtasia Studio verison 7 for photo editing

 

SnagIt version 10 for making screen captures

Audacity version 1.2.6 for making audio podcasts
Mixcraft 5 for making multimedia podcasts Feed Me for creating XML or RSS feeds for podcasts
Microsoft 2010 for making .PDF files PowerPoint for making .PDF files of PowerPoint Slideshows
Digital camera for making digital photos Camcorer for maing video clips
Five digital recorders for making audio recordings Extra headsets including some with microphones
Scanning documents and photos. Click here for free multimedia applications

 

FTP Client Server Account in one or three choices:

Textbook(s)

 

How to Use Dreamweaver 8 and Fireworks 8 by Lon Coley, Jennifer Fulton and Scott M. Fulton, published by SAMS, 2006. 291 pages. ISBN 9-672-32750-3. Amazing full-color screen dumps with detailed instrictuion for every step. A must book for educators for learning the more sophisticated features of Dreamweaver.. Amazing full-color screen dumps with detailed instrictuion for every step. A must book for educators.

 

Learn Adobe Dreamweaver CS3 in a Day, by Arnie Abrams. Free copy provided by the instructor that contains a data disk correlated lessons on learning the editing features of Dreamweaver.

 

Web Design Class Schedule

 

For a thumbnail of the instructional activities in this three-day workshop, go to:http://www.kuzmich.com/Web_Design_Class.html

 

Available Fundamental Module Instruction for Web Development Workshop Syllabus

 

HTML coding in NotePad, Word and Dreamweaver GUI in Dreamweaver
Creating links and maybe some anchors if the class is advanced. Page formatting and using SnagIt for screen dumps for obtain artwork
Working and embedding images, audio and video Creating tables for layout purposes

Blogging techniques:  I'll get my daughter to design a curriculum. For a quick introduction to tricks on blogging, view a video of me interviewing her at: http://www.kuzmich.com/Blogging Reva/2011-06-01 20.46 New meeting.wmv

 

For a series of video tutorials on blogging techniques with Blogger.Com, peruse the ones below:

Uploading/posting projects with Dreamweaver since it has an FTP client built in.  Best free FTP client servers for both PC and Mac platforms are Filezilla and Cyberduck.
Audio with Audacity since I already have it being installed and I have good tutorial for doing a bare bones podcast without multimedia.  Go to:  http://www.kuzmich.com/podcasting/Podcasting Web Site.html
Video editing with Camtasia Studio

Podcasting creation can be in Apple's GarageBand, Audacity and Mixcraft. Best free on-line service is Podamatic.  Best video tutorial for Mixcraft 5 is http://www.acoustica.com/mixcraft/v5/help/video-tutorials.htm. Mixcraft is the primo PC multimedia product and GarageBand is for Mac in that both products can collaborate podcasts with digital photos, videos and web pages along with loops. Note: the videos need to be done outside of Mixcraft and GarageBand and then imported into them for the collaboration file comprising a podcast. To create an RSS or XML file for streaming the podcast over the Internet, there are several programs recommended. For PC, Feed Editor is the whistles & bell one from several others at Extralabs.com. On the Internet, http://www.podcastblaster.com/podcast-feed/ (free!! web based feed editor) and Podcast Assistant is free from Apple. Audacity is great for audio podcasts and it is free for both Mac and PC platforms. For a step-by-step tutorial for Audacity in developing audio podcasts, click here.

PodOmatic | Best Free Podcasts

Best mixes on planet Earth. DJs, radio, performing artists, educators, and more. Get a free podcast, share your faves. Only on PodOmatic.
www.tumblr.com is the most multimedia savvy blog out there but not as user-friendly.  I do have a blogging example at the end of the e-mail madein Tumblr.com.  You can store up to a 10 MB audio file free on their website daily!!!! YouTube since it is the best place to upload videos for free and also to easily embed the YouTube video on ones web site or blog.
.PDF files can be created effortlessly in Microsoft Word 2007 & beyond and posted to web sites without formatting problems. Which can save you much time and effort when HTML files don't view properly on the Internet. And maintain the original links. Adobe Acrobat in module 26 for other products that can create and edit Adobe PDF files. Create screen captures easily with SnagIt. Skitch is another free program for Mac that allows you to take snapshots of computer screens and mark them up with arrows, etc for demonstrating for others.
   
   

 

Alpha Topic Resouce Index To Supplement Web Development Workshop Syllabus


 

 

 

Adobe Acrobat in module 26

Animated GIFS and Music Clip Art in module 5

Audio streaming in module 24 and 30


Browser special effects in module 27

Calendars for HTML in module 5 Color tutorials in module 14

Digital audio recording in module 22


Discounted academic pricing in module 31

Dreamweaver tutorials in module 7 and 13 Emails (weekly) to parents in module 1
Fancy backgrounds in module 5 and 14 Forms in module 7
FTP software in module 3 and 12 GIF Animators in module 26
Grades on-line for students 24/7 in module 1 and 5 HTML basics: tags in module 3 and 5
Interactive school music web sites on module 1 Links (hyperlinks) in module 5

MIDI files (free) in module 23


National Teaching Standards in module 7

Sea Breeze and Page Breeze tutorial in module 7 and 9

Parent-Teacher-Student conferences on-line in module 1

Photo restoration/editing in module 16 and 26 Photos (posting to Web) in module 27
PowerPoint tutorials in module 29

Required reading of 10 web development articles on page 1

Review of literature for model public school music web sites in module 1, 19, 20 and 21 Scanning (OCR and music) in module 16
Table tutorials in module 7 Video streaming in module 25
Web designing in module 4 Web basics in module 1 and 23
Web hosting (free) in addendum first page Web publishers of books in last page of addendum
Workshop Reference Books on page 1

Podcasting with Audacity at http://www.kuzmich.com/podcasting/Podcasting Web Site.html

and with Mixcraft at: http://www.kuzmich.com/podcasting/podcasting resources.html

Blogging Video Tutorial materials: http://www.kuzmich.com/YouTube Blogging Tutorials.html  
   

 

Latest Topic Updates

Audio Recording Cleaning Audio Tools for Mus ic Educators:Noise Cleaning & Audio Enhancements Tools
Blogging for Music Educatos with information on Podcasting and YouTube.Com

 

CSS (Cascading Style Sheet) for HTML in module 7

Copyright Internet Licensing Information Frameset in module 7 How To Use Dreamweaver MX & Fireworks MX by Lon Coley (Que). Fantastic tutorial on forms: pages 60 to 67.
HTML Validators in modeul 5 and they are free! Multimedia Tricks and Effects (Free) Must peruse: Dynamic Multimedia Instruction
PHP, CGI Scripting, JavaScript and Rollover Effects for dynamic web pages Podcasting: Parts One and Two
Podcasting (entry-level clinic with Audacity) Posting Your Music on the Web: Three Easy Steps
Quizzes, Tests Social-Networks
Virtual Education Web publishers of books in last page of addendum
YouTube Word Fill: Lorem Ipsum text generator
www.whotune.com - a multimedia explosion for music educators for teaching and promoting your music program over the Internel. Click here.  

Workshop Handouts: http://www.kuzmich.com/Web_Development_Workshop_Handouts.html

Optional-Required Reading:

  1. May 2011
    Interactive Blogging and Social-Networking, pages 48 to 53
  2. January 2011
    Starting the New Year with YouTube
  3. February 2010: Today's K-12 Virtual Instruction
  4. July 2010: Dynamic Multimedia Instruction

  5. April 2010: Three Tech Winners for Music Ed

  6. March 2010: Audio Tools for Music Educators: Noise Cleaning & Audio Enhancements

  7. December 2009: The Magic of Hand-Held Digital Recorders
  8. April, 2009: Teaching In A Changing Profession
  9. March, 2009: Creativity, Teamwork, and The Vermont MIDI Composition Project
  10. December, 2008
    Three Easy Steps to Posting Your Music on the Web
  11. November, 2007 Working But Not On SBO Web Site:" The Radio Hour: Inside Steven Chetcuti's Innovative Instruction
  12. October, 2007 Jazz Education For All Students: The Radio Hour for Developing. Great resource for interactive web pages dealing with instruction on-line and assessments: http://www.iaje.org/article.asp?ArticleID=287
  13. March, 2006: Shortcuts: Time is a Barometer for Success, Part Two of Four with Scores on the web: click here.
  14. December, 2006
    Tools to Get You Podcasting, Part 2

    November, 2006
    Podcasting for Music Educators, Part 1
    or http://www.kuzmich.com/articles/img114.pdf for the complete article

  15. AUGUST 2006: Web Development for Music Educators, Part IV of a four-part series. This article is a definitive resource for interactive crossword puzzles, word search puzzles, call charts, test makers and Flash card builders/animators. If time permits, this area will be very interesting to study and peruse at: Click here.
  16. JULY 2006: Web Development for Music Educators, Part III of a four-part series: Covers audio/video streaming and on-line databases. Click here.
  17. JUNE 2006: Web Development for Music Educators, Part II of a four-part series: click here.
  18. MAY 2006 :Web Development for Music Educators, Part 1 of a four-part series: click here.
  19. JULY 2003 : Guide to Graphic Editor Software Applications: click here.
  20. JUNE 2002: http://www.kuzmich.com/SBOTravel.pdf Traveling Remote Web Sites
  21. SEPTEMBER 2001: Web Pages More User-Friendly
  22. DECEMBER 2000: http://www.kuzmich.com/VideostreamDecember2000.htm Video Streaming Step-By-Step Instructions
  23. OCTOBER 2000: http://www.sbomagazine.com/7627/archives/october-2000/why-is-mp3-so-important-for-music/ MP3 for Music Educators
  24. JUNE 2000:http://www.kuzmich.com/articles/img108.pdf Building Exciting Web Pages, Part 2!
  25. JANUARY 2000: http://www.kuzmich.com/articles/img107.pdf Building Your Own Website

Workshop Reference Books:

  1. How to Use Dreamweaver 8 and Fireworks 8 by Lon Coley, Jennifer Fulton and Scott M. Fulton, published by SAMS, 2006. 291 pages. ISBN 9-672-32750-3. Amazing full-color screen dumps with detailed instrictuion for every step. A must book for educators.How to Use Dreamweaver MX & Fireworks MX by Lon Coley, published by QUE, 2003. 396 pp. ISBN 0-7897-2725-0. Amazing full-color screen dumps with detailed instrictuion for every step. A must book for educators.
  2. Learn Adobe Drteamweaver CS3 in a Day by Arnie Abrams, published by Visions Technology in Education. 2008. 89 pages. ISBN 978-1-58912-761-6
  3. HTML and XHTML Interactive Movie Tutorials by Scott McLeod and Patrick Carey, published by Thomson Course Technology., IBNS #1-4188-3938-8. Videos are 3.5 hours
  4. HTML and XHTML by Patrick CArey, published by Thomson Course Technology, ISBN #0-619-26747-X
  5. How to USE HTML and XHTML by Gary Rebholz, published by Sams, ISBN #0-672-32031-2. The complete step-by-step solutions with color screen dumps with instructions for every stelp!
  6. Dreamweaver: The Missing Manul by David Sawyer McFarland, published by O'Reilly, SBN #0-596-10056-6. The book that should have been in the box with 140 pages of hands-on tutorials.
  7. Macromedia Dreamweaver 8 in 24 Hours by Betsy Bruce, published by Sams. ISBN # 0-672-32753-8. 24 lessons of one hour or less with step-by-step instructions, quzzes and exercises at the end of each chapter and notes and tips pointing out shortcuts and solutions.
  8. Absolute Beginner's Guide to Podcasting by George Colombo & Curtis Franklin, Jr., published by Que, ISBN # 0-7897-3455-9. Makes podcasting simple and easy to do and in no time!
  9. Podcast Solutions by Michael W. Geoghegan and Dan Klass, published by Friendso. ISBN # 1-59059-554-8.. The complete guide to podcasting which includes a CD with all software needed to start podcasting.
  10. KidCast by DAn Schmit, published by FTC Publishing. Written for teachers. Provides solid strategis and project ideas for using podcastint o support your curriculum.
  11. Podcast Factory published by M-Audio. Provides professional audio interface, software included and bradcast quality microphone. A complete professional podcasting package for producing podcasting.
  12. GarageBand Mechanics by Dan Schmit, published by FTC Publishing. 3rd edition includes a section on podcasting. Book focuses in on lesson plans on recording arts and cpomposition activities for the classroom teacher.
  13. The Teacher's Guide to Music, Media, and Copyright Law by James Frankel, published by Hal Leonard Corp in Bluemond, Wisconsin, 2009. 258 pp.
  14. YouTube in Music Education by Thomas Rudolph and James Frankel, published by Hal Leonard Corp in Bluemond, Wisconsin., 2009. 241 pp.
  15. YouTube for Dummies by Doug Sahlin and Chris Botello, published by Wiley Publishing in Hobeken, New Jersey, 2007. 386 pp.

On-Line Tutorials:

  1. XHTML at:  http://www.w3schools.com/xhtml/default.asp
  2. Cascading Style Sheets at:  http://www.w3schools.com/css/default.asp
  3. Cascading Style Sheet Tutorials: http://www.westciv.com/style_master/academy/hands_on_tutorial/index.html. Style Master is a CSS editor which includes full support for hand-coding. It's a great way to start learning CSS: hand code when it suits, and fall back on the WYSIWYG editors when you're working with new properties and selectors. This tutorial is included as part of the 30 day demo download. There are 13 CSS tutorials on-line that you can use as well.

Instructional Software:

  1. The software for making the web pages will be Dreamweaver by Adobe.  Suggest you have either versions 7 or 8 or the latest one.  You can also download the latest version, full version for free for 30 days.  I can get you special educator prices for $98 (list price is $399.00).  Just go to:  http://www.adobe.com/products/dreamweaver/ to learn more about it and then download it for free for 30 days at:  https://www.adobe.com/cfusion/tdrc/index.cfm?product=dreamweaver. It does it all:  HTML, XHTML, CSS and much more.

  2. Where to purchase Dreamweaver with an significant edutor pricing:

 

Module # and Approximate Times for Each Module: Topics for Each Module


20 minutes

Registration and Introductions: as well as overview of the courseware Available modeles of instructions. Click here.

Module #1.

 

30 minutes

Welcome to Web Development and how it may make a difference on your teaching and relationships with students, faculty, administrators, parents and community..

Summary of Final Assessment:

Creation of a series of projects producing a web site with at least 3 or 4 linked web sites designed for each teacher. 

 

Component ingredients for the final project assessment will contain ten of the following structural ingredients below:

Four or more web pages all linked together with content pertinent to each teacher that can be implemented in each enrollee’s present curriculum.             

  1.      Master Web Site Title        
  2.      Creating Calendar              
  3.      Posting Musical examples (audio, music score, etc.    
  4.      Posting Photos     
  5.      Posting Videos     
  6.      Links for instructional web sites      
  7.      Curriculum highlights         
  8.      Music Games      
  9.      Class News           
  10.   Teaching Schedule             
  11.   Need Volunteers 
  12.   How To Contact 
  13.   Moving Banner   
  14.   Forms    
  15.   Curriculum Handbook      
  16.   Musical Web Site Links     
  17.   Programs              

Examples of Previous Web Site Projects Exhibiting Many Pertinent Characteristics Beneficial for Educators.

  1. http://www.kuzmich2.com/Laura/index.html    
  2. http://www.kuzmich2.com/Kristin/kodiakkristin4.htm              
  3. http://www.kuzmich2.com/Pam/Home4.htm 
  4. http://www.kuzmich2.com/Jesse/bandpage.htm         
  5. http://www.kuzmich2.com/Leona/Dreamweaver%20Projects/RAS%20Music.htm           
  6. http://www.kuzmich2.com/Marlene/marlene1.htm    
  7. http://www.kuzmich.com/roslyn/welcome.html 
  8. http://kellerskids.com/
  9. Willie Wright has been quite active in developing his web site for his brand-new position in Worlund, Wyoming.  Hopefully, it will quickly get the attention of his administration, band parents and students at http://www.mrwright.worlandband.com/ which was done in the WordPress. blog.
  10. Sean Downing amazed quite a collection of cigar-box string instruments that he has made creatively posted at:  https://sites.google.com/a/pagosa.k12.co.us/stovewood-smokin--cigar-box-instruments/
  11. Our website is www.3xMGrinding.com. This website wouldn't exist without you!

Sample Web Pages, Podcasting and Blogging Sites by John Kuzmich, Jr.

  1. Web: http://www.kuzmich.com/ti-me/TimeEBlast3.html
  2. Web:  http://www.kuzmich.com/clinics.html
  3. Web:  http://www.kuzmich.com/articles.html
  4. Blogging:  http://www.kuzmichmediablog.tumblr.com
  5. Blogging: http://kuzmichgenealogy.blogspot.com
  6. Blogging: http://goldenemployment.blogspot.com
  7. Vod Podcasting:  http://web.me.com/wcruse/Carmody_Middle_School_Instrumental_Music/Podcast/Podcast.html
  8. Vod Podcasting (Click Here)
  9. Multimedia: http://www.whotune.com/jkuzmich
  10. Reva Kuzmzich Paget Blog featuring elementary music resource: http://atreblemaker.blogspot.com

For overview of web development concepts, view Steven Estrella's http://www.makepages.com/ for tutorial with lots of links to short tutorials that makes for good web programming orientation. Although a bit out-of-date, this web site will be updated in June approximately.

Welcome

XHTML

Style Sheets (CSS)
JavaScript

DHTML

Multimedia Basics

Web Audio

Flash

QuickTime

Software

Learning Links

Products for Sale

Search

Browser Check

 

 

PowerPoint presentation entitled: Creative Web Development for Music Education at: mhtml:http://www.kuzmich.com/2004_ASU_Web_Development.mht!2004_ASU_Web_Development_files/frame.htm or go to: http://www.kuzmich.com/index2.html

 

Review of Literature: Let's Find Suitable School Web Pages and School Music Web Pages:

 

1. Spot Light on Bands in all 50 states: http://www.schoolbands.com/

 

2. Elementary and Middel School General Music Web:

Interactive web sites:

  1. John Kuzmich, Mr. Middle School with many features: http://www.kuzmich.com/carmody/Carmody_Opening.htm
  2. Audio streaming: http://www.kuzmich.com/Reva/Butterfly.ram
  3. More audio and video streaming: http://www.kuzmich.com/graduaterecital/graduaterecital.html
  4. On-line tests:
  5. Model public school music web sites
  6. On-line student Grades: http://www.kuzmich.com/carmody/Grades.html Post Grades for Parents and Students to View 24-Hours a Day with the option of printing out a complete progress report!
  7. On-line Parent-Student-Student Conferences: http://www.kuzmich.com/web_conference.html and http://www.kuzmich.com/carmody/web_conference_form4.html
  8. Weekly parent newsletters: http://www.kuzmich.com/parent_newsletters.html
  9. Weekly Emails to parents: Eudora e-mail

Specific Tips for Planning What Features You Want In your Web Site: Music Teacher Modeling Excerpts!: http://www.kuzmich.com/Web_Tips.html

 

TI:ME resource page: http://www.ti-me.org/members/2BInternet/. Requires a username and password.

 

Final Project: Wednesday, June 15, 2011 at 4:45 p.m. to5:30 p.m.

Module #2

30 minutes

 Focus of Workshop with the reading of a Beginning Web Development Article: Building Your Own Web Page at:

<Building Your Own Website>


Meet John Kuzmich, Jr.: http://www.kuzmich.com/ and http://www.kuzmich.com/clinics.html

Module #3

 

90 minutes

Basic text for this clas is: Learn Adobe Dreamweaver CS3 in a Day by Arnie Abrams, published by Visions Technology in Education, 2008. 88 pp. ISBN: 978-1-58912-761-6

 

Chapters covered:

  • Introduction
  • Previewing finished site in your web browser
  • Styarting up Dreamweaver
  • Exploring the DreamweaverInerface
  • Getting Help
  • Loadding a page
  • Creating a New Page
  • Working with text
  • Formatting the background
  • Importing text
  • Checking spelling
  • Changing Colors, Styles, and fonts
  • Formatting Lists
  • Inserting horiontal lines
  • Creating Intgernal links
  • Adding External Links
  • Setting Anchors
  • Working with Images
  • Working in HGML
  • Inserting an aduio or video clip
  • Building talb es
  • Page properties
  • Posting your site

Supplement instructional materials.

 

Where to Begin the basics of Web Development as a Novice Web? Go to: <http://www.kuzmich.com//handouts/HTML_outline.html>.

  1. Understanding HTML Tags
  2. Reviewing Selected Web URL, Analyze Them, Copy Them, Alter Them and More!
  3. A No-Nonsense Approach
  4. A More Advanced Approach
  5. HTML On-Line Internet Tutorials: Nearly 9,000 URL listed in Alta Vista Search Engine under: & HTML Tutorials.
  6. Downloading and Uploading Web Pages (FTP)
  7. Do's of Good Web Page Design: See handout: What Makes For A Good Web Page,
  8. Registering Your Web Page With Internet Search

To Be Arranged (TBA)

Break

Module #4

 

20 to 30 minutes

Understanding Web designing principles::

  1. Web Pages That Suck by Vincent Flanders and Michael Willis (Sybex) at: <http://www.webpagesthatsuck.com/>
  2. Design Elements: http://www.kuzmich.com/handouts/Web_Design.html

TBA

Break

Module #5

 

90 minutes

Web Primer: <http://www.w3schools.com/web/default.asp>.

 

Web builder definition of terms: <http://www.w3schools.com/site/site_intro.asp>.

 

Let's Start with Basic HTML Programming Elements with Tutorials that cover many important web page concepts at: <http://www.kuzmich.com//handouts/HTML_outline.html> and free HTML Tutorial at: http://www.2createawebsite.com/build/html.html>.

  1. The Very Beginning
  2. Simple Text Enhancement
  3. Italics typeface:
  4. Underline typeface: Creative banners with fancy fonts: http://www.cooltext.com/

Simple Text Formatting:

  1. Hard carriage return: <BR>or <P>,
  2. Centering: <center>
  3. Font Size: <H1>, <H2>, <H3>, <H4>,
  4. Multiple columns: <MULTICOL COLS=2 GUTTER=10>, </MULTICOL>
  5. Line Across the Screen: <HR>

Fancy Animated backgrounds: <Body Background="File.JPG"> or HTML code: <BODY BGCOLOR="C6EFF7">:

  1. Animation Online: http://www.animfactory.com, http://www.animationonline.com/, http://www.buttonmaker.com/
  2. http://cooltext.com
  3. http://www.gifanimations.com/
  4. GIF Animations.COM (20,000 animations): http://www.gifanimations.com/
  5. Smiley Cental (10,000 smiley faces, some with music): http://smiley.smileycentral.com/download/index.jhtml

In Dreamweaver, you can create background images for your web to serve as backgroun images. Keep the photos simple and hopefully with some similar patters for uniformity. Go to Modify and select Page Properities. Then go to Appearnace HTML and clinic on the icon for backgound properity mages. Select the file. Hit apply button and and OK button. Then go to the code view and and add a space after .jpg and type background ="fixed" and you will be amazed that the photo stays in place no matter you navagate the create. Here's the code:

 

<body background="../Documents and Settings/Administrator/Desktop/Copy of Europelarger.jpg" bgproperties="fixed">

 

Music Clip Art:

  1. Music Graphics Galore: http://www.musicgraphicsgalore.net/
  2. Free Music Clip Art: http://www.voice-teacher.com/html/free_music_clip_art.html
  3. More Free Music Clip Art: http://school.discoveryeducation.com/clipart/l
  4. More, More Free Miusic Clip Art: http://www.school-clip-art.com/music_clipart.shtml

Outling and Organizing Text:

  1. Indent with numbered order: <OL>
  2. Assorted graphical indents: <UL>,
  3. 3. List Item: <LI>

Links to other web sites <A HREF="URL">Text</A> Posting photographs: <img SRC="name of photo file JPEG or .GIF">:

 

Digital camera photos

  1. Scan in photographs to JPEG or GIF files.

Post Calendars!:

  1. localendar: http://www.localendar.com/elsie
  2. Calendar.Net: http://www.calendars.net/indexnof.htm
  3. Free Web Calendars: http://www.workingdogweb.com/FreeCalendars.htm

Post Grades for Parents and Students to View 24-Hours a Day with the option of printing out a complete progress report!:

  1. Making The Grade by Jay Klein Products : http://www.gradebusters.com/
  2. Pinnacle by Excelsior at: http://www.gradebook.com/

Blinking Headlines in Netscape: <BLINK> and Microsoft Explorer traveling headlines across the screen: <marquee>text example</marquee> at: http://www.kuzmich.com/carmody/Grades.html

 

Need more free HTML tutorials on-line?

  1. 2 Create A Website: http://www.2createawebsite.com/build/html.html
  2. W3 Schools: http://www.w3schools.com/
  3. HTML Code Tutorial: http://www.htmlcodetutorial.com/
  4. AAA HTML Tutorials: http://www.aaahtml.com/
  5. Free HTML Tutorials:http://www.davesite.com/webstation/html/
  6. Free HTML On-Line Tutorials: http://www.webdevelopersnotes.com/tutorials/html/

HTML Validators can find programming errors on-line and free! Take advantage of them.

  1. http://validator.w3.org/

  2. http://www.delorie.com/web/purify.html

TBA

Break

Module #6

 

30 minutes

Let's Find Suitable School Web Pages and School Music Web Pages

  1. Things To Think About When Designing a Web Site
  2. Web Site Evaluation Instrument

Module #7

 

60 minutes

SeaMonkey or Netscape Composer, Microsoft WordPad and a Word Processor with HTML Capabilities

 

Netscape tutorial

  1. Build a Web Site In One Day with Netscape Composer by Visions Technology in Education

Dreamweaver tutorials:

  1. Learn Dreamweaver in a Day Tutorial, Summary of GUI Web Development Applications at: http://www.sbomagazine.com/7610/archives/april-2005/music-technology-courseware-options/ >. Free on-line Dreamweaver installation at: <http://www.learnthat.com/software/learn/1158/Free_Macromedia_Dreamweaver_MX_2004_Tutorial_and_Training/> and http://www.learnthat.com/catalog/1/Adobe-Dreamweaver-CS4/ for learning the very basics of Dreamweaver.
  2. Dreamweaver Development Center with many excellent tutorials at: <http://www.adobe.com/devnet/dreamweaver.html>.
  3. W3 Web Development free tutorials at: http://www.w3schools.com/

Tables: Magical formatting tool.

  1. HTML Table Tutor: http://www.echoecho.com/htmltables.htm
  2. Table Tutor: http://www.pagetutor.com/table_tutor/index.html
  3. Web Page Accessibility: http://academics.georgiasouthern.edu/accessibility/docs/tables.htm

Frameset

 

The terms frames or frameset refer to the display of two or more Web pages or media elements displayed side-by-side within the same browser window. The term framing however refers to the fraudulent display of information of one Web site's data within another Web site's page [1] [2], fraudulent meaning intentionally using some form of trickery in order to receive unfair or unlawful gain. A frameset is the technical HTML term for a group of named frames to which Web pages and media can be directed. The Web or media elements that go in a frame may come from the same Web site or from multiple Web sites. There are multiple ways to accomplish this side-by-side arrangement of Web pages. There is significant value in specialized HTML code for creating side-by-side information displays for reasons of improved user readability and comprehension, reduction in the data transmission load on the Net and expanded options for authors addressing more complex subjects.

  1. http://www.kuzmich.com/employment/Help7/ldsjobs.html
  2. http://www.kuzmich.com/frames_gossip.html
  3. http://www.kuzmich.com/frameset/sample%20frameset.html for step-by-step instructions

Cascading Style Sheets (CSS) is a style sheet language used to describe the presentation semantics (the look and formatting) http://en.wikipedia.org/wiki/Style_sheet_languageof a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML, but the language can also be applied to any kind of XML document, including SVG and XUL.

CSS is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation, including elements such as the layout, colors, and fonts.[citation needed] This separation can improve content accessibility, provide more flexibility and control in the specification of presentation characteristics, enable multiple pages to share formatting, and reduce complexity and repetition in the structural content (such as by allowing for tableless web design). CSS can also allow the same markup page to be presented in different styles for different rendering methods, such as on-screen, in print, by voice (when read out by a speech-based browser or screen reader) and on Braille-based, tactile devices. While the author of a document typically links that document to a CSS style sheet, readers can use a different style sheet, perhaps one on their own computer, to override the one the author has specified.

 

Special 40 MB video tutorial designed by Paul Lukasiewicz on how to create CSS style and link it to an HTML document. Suggest you download the file by right clicking on it since it is large to work with the video. Right click and download it and you'll be happier!!!!

  1. http://homepage.mac.com/mac_cast/time/2bclass/css-tutorial.mp4

  2. CSS Validation service online (check your pages for CSS errors)

National Teaching Standards:

  1. Teaching Music with Technology by Thomas E. Rudolph (GIA Publishing)
  2. Technology Strategies for Music Education by Thomas Ruldoph, Floyd Richmond, David Mash and David Willaims (Hal Leonard Publishing at http://www.halleonard.com/search/search.do?subsiteid=1&keywords=Technology+Strategies+for+Music+Education

Forms:

  1. How To Use Dreamweaver MX & Fireworks MX by Lon Coley (Que). Fantastic tutorial on forms: pages 268 to 285.
  2. Teach Yourself CGI by Rafe Colburn (Sams). In-depth 24 hour instruction.

Module #8 45 minutes

First Project: Your very first home page that has a title with appropriate headings

 

Module # and Approximate Times for Each Module: Topics for Each Module

 

Module #9

90 minutes

Continuation of First Projects with “Build A Web Site in One Day with Netscape Composer by Diann Floyd Boehm at: http://swww.toolsforteachers.com Do a search on the title.

 

Netscape Composer is a GUI interface for creating HTML pages without knowing HTML coding. Versions 7.2 and earlier ones have Composer and later ones, version 8.0 and on don't. It free. There are some formatting issues but it works instantly covering many basic HTMl features, including tables. Go to: http://browser.netscape.com/ns8/download/archive.jsp

Module #10

15 to 20 minutes

Read Second Web Development article: Building Exciting Web Pages: Part 2: http://www.sbomagazine.com/7604/archives/june-2000/building-exciting-web-pages-part-2/

TBA

Break

Module #11 20 minutes

Understanding “Hot” Links

Module #12

 

20 minutes

Read Second Web Development article: Building Exciting

 

FTP file transfers to your web site for uploading and downloading your web site:

  1. Filezilla: free download for PC and Mac platforms. There is a good on-line tutorial at: http://www.kuzmich.com/Filezilla%20overview.pdf
  2. Cyberduck (Mac & PC): http://cyberduck.ch/
  3. Fetch (Macs): http://fetchsoftworks.com/fetch/download/
  4. WS_FTP LE 5.08 (PC): http://www.ipswitch.com/cgi/download_eval.pl?product=main.
  5. SmartFTP at: <http://www.smartftp.com/>
  6. FTP Commander: <http://www.internet-soft.com/ftpcomm.htm>.

Web Pages: Part 2: http://www.sbomagazine.com/7604/archives/june-2000/building-exciting-web-pages-part-2/l

30, 45 or 60 minutes

Lunch

Module #13

 

2 1/2 hours

Learn Dreamweaver in a day Tutorial, Summary of GUI Web Development Applications at:

  1. http://www.sbomagazine.com/7610/archives/april-2005/music-technology-courseware-options/>
  2. Free on-line Dreamweaver installation at: <http://learnthat.com/search/?q=Dreamweaver&cx=partner-pub-4732785265060233%3Ax2ngb52d81q&cof=FORID%3A10&ie=ISO-8859-1#1126> for learning the very basics of Dreamweaver.

Dreamweaver Development Center with many excellent tutorials at:

  1. <http://www.adobe.com/devnet/dreamweaver.html>
  2. W3 Web Development free tutorials at: http://www.w3schools.com/

Module #14

 

30 minutes

Adding to Existing Web Page: Continuation of 1st and 2nd Projects with Colorful backgrounds and animation:

  1. Colored backgrounds: http://www.visibone.com/
  2. Fancy backgrounds: <body background="File.jpg"> or HTML code
  3. http://www.backgrounds4free.com/

Tutorial on Colors: http://www.htmlgoodies.com/tutorials/colors/

HTML & Graphic Tutorials: http://www.htmlgoodies.com/tutorials/

Hexc Hub List of over 700 named colors: http://www.december.com/html/spec/color.html

Module #15

 

30 minutes

Outlining and Organizing Text:

  1. Indent with numbered order: <OL>
  2. Assorted graphical indents: <UL>
  3. List Item: <LI>
  4. Blinking Headlines in Netscape: <BLINK>

Module #16

 

45 minutes

Scanning: OCR (Optical Character Recognition)

  1. Photo editing and restorations: Adobe Photoshop CS5 and Photo Elements 8.0 by Adobe: http://www.adode.com
  2. Text: OmniPage 18.0 by Scan Soft: http://www.scansoft.com/omnipage/
  3. Music: SmartScore X by Musitek: http://www.smartscore.com

Module #17

45 minutes

Third Project: Adding Additional Pages to Web Page and loading to Web server in Preparation for Final Project Presentations!

 

 

Module # and Approximate Times for Each Module: Topics for Each Module

 

Module #18

 

45 minutes

Review PowerPoint presentation entitled: Creative Web Development for Music Education at: mhtml:http://www.kuzmich.com/2004_ASU_Web_Development.mht!2004_ASU_Web_Development_files/frame.htm or go to: http://www.kuzmich.com/index2.html

Module #19 45 minutes

Charms self-directing web sites: http://www.charmsmusic.com and tutorial at: http://www.kuzmich.com/charms1_tutorial.html

Module #20 45 minutes

Public School Examples: http://www.dentonisd.org/arts/jkuzmich.htm

Module #21

30 minutes

Private studio teaching: http://www.charmsstudio.com and tutorial at: http://www.kuzmich.com/charms2_tutorial.html                                              

Module #22

30 minutes

Superscope Digital recordings for web site:

http://www.superscopetechnologies.com/press/IAJEcolumn.shtml Part 1 of an IAJE Watch Out Column for Digital Recording With the Superscope PSD 300

http://www.superscopetechnologies.com/press/IAJEcolumn2.shtml Part 2 of an IAJE Watch Out Column for Digital Recording With the Superscope PSD 300

Module #23

 

30 minutes

Understanding web basics at: http://www.makepages.com. Some links below require an inexpensive subscription. Excellent site for MIDI and other basics for web development for music educators..

Sources of Free MIDI files:

  1. Harmony-Central: http://www.harmony-central.com/MIDI/files.html
  2. Standard MIDI Files on the Net (over 30,000 links): http://www.manythings.org/midi/
  3. MIDI Farm:: http://www.midifarm.com
  4. Classical Music Archives: http://www.classicalarchives.com/
  5. Classical Music: http://www.midiworld.com/classic.htm
  6. The Classical Music Collection: http://www.classicalmidiconnection.com/cmc/index.html

Module #24

 

30 minutes

Audio streaming techniques and demonstration at: <http://www.kuzmich.com/reva.html>.

  1. Switch Sound File Converter
  2. Cakewalk Pyro Audio Creator
  3. RealProducer
  4. RealPlayer

Module #25

 

30 minutes

Video streaming techniques and demonstration at: <http://www.kuzmich.com/reva.html>. Videos from camcorder to computer.

  1. Vegas and RealPlayer
  2. How to Use Digital Video by Dave Johnson (Sams)
  3. Video Streaming article: URL: http://www.kuzmich.com/handouts/bookmarks.html and http://www.sbomagazine.com/sbomag/dec00/technology.html (will post)
  4. Digital Video with Windows XP in a Snap by Greg Perry (Sams)

TBA

Break

Module #26

 

2 hours

Learn Adobe Photo Elements 9.0 in a Daypublished by http://www.toolsforteachers.com

 

Adobe Acrobat PDF by Adobe: For insight about PDF file format, click here.

  1. Adobe Acrobat 9 in a Snap (Sams)
  2. Adobe Acrobat X: Tips and Tricks by Donna L. Baker (Adobe Press). The best 150 tips & tricks.

WordPerfect XV by Corel.

 

PDF Converter 7 Professional by Nuance

 

Primo PDF (free PDF converter through your print drivers): http://www.primopdf.com/

 

Whistles & Bells: GIF Animator slideshows at: http://www.kuzmich.com

  1. Product description and Free Download GIF Animator by Microsoft: http://www.versiontracker.com/dyn/moreinfo/win/13212
  2. GIF Animator tutorial: http://library.thinkquest.org/17131/multimedia/anim/ch3_ga.html

Module #27

 

2 hours

Work on Final Internet Project. Criteria: 3 web pages all linked together with

 

Post Calendars!: My favorites.

  1. Creative Calendar Creator by Broderbund and Calendar Server at: http://www.htmlcalendar.com/products/windows/download/ and
  2. HTML Calendar Maker Pro by Creative Computer Solutions at: http://www.htmlcalendar.com/

Photographs enhanced, resized, cropped.

 

Special Browser Effects:

  1. Blinking Headlines in Netscape: <BLINK>
  2. Microsoft Explorer traveling headlines across the screen: <marquee>text example</marquee> at: http://www.kuzmich.com/carmody/Grades.html

Linking photo posting to other web sites <A HREF="URL">Text</A> Posting photographs: <img SRC="name of photo file JPEG or .GIF">:

  1. Digital camera photos and
  2. Scan in photographs to JPEG or GIF files.

Fancy backgrounds: <Body Background="File.JPG"> or HTML code: <BODY BGCOLOR="C6EFF7">: Also animated GIFs, buttoms and more.

  1. Animation Online: http://www.animfactory.com, and http://www.buttonmaker.com/
  2. http://cooltext.com
  3. Free Wallpapers: http://www.wallpapers-tlc.com/groupfancyfairies.html

Outling and Organizing Text:

  1. Indent with numbered order: <OL>
  2. Assorted graphical indents: <UL>
  3. List Item: <LI>

Module #28

 

30 minutes

If there is sufficient time and interests, there are optional/additional instructional materials from: http://www.kuzmich.com/Interactive_Internet.html or go to the addendum at the bottom of this workshop syllabus entitled: "Addendum When\Where Appropriate: Based on Interest and Abilities!"

 

 

Module # and Approximate Times for Each Module: Topics for Each Module

 

Module #29

30 minutes

Learn how to build portfolios with PowerPoint via: the Portfolio Builder for PowerPoint by Visions Technology in Education at: http://www.toolsforteachers.com/

 

PowerPoint Tutorials:

1. Learning PowerPoint is easy with the many excellent on-line ltutorials that are available. Please take a few minutes to become more familiar with PowerPoint at:

2. PowerPoint concepts that you need to be familiar with that the tutorials will cover are:

  • Setting up a PowerPoint file with presentation type, output of use, template, background, slide layout, pre-set animation, custom animation, Word Art, slide transition, customizing slideshow, changing slide order, deleting slides, adding artwork/photos/sound, viewing a slideshow, new slides, and save as a web presentation.

  • For more features to be learned in PowerPoint, go to a handy on-line PowerPoint glossary at: http://highered.mcgraw-hill.com/sites/007247187x/student_view0/powerpoint_glossary.html

TBA

Break 

Module #30

75 minutes

Audio streaming techniques with MIDI or .WAV files or Web Kit: How to Build Great Web Sites by Arnie Abrams at: https://secure.toolsforteachers.com//item-detail.cfm?Item=The%20Web%20Kit

TBA

Break

Module #31

 

2 hours

Heavily Discounted software pricings for educators only. Web search: "Academic discount"

  1. Gradware: http://www.gradware.com/ - 800-817-2347
  2. Academic Superstore: http://www.academicsuperstore.com/ - 800-854-5787
  3. CCV Software: http://www.ccvsoftware.com/ - 800-843-5576
  4. Sweetwater Music: http://www.sweetwater.com - 800-222-4700, ask for Tim Henderson

If time permits, perusing of on-line interactive crossword puzzles, word search puzzles, call charts, test makers and Flash card builders/animators. More info is in the August, 2006 SBO magazine technology column!

 

Individual final web site instruction to organize and develop web sites from the previous first two days of this work.

TBA

Break

Module #32 60 minutes

Continuation of individual final web site instruction to organize and develop web site.

Module #33 20 minutes

Presenting Final Projects

Module #34 10 minutes

Workshop Assessment and Closure


Addendum When\Where Appropriate:

Based on Interest and Abilities!

 

Free web hosting sites:

XtraNormal Activity (not free) that links to Voki (free) which is text-to-speak avatar discussion.  You can plug text-to-speak module for a character dialogue with students.  You can check the potential of such a creative activity with the URL below for an actual demonstration with student examples that will be the talk of day in your classes:  egedy.wikispaces.com Advantages of such a technology activity for your students are:

  1. Motivate students to participate
  2. Improve message comprehension
  3. Introduct technology in the classroom
  4. Explore Voki as an effective language too
  5. Inspire and get inspired by other teachers

Fancy enhancements with digital photos, posting calendars and more!

∙ Linking to other web sites <A HREF="URL">Text</A>

∙ Posting photographs: <img SRC="name of photo file JPEG or .GIF">

Looking for some safe but rather interesting HTML templates? Check out these to be downloaded and used as templates

Need more templates for making HTML files? See third-party resources but beware of how many lines of code as some examples are rather long and perhaps buggy.

  1. http://www.2createawebsite.com
  2. http://www.quackit.com/html/templates/
  3. http://www.templatesperfect.com/
  4. http://themebot.com/free-website-templates/html-templates
  5. http://www.freewebtemplates.com/
  6. http://www.noupe.com/css/50-free-css-x-html-templates.html
  7. http://freecsstemplate.net/free-html-templates.php
  8. http://www.template4all.com/templates/
  9. http://wufoo.com/gallery/
  10. http://www.htmlwebtemplates.info/
  11. http://free-templates.org/
  12. http://www.zymic.com/free-templates/

For more info and training videos for Dreamweaver based on specific features and topics? Consider going to the following URL's

  1. http://www.tutid.com
  2. http://tv.adobe.com/channels/

1. Digital camera photos

2. Scan in photographs to JPEG or GIF files

∙ Creative Calendar by Broderbund

∙ Post Grades for Parents and Students to View 24-Hours a Day with the option of printing out a complete progress report!

∙ Making The Grade by Jay Klein Products : http://www.gradebusters.com

Continuation of Projects 1 and 2 plus being Project 3 with more powerful web enhances with digital photos, calendar, posting grades and more.

 

Are You Ready For Powerful Web Enhancements?!

∙ Posting Microsoft PowerPoint and Corel Presentation Slide Show Presentations!

∙ Posting speech audio files with WAV. files

∙ How to create and post a musical presentation with analog and wave table sounds: Band-In-A-Box

∙ How to prepare, enhance and post photographs. Edit in PhotoShop

4nd Project with more linked web pages with the home page.

 Musical Things!

• Music Scores: Using Finale 2006 at: http://www.kuzmich.com/Compositions.html

• Audio Streaming: Using Pyro Plus and Helix RealProducer and Plus at: http://www.kuzmich.com/reva.html (dozens of audio streaming)

• Audio Streaming: Band In-A-Box at: http://www.kuzmich.com/John_Kuzmich_Resume/John Kuzmich Resume.html

 

 More Considerations!

∙ How to prepare and post a video presentation!

∙ Posting clinic handouts: http://www.kuzmich.com/handouts.html

∙ Posting e-mail responses from your web page to your e-mail account: <A HREF="mailto:Your E-mail address">Your E-mail Address</A> at: http://www.kuzmich.com/how.html

 

Adding a counter to your web page so you know how many "hits" have occurred: http://www.kuzmich.com, http://www.statcounter.com/, http://www.rapidcounter.com/ and http://www.digits.com

 

Using Web Making Editing Programs: Full Circle from HTML codes to Powerful Web Graphical Software Applications!

∙ Designing and Making Your Own Animated GIF's: http://www.animfactory.com, http://animationonline.com, http://buttonmaker.com, http://coorachive;.com, and http://www.cooltext.com

 

1. Post animated GIF's: <img SRC="notes.gif">

a. Download animated GIF's

2. Create animated GIF's on-line the Internet at <http://www.animationonline.com>.

∙ Design your own buttons from photos, anything graphical on-line at http://www.buttonmaker.com , http://www.coolarchive.com and http://www.cooltext.com

∙ Software that creates your own animated GIF's with PhotoImpact: http://www.asiapac.ulead.com/

∙ Editing and Posting Photographs creatively! Enhance photos with PhotoShop!

∙ FrontPage 2003: http://www.microsoft.com

∙ Playback of Audio Files and Streaming: <A HREF="URL location/Name of the audio file (MIDI, MP3, .WAV)">. URL: ">http://www.kuzmich.com/kuzdir.html">

∙ Video Streaming: URL: http://www.kuzmich.com/handouts/bookmarks.html and http://www.sbomagazine.com/arch/dec00/technology.htm

∙ Reference Books and Where to Go for More Web Making Ideas!

Web publishers:

A. Sams Publishing: http://samspublishing.com

B. IDG Books: 800-434-2086

C. Que: http://www.quecorp.com

D. Peachpit Press: http://www.peachpit.com

∙ Web Development: http://www.kuzmich.com/handouts/web.html

∙ Five Different Computer Music workshops: http://www.kuzmich.com/handouts/mines.html

∙ Videoconferencing: Contact John about when this class will be offered again. In the meantime, please to the following web site for details about his last videoconferencing class. http://www.kuzmich.com/handouts/video_agenda.html

∙ Let's Fix Your Computer Software/Hardware Installations, including Internet access! Contact John about when this monthly time will be available to educators with both their school and personal computers. This is a no credit class. E-mail: jkuzmich@jeffco.k12.co

* Registering Your Web Page With Internet Search Engines

∙ Add Powerful 3D Graphics to Your Web Page with ULead's WebRazor Pro

∙ DreamWeaver Suite by Macromedia and Go Live! By Adobe

∙ HTMLValidators: Search Engine by "Free HTML Validator"

∙ NetTools Box version 2.0.

∙ Posting music files from Finale

∙ Simple Intuitive Web Publishing Software