Digital Design Studio Basics: Website Design II – Class Material
This past Tuesday, the 2nd of the two new workshops the
Digital Design Studio offered at the Toronto Reference Library took place. The title of this workshop is “Digital Design
Studio Basics: Website Design II”. 
This new class main
objective is to familiarize the user with HTML.
Instead of depending on a sole application like Dreamweaver, the content
we provide can be added in any simple HTML building software. Using strictly code, we try and add different
types of Social Media, Audio and Video, Photo Gallery Content, Email Form tools
and more.
The majority of the
HTML codes can be found easily online and in fact, if the handout and HTML
codes we provide aren’t what you’re looking for, simply explore the web by
either search engine and/or message boards to find what you’re looking for.
Inserting Audio Files
As always, in part of
making all the content from any of the Digital Design Studio classes assessable,
I’ve posted a digital copy of the handout and the outline of the class to let
you know more about the program. I also
have made available a copy of the source code for you to explore on your own
and use for your website.
Digital Design Studio Basics: Website
Design II
Outline
I Adding Social Media directly on
your Website
- Adding Twitter Feeds / Embedding a
Single Tweet - Creating a new Twitter Widget
- Creating and Adding a Facebook Badge
- Facebook Video and Plugins
II Posting a Google Map on your
Website
- Search Location
- Embed the Code into the HTML
III Photo Gallery Creating and Titling
- Creating Thumbnails and Larger
Images - Modifying the HTML with Titles
IV Embedding YouTube/Online Videos
- Changing the YouTube Video Window's
Look and Features - Adding a YouTube Video to Social
Network Pages, Blogs, Etc. - Creating Your Own Video Player
V Inserting Audio
- Using the HTML5 <audio>
Element - Embedding From SoundCloud
VI PayPal
- Creating a PayPal Account
- Creating a PayPal Button for your
Website
VII Creating a Feedback Form Script
- Source Code #1 PHP (Feedback Form
Script) - Source Code #2 HTML Code
VIII Disabling Right Click on Your Website
- How the tool works
- How to adjust it
IX Glossary and Links
- Glossary
- Links and Resources
To download a digital copy of the Handout, please
click below:
Download DDS Basics – Website Design II – Participants Package (Blog 2013)
To download a digital copy of the HTML Source Code , please
click below:
Download DDS Basics – Website Design II – HTML Example Codes (Blog 2013)
Thanks,
Greg
2 thoughts on “Digital Design Studio Basics: Website Design II – Class Material”
Hey Thanks
this ability to download the course outline will help those of us waiting for our turn to take the workshop, to do our homework and be prepare so we can all get the most out of the class time.
Cool Stuff –
Hi Greg, I took your opensource software class. It was wonderful. I downloaded a few of the programs and somehow managed to get Snap.do onto my computer. I have tried deleting it under programs in the control panel but it will not seem to uninstall. Could you suggest a way to do this. Thanks.