D r e a m w e a v e r 8
This presentation is the property of its rightful owner.
Sponsored Links
1 / 22

D r e a m w e a v e r 8 PowerPoint PPT Presentation


  • 71 Views
  • Uploaded on
  • Presentation posted in: General

D r e a m w e a v e r 8 . D r e a m w e a v e r 8. ความหมายและประโยชน์ของ Dream weaver 8

Download Presentation

D r e a m w e a v e r 8

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


D r e a m w e a v e r 8

Dreamweaver8


Dream weaver 8

Dreamweaver8

ความหมายและประโยชน์ของ Dream weaver 8

Macromedia Dreamweaver เป็นโปรแกรมสำหรับออกแบบและพัฒนาเว็บไซต์ ที่ได้รับความนิยมอย่างมากในปัจจุบัน เนื่องด้วยสามารถใช้งานได้ง่าย มีเครื่องมือให้ใช้งานมากมาย ซึ่งสามารถพัฒนาเว็บได้อย่างรวดเร็ว และง่ายดาย นอกจากโปรแกรม Macromedia Dreamweaver จะออกแบบมาให้ใช้สร้างเว็บอย่างง่ายดายแล้ว ยังเพิ่มคุณสมบัติต่าง ๆ ที่มีประสิทธิภาพ และเอื้อประโยชน์สำหรับผู้ทำเว็บอย่างเต็มที่ ไม่ว่าจะเป็นระบบการจัดการเกี่ยวกับSiteและการจัดเก็บไฟล์ นอกจากนี้ยังมีระบบช่วยจัดการเกี่ยวกับการ Uploadไฟล์ไปยังเซิร์ฟเวอร์อีกด้วย

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

นอกจากนี้แล้วปัจจุบัน Macromedia Dreamweaver รุ่นใหม่ ๆ ยังสนับสนุนการใช้งานเว็บแบบไดนามิคเพิ่มมากขึ้น มีการรองรับสคริปภาษาต่าง ๆ เช่น CSS , Java Script ภาษา XML และรองรับลูกเล่นเกี่ยวกับการทำภาพเคลื่อน ไหว Gif Animation และสนับสนุนการใช้งานFlashเพิ่มขึ้นอีกด้วย ที่กล่าวมาข้างต้น เป็นคุณสมบัติและความสามารถของโปรแกรมตัวเก่งตัวนี้ ซึ่งสามารถครองใจผู้ทำเว็บมาอย่างยาวนาน ตั้งแต่เริ่มต้นก่อตั้ง ซึ่งจากอดีตจนถึงปัจจุบัน Macromedia Dreamweaver มีออกมาแล้วหลายเวอร์ชั่น

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

ซึ่งมีดังนี้

Dreamweaver8

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

ในอดีตโปรแกรม Macromedia Dreamweaver ถูกสร้างขึ้นโดยบริษัท แมโครมีเดีย แต่ปัจจุบันนี้ควบกิจการรวมกับบริษัท อะโดบีซิสเต็มส์ ดังนั้นเวอร์ชั่นที่ถูกพัฒนาขึ้นในภายหลัง จึงมีการใช้ชื่อใหม่ จากชื่อเดิม แมโครมีเดีย ดรีมวีฟเวอร์ (Macromedia Dreamweaver) เปลี่ยนเป็น อะโดบี ดรีมวีฟเวอร์ (Adobe Dreamweaver)

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

ลักษณะของ Macromedia Dreamweaver 8

การสร้าง เว็บเพจด้วยโปรแกรม Macromedia Dreamweaver 8  ลักษณะของการใช้งาน ของโปรแกรม ก็จะคล้ายๆ กับโปรแกรม Word Processor  ที่เราสามารถพิมพ์ ใส่ตาราง แทรกรูปภาพ แต่สำหรับการใช้งานจริงๆ แล้ว มันก็ไม่เหมือนกัน เช่น เวลาที่จะมีการเว้นวรรคข้อความ ซึ่งถ้าเป็น Word Processor นั้นเวลาที่เราจะเว้นวรรคข้อความ โดยกด Spacebar ที่แป้นพิมพ์ได้เลย ไม่ว่าจะเว้นวรรคกี่ตัวอักษรก็ได้แต่สำหรับ การสร้าง เว็บเพจด้วยโปรแกรม Macromedia Dreamweaver 8  แล้วไม่สามารถที่จะทำแบบนั้นได้ เพราะ โปรแกรม Macromedia Dreamweaver 8  การเว้นวรรคในเอกสารนั้น ต้องปฏิบัติ ตามกฎของ ภาษา HTML คือ จะสามารถเว้นวรรคได้เพียงแค่ 1 ช่องไฟหรือ 1 ตัวอักษรเท่านั้น

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

