VISC210 - Web Design 2

Prerequisites: VISC 102 and VISC 110.Further focuses on the tools, strategies, and techniques for web site design, architecture, naviga- tion, language and production.Explores more in depth the methods for creating successful web sites from concept to implementation. Examines the process of integrating text,graphics, audio, and video for effective communication of information.

VISC210 Intro

Introduction to the Course

In this lesson we will be outlining the goals and expectations of this course as well as quickly reviewing the basics of HTML, CSS, and the Web in general so that we're all on the same page.

View Lesson…

HTML Fundamentals

Basic code structure of a Website

This week we are going to discuss how the Web works and how the various coding languages come together to make our modern Web experiences possible. We will also begin to dive into the fundamentals of HTML and how Web pages are created.

View Lesson…

Choosing a Code Editor

Various programs for Mac & Windows

In this lesson, I use jsbin.com to type out my code. However, I've also listed several other code editors both for Mac and Windows.

View Lesson…

Wild Style With CSS

Learning the basics of Cascading Style Sheets

We will be going over some of the basics of CSS and how it can transform a plain HTML document dramatically.

View Lesson…

Apple vs. Adobe

Why no Flash on the iPad?

We will discuss the heated battle between Apple and Adobe over compatibility issues of Flash with the iPad. We will also discuss the pros and cons of HTML5, CSS3, Javascript, and Flash and the future of the Web.

View Lesson…

Web Typography 101

Getting non-Web-safe fonts a Web page

Typography is a powerful artistic tool to impact your audience. It can completely change the look and feel of a layout and set a specific mood. Unfortunately, the Web has had a long struggle with Typography due to both technical and legal issues. However, very recently, some powerful break-thoughs have been made to free up Web designers to be more expressive with their use of type on the Web.

View Lesson…

Make your Site Public

Site Hosting, DNS, & Domain Registry

We will be setting up our sites online and in a way that will help them receive the most traffic possible through good SEO techniques.

View Lesson…

Tableless PSD to HTML 1

Preping your PSD for tabless Web design (part1)

This week we're going to be applying the concepts that we learned in CSS and HTML towards converting a Photoshop document into HTML.

View Lesson…

Tableless PSD to HTML 2

Preping your PSD for tableless Web design (part2)

This week's lesson will be a continuation of last week's were rebuilt out an HTML page based on a Photoshop template. We will be using some of the CSS principles from week four in addition to some new ones. In week three and four we spent our time primarily coding straight text, but this week we will be using some of Dreamweaver's tools to help us code faster. For those of you who do not have Dreamweaver, I will be showing the code as well. I will also be using the firebug occasionally to help me test out some of the CSS changes in Firefox.

View Lesson…

Tableless PSD to HTML 3

Preping your PSD for tabless Web design (part3)

This week we will be doing another video tutorial on CSS construction of our sample page.

View Lesson…

Flash vs HTML5

The battle between the two dynamic Web platforms

In earlier lessons, we had discussed the implementation of more dynamic features on the Web such as Javascript and Flash as well as the pros and cons of each. Just as a quick review, Flash has been the source of controversy in the Web design community due to its lack of support in Apple's popular products such as the iPad, iPod Touch, and iPhone.

View Lesson…

Intro to jQuery pt1

Write more, do less...

jQuery has emerged as the most popular Javascript library to date. We will explore what jQuery really is and how to use it.

View Lesson…

Intro to jQuery pt2

jQuery Continued

We will continue working with jQuery and jQueryUI to create drag-and-drop functionality, tabs, accordions, and other cool gadgets.

View Lesson…

Setting Up Nivo Slider

Javascript slideshow plugin

As we discussed briefly last week, jQuery is currently the most popular and widely used JavaScript framework. What this essentially does is takes very complex chunks of JavaScript code and organizes it in a way that allows users to run very complex functions with only a few simple lines of code.

View Lesson…

Intro to CMS

Expolore various CMS and blog platforms available

We have now been in the Web 2.0 era of dynamic Web design for quite some time now. Let's explore some of the available FREE options for converting our static HTML site into a dynamic, database-driven site.

View Lesson…

Building a Blog in Modx

Making your static site dynamic with Modx (part2)

Having set up our Modx site in the previous lesson, we will now build more dynamic features and work with community plugins to build our blog.

View Lesson…

Final Project - VISC210

Final project requirements

In this lesson, we'll be going over the requirements for your final project, which will be to build a 3-page website.

View Lesson…