เมื่อพิจารณาจากสถานการณ์ปัจจุบัน ฟังก์ชันภายในของ Dreamweaver อาจกล่าวได้ว่ามีมากมาย สมบูรณ์ และครบถ้วนมากขึ้นเรื่อยๆ ฉันอยากจะแนะนำเคล็ดลับการใช้งานในเวอร์ชัน 4.0 ให้กับคุณที่นี่
1. ทำให้หน้าเว็บมีความยืดหยุ่นมากขึ้น
นักพัฒนาเว็บบางคนเรียกเทคนิคที่นำมาใช้ด้านล่างของเหลว แต่ฉันเรียกเทคนิคนี้ในที่นี้ว่ายืด (เทคนิคการขยายแบบยืดหยุ่น) นี่เป็นเทคนิคที่สามารถปรับขนาดของหน้าเว็บได้เมื่อขนาดของหน้าต่างเบราว์เซอร์ของผู้เยี่ยมชมเปลี่ยนแปลง ดังนั้น หากหน้าต่างใหญ่เกินไปก็จะไม่มีช่องว่าง และหากหน้าต่างเล็กเกินไป หน้าต่างจะขึ้นและ แถบเลื่อนลงจะไม่ปรากฏบนขอบ ที่จริงแล้วหน้าเว็บธรรมดาส่วนใหญ่จะปรับขนาดหน้าโดยอัตโนมัติตามขนาดของหน้าต่างเบราว์เซอร์ อย่างไรก็ตาม หากมีการใช้เฟรมและตารางที่แตกต่างกันจำนวนมากในหน้าเว็บ ก็จะเป็นการยากที่ขนาดหน้าเว็บจะปรับขนาดโดยอัตโนมัติและ ปรับได้อย่างยืดหยุ่น โดยปกติแล้ว นักออกแบบเว็บไซต์จะใช้การผสมผสานระหว่างกรอบความกว้างของคอลัมน์คงที่และรูปภาพ GIF เป็นช่วงเวลาในการออกแบบหน้าเว็บ ด้วยวิธีนี้ ไม่ว่าจะใช้ Internet Explorer หรือ Mac ขนาดหน้าจะได้รับการแก้ไขและจะไม่หายไป ด้วย Dreamweaver 4.0 คุณสามารถออกแบบหน้าเว็บที่ปรับเปลี่ยนได้อย่างยืดหยุ่นโดยอัตโนมัติ ทำอย่างไร?
เปิดหน้าเว็บโดยใช้ปุ่มบนจานสีวัตถุ และสลับไปที่มุมมองเค้าโครง ในขณะนี้ คุณสามารถดูความกว้างของคอลัมน์ของกล่องข้อความได้ มีลูกศรดรอปดาวน์เล็กๆ อยู่ตรงกลางของกล่องเหนือแต่ละคอลัมน์ เลือกลูกศรเล็กๆ เหนือคอลัมน์ที่คุณต้องการตั้งค่าการแสดงผลแบบยืดหยุ่น และ จากนั้นเลือก "ทำให้คอลัมน์มีความยืดหยุ่น" (ทำให้คอลัมน์ยืดอัตโนมัติ) (ตั้งค่าการปรับความกว้างคอลัมน์โดยอัตโนมัติให้จำกัดไว้ที่หนึ่งคอลัมน์) ในขณะนี้ เส้นหยักจะปรากฏขึ้นเหนือกล่องคอลัมน์ แทนที่จะเป็นตัวเลขเดิมที่ระบุความกว้างของคอลัมน์ Dreamweaver จะสร้างไฟล์รูปภาพเปล่าที่มีเลย์เอาต์คงที่โดยอัตโนมัติ โดยจะมีตารางว่างยาว 2 ตารางอยู่เหนือคอลัมน์ ด้วยวิธีนี้ เลย์เอาต์จะถูกเติมโดยอัตโนมัติ และการตั้งค่าเลย์เอาต์ที่ยืดหยุ่นจะเสร็จสมบูรณ์ (เมื่อคุณเพิ่มไฟล์รูปภาพเปล่าเป็นครั้งแรก กล่องโต้ตอบจะปรากฏขึ้นเพื่อถามว่าคุณต้องการใช้ไฟล์รูปภาพในตัวหรือไม่ เพื่อผลที่ดีที่สุด ฉันขอแนะนำให้คุณปล่อยให้ Dreamweaver สร้างไฟล์ขึ้นมาโดยอัตโนมัติ ไม่อย่างนั้นคุณ ไม่ต้องใช้ไฟล์ภาพเปล่าเพื่อเติมเค้าโครง)
2. สร้างพาเนลสี
ส่วนบุคคลของ Dreamweaver 4.0 เป็นเครื่องมือใหม่ที่สามารถจัดการไฟล์ตามประเภทไฟล์ เช่น รูปภาพ เทมเพลต ฯลฯ . เมื่อแก้ไขเว็บไซต์ เมื่อคุณกำหนดเว็บไซต์ใหม่ (เลือกไซต์ · ไซต์ใหม่) ส่วนประกอบทุกประเภทจะถูกเพิ่มลงในกล่องที่เหมาะสมในแผงสินทรัพย์โดยอัตโนมัติ แผงเนื้อหาใหม่นี้ยังมีกล่องสีในแผงควบคุมคุณสมบัติ ซึ่งจัดเก็บสีทั้งหมดที่ใช้ในเว็บไซต์ของคุณ รวมถึงสีข้อความ สีพื้นหลัง และสีลิงก์ นี่คือชุดสีสำหรับเว็บไซต์ที่ออกแบบมาสำหรับผู้ใช้ เพียงเปิดใช้งานแผงสินทรัพย์ (เลือกหน้าต่างก่อน จากนั้นเลือกสินทรัพย์) จากนั้นเลือกแถบเลื่อนสีเล็กๆ ทางด้านซ้าย แล้วคุณจะเห็นตัวเลือกสีที่หลากหลายสำหรับเว็บไซต์ของคุณ แน่นอนคุณสามารถดึงสีเหล่านี้ไปยังข้อความที่เลือกได้ แม้ว่าคุณจะเลือกสี ค่าเลขฐานสิบหกของสีและรหัสที่สอดคล้องกันสามสี (RGB) จะปรากฏบนหน้าจอ หากคุณต้องการทำให้แถบเครื่องมือจานสีของคุณเล็กลง คุณสามารถเพิ่มเฉพาะสีบางสีลงในรายการโปรดของจานสีของคุณได้ เพียงไฮไลต์สีที่เลือก เลือกปุ่ม "เพิ่มในรายการโปรดของฉัน" ในหน้าต่าง (ปุ่มขวาล่าง) เท่านี้ก็เสร็จเรียบร้อย
3. การสร้าง
ระบบนำทางเมนูป๊อปอัป เดิมทีการสร้างระบบนำทางเมนูป๊อปอัปต้องใช้ทักษะด้านไวยากรณ์ JavaScript บางอย่าง แต่หากคุณติดตั้ง Dreamweaver/Fireworks Studio ก็สามารถทำได้อย่างรวดเร็ว เริ่มแรกในดอกไม้ไฟ เลือกรูปภาพ จากนั้นเลือกแทรก·เมนูป๊อปอัปในกล่องโต้ตอบตั้งค่าเมนูป๊อปอัป คุณสามารถป้อนชื่อของรายการและเลือกปุ่มบวกเพื่อเพิ่มโปรเจ็กต์ คุณสามารถดำเนินการตั้งค่าโดยละเอียดต่อไปได้ในกล่องข้อความป๊อปอัป เช่น การตั้งค่าข้อความและลิงก์ที่จะใช้สำหรับรายการนั้น แน่นอนว่าคุณสามารถเพิ่มเมนูย่อยและจัดเรียงการตั้งค่าใหม่สำหรับระดับถัดไปได้ เมื่อเสร็จแล้ว ให้เลือก ถัดไป เพื่อตั้งค่ากำหนดเช่น สี แบบอักษร และอื่นๆ ต่อไป หลังจากเมนูเสร็จสิ้น คุณสามารถดูตัวอย่างไวยากรณ์ HTML และดูตัวอย่างรูปภาพได้ จากนั้นเลือก เสร็จสิ้น ในเวลานี้เมื่อเมาส์เลื่อนไปที่รูปแบบเดิม รายการเนื้อหาของระบบเมนูจะปรากฏขึ้น จากนั้นเมื่อคุณส่งออกไฟล์ที่สร้างขึ้น Fireworks จะสร้างไฟล์ HTML, JavaScript และรูปภาพทั้งหมดที่ Dreamweaver ต้องการโดยอัตโนมัติ
4. ทำให้ไฟล์รูปภาพเคลื่อนไหว!
หากคุณติดตั้ง Dreamweaver/Fireworks Studio ในเวลาเดียวกัน คุณจะทึ่งกับการผสมผสานที่ลงตัวของผลิตภัณฑ์ทั้งสองนี้ แม้ว่าคุณจะไม่ใช่นักออกแบบกราฟิกมืออาชีพ แต่คุณยังคงต้องการแก้ไขไฟล์ภาพ GIF บางไฟล์เพื่อให้มีสีสันมากขึ้นเมื่อออกแบบหน้าเว็บ Dreamweaver ให้คุณสร้างแอนิเมชั่นได้โดยไม่ต้องถามใคร! เลือกรูปภาพที่คุณต้องการแก้ไขในหน้าต่างมาตรฐาน จากนั้นเลือกปุ่มแก้ไขในตัวตรวจสอบคุณสมบัติ หากรวม Fireworks ไว้ในการติดตั้ง Dreamweaver ของคุณ Fireworks จะเป็นโปรแกรมแก้ไขรูปภาพเริ่มต้นของ Dreamweaver และรูปภาพจะถูกโหลดเข้าสู่ Fireworks โดยอัตโนมัติ (หากสังเกตดีๆ จะพบว่าข้อความและกราฟิก เช่น การแก้ไขจาก Dreamweaver จะปรากฏบนหน้าจอดอกไม้ไฟ ซึ่งบ่งบอกว่าคุณสามารถแก้ไขรูปภาพจาก Dreamweaver ได้) เอาล่ะ ตอนนี้เลือกรูปภาพที่จะแก้ไขใน Fireworks แล้วเลือก Modify· เคลื่อนไหว · การเลือกภาพเคลื่อนไหว จากนั้น ตั้งค่าในกล่องโต้ตอบ Animate ให้เสร็จสิ้น เลือกจำนวนเฟรมสำหรับภาพเคลื่อนไหว ทิศทางการเคลื่อนไหวของภาพเคลื่อนไหว ความโปร่งใส ฯลฯ คุณยังสามารถเลือกแถบเครื่องมือ Frames เพื่อตั้งค่าความเร็วในการเคลื่อนที่ และเลือกแผง Object เพื่อเปลี่ยนการตั้งค่า หากต้องการส่งออกไฟล์ เพียงเลือกแถบเครื่องมือ Optimize และเลือก Animated GIF เป็นประเภทไฟล์ หลังจากเสร็จสิ้น ดอกไม้ไฟจะส่งออกรูปภาพโดยอัตโนมัติด้วยการตั้งค่าที่ปรับให้เหมาะสม อัปเดตไฟล์รูปภาพ GIF โดยอัตโนมัติ และแสดงไฟล์รูปภาพที่อัปเดตใน Dreamweaver เลือกไฟล์·ดูตัวอย่างในเบราว์เซอร์ เพื่อให้คุณสามารถดูตัวอย่างภาพน่ารักที่คุณเพิ่งสร้างขึ้นในเบราว์เซอร์ได้!
5. ทำให้ปุ่มมีเอฟเฟกต์การกะพริบ
ใน Dreamweaver คุณสามารถสร้างวัตถุปุ่ม Flash พร้อมเอฟเฟกต์การกะพริบโดยไม่ต้องใช้โปรแกรม Flash เวอร์ชัน 4.0 มีออบเจ็กต์ปุ่ม Flash ในตัวหลายรายการ ซึ่งสามารถสร้างปุ่มได้หลายรูปแบบ เลือกแทรก·รูปภาพเชิงโต้ตอบ·ปุ่มแฟลชเพื่อดูว่ามีปุ่มใดในตัวที่พร้อมใช้งาน คุณยังสามารถใช้เมาส์เพื่อชี้ไปที่รูปแบบปุ่มที่คุณต้องการใช้ในกล่องโต้ตอบ แล้วดูว่ามันทำงานอย่างไรในเบราว์เซอร์ ใช้เคอร์เซอร์ของเมาส์เพื่อเลือกรูปแบบปุ่มที่คุณต้องการใช้ จากนั้นป้อนพารามิเตอร์ตามลำดับ เช่น ข้อความ แบบอักษร สี ลิงก์ ฯลฯ บนปุ่ม หรือชื่อไฟล์ที่กำหนดเอง กดตกลง จากนั้น ไฟล์ SWF จะถูกสร้างขึ้นและวางบนหน้าเว็บของคุณโดยอัตโนมัติ คลิกที่ไฟล์ที่เสร็จสมบูรณ์แล้วคุณจะเห็นคุณสมบัติของไฟล์ที่แสดงใน Property Inspector เมื่อแสดงคุณสมบัติของไฟล์ หากคุณขยายรายการคุณสมบัติของไฟล์ ปุ่มเล่นจะปรากฏขึ้น หลังจากเลือกแล้ว คุณสามารถดูตัวอย่างเอฟเฟกต์การกะพริบของปุ่มได้โดยไม่ต้องเปิดเบราว์เซอร์
6. สร้างข้อความต่อเนื่อง
การเพิ่มข้อความต่อเนื่องให้กับหน้าเว็บนั้นง่ายพอๆ กับการเพิ่มปุ่ม Flash ที่ฉันเพิ่งแนะนำ ในทำนองเดียวกัน คุณไม่จำเป็นต้องติดตั้ง Flash คุณสามารถทำได้ง่ายๆ ด้วยฟีเจอร์ใหม่ๆ ของ Dreamweaver 4.0 ผู้สร้างเว็บเพจที่มักใช้ไวยากรณ์ HTML ในการเขียนเว็บเพจและไม่มีประสบการณ์ด้านสื่อเชิงโต้ตอบสามารถสร้างข้อความที่มีขนาดกะทัดรัดในรูปแบบ Flash ได้อย่างง่ายดาย จากข้อมูลของ Macromedia ผู้ใช้อินเทอร์เน็ต 97% สามารถดูหน้าเว็บที่มีเอฟเฟกต์ Flash ได้ ดังนั้นฟีเจอร์ใหม่นี้จึงสามารถเพิ่มการโต้ตอบในการเรียกดูและผู้อ่านไปยังหน้าเว็บได้โดยไม่ต้องเพิ่มปัญหาความเข้ากันได้ เลือก แทรก · รูปภาพเชิงโต้ตอบ · ข้อความแฟลช จากนั้นกรอกการตั้งค่ากำหนดทีละรายการ (เช่น ข้อความ ลักษณะแบบอักษร สีแบบอักษร ขนาดแบบอักษร ฯลฯ ที่คุณต้องการเปลี่ยนเอฟเฟ็กต์)