Section 1: Course Introduction |
|
What is Dreamweaver? |
3:15 |
| |
Intro |
0:00 | |
| |
Dreamweaver Introduction |
0:07 | |
| |
Dreamweaver Interface |
0:32 | |
| |
| Code View |
0:48 | |
| |
| Design View |
1:04 | |
| |
| Preview in Browser |
1:08 | |
| |
| Adobe Products |
1:29 | |
| |
| Panels and Menus |
1:47 | |
| |
Summary |
2:31 | |
|
How to Use the Project Files for this Course |
3:42 |
| |
Intro |
0:00 | |
| |
Course File Instructions |
0:08 | |
| |
Extras Folder |
1:46 | |
| |
Summary |
2:44 | |
Section 2: Introduction to the Web |
|
URL Basics |
5:53 |
| |
Intro |
0:00 | |
| |
Domain Name |
0:22 | |
| |
Protocol |
1:34 | |
| |
Folders and Website Files |
2:54 | |
| |
Web page file extension |
4:33 | |
|
Client Server Environment |
6:39 |
| |
Intro |
0:00 | |
| |
Web Server Example |
0:21 | |
| |
| Port Number |
2:17 | |
| |
Browser Environment |
3:45 | |
| |
| Other Browsers |
4:31 | |
| |
Summary |
5:07 | |
|
Static vs. Dynamic Pages |
4:56 |
| |
Intro |
0:00 | |
| |
Static Page Request Process |
0:30 | |
| |
Dynamic Page Request Process |
1:32 | |
| |
| Application Server |
2:24 | |
| |
| Server Side Languages |
3:01 | |
| |
Summary of Differences between Static and Dynamic |
3:44 | |
|
Separation of Content & Presentation |
6:35 |
| |
Intro |
0:00 | |
| |
Three Parts of a Browser |
1:15 | |
| |
| HTML - Page Structure |
1:25 | |
| |
| CSS - Styling |
2:16 | |
| |
| JS - User Interactivity |
4:29 | |
| |
Interpreters |
5:24 | |
| |
Summary of the Three Parts of a Browser |
6:03 | |
|
Planning the Website Development Process |
5:08 |
| |
Intro |
0:00 | |
| |
Design Development process |
1:24 | |
| |
| Initiate Project Process |
1:55 | |
| |
| Site Development Process |
2:08 | |
|
Project Planning Documents |
5:08 |
| |
Intro |
0:00 | |
| |
Project Plan |
1:16 | |
| |
Design Document Questionnaire |
1:45 | |
| |
Design Document Items |
2:25 | |
| |
Homepage Wireframe |
2:42 | |
| |
Website Wireframe |
3:12 | |
| |
Login Process Flowchart |
3:35 | |
|
HTML Naming Conventions |
6:46 |
| |
Intro |
0:00 | |
| |
Examples of Different Naming Conventions |
0:49 | |
| |
| Headless Camel Casing |
2:34 | |
| |
File Extension Options |
4:22 | |
| |
Summary of Naming Conventions |
5:25 | |
|
Creating the Page Designs |
5:44 |
| |
Intro |
0:00 | |
| |
Examples of Page Designs and Programs |
0:40 | |
| |
| Photoshop Example |
1:27 | |
| |
| FireWorks Example |
2:11 | |
| |
JPEG Format Example |
4:25 | |
|
Copyright on the Web |
3:30 |
| |
Intro |
0:00 | |
| |
Copyright Law Links |
0:50 | |
| |
Copyrighted Page |
1:26 | |
|
Website Accessibility & the 508 Standard |
6:04 |
| |
Intro |
0:00 | |
| |
Accessibility Definition |
1:53 | |
| |
Accessibility Features |
2:30 | |
| |
Four Principles of Accessibility |
3:30 | |
Section 3: Working in the Browser |
|
HTML Versions & DOCTYPE |
8:25 |
| |
Intro |
0:00 | |
| |
XHTML Document Type |
0:37 | |
| |
Set Default Document Type |
2:31 | |
| |
HTML 5 Document Type and Comparison |
4:21 | |
|
Browser Differences |
8:28 |
| |
Intro |
0:00 | |
| |
Testing Different Browsers |
1:10 | |
| |
Google Analytics |
3:36 | |
|
Browser Developer Tools |
6:11 |
| |
Intro |
0:00 | |
| |
Google Chrome Developer Tools |
0:15 | |
| |
Firefox Web Console |
1:32 | |
| |
Internet Explorer Developer Tools |
2:34 | |
| |
| Change Browser Mode |
2:49 | |
| |
| Quirks Mode |
4:31 | |
| |
| CSS Viewer |
5:16 | |
|
Additional Browser Tools |
7:36 |
| |
Intro |
0:00 | |
| |
Web Developer Toolbar |
0:53 | |
| |
| View Document Size |
1:34 | |
| |
| Populate Form Fields |
2:24 | |
| |
| ColorZilla |
2:54 | |
| |
Firefox Extensions |
3:53 | |
| |
| Install Extension |
4:46 | |
| |
Customize Toolbar |
5:41 | |
|
Using Firebug for CSS/JS |
5:50 |
| |
Intro |
0:00 | |
| |
Installing Firebug |
0:28 | |
| |
Firebug Tabs |
2:30 | |
| |
| JavaScript Console |
2:36 | |
| |
| HTML Tab |
2:47 | |
| |
| CSS Tab |
3:35 | |
| |
Inspect Elements |
3:58 | |
| |
Link to Firebug |
5:21 | |
Section 4: The Dreamweaver Interface |
|
The Workspace Switcher |
5:31 |
| |
Intro |
0:00 | |
| |
Workspace Templates |
0:28 | |
| |
Reset Workspace |
1:47 | |
| |
Classic Workspace |
2:25 | |
| |
Workspace Switcher |
3:06 | |
| |
Manage Workspaces |
3:35 | |
| |
| New Workspace |
3:43 | |
|
Dreamweaver Interface Overview |
6:29 |
| |
Intro |
0:00 | |
| |
Menus |
0:43 | |
| |
Create New HTML |
1:33 | |
| |
Design View |
1:49 | |
| |
Insert Bar and Tabs |
2:21 | |
| |
Document Window |
3:24 | |
| |
Properties Tab |
4:11 | |
| |
Panels |
5:05 | |
| |
Overview and Summary |
5:21 | |
|
Navigating the Interface |
8:14 |
| |
Intro |
0:00 | |
| |
Modify/Customize Panels |
0:44 | |
| |
Move Panels |
3:53 | |
| |
Rearrange Panels |
4:42 | |
| |
Open and Close Properties Tab |
7:13 | |
|
Dreamweaver Preferences |
4:10 |
| |
Intro |
0:00 | |
| |
General Preferences |
0:23 | |
| |
| Allow Multiple Consecutive Spaces |
0:44 | |
| |
Fonts |
1:09 | |
| |
New Document |
1:43 | |
| |
Preview in Browser |
2:43 | |
|
Insert Bar & Insert Menu |
4:26 |
| |
Intro |
0:00 | |
| |
Create New HTML |
0:16 | |
| |
Insert Bar |
0:46 | |
| |
| Forms Tab |
1:03 | |
| |
| Common Tab |
1:18 | |
| |
Insert Menu |
1:39 | |
| |
Insert Bar within Designer Workspace |
3:36 | |
|
Working in Code View |
7:00 |
| |
Intro |
0:00 | |
| |
Example Page |
0:26 | |
| |
Coding Toolbar |
1:13 | |
| |
| Apply HTML Comment |
3:57 | |
| |
| Remove Comment |
4:39 | |
| |
Properties Area |
4:56 | |
| |
Line Numbers |
5:58 | |
| |
Summary |
6:08 | |
|
Installing Additional Browsers in Dreamweaver |
5:50 |
| |
Intro |
0:00 | |
| |
Edit Browser List |
0:56 | |
| |
| Add a browser |
1:49 | |
| |
| Set Secondary Browser |
3:58 | |
| |
| Select Preview in Browser |
4:42 | |
Section 5: Getting Started |
|
Defining a Site in Dreamweaver |
11:18 |
| |
Intro |
0:00 | |
| |
Manage Sites |
1:38 | |
| |
Create a New Site |
2:57 | |
| |
Files Panel |
6:16 | |
| |
Rearranging Site Files |
7:10 | |
| |
Local View |
9:40 | |
| |
Summary |
10:14 | |
|
The Importance of the Files Panel |
7:02 |
| |
Intro |
0:00 | |
| |
Blank Example Site in Files Panel |
0:13 | |
| |
Files Panel Options |
0:59 | |
| |
| Edit Menu |
2:06 | |
| |
| View Menu |
2:22 | |
| |
| Site Menu |
2:30 | |
| |
Delete Files |
2:51 | |
| |
Rename File |
3:54 | |
| |
Files Refresh |
5:31 | |
Section 6: Creating a Page Using a Pre-Defined Layout |
|
Pre-Defined CSS Layout Options |
8:21 |
| |
Intro |
0:00 | |
| |
Course Files |
0:21 | |
| |
Files in Files Panels |
1:37 | |
| |
New Document |
2:38 | |
| |
| Page Type |
3:14 | |
| |
| Layout Options |
3:21 | |
|
Creating a Pre-Defined CSS Layout Page |
7:18 |
| |
Intro |
0:00 | |
| |
New HTML5 Layout Page |
0:49 | |
| |
Preview in Browser |
2:28 | |
| |
Save Page |
2:43 | |
| |
Browser Preview |
4:35 | |
| |
Page in Files Panel |
5:12 | |
|
Building the Header Area |
15:39 |
| |
Intro |
0:00 | |
| |
Code View and Comments |
0:40 | |
| |
Customizing the Header |
1:22 | |
| |
| Removing Image Placeholder |
2:36 | |
| |
| Select Regions |
3:38 | |
| |
| Adding Text |
3:55 | |
| |
| Set Page Title |
4:24 | |
| |
CSS Styles Panel |
7:31 | |
| |
| Edit Header Color |
8:39 | |
| |
| Edit Header Text |
9:58 | |
| |
Add CSS Style Rule |
11:15 | |
| |
| Rule Definition |
12:35 | |
| |
Summary |
14:36 | |
|
Modifying the Navigation Column, Part 1 |
9:01 |
| |
Intro |
0:00 | |
| |
Modifying the Side Bar |
0:23 | |
| |
| Tag Selection |
1:07 | |
| |
| Changing Position and Background Color |
2:04 | |
| |
| Changing Text Color |
4:59 | |
| |
| Changing Hover Text and Background Color |
6:49 | |
| |
Summary |
8:17 | |
|
Modifying the Navigation Column, Part 2 |
10:36 |
| |
Intro |
0:00 | |
| |
Modifying the Side Bar |
0:30 | |
| |
| Editing Link Text |
0:34 | |
| |
| Correcting Mistakes |
1:20 | |
| |
| Inserting an Image |
3:52 | |
| |
| Fixing Format Errors |
5:08 | |
| |
Modifying the Header |
7:28 | |
| |
| Add new Margin Property |
8:03 | |
| |
Summary |
9:52 | |
|
Adding Content to the Page |
9:42 |
| |
Intro |
0:00 | |
| |
Modifying the Main Content Area |
0:23 | |
| |
| Removing Content |
1:15 | |
| |
| Inserting Code and Content |
2:35 | |
| |
| Page and Text Formatting |
4:30 | |
| |
Summary |
9:21 | |
|
Modifying the Footer Area |
7:38 |
| |
Intro |
0:00 | |
| |
Modifying the Footer |
0:22 | |
| |
| Footer Tag |
0:31 | |
| |
| Changing the Background Color |
1:36 | |
| |
| Customizing Text |
2:22 | |
| |
| Customize Address Tag |
3:42 | |
| |
Preview in Safari |
5:46 | |
| |
Format Troubleshooting |
6:09 | |
|
Changing the Page Background Color |
4:41 |
| |
Intro |
0:00 | |
| |
Modify Background Color |
1:01 | |
| |
| CSS Short Hand |
1:39 | |
| |
| Save Command Shortcut |
2:53 | |
| |
| Browser Preview |
3:10 | |
| |
Summary |
4:03 | |
Section 7: Building a Web Page from Scratch |
|
HTML Page Code |
5:58 |
| |
Intro |
0:00 | |
| |
HTML5 Page |
0:41 | |
| |
| Change Default Doctype to HTML5 |
1:16 | |
| |
HTML5 Code |
2:39 | |
| |
| Head Section Code |
3:01 | |
| |
| Title Tag Code |
3:41 | |
| |
Importance of Code View |
4:16 | |
| |
Summary |
5:12 | |
|
Creating a New Page |
4:34 |
| |
Intro |
0:00 | |
| |
Keyboard Shortcut to Create New Page |
0:49 | |
| |
Saving a New Page |
1:21 | |
| |
Create New Page with New Document |
3:27 | |
|
The Importance of a Title |
4:43 |
| |
Intro |
0:00 | |
| |
Importance of a Title on a Page |
0:10 | |
| |
| New Document |
0:17 | |
| |
| Save Document |
0:35 | |
| |
| Preview in Chrome |
0:52 | |
| |
| Default Bookmark Title |
1:13 | |
| |
| Search Engine Optimization |
1:35 | |
| |
| Preview in Firefox |
3:35 | |
Section 8: Adding Text Content |
|
Discovering Paste Special |
11:01 |
| |
Intro |
0:00 | |
| |
Paste Special Command from Word |
1:05 | |
| |
| Create New and Save |
1:22 | |
| |
| Paste Special with Full Formatting |
2:44 | |
| |
| Clean Up Source Code |
4:42 | |
| |
| Paste Special with Basic Formatting |
5:34 | |
| |
| Paste Special with Structure Only |
6:30 | |
| |
| Paste Special with Text Only |
7:29 | |
| |
Change Paste Preferences |
8:06 | |
|
Importing a Word Document |
3:52 |
| |
Intro |
0:00 | |
| |
Create New and Save |
0:42 | |
| |
Add Title |
1:11 | |
| |
Import Word Document |
1:32 | |
| |
Summary |
2:38 | |
|
Setting Headings |
6:17 |
| |
Intro |
0:00 | |
| |
Create New and Save |
0:17 | |
| |
Add Title |
0:40 | |
| |
Add Text |
0:47 | |
| |
Insert Heading Tags into Text |
1:55 | |
| |
Importance of a Heading Tag |
2:43 | |
|
Paragraphs & Line Breaks |
8:25 |
| |
Intro |
0:00 | |
| |
Paragraph Tags |
1:11 | |
| |
Selecting Text |
3:14 | |
| |
Insert Line Break Tag |
4:05 | |
|
Creating a Bulleted List |
10:31 |
| |
Intro |
0:00 | |
| |
Formatting Content |
0:42 | |
| |
| Add Title |
1:07 | |
| |
| Insert Heading Tag |
1:39 | |
| |
Creating a List |
2:13 | |
| |
| Creating an Unordered List |
3:07 | |
| |
| Example of Incorrect List Formatting |
3:23 | |
| |
Creating Nested Lists |
5:16 | |
| |
| Indent List |
5:59 | |
| |
Changing List Type |
7:50 | |
| |
| Change to Numbered List |
8:37 | |
| |
| Change Bullet Type |
9:04 | |
|
Creating a Numbered List |
4:21 |
| |
Intro |
0:00 | |
| |
Formatting Content |
0:20 | |
| |
| Merging Multiple Lines into Paragraph |
1:03 | |
| |
| Inserting Header Tag |
1:34 | |
| |
Create Numbered List |
2:36 | |
| |
| Create Ordered List |
3:08 | |
|
A Definition List |
4:27 |
| |
Intro |
0:00 | |
| |
Creating a Definition List |
0:30 | |
| |
| Select Text |
1:11 | |
| |
| Create Definition List from Format Menu |
1:29 | |
| |
Definition List Tags |
3:21 | |
|
Setting Bold & Italics |
6:12 |
| |
Intro |
0:00 | |
| |
Add Bold and Italics to Definition List |
0:12 | |
| |
| The Destinations Page |
0:23 | |
| |
| Making Terms Bold |
1:12 | |
| |
| Bold Tag Information |
1:42 | |
| |
| Making Definition Italic |
4:02 | |
| |
Summary |
5:41 | |
|
Inserting Special Characters |
7:23 |
| |
Intro |
0:00 | |
| |
ASCII Characters |
0:12 | |
| |
Create Copyright Message |
2:10 | |
| |
| Insert Copyright Symbol |
3:23 | |
Section 9: CSS Basics |
|
What is CSS? |
6:03 |
| |
Intro |
0:00 | |
| |
Cascading Style Sheets |
0:05 | |
| |
Example CSS Layouts |
0:59 | |
| |
| Turning CSS Off Examples |
3:27 | |
|
The Syntax for a CSS Rule |
9:24 |
| |
Intro |
0:00 | |
| |
Create New and Save |
0:27 | |
| |
Add Title |
1:05 | |
| |
Adding CSS Styles to a Page |
1:18 | |
| |
| Dragging Tags |
2:24 | |
| |
| Placing Content |
2:48 | |
| |
| Adding a Selector |
3:28 | |
| |
| Creating Style Rules |
4:16 | |
| |
| Properties and Values |
7:19 | |
| |
CSS Syntax Examples |
7:53 | |
|
CSS Rule Locations |
9:03 |
| |
Intro |
0:00 | |
| |
Three Locations for Placing Style Rules |
0:31 | |
| |
| Inline Rule |
0:58 | |
| |
| Internal or Embedded Rule |
1:22 | |
| |
| External Rule |
1:41 | |
| |
Inline Style Rule |
2:08 | |
| |
Internal or Embedded Style Rule |
3:35 | |
| |
| Examples of Internal/Embedded Style Rule |
5:09 | |
| |
External Style Rule |
5:59 | |
| |
| Example of Linking a Style Sheet |
7:13 | |
| |
Summary |
8:40 | |
|
Types of CSS Selectors |
9:51 |
| |
Intro |
0:00 | |
| |
Three Main Selector Types |
0:16 | |
| |
| HTML Tag Selector Type |
0:35 | |
| |
| Class Selector Type |
2:40 | |
| |
| ID Selector Type |
4:35 | |
| |
Selector Rules and Examples |
7:17 | |
| |
| HTML Tag Selector Example |
7:46 | |
| |
| Class Selector Example |
8:09 | |
| |
| ID Selector Example |
8:28 | |
Section 10: Formatting with Text Using CSS |
|
Creating an Inline Style Rule |
9:54 |
| |
Intro |
0:00 | |
| |
Code View for Creating an Inline Header Style |
2:02 | |
| |
| Creating a Font Type Style |
3:14 | |
| |
| Creating a Color Style |
4:26 | |
| |
| Creating a Font Size Style |
5:16 | |
| |
| Split Horizontally |
6:06 | |
| |
Creating Paragraph Styles |
7:00 | |
| |
Summary |
9:17 | |
|
Creating an Internal or Embedded Rule |
10:32 |
| |
Intro |
0:00 | |
| |
Create New and Save |
0:35 | |
| |
Add Title |
0:45 | |
| |
Adding Text Content |
1:26 | |
| |
Add New CSS Style Rule |
5:44 | |
| |
Assigning Style Properties |
6:56 | |
| |
Duplicate Style Rule |
8:12 | |
| |
Modify Style Rule |
8:46 | |
| |
Summary |
10:17 | |
|
Working with an External CSS File |
9:27 |
| |
Intro |
0:00 | |
| |
Move CSS Rules to External Style Sheet |
0:32 | |
| |
CSS File in Styles Panel |
2:00 | |
| |
| Remove Style Tag |
2:35 | |
| |
External Style Sheet |
2:46 | |
| |
| Related Files Toolbar |
3:13 | |
| |
| Adding Additional Styles |
4:53 | |
| |
Summary |
8:56 | |
|
Attaching a Style Sheet |
6:34 |
| |
Intro |
0:00 | |
| |
Apply External Style Sheet to Another Page |
0:56 | |
| |
| Attach External Style Sheet |
1:09 | |
| |
Apply Same Style Rules to Multiple Tags |
2:39 | |
| |
Troubleshooting Style Problems |
4:30 | |
| |
Summary |
5:44 | |
|
Creating a Class Selector |
12:29 |
| |
Intro |
0:00 | |
| |
Create New and Save |
0:16 | |
| |
Add Title |
0:48 | |
| |
Adding Text Content |
0:59 | |
| |
Attaching a Style Sheet |
2:05 | |
| |
Adding and Formatting Headers |
3:18 | |
| |
Creating a Class |
4:27 | |
| |
| New CSS Rule |
5:24 | |
| |
| Setting Class Definition |
5:55 | |
| |
Applying a Class to Text |
7:30 | |
| |
| Troubleshooting Class Errors |
7:55 | |
| |
Editing Class Properties |
8:53 | |
| |
| Edit Rule Definition |
8:59 | |
| |
Other Methods for Applying Classes |
9:42 | |
| |
Preview in Safari |
11:10 | |
| |
Summary |
11:53 | |
|
Dreamweaver Style Tools |
11:14 |
| |
Intro |
0:00 | |
| |
Code Navigator |
0:30 | |
| |
Enable/Disable Styles Option |
3:50 | |
| |
| Comments Out Style Rule |
5:02 | |
| |
| Enable/Disable All |
6:05 | |
| |
Live View |
6:37 | |
| |
| Live Code |
7:56 | |
| |
| Inspect |
8:24 | |
| |
Summary |
10:10 | |
Section 11: Working with Fonts on the Web |
|
Creating a Custom Font Stack |
8:58 |
| |
Intro |
0:00 | |
| |
Create New Page |
0:13 | |
| |
Properties Area |
0:28 | |
| |
| Edit Font List |
1:36 | |
| |
Adding Style Rules to Content |
5:17 | |
| |
Preview in Browser |
6:55 | |
| |
Summary |
8:35 | |
|
Working with Web Fonts |
5:36 |
| |
Intro |
0:00 | |
| |
Fonts Overview |
0:07 | |
| |
Adobe Type Service |
1:52 | |
| |
Google Fonts |
2:40 | |
| |
Font Squirrel |
3:26 | |
| |
Font Licensing |
3:34 | |
| |
Summary |
4:49 | |
|
Using Google Fonts |
13:32 |
| |
Intro |
0:00 | |
| |
Google Fonts |
0:05 | |
| |
| Access and Preview Fonts |
0:29 | |
| |
| Font Collection Area |
2:50 | |
| |
| Review Font |
4:05 | |
| |
| 'Use Font' Feature |
4:23 | |
| |
Adding Google Fonts |
6:21 | |
| |
| Adding New Style with Google Font |
9:31 | |
| |
Preview in Browser |
11:29 | |
| |
Summary |
13:10 | |
|
Adding Fonts from Fontsquirrel |
18:02 |
| |
Intro |
0:00 | |
| |
Font Squirrel Fonts |
0:08 | |
| |
| Font Squirrel Website |
1:23 | |
| |
| Download Font Zip File |
2:28 | |
| |
| Extract Font File |
3:04 | |
| |
| Web Font Generator |
4:23 | |
| |
| Download Web Font Kit |
6:38 | |
| |
| Extract Web Font Kit |
7:44 | |
| |
Working with Font Squirrel Fonts |
8:20 | |
| |
| HTML Font File Preview |
9:29 | |
| |
| CSS Font File |
9:54 | |
| |
| Copying over Font Styles |
10:26 | |
| |
| Adding Styles |
11:56 | |
| |
| Preview in Browser |
12:40 | |
| |
| Troubleshooting Errors |
13:25 | |
| |
| Adding more Styles |
15:13 | |
| |
| Preview in Browser |
16:13 | |
| |
Summary |
16:58 | |
Section 12: Inserting Images |
|
Web Image File Formats |
16:44 |
| |
Intro |
0:00 | |
| |
Two Different Image Formats |
0:43 | |
| |
| Vector Graphics |
0:52 | |
| |
| Raster Images |
2:05 | |
| |
Raster Image Formats |
2:49 | |
| |
| Three Types of Raster Image Formats |
2:52 | |
| |
| Optimization Process |
3:48 | |
| |
| GIF Image Format |
6:27 | |
| |
| JPG Image Format |
8:49 | |
| |
| PNG Image Format |
9:39 | |
| |
Vector Graphics |
11:40 | |
| |
| Scalable Vector Graphics |
12:35 | |
| |
Web Page Image Creation Tips |
14:18 | |
| |
Summary |
16:20 | |
|
The Assets Panel |
7:32 |
| |
Intro |
0:00 | |
| |
Assets Panel |
0:35 | |
| |
| Colors Used |
1:54 | |
| |
| URLs Outside the Website |
2:21 | |
| |
| Flash Files |
2:38 | |
| |
| Shockwave Files |
2:56 | |
| |
| Movie Files |
3:13 | |
| |
| Scripts, Templates, Library |
3:29 | |
| |
| Images Category |
3:41 | |
|
Inserting an Image & Alternate Text |
9:07 |
| |
Intro |
0:00 | |
| |
Inserting an Image |
0:40 | |
| |
| Insert Image using Image Name |
1:17 | |
| |
| Inserting Alternate Text |
1:27 | |
| |
| Insert Image using Image Icon |
3:09 | |
| |
| Insert Image using Insert Button |
5:23 | |
| |
Preview in Browser |
7:11 | |
| |
Summary |
8:31 | |
|
The Difference between Alternate Text & Title |
6:22 |
| |
Intro |
0:00 | |
| |
Image Alternate Text Explanation |
0:10 | |
| |
Image Title Explanation |
0:51 | |
| |
Add an Image Title |
1:39 | |
| |
Preview in Browser |
2:46 | |
| |
Editing Image Titles |
3:06 | |
|
Setting the Default Editors for Dreamweaver |
6:09 |
| |
Intro |
0:00 | |
| |
Setting Default Image Editors |
1:07 | |
| |
| Set Preferences |
1:16 | |
| |
| Adding Image Editors |
2:08 | |
| |
| Set Primary Editor |
3:39 | |
| |
| Removing Editors |
4:38 | |
| |
Editor Icon Shortcut |
5:09 | |
| |
Summary |
5:39 | |
|
Incorporating Photoshop Smart Objects |
6:44 |
| |
Intro |
0:00 | |
| |
Photoshop Smart Object Explanation |
0:09 | |
| |
Inserting Image from Files Panel |
0:27 | |
| |
| Image Optimization |
1:43 | |
| |
| Editing with Photoshop |
3:36 | |
| |
Update from Original |
5:20 | |
| |
Summary |
5:53 | |
Section 13: Adding Video to Web Pages |
|
Inserting Flash Files |
8:57 |
| |
Intro |
0:00 | |
| |
Create New HTML Page |
0:10 | |
| |
Inserting SWF File |
0:37 | |
| |
| Preview SWF File |
3:00 | |
| |
| Add SWF File |
3:32 | |
| |
| Autoplay and Loop Options |
5:05 | |
| |
SWF File Flash Player Error Message |
6:12 | |
| |
Copy Dependent Files |
6:52 | |
| |
Summary |
8:22 | |
|
Inserting Flash Video |
10:19 |
| |
Intro |
0:00 | |
| |
Add Flash Video using Insert Menu |
1:51 | |
| |
| Insert FLV |
2:33 | |
| |
| Browse File Location |
3:10 | |
| |
| Setting Controls Skin |
3:32 | |
| |
| Set Auto Rewind |
6:28 | |
| |
Preview in Browser |
7:29 | |
| |
Add a Title |
8:22 | |
| |
FLV File Flash Player Error Message |
8:44 | |
| |
Summary |
9:04 | |
|
Inserting HTML5 Video |
14:43 |
| |
Intro |
0:00 | |
| |
Setting up an HTML5 Video |
0:44 | |
| |
| History of Videos on the Web |
1:43 | |
| |
| Video Coding |
3:26 | |
| |
| Video Tag |
5:14 | |
| |
| Controls |
5:48 | |
| |
| Poster for Video |
6:00 | |
| |
| Width and Height |
6:24 | |
| |
Preview In Browser |
6:40 | |
| |
Troubleshooting Video and Browser Issues |
8:59 | |
| |
Insert FLV |
11:36 | |
| |
Preview In Browser |
12:02 | |
| |
Video Formats |
13:15 | |
Section 14: Creating Hyperlinks |
|
Linking to Website Files |
13:46 |
| |
Intro |
0:00 | |
| |
Creating Hyperlinks between Web Pages |
0:30 | |
| |
| Create New File |
3:14 | |
| |
| Assigning a Hyperlink using Point to File |
5:01 | |
| |
| Assigning a Hyperlink using Browse for File |
7:21 | |
| |
Preview in Browser |
7:48 | |
| |
Creating Hyperlinks to other Files |
10:02 | |
| |
| Features of Point to File |
10:39 | |
| |
Preview in Browser |
11:59 | |
| |
Linking Image to Web Page |
12:47 | |
|
Linking to Files Outside Your Website |
7:37 |
| |
Intro |
0:00 | |
| |
Linking to a Website |
0:45 | |
| |
| Link Area |
1:14 | |
| |
| Open Link in New Tab |
4:15 | |
| |
Another Link Example |
5:39 | |
| |
Summary |
6:25 | |
|
Email Links |
10:20 |
| |
Intro |
0:00 | |
| |
Creating an Email Link |
0:21 | |
| |
| Insert Email Link |
1:02 | |
| |
| Adding Subject Line Information |
6:12 | |
| |
| Adding CC Recipients |
8:40 | |
| |
Summary |
9:54 | |
|
Named Anchors |
10:06 |
| |
Intro |
0:00 | |
| |
Adding Links to Page Content |
0:26 | |
| |
| Insert Image |
1:00 | |
| |
| Creating Navigation Bar with Links |
2:41 | |
| |
| Insert Named Anchor |
3:46 | |
| |
| Linking to Anchor |
5:10 | |
| |
| Preview in Browser |
6:31 | |
| |
| Add Link to Top of Page |
7:11 | |
|
Image Maps/Hotspots |
11:45 |
| |
Intro |
0:00 | |
| |
Creating an Image Map |
0:47 | |
| |
| Select Image |
1:35 | |
| |
| Image Map/Hotspot Tools |
1:43 | |
| |
| Link Hotspot |
3:06 | |
| |
| More Hotspot Tools |
3:55 | |
| |
Preview in Browser |
8:37 | |
| |
Troubleshooting Image Hotspots |
9:34 | |
| |
Summary |
10:53 | |
|
Creating the Navigation Bar |
5:47 |
| |
Intro |
0:00 | |
| |
Create New Contact Us Page |
0:11 | |
| |
| Add Title |
0:37 | |
| |
| Add Header |
0:48 | |
| |
| Add Text Content |
1:19 | |
| |
| Bulleted List |
2:56 | |
| |
Create Hyperlinks to Pages |
3:17 | |
| |
| Assigning Links |
4:22 | |
| |
Summary |
5:38 | |
|
Adding Styles for Hyperlinks |
13:20 |
| |
Intro |
0:00 | |
| |
Basic Hyperlink Styles |
0:36 | |
| |
| Create New CSS Style |
1:18 | |
| |
| Selector Type |
1:32 | |
| |
| Selector Name |
2:09 | |
| |
| Set Font Family |
3:14 | |
| |
| Set Font Size |
3:47 | |
| |
| Text-transform |
4:20 | |
| |
| Set Color |
4:31 | |
| |
| Text Decoration |
4:39 | |
| |
| Set Line Height |
4:55 | |
| |
| Set Font Weight |
5:29 | |
| |
Preview in Browser |
5:47 | |
| |
Add Visited Link Style |
6:38 | |
| |
Add Hover Link Style |
8:40 | |
| |
| Change Background Color |
10:00 | |
| |
Add Active Link Style |
11:26 | |
| |
Summary |
12:37 | |
Section 15: Positioning Content Using CSS |
|
How to Use CSS for Page Layout |
7:51 |
| |
Intro |
0:00 | |
| |
Page Layout Example |
0:10 | |
| |
| HTML Tasks |
1:16 | |
| |
| CSS Tasks |
2:34 | |
| |
Code Examples |
3:50 | |
| |
| HTML Code Example |
4:01 | |
| |
| CSS Code Example |
5:47 | |
|
Understanding the Box Model |
8:33 |
| |
Intro |
0:00 | |
| |
The Box Model Explanation |
0:19 | |
| |
Add Padding |
2:01 | |
| |
Add Border |
3:43 | |
| |
Add Margin |
4:01 | |
| |
Disabling Styles |
6:15 | |
| |
Summary |
8:17 | |
|
Creating Boxes on the Page |
11:56 |
| |
Intro |
0:00 | |
| |
Create New Page |
0:07 | |
| |
Insert Div Tag Box |
0:41 | |
| |
| New ID CSS Rule |
1:36 | |
| |
| Assign Properties |
2:50 | |
| |
Modify Box Properties |
4:26 | |
| |
Insert Div Tag Box on Left |
4:53 | |
| |
| Set Insert Location |
5:48 | |
| |
| Assign Properties |
6:25 | |
| |
Insert Div Tag Box on Right |
7:13 | |
| |
| New ID CSS Rule |
8:16 | |
| |
| Assign Properties |
8:33 | |
| |
Code View of Boxes |
9:14 | |
| |
Preview In Browser |
10:00 | |
| |
Summary |
10:43 | |
|
Controlling Content Boxes Using CSS |
14:53 |
| |
Intro |
0:00 | |
| |
Create New Page |
0:18 | |
| |
Creating Divs with Matching IDs |
0:32 | |
| |
| Insert Div Tag |
0:41 | |
| |
| New ID CSS Rule |
1:14 | |
| |
| Assign Properties |
1:47 | |
| |
| Insert Header Div Tag |
3:42 | |
| |
| Assign Properties |
4:56 | |
| |
| Add Text |
6:11 | |
| |
Building Navigation Bar |
6:50 | |
| |
| Insert Div Tag |
6:57 | |
| |
| Set Insert Location |
7:00 | |
| |
| Assign Properties |
7:33 | |
| |
| Add Text |
8:31 | |
| |
Create Content Area |
9:07 | |
| |
| Insert Div Tag |
9:15 | |
| |
| Assign Properties |
9:46 | |
| |
Modify Header Style |
11:01 | |
| |
Add Float Property |
11:39 | |
| |
Add Padding Property |
12:20 | |
| |
Add Margin-Left Property |
13:11 | |
| |
Summary |
13:47 | |
Section 16: Types of Positioning |
|
Absolute Positioning |
14:51 |
| |
Intro |
0:00 | |
| |
Absolute Positioning Introduction |
1:15 | |
| |
Modifying Div Color |
1:33 | |
| |
Code View of Elements |
3:11 | |
| |
Delete Styles |
3:52 | |
| |
Using Absolute Positioning |
4:34 | |
| |
| Add Position Property |
5:42 | |
| |
| Add Left Property |
8:08 | |
| |
| Adjusting Position and Width |
10:04 | |
| |
Insert Right Div Tag |
10:39 | |
| |
| Assign Properties |
11:07 | |
| |
| Adjusting Position and Height |
12:10 | |
| |
Summary |
14:19 | |
|
Exploring Floats |
10:50 |
| |
Intro |
0:00 | |
| |
Float Property |
0:05 | |
| |
Preview in Browser |
1:14 | |
| |
Display Boxes |
1:31 | |
| |
Float Left Property |
4:32 | |
| |
Float Right Property |
8:00 | |
| |
Summary |
10:18 | |
|
What is a Clear? |
10:34 |
| |
Intro |
0:00 | |
| |
Div Float and Dimension Properties |
0:44 | |
| |
Adding a Clear Property |
6:50 | |
| |
Preview in Browser |
8:32 | |
| |
Height Discussion |
8:49 | |
| |
Summary |
9:58 | |
|
Fixed Positioning |
10:48 |
| |
Intro |
0:00 | |
| |
Fixed Positioning Examples |
0:11 | |
| |
Fixed Positioning with an Image |
2:18 | |
| |
| Current CSS Styles |
2:38 | |
| |
| CSS Text File |
4:17 | |
| |
| Preview in Browser |
5:30 | |
| |
| CSS Properties for Fixed Positioning |
6:17 | |
| |
| Preview in Browser |
7:48 | |
| |
Z-Index |
9:19 | |
| |
Summary |
10:17 | |
Section 17: Working With Tables |
|
Creating a Table |
9:48 |
| |
Intro |
0:00 | |
| |
Page Table Example |
0:19 | |
| |
Correcting Tags |
1:17 | |
| |
Creating a Table |
3:11 | |
| |
| Insert Table |
3:46 | |
| |
| Header Option |
5:01 | |
| |
| Non-Breaking Space |
5:50 | |
| |
| Add Content to Table |
6:31 | |
| |
Summary |
9:08 | |
|
Customizing & Modifying Table Properties |
13:09 |
| |
Intro |
0:00 | |
| |
Save Page |
0:33 | |
| |
Modifying the Table |
3:05 | |
| |
| Table Widths |
3:59 | |
| |
| Select Table |
5:17 | |
| |
| Borders |
6:01 | |
| |
| Cell Padding |
6:49 | |
| |
| Select Column of Content |
7:40 | |
| |
| Remove Column |
8:42 | |
| |
| Add and Remove Rows |
9:19 | |
| |
| Merge Columns |
11:10 | |
| |
Summary |
12:45 | |
|
Using CSS for Formatting Tables |
11:13 |
| |
Intro |
0:00 | |
| |
Table Styling |
0:33 | |
| |
| Table Header Tag |
1:16 | |
| |
| Removing a Class |
4:16 | |
| |
| Content Styles |
5:15 | |
| |
Preview in Browser |
7:59 | |
| |
Fixing Table Size |
8:39 | |
| |
Summary |
10:53 | |
|
Importing Spreadsheet Data onto a Page |
12:04 |
| |
Intro |
0:00 | |
| |
Create and Save New Page |
0:49 | |
| |
Locating Saved Files |
1:14 | |
| |
Importing Spreadsheet Data |
3:45 | |
| |
| Import Excel Document |
4:25 | |
| |
| Delete/Merge Cells |
5:57 | |
| |
| Customizing Table Content |
6:23 | |
| |
Importing Delimited Data |
7:59 | |
| |
| Import Tabular Data |
8:34 | |
| |
| Choosing a Delimiter |
9:07 | |
| |
| Table Formatting Options |
9:31 | |
| |
| Table Content Styles |
10:24 | |
| |
Summary |
11:16 | |
|
Merging & Splitting Table Cells |
10:05 |
| |
Intro |
0:00 | |
| |
Create and Save New Page |
0:10 | |
| |
Insert Table |
0:54 | |
| |
| Table Options |
1:05 | |
| |
Moving Cursor in Front of Table |
4:04 | |
| |
Adding an Image |
5:35 | |
| |
Moving a Table |
6:29 | |
| |
Merging and Splitting Table Cells |
7:41 | |
| |
| Merging Cells |
7:53 | |
| |
| Splitting a Cell |
8:42 | |
| |
Summary |
9:12 | |
|
Modifying Rows & Columns |
5:12 |
| |
Intro |
0:00 | |
| |
Save Page |
0:19 | |
| |
Hiding Table Widths |
0:23 | |
| |
Modifying Rows and Columns |
1:15 | |
| |
| Insert Column |
1:33 | |
| |
Moving through Cells |
2:28 | |
| |
Tabbing into New Row |
3:08 | |
| |
Deleting Rows |
3:36 | |
| |
Summary |
4:31 | |
|
Aligning Table Content |
4:46 |
| |
Intro |
0:00 | |
| |
Modifying Table Content |
0:38 | |
| |
| Table Tag Properties |
0:46 | |
| |
| Cell Alignment |
2:11 | |
| |
| Center Content in a Row |
2:44 | |
| |
| Align Content in a Column |
3:21 | |
| |
Summary |
4:01 | |
Section 18: Creating Forms |
|
Creating an HTML Form |
9:22 |
| |
Intro |
0:00 | |
| |
Creating a Contact Us Form |
0:52 | |
| |
| Adding Content |
1:20 | |
| |
| Insert Form |
2:24 | |
| |
| Insert Text Field with Form Tag |
3:54 | |
| |
| Form Tag Properties |
4:47 | |
| |
Summary |
8:29 | |
|
Text Field Elements |
8:37 |
| |
Intro |
0:00 | |
| |
Adding a Field Set |
0:26 | |
| |
| Insert Field Set |
0:51 | |
| |
Adding Name Text Field |
1:35 | |
| |
| Text Field Attributes |
2:05 | |
| |
| Text Field Tag Properties |
3:46 | |
| |
Adding Email Text Field |
4:58 | |
| |
| Text Field Tag Properties |
5:24 | |
| |
Preview in Browser |
5:58 | |
| |
Summary |
8:02 | |
|
Radio Buttons & Select Lists |
12:23 |
| |
Intro |
0:00 | |
| |
Adding more to the Field Set |
0:26 | |
| |
| Create another Field Set |
1:29 | |
| |
Adding a Radio Button |
2:25 | |
| |
| Insert Radio Button Group |
3:42 | |
| |
| Radio Button Group Options |
4:09 | |
| |
Set Initial State of Radio Button Group |
6:52 | |
| |
Adding a Drop Down Menu |
8:07 | |
| |
| Insert Select (List/Menu) |
8:29 | |
| |
| Set Drop Down Menu Attributes |
8:59 | |
| |
| Edit List Values |
9:38 | |
| |
Preview in Browser |
10:46 | |
| |
Add Choose Prompt |
11:11 | |
| |
Summary |
12:07 | |
|
Checkboxes & Submit Button |
8:09 |
| |
Intro |
0:00 | |
| |
Adding a Field Set |
0:36 | |
| |
Adding a Checkbox Group |
1:33 | |
| |
| Checkbox Group Attributes |
2:14 | |
| |
| Arrange Checkboxes |
4:38 | |
| |
Adding a Submit Button |
4:56 | |
| |
| Submit Button Attributes |
5:25 | |
| |
| Submit Button Tag Properties |
6:00 | |
| |
Preview in Browser |
6:25 | |
| |
Summary |
7:28 | |
|
Validating Form Data |
20:58 |
| |
Intro |
0:00 | |
| |
Form Field Validation Example |
0:32 | |
| |
Client Side and Web Server Validation |
2:54 | |
| |
Adding a Comment Section |
6:14 | |
| |
| Comment Text Field Attributes |
7:04 | |
| |
| Comment Text Field Tag Properties |
7:34 | |
| |
Add Form Field Validation |
8:47 | |
| |
| Tag Inspector Area |
8:54 | |
| |
| Add Validate Form Behavior |
10:00 | |
| |
| Validate Form Behavior Attributes |
10:17 | |
| |
Preview in Browser |
11:56 | |
| |
HTML5 Form Field Features |
14:56 | |
| |
| Required and Autofocus Attributes |
16:40 | |
| |
Preview HTML5 Form Validation in Browser |
18:08 | |
| |
Summary |
20:41 | |
|
Server-Side Validation Languages |
4:10 |
| |
Intro |
0:00 | |
| |
Five Server Side Languages |
0:40 | |
| |
| ASP |
0:56 | |
| |
| ASP.NET |
1:47 | |
| |
| ColdFusion |
2:08 | |
| |
| JSP and PHP |
2:42 | |
| |
Summary |
3:44 | |
Section 19: Library Items & Templates |
|
Template & Library Overview |
6:22 |
| |
Intro |
0:00 | |
| |
Dreamweaver Templates and Library Items |
0:12 | |
| |
| Dreamweaver Template Explanation |
0:44 | |
| |
| Library Item Explanation |
2:33 | |
| |
| Overview of Templates and Library Items |
4:50 | |
| |
Summary |
6:07 | |
|
Creating a Library Item |
8:30 |
| |
Intro |
0:00 | |
| |
Creating a Library Item |
0:13 | |
| |
| Delete a Library Item |
0:34 | |
| |
| New Library Item |
2:10 | |
| |
Library Folder |
3:31 | |
| |
How to Use a Library Item |
4:17 | |
| |
Library Item Tag |
5:12 | |
| |
Adding a Library Item |
5:46 | |
| |
Summary |
7:42 | |
|
Modify a Library Item |
5:33 |
| |
Intro |
0:00 | |
| |
Changing a Library Item |
1:07 | |
| |
| Edit Library Item |
1:42 | |
| |
| Save and Update Library Items |
2:35 | |
| |
Summary |
4:17 | |
|
Converting a Page into a Template |
11:23 |
| |
Intro |
0:00 | |
| |
How to Work with a Template |
0:27 | |
| |
| Create Blank Template File |
0:34 | |
| |
| Example Template File |
2:00 | |
| |
Preview in Browser |
2:22 | |
| |
Create Template from File |
3:56 | |
| |
| Save as Template |
4:11 | |
| |
| Template Description |
4:18 | |
| |
| Save and Update Links |
5:15 | |
| |
Create New Pages from Template |
6:26 | |
| |
| Editable and Non-Editable Regions |
8:07 | |
| |
Summary |
10:33 | |
|
Creating Editable Regions |
9:21 |
| |
Intro |
0:00 | |
| |
Create Editable Region for Content |
1:53 | |
| |
| Insert Editable Region |
2:22 | |
| |
| Set Name for Editable Region |
2:59 | |
| |
| Save and Update Template |
3:59 | |
| |
Create Editable Region for Nav Bar |
4:48 | |
| |
| Select and Insert Editable Region |
5:30 | |
| |
| Save and Update Template |
5:53 | |
| |
Update Current Page |
7:16 | |
| |
Summary |
7:49 | |
|
Applying a Template |
8:48 |
| |
Intro |
0:00 | |
| |
Applying a Template |
0:40 | |
| |
| Apply Template to About Us Page |
1:03 | |
| |
| Move Content to New Region |
1:43 | |
| |
Delete Library Item |
4:51 | |
| |
Apply Template to Contact Us Page |
5:27 | |
| |
Summary |
7:34 | |
|
Centering a Page in the Browser |
14:09 |
| |
Intro |
0:00 | |
| |
Centering a Page with Templates |
0:11 | |
| |
| Edit Template |
0:36 | |
| |
| Preview in Browser |
1:13 | |
| |
| Edit External Styles |
1:54 | |
| |
Add Wrapper ID |
3:30 | |
| |
| Insert Div Tag |
4:21 | |
| |
| New CSS ID Rule |
4:52 | |
| |
Save and Update Files |
7:54 | |
| |
Preview in Browser |
8:57 | |
| |
Delete Wrapper ID |
11:15 | |
| |
Save and Preview in Browser |
11:59 | |
| |
Summary |
13:04 | |
Section 20: CSS3 Properties Enhance Your Pages |
|
Using CSS3 |
7:07 |
| |
Intro |
0:00 | |
| |
Preview CSS3 Element in Browser |
0:48 | |
| |
Proprietary CSS3 Properties |
2:51 | |
| |
Summary |
6:00 | |
|
Creating Drop Shadows |
8:12 |
| |
Intro |
0:00 | |
| |
Add Box Shadow Property |
0:30 | |
| |
Preview in Browser |
2:49 | |
| |
Proprietary Options |
6:29 | |
| |
Summary |
7:55 | |
|
Working With Gradients |
10:17 |
| |
Intro |
0:00 | |
| |
Gradient Property |
0:18 | |
| |
| Gradient Code |
1:45 | |
| |
| Apply Comment |
5:08 | |
| |
| Remove Comment |
5:56 | |
| |
Save and Preview in Browser |
6:16 | |
| |
Enable Drop Shadow |
7:56 | |
| |
Summary |
8:28 | |
|
Rounded Corners |
7:34 |
| |
Intro |
0:00 | |
| |
Curve Corners with CSS |
0:14 | |
| |
| Add Border Radius Property |
1:32 | |
| |
Preview in Browser |
2:39 | |
| |
Enable Gradient and Drop Shadow |
4:11 | |
| |
Edit Drop Shadow Color |
5:44 | |
| |
Preview in Browser |
5:48 | |
| |
Summary |
6:56 | |
Section 21: Going Beyond HTML & CSS |
|
Adding a Swap Image Behavior |
12:08 |
| |
Intro |
0:00 | |
| |
Behaviors in Dreamweaver |
0:40 | |
| |
Insert an Image |
2:03 | |
| |
Swapping an Image |
3:40 | |
| |
| Tag Inspector Panel |
3:56 | |
| |
| Behaviors Panel |
4:30 | |
| |
| Adding a Swap Image Behavior |
4:49 | |
| |
Preview in Browser |
8:58 | |
| |
Swap Behavior Code |
9:31 | |
| |
Summary |
10:38 | |
|
Fade and Appear Effects |
9:44 |
| |
Intro |
0:00 | |
| |
Fading and Appearing in CSS3 |
0:15 | |
| |
| Add Page Title and Header |
0:45 | |
| |
| Insert Image |
1:34 | |
| |
| Set Image Tag Properties |
2:26 | |
| |
| Insert Another Image |
2:36 | |
| |
| Add Appear/Fade Behavior Effect |
3:30 | |
| |
Preview in Browser |
5:25 | |
| |
Add Appear/Fade Behavior Effect |
7:16 | |
| |
Preview in Browser |
8:02 | |
| |
Summary |
9:07 | |
|
Opening a New Window Behavior |
9:37 |
| |
Intro |
0:00 | |
| |
Creating a New Browser Window Behavior |
0:24 | |
| |
| Insert Thumbnail Image |
1:53 | |
| |
| Image Tag Properties |
2:35 | |
| |
| Add Open Browser Window Behavior |
3:02 | |
| |
Save and Preview in Browser |
5:40 | |
| |
Modify Open Browser Window Behavior |
6:46 | |
| |
Save and Preview in Browser |
7:11 | |
| |
Summary |
9:09 | |
|
Dreamweaver Extensions |
7:13 |
| |
Intro |
0:00 | |
| |
Manage Extensions |
0:50 | |
| |
| Dreamweaver Extensions |
1:41 | |
| |
| Exchange Panel |
2:18 | |
| |
Summary |
6:43 | |
|
Installing an Extension |
15:35 |
| |
Intro |
0:00 | |
| |
Installing an Extension: Method 1 |
0:12 | |
| |
| Get More Commands |
0:31 | |
| |
| Manage Extensions |
0:37 | |
| |
| Dreamweaver Exchange Classic |
1:08 | |
| |
| Adobe Extension Manager CS6 |
5:32 | |
| |
Working with the Extension |
7:25 | |
| |
| Finding the Extension within Dreamweaver |
7:26 | |
| |
| Using the Lorem Ipsum Extension |
9:02 | |
| |
Installing an Extension: Method 2 |
10:46 | |
| |
| Downloading the Adobe Exchange Panel |
10:47 | |
| |
Adobe Exchange Panel |
13:21 | |
| |
| Opening Adobe Exchange |
13:22 | |
| |
| Searing for Extensions in Adobe Exchange |
14:10 | |
|
Installing the Widget Browser |
8:46 |
| |
Intro |
0:00 | |
| |
Widget Browser |
0:05 | |
| |
| Download Widget Browser |
1:26 | |
| |
| Widget Browser Overview |
3:47 | |
| |
| Preview Widget |
4:55 | |
| |
Summary |
7:47 | |
|
Adding a Widget to My Widget |
6:41 |
| |
Intro |
0:00 | |
| |
Download Widget through Widget Browser |
0:05 | |
| |
| Installing the FlexSlider Widget |
1:19 | |
| |
| My Widgets Area |
3:45 | |
| |
| Save Widget Files |
4:17 | |
| |
Preview Widget in Browser |
5:19 | |
| |
Summary |
6:17 | |
|
Obtaining the FlexSlider Widget Files |
7:23 |
| |
Intro |
0:00 | |
| |
Working with a Widget |
0:25 | |
| |
| Configure a Widget |
1:42 | |
| |
| Save Widget Modifications as Presets |
2:46 | |
| |
| Import/Export Widget Presets |
3:30 | |
| |
Widget Files in Files Panel |
4:51 | |
| |
Summary |
6:10 | |
|
Customizing the FlexSlider Widget |
14:05 |
| |
Intro |
0:00 | |
| |
Preview in Browser |
0:53 | |
| |
FlexSlider Widget Files |
1:24 | |
| |
| Code View |
2:47 | |
| |
| Insert Own Images into Widget |
4:15 | |
| |
Preview in Browser |
6:38 | |
| |
Comment Out Code |
7:47 | |
| |
Understanding Widget Code |
9:10 | |
| |
Comment Out Hyperlink |
9:47 | |
| |
Add Text Content to Widget |
10:34 | |
| |
Preview in Browser |
11:06 | |
| |
Summary |
12:29 | |
Section 22: Responsive Design |
|
What is Responsive Design? |
7:06 |
| |
Intro |
0:00 | |
| |
Responsive Web Design |
0:13 | |
| |
| Website Examples |
2:10 | |
| |
| Wanderlust Travel Website |
4:21 | |
| |
Summary |
6:30 | |
|
CSS Media Types |
10:09 |
| |
Intro |
0:00 | |
| |
Preview in Browser |
0:15 | |
| |
| Print Preview |
2:11 | |
| |
CSS Screen Style Sheet |
2:58 | |
| |
Attach CSS Print Style Sheet |
4:34 | |
| |
Preview in Browser |
7:35 | |
| |
| Print Preview |
7:47 | |
| |
Delete CSS Print Style Sheet |
9:07 | |
| |
Summary |
9:58 | |
|
Planning for Multiple Screen Sizes |
7:16 |
| |
Intro |
0:00 | |
| |
Multiple Screen Size Feature in Properties Panel |
0:50 | |
| |
Manual Screen Size Adjustment |
2:28 | |
| |
CSS Phone and Tablet Style Sheets |
3:06 | |
| |
Preview in Browser |
4:37 | |
| |
Summary |
7:05 | |
|
Creating Media Queries |
10:02 |
| |
Intro |
0:00 | |
| |
Creating Media Queries |
0:58 | |
| |
| Media Queries Dialog Box |
2:02 | |
| |
| Default Presets |
3:38 | |
| |
| Select CSS File |
4:38 | |
| |
Preview in Browser |
7:14 | |
| |
Summary |
9:47 | |
|
Modifying Styles within Media Queries |
17:53 |
| |
Intro |
0:00 | |
| |
Troubleshooting CSS Issues |
1:17 | |
| |
| Enable CSS Properties |
4:29 | |
| |
| Preview in Browser |
5:41 | |
| |
| Tablet Version Style Errors |
6:36 | |
| |
| Modify Tablet Styles |
7:38 | |
| |
| Preview in Browser |
8:43 | |
| |
| Firebug |
10:33 | |
| |
| Modify Media Query Styles |
12:42 | |
| |
| Preview in Browser |
14:00 | |
| |
| Copy and Paste Styles |
14:45 | |
| |
| Preview in Browser |
15:40 | |
| |
Summary |
17:32 | |
Section 23: Site Maintenance & Publishing |
|
Find & Replace |
7:11 |
| |
Intro |
0:00 | |
| |
Modifying Text Content |
0:15 | |
| |
Find and Replace Feature |
0:52 | |
| |
Summary |
6:44 | |
|
Site Reports |
6:02 |
| |
Intro |
0:00 | |
| |
Results Section |
0:32 | |
| |
| Settings Option for Target Browsers |
1:36 | |
| |
Site Reports |
2:18 | |
| |
| Select Reports |
2:27 | |
| |
| Run Reports |
3:20 | |
| |
| Fix Warnings |
3:45 | |
| |
Summary |
5:19 | |
|
Entering Web Server Information |
3:31 |
| |
Intro |
0:00 | |
| |
Manage Sites |
0:20 | |
| |
| Edit Site Information |
0:31 | |
| |
| Adding a Web Server |
0:49 | |
| |
Summary |
3:20 | |
|
Uploading Files to the Web Server |
3:43 |
| |
Intro |
0:00 | |
| |
Put Files to Remote Server Function |
0:08 | |
| |
Dependent Files |
1:10 | |
| |
Preview in Browser |
1:31 | |
| |
Use Files Panel to Upload Files |
2:21 | |
| |
Summary |
3:13 | |
|
Downloading from the Web Server |
3:15 |
| |
Intro |
0:00 | |
| |
How to Download Files from a Web Server |
0:06 | |
| |
| Get Files from Remote Server Function |
0:46 | |
| |
| Show Local and Remote Sites |
2:02 | |
| |
Summary |
2:33 | |
Section 24: Creating a Mobile Website Using jQuery mobile |
|
What is jQuery Mobile? |
6:45 |
| |
Intro |
0:00 | |
| |
jQuery Examples |
0:51 | |
| |
| Photo Gallery |
4:49 | |
| |
| Slideshow |
5:04 | |
| |
Summary |
5:29 | |
|
Building a jQuery Mobile Page |
8:48 |
| |
Intro |
0:00 | |
| |
jQuery Website Page |
0:10 | |
| |
New jQuery Page Options |
1:06 | |
| |
| jQuery Mobile CDN |
1:35 | |
| |
| jQuery Mobile Local |
3:05 | |
| |
| jQuery Mobile with Theme Local |
3:20 | |
| |
Save jQuery Mobile Page in own Folder |
4:15 | |
| |
| Copy Dependent Files |
5:15 | |
| |
Summary |
7:34 | |
|
jQuery Mobile Pages |
8:06 |
| |
Intro |
0:00 | |
| |
jQuery Files |
0:09 | |
| |
Preview Page in Browser |
1:26 | |
| |
Page Structure |
2:42 | |
| |
| Add Content to Footer Area |
3:37 | |
| |
| Preview in Browser |
4:59 | |
| |
| Edit Content in Footer Area |
5:33 | |
| |
Summary |
7:17 | |
|
Working with jQuery Mobile Themes |
6:20 |
| |
Intro |
0:00 | |
| |
Overview of Themes |
0:06 | |
| |
Live View of jQuery Page |
2:47 | |
| |
Example Page |
3:43 | |
| |
| Preview In Browser |
3:57 | |
| |
Summary |
4:51 | |
Section 25: Summary |
|
What We Accomplished in the Course |
4:27 |
| |
Intro |
0:00 | |
| |
CSS 3 Properties |
0:42 | |
| |
Images and Slideshows |
1:35 | |
| |
Using Web Fonts |
2:14 | |
| |
HTML 5 Video |
2:42 | |
| |
Web Forms |
3:08 | |
| |
FlexSlider Widget |
3:31 | |
| |
Dreamweaver Interface |
3:56 | |