Web Design and Creation

Professor: Steven D. Anderson, Ph.D. (anderssd@jmu.edu)

Course Description:

Student will learn how to plan and create websites using images, HTML and CSS. The course encompasses everything from building a simple page to creating complex, responsive sites that work well in various browsers and devices. The latest web standards will be covered, including HTML5 and CSS Grid for layout. Students will learn how to incorporate user experience (UX) methodologies to create sites based on user preferences and needs. There will also be consideration of interface design and web delivery issues. No prior knowledge of webpage creation and coding is required.


Online Lectures

YouTube
https://sites.google.com/uniurb.it/webinars-prof-anderson-03-2020/home-page

MP4 Files
http://drsteveanderson.com/anderson-lectures


Class Schedule

Tuesday, 10 March: 16:00 – 18:30
Wednesday, 11 March: 10:30 – 13:00
Friday, 20 March: 9:00 – 11:00
Saturday, 21 March: 11:00 – 13:00
Friday, 27 March: 9:00 – 11:00
Saturday, 28 March: 11:00 – 13:00


Free Software

WINDOWS
Text Editors
– Brackets: http://brackets.io
– Notepad++: https://notepad-plus-plus.org/downloads
FTP Client
– Filezilla: http://drsteveanderson.com/software/windows/FileZilla 3.41.2.zip
Image Editor
– Gimp: https://www.gimp.org/downloads

MAC
Text Editors
– Brackets: http://brackets.io
– BBEdit: http://drsteveanderson.com/software/mac/BBEdit_13.0.4.dmg
FTP Client
– Filezilla: http://drsteveanderson.com/software/FileZilla_3.44.2.bz2
Image Editor
– Gimp: https://www.gimp.org/downloads


Cheatsheets

– Useful Code – Basic: http://drsteveanderson.com/cheatsheets/useful-code-basic.pdf
– Useful Code – Layout: http://drsteveanderson.com/cheatsheets/useful-code-layout.pdf


Lessons

– HTML: http://drsteveanderson.com/lessons/html.pdf
– CSS: http://drsteveanderson.com/lessons/css.pdf
– CSS for Layout: http://drsteveanderson.com/lessons/layout-css-grid.pdf


Lectures

– Design: http://drsteveanderson.com/lectures/design.pptx
– Graphics for the Web: http://drsteveanderson.com/lectures/graphics.pptx


Grid Paper

– 1-Column: http://drsteveanderson.com/grid-paper/1-column.png
– 2-Column: http://drsteveanderson.com/grid-paper/2-column.png
– 3-Column: http://drsteveanderson.com/grid-paper/3-column.png
– 4-Column: http://drsteveanderson.com/grid-paper/4-column.png
– 5-Column: http://drsteveanderson.com/grid-paper/5-column.png
– 6-Column: http://drsteveanderson.com/grid-paper/6-column.png
– 12-Column: http://drsteveanderson.com/grid-paper/12-column.png


Images for Lessons

– images.zip: http://drsteveanderson.com/software/images.zip


Web Sites

– CSS Grid Layout: http://grid-layout.com
– W3 Schools CSS Reference: https://www.w3schools.com/cssref


Links to Online Lectures

Tuesday, 10 March: 16:00 – 18:30
https://youtu.be/OkEySS_oPUY

Wednesday, 11 March: 10:30 – 13:00
https://youtu.be/jpocyj7j9Xg

Friday, 20 March: 9:00 – 11:00
https://youtu.be/SylF_x2dHUY

Saturday, 21 March: 11:00 – 13:00
https://youtu.be/y9i0BhTC2rI

Friday, 27 March: 9:00 – 11:00
https://youtu.be/4LzMr5wgEt4

Saturday, 28 March: 11:00 – 13:00
https://youtu.be/UCP067rISj4