ใส่ข้อความในเว็บเพจด้วย Dreamweaver

Dreamweaver

    เริ่มต้นด้วยการสร้างหน้าเว็บเพจ การสร้างเอกสารใหม่ของ dreamweaver นั้นทำได้ง่ายมากเมื่อเปิดโปรแกรมขึ้นมาจะเห็นว่ามีหน้าจอดังภาพ เราสร้างเอกสารได้จากหน้าจอนี้ดังรูป



จากหน้าจอจะเห็นว่ามีชนิดไฟล์มากมายที่เราสามารถสร้างได้ แต่ในบทนี้จะขอพูดถึงแค่ HTML เท่านั้น

นอกเหนือจากการใช้หน้าจอเริ่มต้นเมื่อเปิดโปรแกรมเรายังสามารถสร้างเอกสารใหม่ได้ด้วยการไปที่ Menu เลือก File > New Document จะมีหน้าจอให้เลือกดังรูปด้านล่าง เลือก Blank Page > HTML



เลือก Create จะได้เอกสาร HTML ขึ้นมา ให้เรา save ทันทีโดยไปที่ Menu เลือก File > save

การตั้งชื่อให้กับเว็บเพจ

    การตั้งชื่อให้กับเว็บเพจนั้นจะต้องตั้งเป็นภาษาอังกฤษเท่านั้น และการตั้งชื่อห้ามมีการเว้นวรรคในชื่อ เราอาจใช้เครื่องหมาย underscore (_) หรือ hyphen (-) แทนการเว้นวรรคได้

    หน้าหลักที่จะต้องมีในเว็บไซต์คือหน้า index.html หน้านี้เปรียบเสมือนกับสารบัญของเว็บไซต์ เมื่อเราพิมพ์ชื่อเว็บไซต์ หน้า index.html จะถูกนำมาแสดงเป็นหน้าแรก



เริ่มต้นใส่เนื้อหาให้เว็บเพจ

    การใส่เนื้อหานั้นทำได้ง่ายมาก แค่เราคลิกที่ Document window ก็สามารถพิมพ์เนื้อหาลงไปได้เลย ดังตัวอย่างพิมพ์ข้อความว่า ท่องเที่ยววัดพระศรีรัตนศาสดาราม (วัดพระแก้ว) เพื่อเป็นหัวข้อของเว็บเพจอันนี้

การสร้างหัวข้อให้กับเว็บเพจ

    จากเนื้อหา HTML เราทราบอยู่แล้วว่าการสร้างหัวข้อให้กับข้อความนั้น เราจะให้คำสั่ง <h1>หัวข้อขนาดใหญ่มาก</h1> , <h2>หัวข้อขนาดเล็กลงมา</h2> การใส่หัวข้อให้กับเว็บเพจนั้น เป็นเรื่องที่สำคัญมาก แต่หลายคนมักละเลยเรื่องนี้ Search Engine หลายแห่ง เช่น Google นั้นจะให้ความสำคัญกับคำที่เป็นหัวข้อของแต่ละเว็บเพจมากโดยเฉพาะอย่างยิ่งหัวข้อที่อยู่ใน <h1>

เราสามารถสร้างหัวข้อใน dreamweaver ได้โดย

    1.เลือกที่คำที่ต้องการให้เป็นหัวข้อ

    2.ไปที่ Property inspector จะมีคุณสมบัติของตัวอักษรให้เราเลือก ให้เราดูที่ Format จะมีรายการหัวข้อขึ้นมาให้เลือก ดังรูป



เปลี่ยน font และขนาดตัวอักษร

    เราสามารถเปลี่ยน font ที่ใช้ในการแสดงตัวอักษรและขนาดของตัวอักษรได้ โดย

    1.เลือกตัวอักษรที่ต้องการเปลี่ยน

    2.ไปที่ Property inspector เลือก font จะมีรายการแสดงชื่อ font มากมายให้เลือก

    3.การปรับขนาดก็ไปที่ size แล้วเลือกขนาดที่เราต้องการได้ทันที



    สามารถเปลี่ยน font ในรายการที่แสดงอยู่ได้โดยคลิกที่ท้ายของรายการจะมีหัวข้อ Edit font list สามารถปรับเปลี่ยนรายการได้

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

     ระบบปฏิบัติการ window จะมี Tahoma

     ระบบปฏิบัติการ linux จะมี loma

การขึ้นย่อหน้าใหม่ หรือเริ่มบรรทัดใหม่

    ในการขึ้นบรรทัดใหม่ทำได้ดังนี้

    1.กด Enter เพื่อทำการขึ้นบรรทัดใหม่ ตัวอักษรที่เราพิมพ์มาทั้งหมดจะอยู่ใน <p> </p> โดยอัตโนมัติ

    2.กด shift + enter จะทำการแทรก <br /> ใน code

    ในส่วนของการแสดงผล <p> </p> จะทำให้ความห่างของบรรทัดมีมากว่าการใช้คำสั่ง <br>

เครื่องมืออื่นที่เกี่ยวกับตัวอักษร ก็มีการใช้งานเหมือนกับตัวอย่างข้างบนทั้งหมด

เกี่ยวกับบทความนี้

  • ระดับความยาก : พื้นฐาน
  • คะแนนของบทความนี้ : 9
  • สร้างเมื่อ : 16-05-2010
  • จำนวนครั้งที่เปิด : 21,299
  • เนื้อหาที่เกี่ยวข้อง :
      -

