Design by Photoshop :: ชุนชนคนมีไอเดีย

ลำดับตอนที่ #105 :

เรียนรู้เคล็ดลับการทำพื้นหลังเพื่อไปใช้งานบนเว็บ..

เคล็ดลับที่1.
* การทำให้พื้นหลังดูลักษณะแบ่งข้างบนเว็บ...

ขั้นตอนที่1.
เริ่มจากการกำหนดขนาดตามความเหมาะสม โดยปกติหน้าจอเราจะมีขนาด 800 x 600แต่ในพื้นที่
ของเว็บจะใช้การทำลักษณะพื้นหลังที่มีลักษณะแบ่งข้างจะนิยมกำหนดดังภาพ.
(ในการสร้างไฟล์ใหม่สำหรับผู้เริ่มต้นใช้คำสั่ง File --> New หรือกด Ctrl + N ) แล้วให้ปรับค่าดังภาพเราจะได้ไฟล์ใหม่ตามขนาดที่เรากำหนด

ขั้นตอนที่2.
เมื่อเราได้ไฟล์ใหม่แล้วให้กำหนดพื้นจะทำการใส่สีโดยการใช้อุปกรณ์ Marquee Tool เพื่อสร้างเส้น
Selection แล้วให้ทำการเลือกสีโดยมาที่อุปกรณ์ Foreground Color เมื่อได้แล้วทำการ Fill สีลงไป
( Edit --> Fill , Use = Foregound color) ก็จะได้ดังภาพ. ( คลิ๊กเพื่อดูตัวอย่างพื้นหลัง )






 



แสดงลักษณะเมื่อนำไปใช้บนเว็บ...

ขั้นตอนที่3.
หรือเมื่อเกิดเส้น Selection ที่เราจะทำการแบ่งข้างแล้วไม่ต้องทำการ Fill สีลงไปจะทำการไล่เฉดสี
โดยใช้อุปกรณ์ Gradient Tool โดยทำการไล่เฉดแบบ Foreground to Background ดังตัวอย่าง
ในการไล่เฉดให้ไล่เฉดลักษณะตามแนวขวางจะได้ดังภาพ ( คลิ๊กเพื่อดูตัวอย่าง )

แสดงลักษณะเมื่อนำมาใช้บนเว็บ...

เคล็บลับที่2.
*การสร้างพื้นหลังโดยการกำหนดพื้นที่สำหรับนำภาพมาประกอบ...

ขั้นตอนที่1.
เริ่มจากการกำหนดขนาดตามความเหมาะสม โดยปกติหน้าจอเราจะมีขนาด 800 x 600 แต่ในพื้นที่ของเว็บจะใช้
การทำลักษณะพื้นหลังที่มีลักษณะแบ่งข้างจะนิยมกำหนดดังภาพ ( ในการสร้างไฟล์ใหม่สำหรับผู้เริ่มต้นใช้คำสั่ง
File --> New หรือกด Ctrl + N ) แล้วให้ปรับค่าขนาดดังต่อไปนี้...
Width = 778 Pixels
Height = 783 Pixels
Mode = RGB Color

ขั้นตอนที่2.
สร้าง Layer ใหม่แล้วทำการ พิมพ์ตัวอักษร ขนาดใหญ่ ( หรือจะนำภาพมาตกแต่งก็ได้ )
แล้วให้ปรับค่า Opacity = 50% ( ข้างบนอุปกรณ์ Layer ) ดังภาพ. 
แล้วทำการ Blur ตัวอักษรเสีย ( Filter --> Blur --> Gaussian Blur )
โดยปรับค่า Radius = 2.0  ( คลิ๊กเพื่อดูตัวอย่าง )

แสดงลักษณะเมื่อนำมา

http://www.thaigraph.com/technic/make_bgweb/make_bgweb.htm