จุดเด่นของโปรแกรม  Macromedia Dreamweaver 8

1. โปรแกรมจะทำการแปลงรหัสให้เป็นภาษา HTML โดยอัตโนมัติดังนั้น ผู้ใช้ที่ไม่มีความรู้ ด้านนี้ก็สามารถทำได้

2. มีแถบเครื่องมือ หรือแถบคำสั่ง ที่ใช้ในการควบคุมการทำงาน แบ่งออกเป็นหมวดหมู่จึง ช่วยในการทำงานที่ดีขึ้น และรวดเร็วยิ่งขึ้น

3.สนับสนุนเว็บเพจที่เป็นภาษาไทยได้ดี

4. มีคุณสมบัติที่สามารถจัดการกับ รูปภาพเคลื่อนไหว โดยไม่ต้องอาศัย Plugin

5. สามารถเรียกใช้ตารางจากภายนอก โดยการอิมพอร์ทจาก Text File

6. เป็นโปรแกรมที่สามารถสนับสนุนการใช้งาน CSS (Cadcading Style Sheet)

7. มีความสามารถในการทำ Drop Down Menu  รวมไปถึงการทำให้รูปภาพ เปลี่ยนเมื่อนำเมาส์ไปชี้ เป็นต้น

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

เหตุผลที่สนใจ

โดยส่วนตัวแล้วอยากมีเว็บไซต์เป็นของตัวเอง แต่ปัญหาอยู่ที่ว่าเราเขียนภาษาคอมพิวเตอร์ไม่เป็น ก็เลยล้มเลิกความคิดตรงนั้นไป แต่แล้ววันหนึ่งก็มาเจอโปรแกรม Dreamweaver ซึ่งโปรแกรม Macromedia Dreamweaver มีความน่าสนใจตรงที่เราสามารถสร้างเว็บขึ้นมาโดยไม่ไต้องใส่ Code เพียงแต่เขียนลงไปได้เลย แล้วโปรแกรมจะจัดการให้เอง ทำให้การทำเว็บไซต์นั้นง่ายเหมือนปลอกกล้วยเลยล่ะ

Macromedia Dreamweaver เป็นประเภทShareware

คือ เป็นซอฟต์แวร์ที่ให้ทดลองใช้ ถ้าต้องการใช้งานตลอดชีพต้องเสียเงิน

สามารถ Download Macromedia Dreamweaver 8ได้ที่นี่

… Download Here …

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

หน้าแรกของMacromedia Dreamweaver

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

รู้จักฟังก์ชั่นต่าง ๆ ของ Macromedia Dreamweaver8

สำหรับโปรแกรม Macromedia Dreamweaver เป็น โปรแกรมเขียนเว็บ ที่ออกแบบมาเพื่อ ช่วยจัดการกับ เว็บเพจ โดยผู้ใช้ไม่จำเป็นต้องมีความรู้ ในภาษา HTML ซึ่งเป็นภาษาสำหรับสร้างเว็บเพจ โดยตรง ดังนั้น โปรแกรม Macromedia Dreamweaver  จึงมีฟังก์ชั่นต่างๆ มากมายซึ่งแต่ละ ฟังก์ชั่นก็จะ แสดงผลในลักษณะของ วินโดวส์ (WINDOWS) หรือแถบคำสั่ง (PALETTE) ตัวอย่างของ ฟังก์ชั่น เช่น (BEHAVIOR) เป็น ฟังก์ชั่นสำหรับใช้ในการควบคุม การใช้สคริปต์ต่างๆ เป็นต้น ในการที่จะเลือกใช้ฟังก์ชั่น ผู้ใช้ต้องทำความเข้าใจ และเรียนรู้วิธีในการควบคุมการทำงาน ของฟังก์ชั่นต่างๆ ให้เข้าใจเสียก่อน และวิธีเรียกใช้ฟังก์ชั่นต่างๆ ของโปรแกรม Macromedia Dreamweaver ก็สามารถทำได้ดังนี้ เลือกคำสั่งที่เมนูบาโดยคลิกเลือกเมนู Window ก็จะปรากฏ รายการของคำสั่งควบคุม หรือฟังก์ชั่นต่างๆ ให้เลือก

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