คะแนนความน่าสนใจ

6167

คลิกที่ ใช่เลย! เพื่อโหวตให้กับบทความนี้หากคิดว่าน่าสนใจ

บทความอื่นๆในหมวดลองทำเว็บไซต์ แบบง่ายๆ (10 เรื่อง)

แนะนำ Dreamweaver

แนะนำ Dreamweaver

ในบทความนี้จะแนะนำโปรแกรม dreamweaver ว่าสามารถใช้งานอะไรได้บ้าง และดีอย่างไร ทำไมถึงมีชื่อเสียงโด่งดัง มีเว็บไซต์ชื่อดังมากมายใช้โปรแกรมนี้ในการพัฒนาเว็บไซต์ และทำไม ถึงมีออกมาหลายเวอร์ชัน

สร้างเมื่อ : 16-05-2010 9:40 | จำนวนครั้งที่เปิด : 28,247


เตรียมความพร้อมปรับแต่ง Dreamweaver ใช้งานภาษาไทยได้

เตรียมความพร้อมปรับแต่ง Dreamweaver ใช้งานภาษาไทยได้

ในบทความนี้จะเป็นเนื้อหาการปรับให้ Dreamweaver ทำงานกับภาษาไทยได้

สร้างเมื่อ : 16-05-2010 9:40 | จำนวนครั้งที่เปิด : 22,742


เครื่องมือต่างๆในโปรแกรม Dreamweaver

เครื่องมือต่างๆในโปรแกรม Dreamweaver

บทความนี้เกี่ยวกับตำแหน่งและ ชื่อเรียกเครื่องมือต่างๆ ของ Dreamweaver

สร้างเมื่อ : 16-05-2010 9:24 | จำนวนครั้งที่เปิด : 47,264


กำหนด Site ขั้นตอนสำคัญที่สุดของการทำเว็บด้วย Dreamweaver

กำหนด Site ขั้นตอนสำคัญที่สุดของการทำเว็บด้วย Dreamweaver

การกำหนด site เป็นขั้นตอนที่สำคัญมากในการทำเว็บด้วย dreamweaver เราแทบจะทำงานไม่ได้เลยถ้าไม่กำหนด site ให้กับ dreamweaver ก่อน

สร้างเมื่อ : 16-05-2010 9:40 | จำนวนครั้งที่เปิด : 39,867


ใส่ข้อความในเว็บเพจด้วย Dreamweaver

ใส่ข้อความในเว็บเพจด้วย Dreamweaver

หลังจากที่ปรับแต่งระบบมาหลายบทความแล้ว ในบทความนี้จะเริ่มสร้างเว็บเพจกันสักที ขอเริ่มต้นด้วยการใส่ข้อความในเว็บเพจ

สร้างเมื่อ : 16-05-2010 9:52 | จำนวนครั้งที่เปิด : 21,299


ใส่รูปภาพในเว็บเพจ (พื้นฐาน)

ใส่รูปภาพในเว็บเพจ (พื้นฐาน)

ภาพใบเดียวแทนทำพูดได้ล้านคำ รูปภาพดีๆสักรูปก็ช่วยทำให้เว็บเพจมีความสวยงามมากขึ้น และสื่อความหมายได้ดีขึ้น

สร้างเมื่อ : 16-05-2010 9:36 | จำนวนครั้งที่เปิด : 18,791


สร้าง Hyperlink

สร้าง Hyperlink

เว็บไซต์ประกอบด้วยไฟล์หลายไฟล์มารวมกัน ทั้งเว็บเพจ รูป วีดีโอ เสียง ในบทความนี้จะทำ link เพื่อเชื่อมโยงไปยังไฟล์ต่างๆที่อยู่ในเว็บไซต์กัน

สร้างเมื่อ : 16-05-2010 8:48 | จำนวนครั้งที่เปิด : 14,363


ปรับแต่งเว็บเพจด้วย Page Properties

ปรับแต่งเว็บเพจด้วย Page Properties

Page propertiese สามารถทำให้เราปรับแต่งเว็บเพจของเราได้ ทั้งพื้นหลัง , ชนิดตัวอักษร , รูปแบบของ hyperlink และอื่นๆ อีกมากที่เราสามารถปรับได้ด้วยเครื่องมือนี้

สร้างเมื่อ : 16-05-2010 8:49 | จำนวนครั้งที่เปิด : 15,180


Adding Meta Tags สำหรับการค้นหาของ Search Engine

Adding Meta Tags สำหรับการค้นหาของ Search Engine

meta tags เป็นคำที่ใช้ในการอธิบายเว็บไซต์ของเราให้กับ Search Engine (เช่น google.com) ต่างๆ ว่าเว็บไซต์ของเราเกี่ยวข้องกับอะไรบ้าง

สร้างเมื่อ : 16-05-2010 8:50 | จำนวนครั้งที่เปิด : 10,669


แสดงผลเว็บเพจของคุณใน browser

แสดงผลเว็บเพจของคุณใน browser

ถึงแม้ว่า Dreamweaver จะแสดงผลเสมือนจริง แต่ก็ยังไม่ถูกต้องเสมอไป สุดท้ายเราก็ต้องดูผ่าน browser อยู่ดีว่าเว็บเพจที่เราเขียนนั้นเป็นอย่างไร

สร้างเมื่อ : 16-05-2010 8:50 | จำนวนครั้งที่เปิด : 13,823