All posts by admin

MMDI 202 14: Preparation for Finals 12/01/14

INTRO:
– Play around with customizing your blog using the editing function.
– Show results next class
– Make a flavicon, install it
– customize your WP blog. Put all assignments here (Next week, I will produce the HW list)
– Work on Final. Design and development

Read the following articles/resources
– Some Basics
Mobile Site Bible
To Swipe?
– Sub-domain
How to redirect?. More than 1 way
– WordPress does it for you
– More mobile me
jquery picks
ready to slide?

Assignment 14: Mobile Workshop
Crate a redirect from a mobile device
Work on Final. Documentation + Design + Development
Course Faculty Evaluation Form 1415 Instructions
Course Number MMDI 202: Web Design Studio

CE 2411 09: Odds and Ends Before Final 11/24/14

INTRO:
Did you get your Favicons to work?
Review final deliverables

READING:
– Review Video and Flash
– All things, text
– More text from W3 Schools
– Some helpful SEO resources
More on SEO

EXTRAS:
– Some Basics
Mobile Site Bible
– Sub-domain
Media Query
To Swipe?
jquery picks
ready to slide?
– Adding Social Media
– Example form to get you started

ASSIGNMENT:
Final Site and deliverables due 12/01

MMDI 202 13: WordPress Customization 11/24/14

INTRO:
Make a favicon, install it
WP: Play around with the themes
Play around with customizing your blog using the editing function.
Show results next class

Class:
– Some helpful SEO resources
WP customize
– More WP custom
– WP theme mods
– WP theme customization
– More WP tips

Assignment:
Final WP customization
All HW on WP (List provided in Afternoon session)
Work on your final

Final Deliverables:
1. Final Web Site (+ Documentation/Process) – Please provide all of your Final Site files (HTML + CSS +Images) as a .zip file.
2. WordPress Site

HOMEWORK
10: Mobile redirect

09:Final WP customization
Put all HW on WP

08: Make a favicon, install it

07: Practice – Image alignment
Practice – Roll-overs and sprites

06: Practice- create tables and try all the attributes in Ch. 6
Practice modifying Cursors
Practice opacity, Z-index, drop down menu using lists, and drop shadows.

05: Create your own HTML/CSS site with multiple pages, using external CSS
Practice all list elements
Create a 3 column web page using CSS

04: Use external CSS
Practice tables (create an image mounted in a table, create other table structures including ‘colspan’ and ‘rowspan’).
Put text on top of your image/images in your table using the background image capability in HTML tables)

03: CSS: Create your own mini web site (at least 3 pages), using css to complete the following on each page:
1. place background image,
2. Use the “box model”
3. Use pseudo classes

02: DOCUMENTATION and PROCESS
– Start thinking about the site you want to build. Draft requirements.
– Who is the audience? Determine the target demographic and create preliminary user scenarios.
– Create User experience maps for your site
– Create a Site Map for the site. Start with content inventory.
– Create wireframes for several pages of your website (home+ top level + second level). Start with sketches. Post to your server.
– Create an HTML prototype with your wireframes
– Create template interface design, 3 levels (HOME + 2 sub pages)

01: HTML: Create a splash page for your web site (use anything you want) Example?
– Use HTML and images.
– Create links to multiple pages both internal and external (what does this mean?)
– Create a link to your email address for contact
– Add more structural and semantic HTML to your pages. Try all new HTML introduced in Chapters 1 and 2

CE 2411 08: HTML5 – 11/17/14

INTRO:
Practice – Image alignment
Practice – Roll-overs and sprites
Review Final Interface design
Due: FINAL WEB SITE (12/01/14)

HW Deliverables for final:
BASIC HTML
– Create a Basic splash page with images, links, and headings.
– Add more structural and semantic HTML to your pages.

PLANNING:
– 1-2 pragraph proposal For Final Website. Discuss limitations and example sites.
– Create Site Maps
– Create wireframes
– Build out your Site prototype using your final wire frames.
– Create Interface Design – 3 levels minimum, (JPG, PDF, ETC.).

CSS/HTML:
-Create your own mini web site (at least 3 pages), using css to complete the following on each page:
— 1. place background image,
— 2. Use the “box model”
— 3. Use pseudo classes
— 4. Include Declaration and metatags (refresh and redirect)
– HTML: Create a table. Try all tags and parameters introduced in chapter 6 (including “colspan”, “rowspan”, etc).
– HTML: Try using Photoshop/slices to create a table mounted image. Text over image?
– CSS: Practice text attributes. In particular, I want to see the @font-face
– Create a 3 column web page using external CSS
– Practice- create tables and try all the attributes in Ch. 6
– Practice styling Forms
– Practice modifying Cursors
– Practice opacity, Z-index, drop down menu using lists.
– Practice – Image alignment
– Practice – Roll-overs and sprites
– Practice all HTML5 elements in Chapter 17
– Practice – Image alignment
– Practice – Roll-overs and sprites
– Instal Favicon on your site
– Try Mobile redirect functionality

