DW Introduction

DW Introduction   Short Introduction to DW - look around, panels, docking, workspace.
DW-Starting New site Generic Intro How to start a new wesite in DW - website design process
DIV Tags   New DIV tags and setting up CSS

Halloween Site

Halloween 01 01 Video
How to Start a new website, Comp/wireframe, Name each page, new local sites folder, Paletton, bring over all images,
4:26 - setting up new website using Dreamweaver

Halloween 02

02 Video
Review of DW, making new HTML5 page, adjusting panels, switching between views (code,split,Design/Live)
3:35 Making DIV tags
Tag Selectors, New Internal CSS, selectors, #container, making css for all div tags.
Halloween 03 03 Video
Review of Workspace Editor, panels, Tag Selector,
4:51 Adding CSS, Adding CSS selectors, using COMP to make site, how to center a website,
Halloween 04 04 Video
Review of where site is located, inserting Images, using Paletton image to change CSS colors, paint sampler
Halloween 05 05- Video
Review of DW Setup, CSS, title, Page Properties(!), Font changes, body color, link css, headings,
Halloween 06 06 Video
Site Setup Review, Externalize CSS
Halloween 07 07 Video
Setting up Links to other pages (that don't exist yet) Make all pages with links to each page, Change titles on each page, change headers.
Simple Edits for Images
Halloween 08 08 Video
Adding all images to the website,
2:22 adding video to website
Halloween 09 09 Video
Uploading a a website for the first time.
Check your website out on www.mhsweb1.com

6-Adobe Site

Adobe 01 12:13 Sketch Site Out, Nav on Left, Site Comp, color.adobe.com and Paletton.com
Adobe 02 14:53 Set up new website, New Page, DOM Panel, Setting up DIV using HTML5 (header,nav,main,footer) CSS Styles for HTML5 tags, FrootLooping colors,
Adobe 03 9:10 Inserting Images 3 ways, Letting DW insert Images, Optimizing Images, Paste Special, DOM Panel to change <p> to >h2>, DOM Panel to .floatleft
Changing Fonts -

Adobe 04

6:00 Inserting Links using a Table, Inserting Link Images, Background Images / cover

7-LC - Language Club Website
Chapter 6-7 in Green Book Files HERE

LC-01 6:26

New site setup - Comp, Bringing in Files,
Comp and DIV Tags

LC-02 9:07

DIV Tags, Creating initial page, and CSS

LC-03 8:37 Internal -- Externalizing CSS Sampling colors from header, container background, bg repeat
Rollover images, Bottom LinksCreating Template
LC-04 10:14

Template/Editable Regions, Saving a template, (New Folder & Page Names), new pages from tempate, Lorem Ipsum, adding content.

LC-05 13:00

H1,H2,H3 on main page, Additional Content and Uploading, Table with CSS, Float left/right with margins, e-mail links, adding embed map from GoogleMaps & resizing

LC-06 6:08 Checking over the website, footer links using sniper & folder tool, Using template to update ALL pages, E-Mail links, Page Titles, Uploading website.

09 Bike and Hike

Part 01 10:50 Setting up Website, container, Making the website, BG gradient
Part 02 7:25

Footer Information, Adding & Editing Images,

Part 03 8:40

Image Map, swf sound file, Bike video

Part 04 7:18

Adding GIF image from internet, adding Word document and linking to word, Embedding YouTube video.

Part 05 13:40 Rollover Behaviors/Javascript, Form

10 My Disk Designs

10-MDD-01 11:47

Initial Site Setup,creating internal CSS, linking external CSS, Creating a form Privacy Policy, Internal Links

10-MDD-02 12:45 FAQ, Reports, links, Guestbook, Meta Data
10-MDD-03 7:00 MetaData - Description and Keywords

11- Demo Site

Responsive Page 12:29 Media Queries - Using Max and Min Width on pages.
Responsive Bootstrap Navigation 13:24 Bootstrap Demonstration
1. Navbar Linked to top
2. Changing Links usign Code view.
Responsive Bootstrap Carosel 6:00 Carosel - Responsive image slideshow
    Editing HTML code & Cleaning up Bootstrap

13 Personal Site
OLD Version (But might help!)

Day1 No Video

BUT you can look at above videos
Create your site using DIV tags
Replace NAV with ASIDE due to future bootstrap issues
Day2 No Video
BUT you can look at above videos

Use Paletton to make colors
H1-H3 - Link -
Background, etc

Part3 (8:51) Boostrap Nav Inserting Bootstrap
1. Navbar fixed to top - creating new links,
Part4 (11:02) Template

Create Template
Add H1 titles and Page Titles
Link footer &,Aside

Part4B (4:38) Linking Bootstrap Be careful!!!
DW Page Linking Old Sites

How to link up / uploading old websites

PS Page PS Portfolio Uploading and linking all the PS assignments that we have completed.


Day 05

General Stuff
8:34 Min

General Maintainence.
Using Word List, Index page, About me (Already done - Copy and Paste!), Target Blank!, STUFF Manga and Cartoonify, Paletton Page, Contact Page

Clean up, Images, Pages, CSS, Make Folders, Contact Me, Random Links, Adobe Pages,

13:13 Min

Photoshop files with small thumbnail version.
Day 07 Dreamweaver Linking up old websites.
Day 09 Check Links Check links and Orphan Files


ico File   Ico File for your browser Tab



Link to top