Dreamweaver+Photoshop+Flash+Fireworks website construction directory and complete practical manual for web page design.

Dreamweaver+Photoshop+Flash+Fireworks website construction and web design complete practical manual.

The first dreamweaver web page making article

Chapter 1 Understanding Web Design

1. 1 web design related terms 3

1. 1. 1 What is a static webpage 3?

1. 1.2 What is a dynamic webpage 4?

1.2 Common website types 5

1. 2. 1 personal website 5

1.2.2 enterprise website 5

1.2.3 Institutional Website 6

1.2.4 Entertainment and Leisure Website 7

1.2.5 Industry Information Website 7

1.2.6 Portal 8

1.2.7 Shopping Website 9

1.3 common tools and skills for web design 9

1.3. 1 photoshop cs5 and fireworks cs5 9.

1.3.2 Dreamweaver CS510, web page editing and typesetting software.

1.3.3 web animation software flash cs5 1 1

1.3.4 introduction to web markup language html 1 1

1.3.5 javascript 12。

. 1.3.6 dynamic Web programming language asp 12

1.4 Quickly create a basic web page 13

1.4. 1 Determine the main columns and overall layout of the webpage 13

1.4.2 Create a local site 13

1.4.3 new Web document 14

1.4.4 Insert table layout page 15

Insert multimedia 16

Insert text content 17

1.4.7 Insert image 17

1.4.8 webpage saving 18

1.5 Summary of this chapter 19

The second chapter is my first contact with dreamweaver cs5, a web page making software.

2. Introduction to1Dreamweaver CS5 2 1

2.2 dreamweaver cs5 work interface 22

2.2. 1 Menu Bar 22

2.2.2 Insert the 23rd column.

Floating panel 23

"Properties" Panel 23

Document window 24

2.3 Creating and Managing Sites 24

2. 3. 1 Practice Exercise-Building Site 24 with Wizard

2.3.2 Practice Exercise-Setting up Site 25 through Advanced Panel

2.4 Managing Multiple Sites 28

2. 4. 1 Edit Site 28

2.4.2 Delete Website 28

2.4.3 Replication Site 29

2.5 Example-Creating a Local Site 29

2.6 Overview of this chapter 30

Chapter 3 Easily Create Colorful Text Web Pages

3. 1 Set Page Properties 32

3. 1. 1 Appearance 32

3. 1.2 Appearance (html) 33

3. 1.3 Links (css) 34

3. 1.4 Title (css) 34

3. 1.5 Title/Code 35

3. 1.6 Tracking image 36

3.2 Insert text 36

3.2. 1 computer exercise-insert plain text 36

3.2.2 Lab Exercise-Setting Text Attributes 37

3.2.3 Computer Exercise-Inserting Special Characters 39

3.3 Use List 40

Insert item list 40

Insert numbered list 40

3.4 Insert the contents of the file header in the webpage 4 1

3.4. 1 Insert ETA information 4 1.

3.4.2 Setting Basis 42

Insert keyword 43

3.4.4 Insert explanatory text 43

3.4.5 Settings refresh 43

3.5 Insert Other Objects 44

3.5. 1 insert date 44

Insert horizontal line 45

3.6 Example-Creating a Basic Text Web Page 47

3.7 Overview of this chapter 49

The fourth chapter skillfully uses gorgeous images and multimedia to make the web page move.

4. 1 Insert the image into the webpage 5 1

4. 1. 1 computer exercise-insert webpage picture 52

4. 1.2 Setting image properties 53

4. 1.3 Crop image 54

4. 1.4 Adjust image brightness and contrast 56

4. 1.5 Sharpen the image 56

4. 1.6 Optimizing images with photoshop 57

4.2 Insert other web page images 57

4. 2. 1 Computer Exercise-Creating Mouse Hover Images 57

4.2.2 Lab Exercise-Inserting an Image Placeholder 59

4.3 Add audio and video files 6 1

4.3. 1 computer exercise-adding sound 6 1

4.3.2 Computer Exercise-Inserting Video Files 63

4.4 Insert flash and other media objects 65

4.4. 1 Insert flash Animation 65

Insert Shock Wave Animation 67

4.4.3 Insert java applet 68

4.5 Example Details 69

4.5. 1 instance 1- Create a web page navigation 70

4.5.2 Example 2- Inserting Media 72 into a Web Page

4.6 Overview of this chapter 74

