วันพฤหัสบดีที่ 21 มกราคม พ.ศ. 2559

ส่วนประกอบของเว็บไซต์ที่ดี

ส่วนประกอบของเว็บไซต์ที่ดี



สำหรับคนที่เริ่มต้นออกแบบเว็บไซต์ในครั้งแรกไม่รู้ว่าจะเริ่มอย่างไรดี บทความนี้จะแนะนำวิธีการในการออกแบบเว็บไซต์ที่เว็บทั่วไปควรมี ดังรูปที่เห็นด้านบนเป็นโครงสร้างของเว็บไซต์โดยจะมีส่วนหลักๆอยู่ด้วยกันทั้งหมด 6 ส่วนดังนี้

Containing block
โดยปรกติเราจะเขียน <div> หรือ <table> ต่อจาก <body> เพื่อเอาไว้เก็บเนื้อหาทั้งหมดของเว็บไซต์ก่อน เพื่อเอาไว้เป็นกล่องในการเก็บเนื้อหาทั้งหมด โดยกล่องของเราจะมีข้อดีอยู่ตรงที่ สามารถทำให้ปรับเปลี่ยนขนาดในการแสดงผลของเนื้อหาได้ หรือตำแหน่งการแสดงผลของเว็บไซต์ได้เช่น จัดกลาง ชิดซ้าย หรือชิดขวา หากนึกภาพไม่ออก ลองเขียนเว็บไซต์โดยเริ่มที่ใส่ตัวหนังสือลงไปก่อน จากนั้นหากต้องการจัดตัวหนังสือเหล่านั้นจะทำได้ยากมาก ดังนั้นทุกครั้งที่ออกแบบเว็บไซต์อย่างลืมที่จะสร้าง containing block เอาไว้ใส่เนื้อหาทั้งหมดก่อน เพื่อความสะดวกของเราเอง

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

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

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

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

Whitespace
พื้นที่ว่างในเว็บไซต์ คนส่วนใหญ่มักไม่เห็นความสำคัญของการเว้นพื้นที่ว่างไว้ในเว็บไซต์ เรามักจะใส่ภาพหรือตัวหนังสือเข้าไปให้มากที่สุดเพราะคิดว่าจะทำให้เว็บดูสวยงามขึ้น หรือใช้พื้นที่มีมีอยู่ให้คุ้มค่าที่สุด หากเราออกแบบโดยไม่ได้คำนึงว่าต้องมีพื้นที่ว่างอยู่ในเว็บไซต์ จะทำให้เว็บของเรานั้นดูอึดอัดทันที การเว้นช่องว่างเอาไว้ ไม่ว่าจะเป็นระยะห่างระหว่างตัวอักษร หรือช่องว่างระหว่างภาพ เนื้อหาต่างๆ นอกจากจะทำให้เว็บของเราดูสบายตาขึ้นแล้ว ยังทำให้เราสามารถกำหนดจุดที่จะให้ผู้ใช้งานเว็บรู้สึกสนใจในจุดนั้นได้อีกด้วย เช่นหากเราเว้นช่องว่างเอาไว้ตรงกลาง และนำภาพหรือตัวหนังสือเล็กๆไปวางไว้ ตรงจุดนั้นจะเป็นที่สนใจของผู้ใช้ทันที
ที่มา http://www.bike-monster.com/
http://www.zweetherb.com/
http://www.welovestreetfashion.com/

วันพุธที่ 20 มกราคม พ.ศ. 2559

แปลข่าว

เทคโนโลยีที่รองรับในงานออกแบบนิเทศศิลป์


ปากกาอัจฉริยะ เขียนบนกระดาษปรากฏข้อมูลบนสมาร์ทโฟน

Sometimes you may want to keep a digital record of your notes or sketches. If you haven't got access to a computer or you'd simply prefer to use a pen, however, digitizing your content can be problematic. The new Orée Stylograph pen, however, will digitize what you write or draw as you go.
The Stylograph is the latest pen to have built-in digital note-taking functionality, with other offerings such as the Livescribe and the Neo Smartpen N2 already on the market. Indeed, the Stylograph's appearance isn't dissimilar to that of the Neo. Despite that, however, there's no doubt that, looks-wise, it is a cut above.
Like the Neo, the Stylograph has a triangular-shaped body with curved corners. This shape is said to be ergonomically considered so as to be comfortable for the user to hold. The pen casing is formed of copper, which makes the design look all the more striking and premium.
A leather-covered A5 notepad accompanies the pen. The pad contains 192 pages of specially patterned paper, and is refillable. The pattern on the paper allows the pen to sense how it is moving and to record the text or image shapes that the user is creating. While the pen could be used to write without the special paper, it would not be possible to digitize its output.

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


Orée Stylograph pen หรือปากกาลูกลื่นอัจฉริยะนี้ได้ถูกอธิบายโดย Orée 
บริษัทเทคโนโลยีจากฝรั่งเศสว่า “นี่คือครั้งแรกของเครื่องมือการเขียนที่เหมาะกับยุคดิจิทัล
ตัวปากกาทำจากทองแดงบริสุทธ์ มีแบตเตอรี่ด้านใน ด้ามจับมีลักษณะเป็นสามเหลี่ยมที่มีมุมโค้ง
ซึ่งรูปร่างนี้ได้รับการออกแบบตามหลักสรีระศาสตร์เพื่อให้สะดวกและเหมาะกับการเขียนของผู้ใช้
ด้านในของปากกาประกอบไปด้วยกล้องขนาดเล็กความเร็วสูงที่ติดตามจังหวะการเขียนของปากกา
ที่ถูกวางลงบนตำแหน่งต่างๆ บนหน้ากระดาษ ซึ่งสามารถจับรายละเอียดการเขียนได้สูงสุด
120 เฟรมต่อวินาที โดยตัวแบตเตอรี่ของปากกาสามารถใช้งานได้ 2 วัน
ปากกาลูกลื่นนี้จำหน่ายพร้อมสมุดโน้ตปกหนังซึ่งมีกระดาษขนาด A5 บรรรจุอยู่ 192 แผ่น
โดยกระดาษถูกออกแบบมาเพื่อทำงานร่วมกับปากกา โดยรูปแบบของกระดาษนั้นจะช่วยให้
ปากกาสามารถเคลื่อนย้ายไปมาและบันทึกสิ่งที่เขียนหรือภาพที่ผู้ใช้สร้างขึ้นได้ ทั้งนี้
ปากกาสามารถนำไปใช้เขียนบนกระดาษอื่นๆ ที่ไม่ได้ออกแบบมาจำเพาะได้ แต่ยังไม่สามารถที่
จะแปลงให้อยู่ในรูปของสื่อดิจิทัลได้
ทุกสิ่งที่คุณเขียนลงบนกระดาษจะถูกบันทึกไว้ในปากกาและซิงค์ข้อมูลกับแอพลิเคชั่นบนมือถือทั้ง
 iOS หรือ Android app ผ่านบลูทูธ
ในปีถัดไป ผู้สร้างเทคโนโลยีนี้หวังเป็นอย่างยิ่งในการพัฒนากระดาษในรูปแบบอื่นๆ เข้าไป
แต่ในขณะนี้คุณสามารถซื้อมันได้ในราคา 450 ดอลล่าสหรัฐฯ หรือราว 16,000 บาท 







ความสัมพันธ์ระหว่างเทคโนโลยีกับการออกแบบนิเทศศิลป์