วันนี้เราจะมาพูดถึงเทคนิคการออกแบบเว็บไซต์ที่มีหลายๆหน้า ปัญหาหลักๆที่พบคือ หาไฟล์หน้านั้นไม่เจอ หรือพอแก้ไฟล์ออกแบบหลัก ก็ทำให้ต้องแก้ส่วนที่เหลือ ไม่ต่างกับทำใหม่ วิธีหนึ่งที่พอจะช่วยลดปัญหาเล่านี้ได้ และยังช่วยให้เราขึ้นโครงหน้าเว็บได้ง่ายขึ้น ก็คือการแยกเฉพาะ Elements ต่างๆของหน้าเว็บออกมาอีกไฟล์หนึ่ง ที่ไม่เกี่ยวกับไฟล์ออกแบบหลัก
สวัสดีค่ะ วันนี้มาแบบสั้นๆ พร้อมคำถามที่ว่า ทำไมต้องตั้งชื่อ layer? ก่อนหน้านี้เวลาที่เราแต่งภาพในโปรแกรมรูปที่มี layer ให้ใช้ เช่น Photoshop เราก็ไม่เคยใส่ใจกับการตั้งชื่อ layer สักเท่าไหร่ค่ะ ตอนนั้นมองไม่เห็นปัญหา เพราะเราไม่ได้ทำงานที่มี layer เยอะๆ เวลาเลือก layer ก็อาศัยมั่วๆไป ก็ไม่ลำบากอะไร แต่พอมาถึงจุดหนึ่งที่ไฟล์งานของเรามี layer เยอะมาก จนไม่รู้ว่าเราจะหา layer ที่เราต้องการได้ยังไง ถึงแม้ว่า โปรแกรม Photoshop จะมีฟังก์ชั่น คลิ้กขวา เพื่อเลือก layer ที่ซ้อนกันอยู่ ณ จุดที่เรากดมาให้เราเลือกแบบง่ายขึ้นแล้ว หรือจะใช้ shortcut key : ctrl + alt คลิ้กขวา เพื่อเลือก layer บนสุดที่ตรงนั้นได้เลยก็แล้ว ในหลายๆครั้งที่เราต้องการ layer ที่ถูกซ้อนไว้ ก็ยังเจอความลำบาก และสับสนอยู่ดีค่ะ สุดท้าย ก็ต้องลองกดมั่วๆไปหลายครั้ง กว่าจะเจอ layer ที่ต้องการ ซึ่งเสียเวลาไม่น้อยเลย
มาดูกันว่า Layer Comps คืออะไรแล้วมีประโยชน์ในการออกแบบอย่างไร ที่มา : http://help.adobe.com/en_US/Photoshop/11.0/index.html Layer Comps คือการเซฟ สถานะของ layers ที่เราทำงานไว้ เพื่อให้แสดงผลได้หลายๆแบบ ในไฟล์ๆเดียว ก็คือมันจะเก็บ state การแสดง layer ต่างๆของเราไว้นั่นเอง โดยจะสามารถเก็บรายละเอียดได้ 3 อย่างคือ Layer visibility คือ การเก็บการ ซ่อน/แสดง ของแต่ละ layer Layer position คือ การเก็บตำแหน่งของภาพ Layer appearance คือ เก็บ Layer Style และ ค่าต่างๆที่ตั้งไว้ใน Blending Option ความสามารถของ Layer Comps นี้ มีประโยชน์มากๆ สำหรับงานที่มีการแบ่งเป็นหน้าๆ เช่น งานออกแบบเว็บ, ภาพวีดีโอ หรือทำภาพ gif เนื่องจากสามารถแสดงผลได้หลายหน้า ในไฟล์ๆเดียว โดยที่ไม่ต้องยุ่งยากในการจำว่า Layers ไหน ซ่อน หรือ แสดงอยู่ ในหน้านั้นๆ How to use Layer Comps. ในการใช้ Layer Comps นั้น ง่ายๆก็แค่เปิดหน้าต่าง Layer Comps ที่เมนู Window > Layer Comps Layer Comps panel A. Apply Layer Comp icon B.Last Document State…read more
ไปงาน CS5 is here มา ได้อะไรมาหลายๆอย่างมากๆ เสียดายที่เค้ามีแจก Adobe Design Premium Pack ราคา 9 หมื่นบาท ด้วย แต่ไม่ได้ T^T เสียใจ งาน CS5 is Here นี้ เป็นงานที่ทาง Thai Adobe User Group จัดขึ้น เนื้อหาในคราวนี้ เกี่ยวกับการแนะนำ Feature ใหม่ๆ ใน Design Premium CS5 เนื้อหาตื่นตาตื่นใจมากทีเดียว เนื้อหาค่อนข้างจะกระชับมากๆ เพราะเนื้อหาค่อนข้างเยอะ เค้าเลยพูดสั้นๆ และให้กลับไปดูละเอียดๆที่บ้านเอง ซึ่งเค้ามีแจกวีดีโอให้สำหรับผู้ร่วมงาน และเค้าไม่อนุญาติให้แจกค่ะ ใครอดงานนี้ งานหน้าถ้าไปสามารถไปขอไฟล์จากผู้จัดได้ โดย Adobe CS5 นี้ เพิ่มความสามารถทาง online ขึ้นมาอีกคือ การ review งาน online ผ่าน internet โดยใช้ร่วมกับ Acrobat.com สามารถใส่ user ที่ review ได้ เก็บ record การแก้ไขเป็น revision แน่นอนว่าใครใช้โปรแกรมเถื่อน ย่อมใช้ไม่ได้แน่นอน มาดูกันต่อดีกว่า ว่าแต่ละโปรแกรมมีอะไรเจ๋งๆบ้าง
หมายเหตุ: อันนี้เราอ้างอิงจากคีย์ลัด default ของ photoshop นะคะ เพราะ จขบ. ถนัดใช้แบบนี้ซะแล้ว เราจะรู้ได้อย่างไรว่า tool ไหนมีคีย์ลัดอะไร วิธีง่ายๆคือ เอาเม้าไปชี้แช่ไว้สักพัก มันจะขึ้นแถบข้อความมาและมีคีย์ลัดวงเล็บไว้ข้างหลังให้ จริงๆแล้วเราไม่จำเป็นต้องจำทั้งหมด จำแค่อะไรที่ใช้บ่อยๆก็เพียงพอแล้ว