Chapter 5 Using Hyperlinks: the Basis of Network Interconnection

5. 1 Understanding Hyperlink 76

5. 1. 1 absolute path 76

5. 1.2 Relative Path 77

5. 1.3 root directory relative path 77

5.2 Method of Creating Hyperlinks 77

Create a link using the property panel 77

5.2.2 Use the "Point to File" button to create a link 78

5.2.3 Creating Links Using Menus 79

5.3 Create Hyperlinks 79

5. 3. 1 Lab Exercise-Creating a Download File Link 79

5.3.2 Practice Exercise-Creating E-mail Link 8 1

5.3.3 Hands-on Exercise-Creating Image Hotspot Links 82

5.3.4 Lab Exercise-Creating Anchor Link 84

5.4 Example: 85

5.4. 1 instance 1- Create hotspot link navigation 86

5.4.2 Example 2- Creating an Anchor Link 88

5.5 Overview of this chapter 90

Chapter 6 Using Tables to Easily Arrange and Layout Web Page Elements

6. 1 Insert table and table element 92

6. 1. 1 computer exercise-insert table 92

6. 1.2 Setting Table Attributes 94

6. 1.3 Add content to cell 95

6.2 Select Table Element 95

Select form 95

6.2.2 Selecting a Row or Column 96

6.2.3 Select Cell 97

6.3 Basic Operation of Forms 98

Resize tables and cells 99

6.3.2 Add or delete rows or columns 100

6.3.3 Split Unit 102

Merge cells 102

6.3.5 Cut, Copy and Paste Cells 103

6.4 Sorting and Sorting Table Contents 103

6.4. 1 computer exercise-importing tabular data 103

6.4.2 Computer Practice-Table Sorting 106

6.5 Example: 108

6.5. 1 Example 1- Create a web page thin line table 108

6.5.2 Example 2- Arranging data using table11.

6.6 Overview of this chapter 1 17

Chapter 7 Flexible Frame Page Layout

7. 1 Overview of Framework Web Page 1 19

7.2 Creating Frames and Framesets 120

7.2. 1 Hands-on Exercise-Creating a Frame Group 120

7.2.2 Hands-on exercise-Insert predefined frameset 120

7.2.3 Hands-on exercise-save the frame and frameset file 12 1.

7.3 Selecting Frames and Framesets 122

7.3. 1 Select a frame or frameset in the frame panel 122.

7.3.2 Select a frame or frameset in the document window 123.

7.4 Setting Frame and Frameset Properties 124

7.4. 1 Set frame properties 124

7.4.2 Set frameset properties 124

7.5 Example: 125

7.5. 1 instance 1- Create a floating frame 125

7.5.2 Example 2- Creating a Complete Frame Page 127

7.6 Overview of this chapter 138

Chapter 8 Using Behavior to Easily Realize Web Special Effects

8. 1 behavior overview 140

8. 1. 1 Usage Behavior Panel 140

8. 1.2 Common actions 14 1

8. 1.3 Common Events 142

8.2 Using dreamweaver Built-in Behavior 143

8.2. 1 computer practice-exchanging images 143

8.2.2 Computer Practice-Restoring Image Exchange 144

8.2.3 Computer Practice-Open a browser window 145.

8.2.4 Computer Practice-Calling javascript 146

8.2.5 Changing properties 147

8.2.6 Hands-on Exercise-Drag ap Element 148

8.2.7 Computer Practice-Go to the website 149.

8.2.8 Computer Practice-Pop-up message 15 1

8.2.9 Computer Exercise-Preloading Images 152

8.2. 10 computer exercise-setting status bar text 153

8.2. 1 1 jump menu 154

8.2. 12 show-hide elements 156

8.2. 13 computer practice-checklist 159

8.2. 14 computer exercise-increase/decrease effect 160

8.2. 15 computer exercise-squeezing effect 16 1

8.3 using javascript 162

8.3. 1 computer practice-using javascript function to realize printing function 162

8.3.2 Hands-on exercise-use javascript function to close the window 164.

8.4 Overview of this chapter 166

Chapter 9 Beautifying Web Pages with css Style Sheets

9. 1 Understanding css Stylesheets 168

9.2 Basic Syntax of CSS 169

9.3 Set css properties 170

9.3. 1 Set css type properties 170

9.3.2 Set the css background attribute 17 1.

9.3.3 Set the css block attribute 17 1.

9.3.4 Set css box properties 172.

