ทำแบนเนอร์เว็บไซต์ง่ายๆด้วย Adobe Photoshop

Graphic design ความรู้สำหรับ การออกแบบ ออกแบบเว็บ Phothoshop ตัดต่อวีดีโอ

Moderator: mindphp, ผู้ดูแลกระดาน

nutapisit
PHP Hero Member
PHP Hero Member
โพสต์: 145
ลงทะเบียนเมื่อ: 21/06/2021 10:56 am

ทำแบนเนอร์เว็บไซต์ง่ายๆด้วย Adobe Photoshop

โพสต์ที่ยังไม่ได้อ่าน โดย nutapisit »

ทำแบนเนอร์เว็บไซต์ง่ายๆด้วย Adobe Photoshop


ในปัจจุบันนั้นคงไม่มีใครไม่รู้จักเว็บไซต์ ซึ่งในชีวิตประจำวันเรานั้นยังไงเราก็ต้องมีเว็บไซต์ที่ผ่านตา และในเว็บไซต์ก้มีส่วนที่เรียกว่า แบนเนอร์ แบนเนอร์คือแผ่นป้ายโฆษณาที่อยู่บนส่วนหัวของเว็บที่เราจะเห็นเป็นอันดับแรก ถ้ามันดึงดูดผู้ใช้งานก็จะสามารถเพิ่มยอดผู้เข้าชมให้กับเว็บไซต์นั้น ในบทความนี้นั้นผมจะพาทุกคนไปออกแบบ แบนเนอร์เว็บไซต์ง่ายๆด้วยโปรแกรมที่ใครๆก็รู้จักนั่นก็คือ Adobe Photoshop จะเป็นยังไงมาออกแบบไปพร้อมกันเลยครับ


  • เปิดโปรแกรม Adobe Photoshop บนอุปกรณ์ของคุณ

Adobe Photoshop
Adobe Photoshop
1.jpg (3.64 KiB) Viewed 1301 times

  • หาเว็บไซต์ที่คุณอยากลองทำแบนเนอร์แล้วกด Print Screen ( PRTSC )
ในตัวอย่างผมจะลองทำ Banner ของ https://www.mindphp.com/ นะครับ
ขั้นตอนที่1
ขั้นตอนที่1
2.jpg (9.42 KiB) Viewed 1301 times

  • เปิด Adobe Photoshop กด Create New > เลือก Clipboard > Create

ขั้นตอนที่2
ขั้นตอนที่2
3.jpg (12.67 KiB) Viewed 1301 times

  • กด Ctrl + V แล้วเลือกใช้เครื่องมือ Crop เฉพาะส่วนแบนเนอร์

ขั้นตอนที่3
ขั้นตอนที่3
4.jpg (38.31 KiB) Viewed 1301 times

  • กด Ctrl + A เพื่อเลือกทั้งหมด แล้วตามด้วย Ctrl + C

ขั้นตอนที่4
ขั้นตอนที่4
5.jpg (12.21 KiB) Viewed 1301 times

  • ไปที่ File > New > Clipboard > Create
ขั้นตอนที่5
ขั้นตอนที่5
6.jpg (10.35 KiB) Viewed 1301 times
เท่านี้คุณก็ได้ขนาด Banner ของเว็บไซต์นั้นไว้ทำการออกแบบแล้วครับ โดยทุกคนสามารถออกแบบได้ตามความคิดสร้างสรรค์ของตัวเองเลยครับ :-D


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


แหล่งที่มา :
https://th.strephonsays.com/photoshop-elements-and-vs-photoshop-6339
http://www.krukikz.com/photoshop-cs6/unit2/intro-photoshop-cs6
https://today.line.me/th/v2/article/81Kj7R
  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ผู้ใช้งานขณะนี้

สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 56