ใบความรู้ เรื่อง การออกแบบหน้าเว็บเพจ ด้วยโปรแกรม Photoshop

1. การตั้งค่าหน้ากระดาษ ดังภาพ

2. การตั้งค่าเส้น Grid ดังภาพ View – Rulers ก าหนดไม้บรรทัด View – show – Grid ก าหนดเส้นตาราง

3. ลากเส้นสีฟ้า ส าหรับการแบ่งส่วนหัวเว็บ เมนู และส่วนท้ายเว็บ คลิกสีเหลี่ยม เลือกต าแหน่งท่ีต้องการลงสี

4. การลงสีพื้นเว็บไซต์ คลิกถังสี ดังภาพ

5. คลิกรูปดินสอเพื่อ เปลี่ยนสี หากต้องการเพิ่มถังสีคลิกขวา หากต้องการลบถังสี คลิกที่ถังสีแล้วกด delete

6. การแต่งรูปภาพ ดังภาพ เลือก File – open เลือกภาพที่ต้องการ

คลิกขวาที่ยางลบ เพื่อเลือกเฉพาะส่วนที่ต้องการ ดังภาพ

ย่อหน้าจอ เปลี่ยนเครื่องมือ ลากรูปภาพใส่หน้าเว็บ กด ctrl+T เพื่อย่อขนาดรูปภาพ ปรับแต่งตามต้องการ

7. เขียนข้อความ เลือก รูป T คลิกที่กระดาษ เขียนหัวเว็บ เปลี่ยนรูปแบบ Font เลือกรูปแบบตามต้องการ เปลี่ยนขนาดอักษร เลือกขนาดอักษรตามต้องการ เปลีย่นสีอักษร คลุมด าที่ข้อความ เลือกสีตามต้องการ ดังภาพ

ปรับแต่งข้อความต้องการการ เลือก f-> Stroke เพื่อปรับแต่งข้อความ ดังภาพ

8. ขั้นตอนการตัดภาพ ส าหรับน าไปตกแต่งเว็บเพจ

ตัดภาพตามต าแหน่ง โดยตัดตามช่องเส้น Grid ให้ครบทุกส่วนเท่า ๆ กัน

9. ขั้นตอนการบันทึกภาพ เลือก File -> save for web ก าหนดชนิดรูปภาพเป็นประเภท JPEG กด save ดังภาพ