9.3.5 Set css border property 173

9.3.6 Setting css list properties 173

9.3.7 Set css positioning attribute 174

9.3.8 Set css extension properties 175

9.4 Linking or exporting external css style sheets 175

9.4. 1 lab exercise-creating internal style sheets 176

9.4.2 Practice Exercise-Creating an External Style Sheet 178

9.4.3 Practice Exercise-Linking External Style Sheets 179

9.5 Example 18 1

9.5. 1 instance 1- Use css styles to define font size 18 1.

9.5.2 Example 2- Making Shadow Text Using css Style 183

9.6 Overview of this chapter 186

Chapter 10 uses css+div to flexibly lay out pages.

The first meeting div 188

10. 1. 1 div overview 188

10.1.2 Advantages of CSS+div layout 189

10.2 ap div basic operation 190

10.2. 1 ap div panel 190

10.2.2 Create an ordinary ap div 190.

10.2.3 create a nested ap div 19 1.

10.3 sets the properties of ap div 192.

10.3. 1 Set the show/hide properties of ap div 192.

10.3.2 change the stacking order of ap div 193.

10.3.3 Add a scroll bar for ap div 193.

10.3.4 change the visibility of ap div 194.

10.4 css positioning and div layout 195

10.4. 1 box model 195

10.4.2 component location 195

Common methods of 10.5 css+div layout 199

10.5. 1 Plan the whole page with div 199.

10.5.2 Design the position of each block of 200.

Positioning 200 with css

10.6 Summary of this chapter 202

Chapter 1 1 uses templates, libraries and plug-ins to improve the efficiency of web page making.

1 1. 1 Create Template 204

1 1. 1 computer exercise-create template 205 directly from blank document.

1 1. 1.2 Lab Exercise-Creating a Template from an Existing Document 206

1 1. 1.3 computer exercise-creating an editable region 207

Application of 1 1.2 template 208

1 1.2. 1 Computer Practice-Creating a Web Page with a Template 208

1 1.2.2 computer exercises-update templates and other web pages 2 1 1

1 1.3 Creating and applying the library 2 13

1 1.3. 1 Create existing content as library 2 13.

1 1.3.2 Application of Library in Web Page 2 13

1 1.3.3 Edit and update the webpage 2 15

1 1.3.4 Separating library items from source files 2 16

1 1.4 Installation and application of plug-ins 2 17

Install 1 1.4. 1 plugin 2 18.

1 1.4.2 Application of Plug-in 2 18

1 1.5 Example Details 220

1 1. 5. 1 instance 1- Create enterprise website template 220

1 1.5.2 Example 2- Creating a Web Page with a Template 226

1 1.5.3 Example 3- Create a floating advertisement using a floating image plug-in.

1 1.5.3 Webpage 229

1 1.6 Abstract of this chapter 23 1

Chapter 12 uses dreamweaver cs5 to design dynamic web pages.

12. 1 Insert the form 233 into the webpage.

12. 1. 1 Insert form field 234

12. 1.2 Create Form Object 235

12.2 building a dynamic web development environment 24 1

12. 2. 1 Install Internet Information Server (iis) 24 1.

12.2.2 Setting up Internet Information Server (iis) 242

12.3 Create Database 244

12.4 create a database (odbc) connection 245

12. 4. 1 lab exercise-creating odbc connection 245

12.4.2 Lab Exercise-Creating ado Connections Using dsn 246

12.5 Edit Datasheet Recordset 246

12. 5. 1 Create Recordset (Query) 247

Insert record 248

12.5.3 Update record 249

Delete record 249

12.6 Add server behavior 250

Insert repeat region 25 1.

12.6.2 Insert display area 25 1

12.6.3 Recordset Pagination 252

12.6.4 Go to page 252.

12.6.5 Go to related page 253.

12.6.6 User authentication 254

12.7 Summary of this chapter 256

The second photoshop design web page picture

Chapter 13 Using photoshop cs5 to draw web pages.

13. 1 photoshop cs5 working interface 259

13. 1. 1 menu command 260

13. 1.2 toolbox

13. 1.3 Tool Options Bar 264

13. 1.4 floating panel 264

13. 1.5 document window 264

13.2 image adjustment 265

13. 2. 1 computer practice adjusting image size 265

Computer Exercise-Resizing Canvas 266

13.3 Set foreground and background colors 267

13.4 Create Selection Area 268

13.4. 1 marquee tool 268

