Home » Computer Science » Web Design » Putting the Idea Together, Part 2

Steven Echavarria

Steven Echavarria

Putting the Idea Together, Part 2

Slide Duration:

Table of Contents

Section 1: Brainstorming
The Idea

12m 8s

Intro
0:00
Learning Objectives
0:17
Learning Objectives
0:18
The Idea
0:49
Sketching
0:50
Logo Sketch
5:25
Logo Sketch: Kiddo Apparel
5:26
Logo Sketch
9:01
Website Layout
9:02
Color Theory

21m 31s

Intro
0:00
Learning Objectives
0:18
Learning Objectives
0:19
Introduction
0:53
Why Color?
0:54
Color Wheel
2:37
Primary, Secondary, Tertiary Colors
2:38
Complementary Colors
4:05
Analogous Colors
5:34
Color Variations
7:12
Warm, Cool, and Neutral Colors
7:13
Value
9:15
Brightness
9:28
Saturation
9:44
Types of Colors
10:19
RGB Color (Red, Green, and Blue)
10:20
CMYK (Cyan, Magenta, Yellow, and Black) Pigment Colors
11:02
Mixing Colors
12:45
Mixing Colors
12:46
Cool Colors
13:44
Cool Colors
13:45
Warm Colors
15:36
Warm Colors
15:37
Neutral Colors
16:11
Neutral Colors
16:12
Saturated Colors
17:07
Saturated Colors
17:08
De-Saturated Colors
18:12
De-Saturated Colors
18:13
Logo Types

25m 43s

Intro
0:00
Learning Objectives
0:12
Learning Objectives
0:13
Logo Types
2:12
Text-based Logo and Icon/Image Base Logo
2:13
Text-Based Logo
2:49
Text-Based Logo: Examples
2:50
Icon Based Logo
4:48
Icon Based Logo: Examples
4:49
Creating Vector Base Logo Using Adobe Illustrator
7:26
Creating Vector Base Logo Using Adobe Illustrator
7:27
Web Layout

37m 54s

Intro
0:00
Learning Objectives
0:11
Learning Objectives
0:12
Digitally Layout Your Website Design
0:48
Template Design
0:49
Text Tools
10:22
Web Page Body Design
15:05
Graphic Design
17:55
Utility Design
20:03
Export Images for the Web
27:05
Export Images for the Web
27:06
Image Types: GIF, JPEG, PNG
29:28
Section 2: Creation
Setting Up Files

15m 39s

Intro
0:00
Learning Objectives
0:16
Learning Objectives
0:17
Preparing Image File for the Web
0:51
Image Size & File Types
1:30
Folder Hierarchy
6:11
Dreamweaver: Setting Up Folder Hierarchy
7:39
Putting the Idea Together, Part 1

34m 34s

Intro
0:00
Learning Objectives
0:24
Learning Objectives
0:25
Setting Up Web Page in Adobe Dreamweaver
0:13
Setting Up the Web Page in Adobe Dreamweaver
0:14
Stylizing Web Page in HTML5 & CSS
5:17
Putting the Idea Together, Part 2

47m 32s

Intro
0:00
Learning Objectives
0:15
Learning Objectives
0:16
CSS Navigation
1:32
CSS Navigation
1:33
Customer Service
19:30
Customer Service and Contact Page
19:31
Setting Up the Server

22m 45s

Intro
0:00
Learning Objectives
0:27
Learning Objectives
0:28
Useful Links
1:53
Overview
1:54
MAMP
5:01
WAMP
8:08
PhpMyAdmin
9:26
Web Hosting Services
12:21
Domain Registration
14:48
Setting Up the Server Example
16:49
MAMP, WAMP and PhpMyAdmin
16:50
Adding E-Commerce Functionality

13m 11s

Intro
0:00
Learning Objectives
0:32
Learning Objectives
0:33
E-Commerce Options
1:14
Introduction to Cartweaver
1:15
Zen Cart
7:01
Installing Cartweaver Extenstion Plugin to Dreamweaver Example
8:09
Installing Cartweaver 3 PHP Extension
12:03
Installing Cartweaver 3 PHP Extension
12:04
Cartweaver 3 PHP setup

32m 45s

Intro
0:00
Learning Objectives
0:39
Learning Objectives
0:40
Installing Cartweaver 3 PHP
1:12
Installing Cartweaver 3 PHP
1:13
Creating a Database
11:45
Creating a Database
11:46
Connecting to the Database
18:47
Connecting to the Database
18:48
Connecting to the Database, cont.
31:27
Input Connection Information
31:28
Input Website Information
31:40
Selection Presentation Files and Setup Miscellaneous Information
31:48
Setting Up Presentation Files, Part 1

45m 1s

Intro
0:00
Learning Objectives
0:21
Learning Objectives
0:22
Cartweaver's Detail Page
1:25
Learn How to Setup Carweaver's Detail Page
1:26
Cartweaver's Results Page
26:35
Learn How to Setup Cartweaver's Results Page and Activate Product Buttons
26:36
Setting Up Presentation Files, Part 2

15m 29s

