Colleges and Universities
Digital Technology
Textbook Publishers
ITI 389 HTML5 - Overview
Course Outline:
Learn the basic building blocks of designing and creating websites optimized for modern computers, tablets, and mobile phones using HTML5. Topics include basic HTML5 elements and attributes, including hyperlinks, images, and tables. Advanced techniques to effectively create multiple column layouts using new HTML5 structural elements. Advanced HTML5 Application Programming Interfaces (APS's) will also be covered.
Prerequisites:
MS Windows or equivalent experience.
Required Textbook & Materials
REQUIRED
- Title: MURACH'S HTML5 and CSS3
- Author: Zak Ruvalcaba and Anne Boehm
- ISBN: 978-1-943872-26-8
- Edition/Copyright: 4th
- Publisher: MURACH
- Published Date: March 2018
- Website: murach.com
Materials:
Please bring a Flash Drive/Memory Stick 512MB or larger to class which will enable you to save your class work.
Meeting Information:
- Days: Monday & Wednesday
- Dates: 1/28/2019 - 2/6/2019
- Number of Sessions: 4
- Time: Tuesday & Thursday - 06:30 PM - 09:30 PM
- Location: HU 321
Lesson Plan:
- Course Overview Presentation
- Chapter 1 - Introduction to Web Development
- Chapter 17 - How to Design a Web Site
- Chapter 18 - How to Deploy a Web Site on a Web Server
- Chapter 2 - How to Code, Test and Validate a web page
- Chapter 3 - How to Use HTML to Structure a Web Page
- Overview of CSS3
- Chapter 12 - How to Work with Tables
- Chapter 13 - How to Work with Forms
- Chapter 15 - How to work with Fonts and Printing
Web Support:
Profburnett's Web4Students Websites: ITI 389 HTML5: Spring 2019 CRN:34889
General Computer Files & Windows Skills
- CMP 226 - File Management Skills (5 hrs)
- CMP 628 - Introduction to Keyboarding (18 hrs)
- CMP 073 - Working with Windows (8hrs)
- ITI 338 - Networking Basics (6 hrs)
Keyboard Shorcuts
- Windows Keyboard Shortcut Keys
- MAC Keyboard Shortcut Keys
- Adobe Dreamweaver Windows Shortcut Keys
- Adobe Dreamweaver MAC Shortcut Keys
General Web Development Links
- Caniuse
- Normalizer
- modernizr
- w3schools
- Google HTML5 Code
- HTML5 Array
- Webkit
- CSSTableGenerator
- CSS Layout Generator
- How Browsers Work
Wireframe Design Apps
Free Cloud Based
- frame box
- Gliffy
- Mockflow
- Mockingbird
- Proto
- Wireframe
- iPhone Mockup (iPhone)
- Mokk.me (iPhone)
- Sketch Design Resources
- UI8 Design Resources
IDE's
Free Web Design IDEs
- Sublime Text
- Brackets
- CoffeeCup Free HTML Editor
- Webuilder
- ICEcoder
- BBEdit
- Code Writer
- Google Web Designer
Free Web Development IDEs
- Visual Studio Code
- Atom by Github
- Komodo Edit
- Netbeans
- Light Table
- RJ TextEd
- CodeLobster
- Bluefish
- Coda
- Aptana (JAVA Required)
- Eclipse (JAVA Required)
Downloadable DesktopWeb Development Apps
- Justinmind
- Craft by InVision LABS
- Bolt 2.0 ($)
- Flair Builder ($)
- Indigo Studio ($$$)
- Omnigraffle (iOS)($)
- TETHR (iOS)
- iPlotz (iPhone & Android)
- Mockups.me - (Web & Desktop)
- Balsamiq ($ - Web & Desktop)
Cloud Based Web Development
Cloud-Based Web Development Sites
- Axure ($)
- Fluid ($)
- HotGloo ($)
- Moqups ($)
- Invision ($$$)
- Pidoco ($)
- Protoshare ($)
- Solidify ($)
- UXPin ($)
- Codepen
- Cloud9
- Codeanywhere
- CodeEnvy
- Kodingen
Online Website Builder Sites
Learning Management Systems (LMS)
- PC Magazine - The Best (LMS) Learning Management Systems for 2018
- Absorb LMS
- Schoology LMS
- Instructure Canvas LMS
- Moodle LMS
- Blackboard Learn LMS
- Google Classroom
- Office 365 Education
CSS Links
CSS Minifiers
- HTML Minifier
- CSSTidy
- Minify
- YUICompressor (also does JS)
- AjaxMin (also does JS)
- CSSCompressor
CSS Precompilers
CSS Postprocessors
CSS Tools
- CodeKit (Paid)
- Compass.app (Paid, Open Source)
- Ghostlab (Paid)
- Hammer (Paid)(Mac)
- Koala (Open Source)
- LiveReload (Paid, Open Source)
- Prepros (Paid)
- Scout-App (Free, Open Source)
jQuery Links
jQuery Forms
Slideshows, Carousels, Graphic Plugins & Components
- Malsup jQuery Plugins
- Web Designer Depot
- JSSOR
- Wow Slider
- Smashing Apps
- PixelzDesign
- Tiny Carousel
- FlowType
- Adaptive Images
- FitVids.js
Calendar & Datepicker jQuery Plugins
JavaScript Minifiers
- HTML Minifier
- JSCompress
- Packer
- JSMin
- Closure compiler
- YUICompressor (also does CSS)
- AjaxMin (also does CSS)
RWD Testing Emulators
- Google Chrome Dev Tools
- Firefox Firebug
- The Responsinator
- StudioPress Responsive Emulator
- ProtoFluid
- ResponsivePx
- Responsive Web Design Testing Tool
- ReView
- Screenfly
- Screenqueri.es
Browser Plugin Apps
- Wireframe Sketcher (Plugin for Eclipse IDE)
- Pencil Project (Firefox Extension)
Imaging Programs
WSDL, SOAP, REST, & ODATA Introduction and Resources
| Session | Chapter | Presentation | Exercise Zip File | Solution Set Zip File |
| I | Course Introduction Presentation |  |
||
| Session I | |
|||
| Setting Up Development Environment | |
 |
||
| II | Session II | |
Chapter 3 |
Chapter 3 |
| III | Session III | |
Chapter 12 Chapter 13
|
Chapter 12 Chapter 13
|
| IV | Session IV | |
Chapter 15 |
Chapter 15 |