สำหรับฟังก์ชั่น ที่เป็นมาตรฐานในการ ทำงานกับโปรแกรม Macromedia Dreamweaver ที่มีการใช้ งานบ่อยๆ ก็มีอยู่ 3 ฟังก์ชั่น ได้แก่

1. ฟังก์ชั่น Insert จะเป็นฟังก์ชั่นที่ใช้สำหรับควบคุมเกี่ยวกับวัตถุต่างๆ เช่น เลเยอร์, รูปภาพ ซึ่งแถบเครื่องมือนี้จะประกอบไปด้วย ชุดเครื่องมือต่างๆ คือ Characters , Common, Form, Frames, head, Invisible

2. ฟังก์ชั่น Properties เป็นฟังก์ชั่นลักษณะต่างๆ เช่น ใช้ในการกำหนดค่าของข้อความในเว็บ สีของตัวหนังสือ รูปภาพ ตาราง เป็นต้น

3. ฟังก์ชั่น Launcher เป็นฟังก์ชั่นสำหรับใช้ในการจัดการหรือควบคุมในส่วนของ สคริปต์ (Behaviors)

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

สิ่งที่น่าสนใจใน Dreamweaver 8

เทคนิคการทำภาพ Swap Image

ขั้นตอนที่ 1ก็ให้ทำการสร้างไฟล์ใหม่ใน Dreamweaver เลยค่ะขั้นตอนที่ 2ให้ทำการดึงรูปเข้ามาในโปรแกรม โดยการที่ตำแหน่ง A ตามภาพค่ะ จากนั้นจะมีไดอะล็อกบ็อก Select Image Source ตามรูปด้านล่าง ให้ทำการเลือกไฟล์ภาพแรกที่เตรียมไว้ จากนั้นกดปุ่ม OK ตามตำแหน่ง C

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

ขั้นตอนที่1และ2

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

ขั้นตอนที่ 3เมื่อได้รูปมาแล้ว ให้ทำการคลิกที่รูป จากนั้นสังเกตที่ Panel Group ทางด้านขวามือของโปรแกรม เลือกแท็บ Behaviors (หากไม่มี Panel Group Behaviors ให้ทำการเรียกใช้งาน โดยการเลือกคำสั่ง Window จากเมนูบาร์ด้านบน แล้วเลือก Behaviors) จากนั้นคลิกที่รูปเครื่องหมายบวก ตามตำแหน่ง A แล้วเลือก Swap Image

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

ขั้นตอนที่3

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

ขั้นตอนที่ 4จะปรากฏไดอะล็อกบ็อก Swap Image ให้ทำการคลิก Browse... ตามตำแหน่งที่ 1 จากนั้นจะปรากฏไดอะล็อกบ็อก Select Image Source ตามรูปด้านล่าง ให้ทำการเลือกไฟล์ภาพอีกภาพที่เตรียมไว้ จากนั้นกดปุ่ม OK ตามตำแหน่ง 2 จะกลับมาที่ ไดอะล็อกบ็อก Swap Image จากนั้นกด OK ที่ตำแหน่งที่ 3

ขั้นตอนที่ 5ทำการบัญทึกหน้าเว็บเพจ เป็นเอกสาร .html หรือ .htm แค่นี้ก็เสร็จเรียบร้อยแล้ว

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

ขั้นตอนที่4และ5

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

ตัวอย่างเว็บไซต์

ดังภาพเป็นการทำ Rollover คือ เมื่อนำเมาส์มาคลิกภาพจะเปลี่ยนเป็นอีกภาพหนึ่ง

แต่ภาพทั้งสองต้องมีขนาดเท่ากัน

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

Top

left

Main frame

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

ภาพที่แสดงเมื่อสักครู่นี้ อาจเป็นเพียงบางส่วนหนึ่งเท่านั้นและเป็นเพียงตัวอย่างของเว็บไซต์ที่ดิฉันได้จัดทำขึ้นมา อาจจะยังไม่สมบูรณ์มากนัก แต่จะมีการพัฒนาในอนาคตอันใกล้นี้

ประภัสรา มีทอง SC15A (B01)


Dream weaver 8

Dreamweaver8

เอกสารอ้างอิง

- http://www.amsoft.cz/Produkty/Macromedia/dreamweaver/pictures/Dreamweaver_id.jpg

- http://th.moneyupload.com/47718_20080720225238_Macromedia%20Dreamweaver%208.0.rar.html

- http://www.metalata.com/thailand/th/Web-Site-Design/Learning-Dreamweaver-1.html

- http://www.metalata.com/thailand/th/Web-Site-Design/index.html

ประภัสรา มีทอง SC15A (B01)


  • Login