Intro
0:00
Learning Objectives
0:17
Learning Objectives
0:18
Cartweaver's Order Form Page
0:59
Learn How to Setup Cartweaver's Order Form Page
1:00
Cartweaver's Confirmation and Showcart Page
6:44
Learn How to Setup Cartweaver's Confirmation Page and Show Cart Page
6:45
Content Management System

21m 31s

Intro
0:00
Learning Objectives
0:15
Learning Objectives
0:16
Content Management System
0:42
Learn How to Login Into and Make Changes In the Content Management System (CSM)
0:43
Editing Cartweaver's CSS File

12m 10s

Intro
0:00
Learning Objectives
0:17
Learning Objectives
0:18
Editing Cartweaver's CSS File
0:35
Changing Cartweaver's CSS File to Match Your Website's Color Palette
0:36
Setting Up Image Files

6m 37s

Intro
0:00
Learning Objectives
0:15
Learning Objectives
0:16
Image Sizes
0:46
Image Sizes & Importing Images Through the CMS
0:47
Image Folders Location
3:53
Section 3: Testing and Launch
Testing Websites

18m 13s

Intro
0:00
Learning Objectives
0:10
Learning Objectives
0:11
Browser Testing
0:42
Live Browser Service Testing
0:43
User Testing
7:46
Writs Out the Usability Test
7:47
Find Participate of All Types
10:08
Determine How Long Test Should Take
11:56
Evaluate the Results
13:47
Going Live

11m 31s

Intro
0:00
Learning Objectives
0:07
Learning Objectives
0:08
Uploading Files Via File Transfer Protocol (FTP)
0:28
Uploading Files Via File Transfer Protocol (FTP)
0:29
Web Design

22m 38s

Intro
0:00
Learning Objectives
0:18
Learning Objectives
0:19
Favicon
0:24
Implementing Favicon to Your Website
0:36
SSL Certificate
7:00
Creating and Setting Up Secure Sockets Layer
7:01
Exporting and Importing MySQL Database
12:42
Exporting and Importing MySQL Database File Into phpMyAdmin
12:43
Loading...
This is a quick preview of the lesson. For full access, please Log In or Sign up.
For more information, please see full course syllabus of Web Design
Bookmark & Share Embed

Share this knowledge with your friends!

Copy & Paste this embed code into your website’s HTML

Please ensure that your website editor is in text mode when you paste the code.
(In Wordpress, the mode button is on the top right corner.)
  ×
  • - Allow users to view the embedded video in full-size.
Since this lesson is not free, only the preview will appear on your website.

  • Discussion

  • Study Guides

  • Download Lecture Slides

  • Table of Contents

  • Related Services

Lecture Comments (9)

1 answer

Last reply by: Professor Echavarria
Sat Jul 13, 2013 3:57 PM

Post by Sharon Windless on July 10, 2013

How do I find the HTML & CSS files for this lecture? I see the PHP files. Are they located in link for the exercise files for each lecture that we can download?

0 answers

Post by Dana Amin on December 13, 2012

I can't follow you very well. becaue I can't see the whole codes ... and When I click on Send button I will see the all php codes that I have written it. And when you update in Dreamweaver I don't know what to do for that small box to pop up and update it.. thnaks

3 answers

Last reply by: Professor Echavarria
Mon Aug 6, 2012 7:53 PM

Post by Melchor Gonzales on April 8, 2012

Hi Steve,
I would like to see the complete source code, so that I could follow through in every topic you are trying to teach.Thanks!

1 answer

Last reply by: Professor Echavarria
Tue Apr 24, 2012 1:41 AM

Post by Jorge Guerrero on March 29, 2012

I'd like to comment that it's true that advertising on your website draws money in, but it also makes the site look cheap and sometimes even confusing. If you will be building a website for your company, make sure your company profits from its own line of business. Otherwise, offer something free so people will visit the site by the LOADS and you can profit from advertising someone else's site/products.

Putting the Idea Together, Part 2

  • CSS backgrounds are used to create a wallpaper effect.
  • CSS will be used to create the about us page.
  • CSS and PHP will be used to create the customer service page that customers will be using to voice themselves.
  • A pure CSS navigation is used in the design to show the power of flexibility.

Putting the Idea Together, Part 2

Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.

  • Intro 0:00
  • Learning Objectives 0:15
    • Learning Objectives
  • CSS Navigation 1:32
    • CSS Navigation
  • Customer Service 19:30
    • Customer Service and Contact Page

Related Services

Educator®

Please sign in to participate in this lecture discussion.

Resetting Your Password?
or
Still having trouble? Contact us
OR

Start Learning Now

Our free lessons will get you started (Adobe Flash® required).
 Get immediate access to our entire library.

Membership Overview

  • Available 24/7. Unlimited Access to Our Entire Library.
  • Search and jump to exactly what you want to learn.
  • *Ask questions and get answers from the community and our teachers!
  • Practice questions with step-by-step solutions.
  • Download lecture slides for taking notes.
  • Track your course viewing progress.
  • Accessible anytime, anywhere with our Android and iOS apps.