- Today’s Codecast
- Inserting Images
- Block vs. Inline Elements
- Working with Tables
- Working with Forms
- Sectioning your HTML Document
- Assignment
- Read (Quiz Material) Introduction to HTML
Category Archives: Internet Technologies
Out of class lab – Modern Web Accessibility
Watch – Accessibility for the Modern Web by Derek Featherstone
Assignment
Explain in your own words what web accessibility means to you & why it is important to build accessible web sites? Do some research on the topic. This is a written assignment (1-2 pages) that should be emailed to me (tswallace@ualr.edu & mxkumar1@ualr.edu) no later than next Monday. Have a nice weekend!
Introduction to HTML5
- Today’s Codecast
- Doctypes & DTD’s – Document Type Definition
- Declaring a Language Type
- Exploring the <head>
- Title Attribute
- Meta Tags
- Marking Up Content – Download the Starter Document
- Additional html tags for textual content
- Special Character Encoding: Details | Reference
- Hyperlinks
- Inserting Images
- Block vs. Inline Elements
- Working with Tables
- Working with Forms
- Sectioning your HTML Document
- Assignment
- Read (Quiz Material) Introduction to HTML
Introduction to HTML5
- Setting up our work environment using Codpen | Today’s Codecast
- Doctypes & DTD’s – Document Type Definition
- Declaring a Language Type
- Exploring the <head>
- Title Attribute
- Meta Tags
- Marking Up Content – Download the Starter Document
- Additional html tags for textual content
- Special Character Encoding: Details | Reference
- Block vs. Inline Elements
- Hyperlinks
Assignment
Read (Quiz Material) Introduction to HTML
Introduction to HTML5
- Classroom Tools
- How the Internet Works
- Understanding how a web page works
- Setting up our work environment using Codpen | Today’s Codecast
- Other Code Editors
- What is HTML5?
- Doctypes & DTD’s – Document Type Definition
- Declaring a Language Type
- Exploring the <head>
- Title Attribute
- Meta Tags
Assignment
Create a Codepen Account and experiment with it’s features.
Read (Quiz Material) Introduction to HTML
Structure, Content, Design, & Behavior
- Structure, Content, Design, & Behavior
- Browser Overview
- 300 Million Dollar Button
- How the Internet Works
- Understanding how a web page works
Assignment
Evaluate your favorite web site based on our discussion of Structure, Content, Design, and Behavior. This is a written assignment that should be emailed to me (tswallace@ualr.edu) and Manoj (mxkumar1@ualr.edu) no later than 1-23-17. Make sure you discuss the following elements: Site URL, An assessment of the Structure, Content, Design, and Behavior of the site, Things you like about the site, Things you would change.
Web Standards and Web Based Terminology
Discussion
- Understanding Web Related Terminology
- Browser Overview
- How the Internet Works
- Understanding how a web page works
Assignment
Setup and Account at Codepen.io. the free account is acceptable for the work we will do in class.
Additional Reading – 300 Million Dollar Button
Course Overview
Course Syllabus
Introduction to the Classroom Technology
- Virtual Machines
- Off Campus Access to VPN
Discussion
Assignment
Read: The history of the Internet and the web, and the evolution of web standards
Semester Wrap Up
- Final Due Tuesday December 13, 2016. The project should be submitted no later than 10:00am – Final Project Guidelines
- Final Q & A
- Next Steps
- IFSC 3300 (Sample Syllabus)
- Mobile Web Development (Spring 2016)
- BA in Web Design and Development
- Advisor Thomas Wallace
- Course Evaluations
Implementing jQuery
Assignment
Upload your working version to you web space and send me the url. Make sure to do some customization so you get the opportunity to play with editing the calls to jQuery. Please send me the working URL before class on Thursday. Please send to tswallace@ualr.edu and mxkumar1@ualr.edu.
Progressive Enhancement
- jQuery Tabs Case Study
- jQuery Cycle Demo
- Review Grades
Assignment
Begin looking for ways you can implement jQuery (or another library) into your final project. Identify what is it you’d like to do (image gallery, carousel, lazy load etc.) and begin researching what it takes to get it implemented.
JavaScript Libraries
- How jQuery Works
- Exploring the functionality of jQuery
- What is a CDN?
- Why use a CDN?
- jQuery Tabs Case Study
- jQuery Cycle Demo
Additional Reading and Study – Javascript 101
Read the following Article on Progressive Enhancement. Send me an email (tswallace@ualr.edu) explaining progressive enhancement in your own words. Please discuss why it is important to use progressive enhancement and include a link to another article you found and read relating to the topic. Due before class Tuesday.
Introduction to JavaScript
Assignment
Complete Getting Started with programming at Codecademy. Send me a a screenshot of the completion page. I recommend creating an account so you can save your progress and completion other modules in the future.
Forms and Project Consulting
- Hosted Solution
- Using Server-Side Technology
- Planning, Storyboarding and Collecting Resources for your Web Site
- Final Project Guidelines
Assignment
- Submit your Segway project
- Complete the planning document and sitemap and submit to me via email before class on Tuesday.
Segway Lab
Work today to complete your Segway project. Make sure you remember to send me the URL no later than Thursday.
Segway Project Lab
Segway Project
- Starter Document | Starter Document (Using HTML Structural Elements)
- Micro-site Project – Due Thursday November 12.
Assignment
- Micro-site Project – Due Thursday November 12.
Image Integration and Page Duplication
- Integrating Image Slices into Your Site Template | Techniques: Kellum
- Finalizing your page template
- Duplicating pages for your site
Segway Project
- Starter Document | Starter Document (Using HTML Structural Elements)
- Micro-site Project – Due Thursday November 10.
Assignment
Begin work on the Segway Projects. You should have a good start on your main page template prior to class on Monday.
Image Optimization
Assignment
Create Banner image for your sample page in Fireworks. The image should be as wide as your container div and between 80px and 200px tall and less than 40kb in size. Emailed tswallace@ualr.edu before class on Tuesday. Have fun with this. You can make an image for anything. It could be a company, an event, a hobby etc. I’d like to see the following elements present in your design. Typographical Element, some sort of photographic element or vector artwork, and a consistent color scheme (Try Kuler).
Next class I’ll show you how to integrate this image into your template page properly. Please bring the file to class.
Image Manipulation and Optimization
Woking with Photography
- Color Resources
- Cropping and Resizing
- Working with the Selection Tool
- Exercise: Remove the Background from this photo
- Color Correction (Curves)
- Clone Stamp
Image Optimization
Assignment
Email me the completed optimized samples of the images you created in class. Due Thursday.
Image Manipulation and Optimization
Woking with Photography
- Color Resources
- Cropping and Resizing
- Working with the Selection Tool
- Exercise: Remove the Background from this photo
- Color Correction (Curves)
- Clone Stamp
Image Optimization
Assignment
Email me the completed optimized samples of the images you created in class. Due next Tuesday.
Introduction to Fireworks
- Review Positioning Exercises
- Fireworks Workspace
- Creating Shapes
- Working with Typography
- Cropping and Resizing
Assignment
Complete the following tutorials and submit the folder icon you create in the 3rd tutorial.
You should email this icon to me before class next Thursday. Late submissions will not be accepted. I do not expect you to perfectly replicate the icon in the tutorial but I would like to see a solid effort from each of you. This is a challenging assignment so I encourage you to not wait until the night before it is due. Good Luck! If you’d like you can download a 30 day trial of Fireworks on your own computer so you can work off campus.
CSS Positioning Lab
Assignment
Complete today’s lab assignment and upload. Sent the url’s for each exercise to tswallace@ualr.edu and mxkumar1@ualr.edu, no later than next Thursday. Be prepared to discuss in class.
Introduction to CSS
- Today’s Codecast
- Creating and Attaching a Style Sheet
- Understanding Color | Kuler
- CSS Box Model – Description | Demonstration
- Styling Page Navigation
- Positioning Overview
- CSS Positioning
Assignment
Read The following Article on CSS Positioning.
Introduction to CSS
- Today’s Codecast
- Creating and Attaching a Style Sheet
- Understanding Color | Kuler
- CSS Box Model – Description | Demonstration
- Styling Page Navigation
- Positioning Overview
- CSS Positioning
Assignment
Read The following Article on CSS Positioning. Be prepared to discuss next week.
Introduction to CSS
- Today’s Codecast
- Creating and Attaching a Style Sheet
- Understanding Color | Kuler
- CSS Box Model – Description | Demonstration
- Styling Page Navigation
- Positioning Overview
- CSS Positioning
Assignment
Read: Getting to Know CSS | Getting to know the Box Model – This is quiz material.
Principles of Graphic Design
- Ashi Franke – UALR Digital Strategy
Be prepared to discuss this presentation in class on Tuesday.
Introduction to CSS
- Today’s Codecast
- Creating and Attaching a Style Sheet
- Understanding Color | Kuler
- CSS Box Model – Description | Demonstration
- Styling Page Navigation
- Positioning Overview
- CSS Positioning
Assignment
Read: Getting to Know CSS | Getting to know the Box Model – This is quiz material.
Out of class lab – Modern Web Accessibility
Watch – Accessibility for the Modern Web by Derek Featherstone
Assignment
Explain in your own words what web accessibility means to you & why it is important to build accessible web sites? Do some research on the topic. This is a written assignment (1-2 pages) that should be emailed to me (tswallace@ualr.edu) no later than next Tuesday.
HTML5 Structural Elements & Introduction to CSS
- HTML5 Structural Elements
- Selecting the Proper Style: Tags, Classes, and ID’s
- Creating and Attaching a Style Sheet
- CSS Box Model – Description | Demonstration
Assignment
Read: CSS Specificity & Class vs. ID – This is quiz material.
Coding Environments
- Quiz
- Brackets
- Organizing your Web Space
- HTML5 Structural Elements
Assignment
- Create and Validate a prototype HTML document that includes examples of all HTML elements covered thus far. For a list of requirements view this page. Send me the URL of this page no later than next Tuesday.
- Reading Assignment: CSS Basics
HTML Wrap Up & File Management
- Today’s Codecast
- Working with Forms
- What is Validation?
- Naming Conventions, Meta Naming, Directory Structure
- Creating Your UALR Web Space
- Using an FTP Client – Filezilla – Tutorial
- Host:ualr.edu
- Username: students\username
- Password: students domain password
- Port:21 (It should default to this)
Assignment
- Create and Validate a prototype HTML document that includes examples of all HTML elements covered thus far. For a list of requirements view this page. Send me the URL of this page no later than next Tuesday.
- Reading Assignment: CSS Basics
Introduction to HTML5
Introduction to HTML5
- Setting up our work environment using Codpen | Today’s Codecast
- Exploring the <head>
- Title Attribute
- Meta Tags
- Marking Up Content – Download the Starter Document
- Additional html tags for textual content
- Special Character Encoding: Details | Reference
- Block vs. Inline Elements
- Hyperlinks
- Working with Tables
- Working with Forms
- Sectioning your HTML Document
Assignment
Read (Quiz Material) Introduction to HTML
HTML Reference – Code Guide | Introduction to HTML
Introduction to HTML5
- Setting up our work environment using Codpen | Today’s Codecast
- Exploring the <head>
- Title Attribute
- Meta Tags
- Marking Up Content – Download the Starter Document
- Additional html tags for textual content
- Special Character Encoding: Details | Reference
- Block vs. Inline Elements
- Hyperlinks
Assignment
Read (Quiz Material) Introduction to HTML
HTML Reference – Code Guide | Introduction to HTML
Introduction to HTML5
- Classroom Tools
- How the Internet Works
- Understanding how a web page works
- Setting up our work environment using Codpen | Today’s Codecast
- Other Code Editors
- What is HTML5?
- Doctypes & DTD’s – Document Type Definition
- Declaring a Language Type
- Exploring the <head>
- Title Attribute
- Meta Tags
Assignment
Create a Codepen Account and experiment with it’s features.
Read (Quiz Material) Introduction to HTML
Structure, Content, Design, Behavior
- Structure, Content, Design, & Behavior
- Browser Overview
- 300 Million Dollar Button
- How the Internet Works
- Understanding how a web page works
Assignment
Evaluate your favorite web site based on our discussion of Structure, Content, Design, and Behavior. This is a written assignment that should be emailed to me (tswallace@ualr.edu) no later than 8-30-16. Make sure you discuss the following elements: Site URL, An assessment of the Structure, Content, Design, and Behavior of the site, Things you like about the site, Things you would change.
Web Standards and Terminology
Discussion
- Understanding Web Related Terminology
- Browser Overview
- How the Internet Works
- Understanding how a web page works
Assignment
Setup and Account at Codepen.io. the free account is acceptable for the work we will do in class.
Additional Reading – 300 Million Dollar Button
Course Overview
Course Syllabus
Introduction to the Classroom Technology
- Virtual Machines
- Off Campus Access to VPN
Discussion
Assignment
Read: The history of the Internet and the web, and the evolution of web standards
Final Project
- Final Due Wednesday May 4, 2016. The project should be submitted no later than 3:30pm – Final Project Guidelines
- If you haven’t done so already please take a moment and fill out the Course Evaluation.
I have enjoyed having you this semester. Have a great Summer.
Semester Wrap-up
- Final Due Wednesday May 4, 2016. The project should be submitted no later than 3:30pm – Final Project Guidelines
- Final Q & A
- Next Steps
- IFSC 3300 (Sample Syllabus)
- Mobile Web Development (Spring 2017)
- BA in Web Design and Development
- Advisor Thomas Wallace
- Course Evaluations
Implimenting jQuery
Assignment
Upload your working version to you web space and send me the url. Make sure to do some customization so you get the opportunity to play with editing the calls to jQuery. Please send me the working URL before class on Wednesday.
Progressive Enhancement
- Review Homework
- What is a CDN?
- Why use a CDN?
- jQuery Tabs Case Study
- jQuery Cycle Demo
- Review Grades
Assignment
Begin looking for ways you can implement jQuery into your final project. Identify what is it you’d like to do (image gallery, carousel, lazy load etc.) and begin researching what it takes to get it implemented.
Introduction to jQuery
- How jQuery Works
- Exploring the functionality of jQuery
- What is a CDN?
- Why use a CDN?
- jQuery Tabs Case Study
- jQuery Cycle Demo
Additional Reading and Study – Javascript 101
Site Planning
Assignment
Complete the planning document and sitemap and submit to me via email before class on Monday.
Introduction to JavaScript Libraries
- How jQuery Works
- Exploring the functionality of jQuery
- What is a CDN?
- Why use a CDN?
- jQuery Tabs Case Study
- jQuery Cycle Demo
Additional Reading and Study – Javascript 101
Read the following Article on Progressive Enhancement. Send me an email (tswallace@ualr.edu) explaining progressive enhancement in your own words. Please discuss why it is important to use progressive enhancement and include a link to another article you found and read relating to the topic. Due before class Wednesday.
Introduction to JavaScript
Assignment
Complete Getting Started with programming at Codecademy. Send me a a screenshot of the completion page. I recommend creating an account so you can save your progress and completion other modules in the future.
Working with Forms
- Hosted Solution
- Using Server-Side Technology
- Project Q&A Lab
Assignment
Add a contact form to your Segway project.
Site Building Demo
Segway Project
- Starter Document | Starter Document (Using HTML Structural Elements)
- Micro-site Project – Due Monday April 11
Bringing it all together
- Integrating Image Slices into Your Site Template | Techniques: Kellum
- Finalizing your page template
- Duplicating pages for your site
Segway Project
- Starter Document | Starter Document (Using HTML Structural Elements)
- Micro-site Project – Due Monday April 11
Begin work on the Segway Projects. You should have a good start on your main page template prior to class on Monday.
Creating and Optimizing Site Imagery
Assignment
Create Banner image for your sample page in Fireworks. The image should be as wide as your container div and between 80px and 200px tall and less than 40kb in size. Emailed tswallace@ualr.edu before class on Tuesday. Have fun with this. You can make an image for anything. It could be a company, an event, a hobby etc. I’d like to see the following elements present in your design. Typographical Element, some sort of photographic element or vector artwork, and a consistent color scheme (Try Kuler).
Next class I’ll show you how to integrate this image into your template page properly. Please bring the file to class.