Lasso tool 270

13.4.3 Magic wand tool 27 1

13.4.4 computer exercise-making transparent images 272

13.5 basic drawing tools 273

1 brush tool 273

Pencil tool 274

13.5.3 Application of deepening and refining tools 275

13.6 Example Details 276

13.6. 1 example 1- feathered web page image 276

13.6.2 Example 2- Drawing Web Logo 278

13.7 Summary of this chapter 280

Chapter 14 Designing Special Effect Text and Buttons on Web Pages

14. 1 Create text282

14. 1. 1 computer exercise-input text 282

14. 1.2 Set Text Attribute 283

14. 1.3 Character Deformation 284

14.2 layers and layer styles 285

Basic operation 14.2. 1 layer 285

14.2.2 Lab Exercise-Setting Layer Styles 287

Filter 288 is applied

14.3. 1 Render 288

14.3.2 Stylization 289

14.3.3 fuzzy 292

14.4 Example Details 294

14.4. 1 example 1- design special characters 295

14.4.2 Example 2- Design stereoscopic crystal word 297

14.4.3 Example 3- Making Transparent Button 299

14.4.4 Example 4- Make Texture Button 302

14.5 Summary of this chapter 305

Chapter 15 Designing Website Logo and Online Advertisement

15. 1 website logo making 307

15. 1. 1 website logo design standard 307

15. 1.2 Website logo specifications 308

15. 1.3 website logo specification 308

15. 1.4 computer practice-logo design example 309

15.2 making online advertisements

Network advertising form 3 1 1

Design elements of online advertising

15.2.3 network advertising design skills

15.2.4 Network Advertising Design Example 3 13

15.3 Summary of this chapter 3 18

Chapter 16 Designing and Making Images in Web Pages

16. 1 Design and production of web page background picture 320

16.2 Design Web Advertisement Pictures 322

16.3 Design website cover page 327

16.3. 1 Design website cover picture 327

16.3.2 Cut the cover image 333 with slices.

16.4 Summary of this chapter 335

The third picture of fireworks design web page

Chapter 17 fireworks cs5 quick start

17. 1 fireworks overview cs5 339

17.2 fireworks cs5 working interface 340

1 menu bar 340

Toolbox 340

Status bar 34 1

File Window 34 1

17.2.5 Properties Panel 342

17.2.6 floating panel 342

17.3 Common bitmap graphics tools 342

1 Select Tool 342

17.3.2 pencil tool 345

17.3.3 "Brush" tool 346

17.3.4 "Rubber Stamp" tool 346

17.3.5 rubber tool 348

17.4 Common vector graphics tools 348

1 "line" tool 349

17.4.2 Pen tool 349

A vector graphic object 350 is selected

17.5. 1 pointer tool 350

17.5.2 "Select Rear Object" tool 35 1

17.5.3 Part Selection Tool 35 1

17.6 Example Illustration-Using Drawing Tools to Design Website Logo 352

17.7 Summary of this chapter 354

Chapter 18 Use of Words and Styles

18. 1 text editing

18. 1. 1 computer exercise-text input 356

18. 1.2 Set Text Attribute 358

18.2 Text Path 358

18. 2. 1 Lab Exercise-Attach Text to Path 358

18.2.2 Lab Exercise-Text Conversion to Path 359

18.3 filter 360

Adjust the color filter 360 degrees.

18.3.2 find edge filter 360

18.3.3 blur filter 36 1

18.4 style 363

18.4. 1 computer practice-using style 364

18.4.2 Lab Exercise-Import and Export Styles 365

18.5 Illustration 365

18.5. 1 example 1- design special effect text 365

18.5.2 Example 2- Design Stone Carving Word 367

18.6 Summary of this chapter 369

Chapter 19 Designing and Making Images in Web Pages

19. 1 Making special words for web pages 37 1

19.2 design network advertisement 373

19.3 making a web page navigation bar 378

19.4 make gradient button 380

19.5 Create image slice 382

19.6 Summary of this chapter 384

Section 4 flash Design Page Animation

Chapter 20 Drawing Basis of flash cs5

20. Introduction to1Flash CS5 387

20.2 working interface of flash cs5 388

20.2. 1 menu bar 389

Stage 389

Toolbox 389

Timetable 390

20.2.5 Property Panel 39 1

20.3 drawing tool 39 1

20.3. 1 line tool 39 1

20.3.2 "ellipse" tool and "rectangle" tool 393