READING:
HTML5
The old
The new
What about those older browsers?

Extras:
FAViSize
Flavor FAVicon
Favicon generator

ASSIGNMENT:
Review 17
Practice all HTML5 elements in Chapter 17 (use code and images)
Read Ch 19, Ch 9, Ch 12
Work on your final PROJECT!!

MMDI 202 12: HTML5 + WordPRess 11/17/14

INTRO:
Practice – Image alignment
Practice – Roll-overs and sprites

READING:
HTML5
The old
The new
What about those older browsers?

Introduction to WordPress
Uses a database and PHP
WordPress the platform, not to be confused with wordpress.com
WordPress magic
WP customize
– More WP custom
– WP theme mods
– WP theme customization
– More WP tips

Extras:
FAViSize
Flavor FAVicon
Favicon generator

Assignment:
Review Ch 17
Make a favicon, install it
WP: Play around with the themes
Play around with customizing your blog using the editing function. Put all assignments here.
Show results next class
Review Ch. 19
Work on Final. Design and development

CE 2411 07: Images/CSS 11/10/14

Review:
Practice all list elements in Ch 3
Practice modifying Cursors
Practice opacity, Z-index, drop down menu using lists, and drop shadows.
Create 3 column layout with css.

READING
Examples of Drop down menu
Adding images is easy
Review “figure” and title=””
Sizes in CSS
Alignment
Centering
More than one way
The lowly roll over
Rollovers and all their parts
Negative values??
Margin Shorthand
Put it all together

ASSIGNMENT
Review 5, 16
Practice – Image alignment
Practice – Roll-overs and sprites
Final Design: Work on the final changes to your interface. Start working on your final Project.
Read Ch 17, 19

MMDI 202 11: IMAGES/CSS 11/10/14

INTRO
Practice- create tables and try all the attributes in Ch. 6
Practice styling Forms
Practice modifying Cursors
Practice opacity, Z-index, drop down menu using lists.

READING
Examples of Drop down menu
Adding images is easy
Review “figure” and title=””
Sizes in CSS
Alignment
Centering
All the different background image insertions
The lowly roll over
Rollovers and all their parts
Put it all together
Great Examples

ASSIGNMENT
Review 5, 16
Practice – Image alignment
Practice – Roll-overs and sprites
Final Design: Work on the final changes to your interface. Start working on your final Project.
Read Ch 17, 19

CE 2411 06: Advanced CSS 11/03/14

Review:
HTML/CSS:
Create a table. Try all tags and parameters introduced in chapter 6 (including “colspan”, “rowspan”, etc). Try using Photoshop/slices to create a table mounted image. Text over image?
Create a mini site (3-4 pages) using external css, and multiple box models and their parameters. Practice css hierarchy

READING:
Ch. 14
List styles
List images
List positioning and shorthand
Table Properties
Even the Cursor can change
z-index, and some examples of opacity, z-index and lists in drop down menus
3 columns
Review Zen Garden

Assignment:
Review 3, 14
Read: Chapter 5, 16
HTML/CSS:
Practice all list elements in Ch 3
Practice modifying Cursors
Practice opacity, Z-index, drop down menu using lists, and drop shadows.
Create 3 column layout with css.

MMDI 202 10: CSS/Tables 11/03/14

INTRO:
CSS:
Create your own HTML/CSS site with multiple pages, using external CSS
Practice all list elements
Create a 3 column web page using CSS

READING:
Basic structure
Headings
Spanning columns and rows
Long Tables
Oldies but goodies
Ch. 14
List styles
List images
List positioning and shorthand
Table Properties
Even the Cursor can change
Ch 15
960.gs
z-index, and some examples of opacity, z-index and lists in drop down menus
3 columns

ASSIGNMENT:
Review 6, 12, 14
Practice- create tables and try all the attributes in Ch. 6
Practice modifying Cursors
Practice opacity, Z-index, drop down menu using lists, and drop shadows.
Read Chapter: 5, 16

CE 2411 05: More CSS 10/27/14

Review:
HTML:
1. Use Metatags (refresh and redirect)
2. Include declaration “Doctypes”
3. Try a table
CSS:
Create your own mini web site (at least 3 pages), using css to complete the following on each page:
1. place background image,
2. Use the “box model”
3. Use pseudo classes
INTERFACE:
Try a version.

READING:
Best examples
CSS Rules
External CSS. Here is how
Class, ID and Grouping
CSS priorities
Tables – Review

Assignment:
Review 6, 10, and 13
Read: Chapter 3, 14
HTML/CSS:
Create a table. Try all tags and parameters introduced in chapter 6 (including “colspan”, “rowspan”, etc). Try using Photoshop/slices to create a table mounted image. Text over image?
Create a mini site (3-4 pages) using external css, and multiple box models and their parameters. Practice css hierarchy