20.3.3 "Polygon Star" Tool 393

"pencil" tool 395

20.3.5 "Brush" Tool 396

"Pen" tool 397

20.4 Select Object Tool 398

20.4. 1 "Select" tool 398

20.4.2 "Partial Selection" Tool 398

20.5 Edit Graphics Tool 399

20.5. 1 "paint bucket" tool 399

20.5.2 Ink bottle tool 40 1

20.5.3 "dropper" tool 402

"Eraser" tool 403

20.6 Basic use of text tools 404

20.7 Example Refinement 406

20.7. 1 example 1- Generate stroke text 406

20.7.2 Example 2- Creating a Simple flash Animation 408

20.8 Overview of this chapter 4 1 1

Chapter 2 1 Using Components and Examples

2 1. 1 concept of components and examples 4 13

2 1.2 Create Component 4 14

2 1.3 component management 4 15

2 1.3. 1 editing component 4 15

2 1.3.2 copy element 4 17

2 1.4 Creating and Editing Instances 4 18

2 1.4. 1 Create Instance 4 19

2 1.4.2 Editing Example 4 19

2 1.5 Creating and Managing Libraries 422

2 1.5. 1 Create Project 422

Delete item 422.

2 1.6 using the public library 423

2 1.7 sample refinement 423

2 1.7. 1 Example 1- Make Button 424

2 1.7.2 Example 2- Animation with Components 426

2 1.8 Summary of this chapter 429

Chapter 22 Creating Basic flash Animation

22. 1 Create frame-by-frame animation 43 1

22.2 Create a tween 433

22.2. 1 Create tween 433

22.2.2 Create Shape Adjustment Animation 436

22.3 Creation of Mask Animation 438

22.3. 1 Create mask text 438

22.3.2 Computer Exercise-Mask Animation Application Example 440

22.4 the creation of animation of motion guidance layer 443

22.5 Overview of this chapter 445

Chapter 23 Making Advanced Interactive Animation

23. 1 Action Script Basis 447

23. 1. 1 variable 447

23. 1.2 operator and expression 447

23. 1.3 function 449

23. 1.4 actionscript syntax 449

23.2 actionscript programming interface 45 1

23. 2. 1 Method of opening the operation panel 45 1

23.2.2 Introduction to the operation panel 45 1

23.3 Add Action Script 452

23. 3. 1 lab exercise-add action 452 to the frame.

23.3.2 Practice Exercise-Adding Actions to Buttons 453

23.3.3 Hands-on Exercise-Add Action 454 to the movie clip.

23.4 Example Elaboration 454

23.4. 1 example 1- making personalized mouse 454

23.4.2 Example 2- Animation of Sending E-mail Using geturl 457

23.4.3 Example 3-Using Stop and Play Statements to Control Animation Play459

23.5 Overview of this chapter 462

The fifth comprehensive case of website construction

Chapter 24 Designing and Making Enterprise Websites

24. 1 website planning 465

24. 1. 1 main principles of website design 465

24. 1.2 website main function page 466

24.2 Design Web Page Pictures 467

24.2. 1 design the webpage logo 467 with photoshop.

24.2.2 design web banner animation with flash 469.

24.3 Creating Local Sites 475

24.4 Making Page 477 with dreamweaver cs5

Making navigation at the top of the website 477

24.4.2 Conduct classified navigation 480

24.4.3 Making Hotel Rolling Announcement 483

24.4.4 Making Hotel News 486

24.4.5 Formulation of service project proposal Part 489

24.4.6 Making the bottom copyright part 490

24.5 Overview of this chapter 492

Chapter 25 Designing and Making Shopping Websites

25. 1 Overview of shopping website design 494

25. 1. 1 e-commerce website classification 494

25. 1.2 analysis of the characteristics of shopping websites/kloc-0 /40666.6066666666866

25. 1.3 website main function page 496

25.2 Create database tables 498

25.3 Create a database connection 499

25.4 Making the homepage of shopping system 50 1

25.4. 1 Make a product classification display page 50 1.

25.4.2 Production Product Details Page 506

25.5 Backstage Management of Shopping System 507

25.5. 1 Make page 508 for adding commodity classification.

25.5.2 Make the page of adding goods 5 1 1.

25.5.3 Making Commodity Management Page 5 13

25.5.4 Making a modified page 5 17

25.5.5 Making Delete Page 520

25.6 Overview of this chapter 523