วันอาทิตย์ที่ 7 สิงหาคม พ.ศ. 2559

การเขียน story board



ความหมาย
     สตอรี่บอร์ด (Story Board) คือ การเขียนกรอบแสดงเรื่องราวที่สมบูรณ์ของภาพยนตร์หรือหนังแต่ละเรื่อง โดยมีการแสดงรายละเอียดที่จะปรากฏในแต่ละฉากหรือแต่ละหน้าจอ เช่น ข้อความ ภาพ ภาพเคลื่อนไหว เสียงดนตรี เสียงพูดและแต่ละอย่างนั้นมีลำดับของการปรากฏว่าอะไรจะปรากฏขึ้นก่อน-หลัง อะไรจะปรากฏพร้อมกัน เป็นการออกแบบอย่างละเอียดในแต่ละหน้าจอก่อนที่จะลงมือสร้างเอนิเมชันหรือ หนังขึ้นมาจริงๆ
• Storyboard คือ การสร้างภาพให้เห็นลำดับขั้นตอนตามเนื้อเรื่องที่ต้องการ โดยเฉพาะภาพเคลื่อนไหว
• รายละเอียดที่ควรมีใน Storyboard ได้แก่ คำอธิบายแต่ละสื่อที่ใช้ (ข้อความ รูปภาพ ภาพเคลื่อนไหว เสียง วีดิโอ)


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

สิ่งสำคัญที่อยู่ภายในสตอรี่บอร์ด ประกอบด้วย

- ตัวละครหรือฉาก ไม่ว่าจะเป็นคน สัตว์ สิ่งของ สถานที่หรือตัวการ์ตูน และที่สำคัญ คือ พวกเขากำลังเคลื่อนไหวอย่างไร

- มุมกล้อง ทั้งในเรื่องของขนาดภาพ มุมภาพและการเคลื่อนกล้อง

- เสียงการพูดกันระหว่างตัวละคร มีเสียงประกอบหรือเสียงดนตรีอย่างไร

ข้อดีของการทำ Story Board

1. ช่วยให้เนื้อเรื่องลื่นไหล เพราะได้อ่านทวนตั้งแต่ต้นจนจบก่อนจะลงมือวาดจริง

2. ช่วยให้เนื้อเรื่องไม่ออกทะเล เพราะมีแผนการวาดกำกับไว้หมดแล้ว

3. ช่วยกะปริมาณบทพูดให้พอดีและเหมาะสมกับหน้ากระดาษและบอลลูนนั้น ๆ

4. ช่วยให้สามารถวาดจบได้ในจำนวนหน้าที่กำหนด (สำคัญสุด!)


ขั้นตอนการทำ Story Board

1.วางโครงเรื่องหลัก ไม่ว่าจะเป็น Theme, ตัวละครหลัก, ฉาก ฯลฯ

1.1 แนวเรื่อง

1.2 ฉาก

1.3 เนื้อเรื่องย่อ

1.4 Theme/แก่น (ข้อคิด/สิ่งที่ต้องการจะสื่อ)

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

2. ลำดับเหตุการณ์คร่าว ๆ

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

3. กำหนดหน้า

4. แต่งบท

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

5. ลงมือเขียน Story Board

แบบฟอร์มการเขียนสตอรี่บอร์ดแบบต่างๆ

แบบที่ 1


แบบที่ 2


แบบที่ 3


ตัวอย่างสตอรี่บอร์ด (Story Board)

ที่มา https://sites.google.com/site/pathumwilairoom1/kar-kheiyn-s-tx-ri-bxrd-storyboard

Teaser กับ Trailer

Teaser กับ Trailer เหมือนหรือแตกต่างกันอย่างไร?

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


Trailer

- Trailer (เทรลเลอร์) คล้ายกับ Teaser แต่ยาวกว่า จุดประสงค์เดียวกัน แต่ถ้า Teaser ทำยาว3-4นาที ก็ยังเรียก Trailer ไม่ได้อยู่ดีครับ ถ้าขาดองค์ประกอบทั้ง แนวเรื่อง, อารมณ์เรื่อง, พล็อตเรื่องคร่าวๆ , ฉากไฮไลท์ เอาง่ายๆคือบอกรายละเอียดมากกว่า Teaser ในบรรดาหนังฮอลลิวูดส์ มี Trailer หนังที่ประสบความสำเร็จมากหลายเรื่อง อย่าง อิมพอสสิเบิล ที่ดึงคนดูอย่างถึงขีด http://www.youtube.com/watch?v=THVFkk-sEus ที่มาของ trailer นั้น
ถ้าแปลก็ ผู้สะกดรอย ส่วนใหญ่คงเข้าใจว่าประมาณบอกคร่าวๆให้รู้ (ตำราม.รามยังใส่เลย) แต่ถ้าลองค้นประวัติคือ ในช่วงแรก Trailer จะฉายต่อท้ายหนัง แต่ภายหลังถึงเปลี่ยนมาฉายก่อนหนังจะเริ่ม (ส่วนใหญ่ถ่ายเสร็จแล้วจึงออก ส่วนTeaser จะออกตอนถ่ายหนังไม่เสร็จ) ดังนั้นคำนี้ จึงน่าจะมาจากความหมายเดิมของ Trailer อีกตัวที่แปลว่า "พ่วง" "ต่อท้าย" 



ที่มา : http://board.postjung.com/705613.html


วันอาทิตย์ที่ 3 กรกฎาคม พ.ศ. 2559

การเขียนบทภาพยนตร์

ขั้นตอนสำหรับการเขียนบทภาพยนตร์

1. การค้นคว้าหาข้อมูล (research)

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

2. การกำหนดประโยคหลักสำคัญ (premise)

      หมายถึงความคิดหรือแนวความคิดที่ง่าย ๆ ธรรมดา ส่วนใหญ่มักใช้ตั้งคำถามว่า “เกิดอะไรขึ้นถ้า…” (what if) ตัวอย่างของ premise ตามรูปแบบหนังฮอลลีวู้ด เช่น เกิดอะไรขึ้นถ้าเรื่องโรเมโอ &จูเลียตเกิดขึ้นในนิวยอร์ค คือ เรื่อง West Side Story, เกิดอะไรขึ้นถ้ามนุษย์ดาวอังคารบุกโลก คือเรื่อง The Invasion of Mars, เกิดอะไรขึ้นถ้าก็อตซิล่าบุกนิวยอร์ค คือเรื่อง Godzilla, เกิดอะไรขึ้นถ้ามนุษย์ต่างดาวบุกโลก คือเรื่อง The Independence Day, เกิดอะไรขึ้นถ้าเรื่องโรเมโอ &จูเลียตเกิดขึ้นบนเรือไททานิค คือเรื่อง Titanic เป็นต้น

3. การเขียนเรื่องย่อ (synopsis)

      คือเรื่องย่อขนาดสั้น ที่สามารถจบลงได้ 3-4 บรรทัด หรือหนึ่งย่อหน้า หรืออาจเขียนเป็น story outline เป็นร่างหลังจากที่เราค้นคว้าหาข้อมูลแล้วก่อนเขียนเป็นโครงเรื่องขยาย (treatment)

4. การเขียนโครงเรื่องขยาย (treatment)

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

5. บทภาพยนตร์ (screenplay)

      สำหรับภาพยนตร์บันเทิง หมายถึง บท (script) ซีเควนส์หลัก (master scene/sequence)หรือ ซีนาริโอ (scenario) คือ บทภาพยนตร์ที่มีโครงเรื่อง บทพูด แต่มีความสมบูรณ์น้อยกว่าบทถ่ายทำ (shooting script) เป็นการเล่าเรื่องที่ได้พัฒนามาแล้วอย่างมีขั้นตอน ประกอบ ด้วยตัวละครหลักบทพูด ฉาก แอ็คชั่น ซีเควนส์ มีรูปแบบการเขียนที่ถูกต้อง เช่น บทสนทนาอยู่กึ่งกลางหน้ากระดาษฉาก เวลา สถานที่ อยู่ชิดขอบหน้าซ้ายกระดาษ ไม่มีตัวเลขกำกับช็อต และโดยหลักทั่วไปบทภาพยนตร์หนึ่งหน้ามีความยาวหนึ่งนาที
6. บทถ่ายทำ (shooting script)

      คือบทภาพยนตร์ที่เป็นขั้นตอนสุดท้ายของการเขียน บทถ่ายทำจะบอกรายละเอียดเพิ่มเติมจากบทภาพยนตร์ (screenplay) ได้แก่ ตำแหน่งกล้อง การเชื่อมช็อต เช่น คัท (cut) การเลือนภาพ (fade) การละลายภาพ หรือการจางซ้อนภาพ (dissolve) การกวาดภาพ (wipe) ตลอดจนการใช้ภาพพิเศษ (effect) อื่น ๆ เป็นต้น นอกจากนี้ยังมีเลขลำดับช็อตกำกับเรียงตามลำดับตั้งแต่ช็อตแรกจนกระทั่งจบเรื่อง
7. บทภาพ (storyboard)

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

ที่มา : joynaka23.wordpress.com

วันจันทร์ที่ 27 มิถุนายน พ.ศ. 2559

องค์ประกอบและหลักการทำงานของคอมพิวเตอร์

องค์ประกอบของคอมพิวเตอร์

คอมพิวเตอร์ จะทำงานได้ต้องประกอบไปด้วยส่วนสำคัญ 5 ส่วนด้วยกันคือ



1.หน่วยรับเข้า (Input Unit)
      ทำหน้าที่รับข้อมูลคำสั่งจากผู้ใช้ เข้าสู่ระบบคอมพิวเตอร์ เพื่อนำไปประมวลผล ข้อมูลที่รับเข้าสู่ระบบคอมพิวเตอร์มีหลากหลาย เช่น ตัวอักษร, เสียง เป็นต้น โดยผ่านอุปกรณ์สำหรับนำเข้าข้อมูลรูปแบบต่างๆ เมาส์, คีย์บอร์ด, เครื่องสแกน



2.หน่วยประมวลผลกลาง (Central Processing Unit)
     ทำหน้าที่ประมวลผล คำนวณ และควบคุมการทำงานต่างๆ ของระบบคอมพิวเตอร์
1. หน่วยควบคุม (Control Unit : CU) ทำหน้าที่อ่านคำสั่ง สั่งงาน และควบคุมการทำงานของระบบคอมพิวเตอร์
2. หน่วยคำนวณตรรกะ (Arithmetic and Logic Unit : ALU) ทำหน้าที่คำนวณด้วยวิธีการทางคณิตศาสตร์ เช่น บวก ลบ คูณ หาร การเปรียบเทียบข้อมูลมากกว่า น้อยกว่า เป็นต้น



3.หน่วยความจำหลัก (Main Memory Unit)
     เป็นหน่วยเก็บข้อมูลก่อนนำไปประมวลผล เก็บคำสั่งโปรแกรมขณะใช้งาน และเก็บผลลัพธ์ที่ได้จากการประมวลผลก่อนนำไปแสดงผล หน่วยความจำหลักแบ่งออกเป็น 2 ประเภท
1. หน่วยความจำหลักแบบอ่านได้อย่างเดียว (Read Only Memory : ROM) เป็นหน่วยความจำที่บริษัทผู้ผลิตคอมพิวเตอร์ได้บรรจุชิปหน่วยความจำแบบติดตั้งถาวร หรือไบออส ไว้บนแผงวงจรหลักเรียบร้อยแล้ว โดยข้อมูลที่บรรจุลงไปในหน่วยความจำจะยังคงอยู่แม้จะปิดเครื่องไปแล้ว แต่ไม่สามารถบรรจุข้อมูลเพิ่มเติมลงไปได้
2. หน่วยความจำหลักแบบแก้ไขได้ (Random Access Memory : RAM) เป็นหน่วยความจำที่ใช้สำหรับเก็บข้อมูลและคำสั่ง มีหน้าที่จดจำคำสั่งที่เป็นโปรแกรมและข้อมูลที่จะทำการประมวลผล หากเกิดไฟฟ้าดับหรือไม่มีกระแสไฟฟ้าข้อมูลที่อยู่ภายในจะหายไปทั้งหมด



4.หน่วยความสำจำรอง (Secondary Memory Unit)
     เป็นหน่วยความจำที่สามารถรักษาข้อมูลได้ตลอดไป ไม่มีทางสูญหายหลังจากเปิดเรื่องคอมพิวเตอร์แล้ว



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


หลักการทำงานของคอมพิวเตอร์

     หลักการทำงานของคอมพิวเตอร์จะเป็นไปตามที่โปรแกรมได้กำหนดไว้ โดยตัวเครื่องคอมพิวเตอร์หรือที่เรียกว่าฮาร์ดแวร์ จะมีส่วนประกอบสำคัญขั้นพื้นฐาน 5 หน่วย ซึ่งแต่ละหน่วยจะมีหลักการทำงาน ดังนี้



1. หน่วยรับข้อมูล (input unit)
     ทำหน้าที่รับข้อมูลมาจัดเก็บที่หน่วยความจำหลักของคอมพิวเตอร์ จากนั้นเมื่อมีคำสั่งให้ประมวลผล ข้อมูลที่ถูกจัดเก็บไว้ที่หน่วยความจำจะถูกส่งไปยังหน่วยประมวลผล



2. หน่วยประมวลผลกลาง (central processing unit)
     ทำหน้าที่ประมวลผลให้ได้ผลลัพธ์ตามที่ต้องการ จากนั้นผลลัพธ์จะถูกส่งไปจัดเก็บที่หน่วยความจำหลัก



3. หน่วยความจำหลัก (main memory)
     ทำหน้าที่จัดเก็บข้อมูลและโปรแกรมต่างๆ ในขณะที่เครื่องคอมพิวเตอร์เปิดอยู่เท่านั้น ถ้าปิดเครื่องคอมพิวเตอร์ข้อมูลหรือโปรแกรมนั้นจะสูญ หายไป

3.1.1 หน่วยความจำแบบลบเลือนได้ 
     คือ หากเกิดไฟดับระหว่างใช้งาน ข้อมูลจะหาย เรียกว่า แรม (RAM)



3.1.2 หน่วยความจำแบบลบเลือนไม่ได้ 
    คือ หน่วยความจำถาวร แม้ไฟจะดับข้อมูลก็จะยังอยู่เหมือนเดิม เรียกว่า รอม (ROM)



4. หน่วยแสดงผล (output unit)
      ทำหน้าที่นำผลลัพธ์ที่ได้จากการประมวลผลมาแสดงผลหรือจัดเก็บไว้ที่หน่วยความจำรอง



5. หน่วยความจำรอง (secondary storage)
     ทำหน้าที่จัดเก็บข้อมูลและโปรแกรมต่างๆ เพื่อนำมาใช้อีกครั้งในภายหลังได้ แม้จะปิดเครื่องคอมพิวเตอร์ข้อมูลและโปรแกรมที่จัดเก็บไว้จะไม่สูญหาย



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

1. บิต (bit)
เป็นส่วนที่เล็กที่สุดของการเก็บข้อมูล เลขฐาน 2 คือ 0 และ 1 จำนวน 1 ตัว จะเรียกว่า 1 บิต เช่น 1001 จะเรียกว่า 4 บิต หากเปรียบเสมือนหลอดไฟ 0 หมายถึงปิดไฟ, 1 หมายถึงเปิดไฟ
2. ไบต์ (byte)
เกิดจากเลขฐาน 2 จำนวน 8 ตัวเรียงกัน หรือ 8 บิต นั่นเอง เข้าใจง่ายๆ คือ 8 บิต = 1 ไบต์ เช่น 10011001 แบบนี้เรียกว่า 1 ไบต์ ซึ่งตัวเลขจำนวน 8 หลักนี้ จะได้ค่าที่แตกต่างกันถึง 256 ค่า 1 ไบต์ มีชื่อเรียกอีกชื่อหนึ่งว่า ออกเทต (octet) แต่ถ้า 4 บิต จะมีชื่อเรียกอีกอย่างว่า นิบเบิล (nibble)
3. รหัสเอ็บซีดิก (Extended Binary Coded Decimal Interchange Code : EBCDIC)
เป็นรหัสที่พัฒนาโดยบริษัท IBM เพื่อใช้กับรบบปฏิบัติการขนาดใหญ่ เช่น OS-390 สำหรับเครื่องแม่ข่าย S/390 ถูกนำมาใช้กับเครื่องคอมพิวเตอร์ของ IBM ทั้งหมด รหัสเอ็บซีดิก มีขนาด 8 บิต แทนรหัสอักขระได้ 256 ตัว ปัจจุบันรหัสเอ็บซีดิกไม่เป็นที่นิยมและกำลังจะเลิกใช้งาน
4. รหัสแอสกี (American Standard Code for Information Interchange : ASCII)
เป็นรหัสมาตรฐานที่กำหนดโดยสถาบันมาตรฐานแห่งชาติอเมริกา (American National Standards Institute : ANSI) เป็นรหัสที่นิยมใช้งานกันมากที่สุดบนเครื่องคอมพิวเตอร์
5. ยูนิโค้ด (Unicode)
เป็นรหัสที่ถูกพัฒนามาในปี พ.ศ.2534 และมีการพัฒนาอย่างต่อเนื่อง ยูนิโค้ดช่วยให้คอมพิวเตอร์แสดงผล และจัดการข้อความตัวอักษรที่ใช้ระบบการเขียนของภาษาส่วนใหญ่ทั่วโลก ยูนิโค้ดเป็นเลขฐาน 2 ตั้งแต่ 1 ถึง 4 ไบต์ ทำให้สามารถรองรับการเก็บข้อมูลอักขระได้กว่า 100,000 ตัว


          -การประมวลผลของซีพียู
1.การรับเข้าข้อมูล (Fetch) รับรหัสคำสั่งและข้อมูล จากหน่วยความจำ
2. การถอดรหัส (Decode) ทำการถอดรหัสคำสั่งได้รับ และส่งต่อไปยังส่วนคำนวณและตรรกะ
3. การทำงาน (Execute) ทำการคำนวณข้อมูลที่ถอดรหัสแล้ว และสั่งให้ CPU ทำงานตามคำสั่ง
4. การเก็บข้อมูล (Store) ทำการเก็บข้อมูลไว้ในหน่วยความจำหลัก


          -การรับส่งข้อมูลภายในคอมพิวเตอร์
     แผงวงจรหลัก หรือเมนบอร์ด (Motherboard/Mainboard)
เปรียบเสมือนศูนย์กลางของเครื่องคอมพิวเตอร์ เพราะอุปกรณ์ทุกอย่าง จะต้องทำการเชื่อมต่อกับแผงวงจรหลักนี้


บัส (Bus)

      หมายถึง ช่องทางการติดต่อสื่อสารข้อมูลของอุปกร์ต่างๆ บัสในหน่วยประมวลผลกลางประกอบไปด้วย
1. บัสข้อมูล (Data Bus) เป็นบัสที่หน่วยประมวลผลกลาง ใช้เป็นเส้นทางในการควบคุมและ การขนส่งข้อมูล ระหว่างหน่วยประมวลผลกลาง และอุปกรณ์ภายนอก
2. บัสรองรับข้อมูล (Address Bus) เป็นบัสที่หน่วยประมวลผลกลาง เลือกว่าจะส่งข้อมูลหรือรับข้อมูลจากอุปกรณ์ใด โดยจะส่งสัญญาณมาที่บัสรองรับข้อมูลนี้
3. บัสควบคุม (Control Bus) เป็นบัสที่รับสัญญาณการควบคุมจากหน่วยประมวลผลกลาง เพื่อบังคับว่าจะอ่านข้อมูลเข้า หรือจะส่งข้อมูลออก

วันอาทิตย์ที่ 29 พฤษภาคม พ.ศ. 2559

สรุปองค์ประกอบสารสนเทศ

ความหมายระบบสารสนเทศ

      ระบบสารสนเทศ (Information System หรือ IS) เป็นระบบพื้นฐานของการทำงานต่างๆ ในรูปแบบของการเก็บ (input) การประมวลผล (processing) เผยแพร่ (output) และมีส่วนจัดเก็บข้อมูล (storage)

 องค์ประกอบของระบบสารสนเทศ

1. ฮาร์ดแวร์ (hardware) หมายถึง อุปกรณ์ที่ประกอบขึ้นเป็นเครื่องคอมพิวเตอร์ ลักษณะเป็นโครงร่างมองเห็นด้วยตาและสัมผัสได้ เช่น จอภาพ คีย์บอร์ด เครื่องพิมพ์ เมาส์ เป็นต้น สามารถแบ่งออกเป็นส่วนต่างๆ ตามลักษณะการทำงาน ได้ 4 หน่วย คือ หน่วยรับข้อมูล (Input Unit) หน่วยประมวลผลกลาง (Central Processing Unit : CPU) หน่วยแสดงผล (Output Unit) หน่วยเก็บข้อมูลสำรอง (Secondary Storage) โดยอุปกรณ์แต่ละหน่วยมีหน้าที่การทำงานแตกต่างกัน

2. ซอฟต์แวร์ (software) หมายถึง ส่วนที่มนุษย์สัมผัสไม่ได้โดยตรง เป็นโปรแกรมหรือชุดคำสั่งที่ถูกเขียนขึ้นเพื่อสั่งให้เครื่องคอมพิวเตอร์ทำงาน เป็นเหมือนตัวเชื่อมระหว่างผู้ใช้เครื่องคอมพิวเตอร์และเครื่องคอมพิวเตอร์ ถ้าไม่มีซอฟต์แวร์เราก็ไม่สามารถใช้เครื่องคอมพิวเตอร์ทำอะไรได้ ซอฟต์แวร์สำหรับเครื่องคอมพิวเตอร์สามารถแบ่งออกได้เป็น
      2.1 ซอฟต์แวร์สำหรับระบบ (System Software)
คือ ชุดของคำสั่งที่เขียนไว้เป็นคำสั่งสำเร็จรูป ซึ่งจะทำงานใกล้ชิดกับคอมพิวเตอร์มากที่สุด เพื่อคอยควบคุมการทำงานของฮาร์ดแวร์ทุกอย่าง และอำนวยความสะดวกให้กับผู้ใช้ในการใช้งาน ซอฟต์แวร์หรือโปรแกรมระบบที่รู้จักกันดีก็คือ DOS, Windows, Unix, Linux รวมทั้งโปรแกรมแปลคำสั่งที่เขียนในภาษาระดับสูง เช่น ภาษา Basic, Fortran, Pascal, Cobol, C เป็นต้น นอกจากนี้โปรแกรมที่ใช้ในการตรวจสอบระบบเช่น Norton’s Utilities ก็นับเป็นโปรแกรมสำหรับระบบด้วยเช่นกัน
      2.2 ซอฟต์แวร์ประยุกต์ (Application Software)
คือ ซอฟต์แวร์หรือโปรแกรมที่ทำให้คอมพิวเตอร์ทำงานต่างๆ ตามที่ผู้ใช้ต้องการ ไม่ว่าจะด้านเอกสาร บัญชี การจัดเก็บข้อมูล เป็นต้น ซอฟต์แวร์ประยุกต์สามารถจำแนกได้เป็น 2 ประเภท คือ
  1. ซอฟต์แวร์สำหรับงานเฉพาะด้าน เขียนขึ้นเพื่อการทำงานเฉพาะอย่างที่เราต้องการ บางที่เรียกว่า User’s Program เช่น โปรแกรมการทำบัญชีจ่ายเงินเดือน โปรแกรมระบบเช่าซื้อ โปรแกรมการทำสินค้าคงคลัง เป็นต้น แต่ละโปรแกรมก็มักจะมีเงื่อนไข หรือแบบฟอร์มแตกต่างกันออกไปตามความต้องการ หรือกฏเกณฑ์ของแต่ละหน่วยงานที่ใช้ ซึ่งสามารถดัดแปลงแก้ไขเพิ่มเติม (Modifications) ในบางส่วนของโปรแกรมได้ เพื่อให้ตรงกับความต้องการของผู้ใช้ และซอฟต์แวร์ประยุกต์ที่เขียนขึ้นนี้โดยส่วนใหญ่มักใช้ภาษาระดับสูงเป็นตัวพัฒนา
  2. ซอฟต์แวร์สำหรับงานทั่วไป มีผู้จัดทำไว้ เพื่อใช้ในการทำงานประเภทต่างๆ ทั่วไป ผู้ใช้คนอื่นๆ สามารถนำโปรแกรมนี้ไปประยุกต์ใช้กับข้อมูลของตนได้ แต่ไม่สามารถทำการดัดแปลง หรือแก้ไขโปรแกรมได้ ผู้ใช้ไม่จำเป็นต้องเขียนโปรแกรมเอง ซึ่งเป็นการประหยัดเวลา แรงงาน และค่าใช้จ่ายในการเขียนโปรแกรม นอกจากนี้ ยังไม่ต้องเวลามากในการฝึกและปฏิบัติ ซึ่งโปรแกรมสำเร็จรูปนี้ มักจะมีการใช้งานในหน่วยงานมราขาดบุคลากรที่มีความชำนาญเป็นพิเศษในการเขียนโปรแกรม ดังนั้น การใช้โปรแกรมสำเร็จรูปจึงเป็นสิ่งที่อำนวยความสะดวกและเป็นประโยชน์อย่างยิ่ง ตัวอย่างโปรแกรมสำเร็จรูปที่นิยมใช้ได้แก่ MS-Office, Lotus, Adobe Photoshop, SPSS, Internet Explorer และ เกมส์ต่างๆ เป็นต้น
3. บุคลากร (Peopleware) หมายถึง บุคลากรในงานด้านคอมพิวเตอร์ ซึ่งมีความรู้เกี่ยวกับคอมพิวเตอร์ สามารถใช้งาน สั่งงานเพื่อให้คอมพิวเตอร์ทำงานตามที่ต้องการ แบ่งออกได้ 4 ระดับ ดังนี้
  1. ผู้จัดการระบบ (System Manager) คือ ผู้วางนโยบายการใช้คอมพิวเตอร์ให้เป็นไปตามเป้าหมายของหน่วยงาน
  2. นักวิเคราะห์ระบบ (System Analyst) คือ ผู้ที่ศึกษาระบบงานเดิมหรืองานใหม่และทำการวิเคราะห์ความเหมาะสม ความเป็นไปได้ในการใช้คอมพิวเตอร์กับระบบงาน เพื่อให้โปรแกรมเมอร์เป็นผู่เขียนโปรแกรมให้กับระบบงาน
  3. โปรแกรมเมอร์ (Programmer) คือ ผู้เขียนโปรแกรมสั่งงานเครื่องคอมพิวเตอร์เพื่อให้ทำงานตามความต้องการของผู้ใช้ โดยเขียนตามแผนผังที่นักวิเคราะห์ระบบได้เขียนไว้
  4. ผู้ใช้ (User) คือ ผู้ใช้งานคอมพิวเตอร์ทั่วไป ซึ่งต้องเรียนรู้วิธีการใช้เครื่อง และวิธีการใช้งานโปรแกรม เพื่อให้โปรแกรมที่มีอยู่สามารถทำงานได้ตามที่ต้องการ
      เนื่องจากเป็นผู้กำหนดโปรแกรมและใช้งานเครื่องคอมพิวเตอร์ มนุษย์จึงเป็นตัวแปรสำคัญในอันที่จะทำให้ผลลัพธ์มีความน่าเชื่อถือ เนื่องจากคำสั่งและข้อมูลที่ใช้ในการประมวลผลได้รับจากการกำหนดของมนุษย์ (Peopleware) ทั้งสิ้น

4. ข้อมูล (Dataware) คือ ส่วนที่เป็นข้อมูลต่างๆ ที่บรรจุลงในเครื่องไมโครคอมพิวเตอร์ เพื่อให้เครื่องไมโครคอมพิวเตอร์ ประมวลผลลัพธ์ออกมาตามที่เราต้องการ ซึ่งข้อมูลต่างๆจะถือว่ามีค่ามากจำเป็นต้องได้รับการดูแลและเก็บรักษาไว้ เป็นอย่างดี ข้อมูลที่จะนำเข้าระบบคอมพิวเตอร์ จะมีหน่วยของข้อมูลที่เล็กที่สุดได้แก่ “ตัวอักขระ”(Character) เมื่อนำตัวอักขระเหล่านี้มาประกอบกันจะทำให้ได้หน่วยข้อมูลที่ใหญ่ขึ้นเรียกว่า “ฟิลด์”(Field) และการนำฟิลด์หลาย ๆ ฟิลด์มาประกอบกันจะทำให้ได้สิ่งที่เรียกว่า “เรคคอร์ด”(Record) และถ้านำเรคคอร์ดหลายเรคคอร์ดมาประกอบกันก็จะได้สิ่งที่เรียกว่า “ไฟล์ข้อมูล”(Data File)

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

ระบบสารสนเทศนั้นจะประกอบด้วย

  • ข้อมูล (Data) หมายถึง ค่าของความจริงที่ปรากฏขึ้น โดยค่าความจริงที่ได้จะนำมาจัดการปรับแต่งหรือประมวลผลเพื่อให้ได้สารสนเทศที่ต้องการ
  • สารสนเทศ (Information) คือ กลุ่มของข้อมูลที่ถูกตามกฎเกณฑ์ตามหลักความสัมพันธ์ เพื่อให้ข้อมูลเหล่านั้นมีประโยชน์และมีความหมายมากขึ้น
  • การจัดการ (Management) คือ การบริหารอย่างเป็นระบบ เป็นการกำหนดเป้าหมายและทิศทางการจัดการขององค์กรนั้น ซึ่งต้องมีการวางแผน กำหนดการ และจัดการทรัพยากรภายในองค์กร เพื่อให้บรรลุถึงวัตถุประสงค์ขององค์กรนั้นๆ
     ระบบสารสนเทศและ MIS (IS) หรือการประยุกต์ใช้ภูมิทัศน์ คือ การรวมกันของเทคโนโลยีสารสนเทศ (information technology) และกิจกรรมของผู้คนว่าด้วยการดำเนินการให้ความช่วยเหลือใด ๆ, การทำการจัดการและการตัดสินใจ ในความหมายที่กว้างมาก, ระบบสารสนเทศเป็นคำที่ใช้บ่อยในการอ้างถึงปฏิสัมพันธ์ระหว่างผู้คน กระบวนการข้อมูลและเทคโนโลยี ในแง่นี้คำที่ใช้ในการอ้างอิงไม่เพียงแต่จะใช้เทคโนโลยีสารสนเทศและการสื่อสาร (ICT) ที่องค์กรจะใช้เท่านั้น, แต่ยังรวมถึงวิธีที่คนมีปฏิสัมพันธ์กับเทคโนโลยีนี้ในการสนับสนุนกระบวนการทางธุรกิจ 

อ้างอิง http://srpsuthon.blogspot.com/

HTML

HTML
     ต้นกำเนิดของภาษา HTML เกิดจาก เมื่อปี 1989 นักฟิสิกส์ชื่อ Tim Berners-Lee แห่งสถาบันวิจัย CERN เสนองานวิจัยเรื่อง prototyped ENQUIRE และ Hypertext system ใช้สำหรับนักวิจัยของสถาบันเพื่อแบ่งข้อมูลกัน และถูกพัฒนามาเรื่อยๆจนถึงปัจจุบัน
     HTML เป็นตัวย่อมาจาก Hypertext Markup Language เป็นภาษาหลักที่ใช้ในการแสดงผลบนเว็บ บราวเซอร์ในอินเตอร์ โดยสามารถนำเสนอข้อมูลตัวอักษร รวมทั้งเชื่อมต่อเพื่อ แสดงภาพ , เสียง และไฟล์ในรูปแบบอื่นๆ

          ภาษา HTML จะแบ่งออกเป็น 2 ส่วน คือ

1. ส่วนของคำสั่ง (tag) เป็นส่วนที่กำหนดรูปแบบของข้อความที่แสดง ซึ่งเราเรียกว่า Tag โดยจะอยู่ในเครื่องหมาย < ... >
2. ส่วนของบทความทั่วๆไป เป็นส่วนของข้อความที่เราต้องการแสดงผล

          ตัวอย่างการใช้งานภาษา HTML

คุณอาจลองพิมพ์ตามตัวอักษรด้านล่างนี้ ใน Text editer ของคุณเช่น Notepad
<html>

    <head>

        <title> หัวข้อเรื่อง ของหน้านี้ </title>

    </head>

    <body>

            เนื้อหาที่จะแสดงใน web browser

    </body>

</html>

     เมื่อคุณพิมพ์เสร็จก็ให้ save ในชื่อ mypage.html และลองใช้ web browser อย่าง internet explorer หรือ fire fox เปิดดูก็จะเห็นผลตามรูปด้านล่าง


          การทำงานของ code ด้านบน

1. <html> ...... </html> ในการใช้งาน HTML เราจะต้องเริ่มด้วย <html> และปิดด้วย </html> เสมอ
2. <head> ...... </head> เป็นส่วนที่ใช้ให้รายละเอียดเกี่ยวกับ เว็บเพจหน้านี้ ซึ่งจะไม่แสดงให้เห็นในส่วนของการแสดงผลของ web browser แต่จะมีผลกับส่วนอื่นๆ เช่น การหาของ search engine (google,yahoo) การใช้งานก็จะมีคำสั่งย่อยเพื่อบรรยายรายละเอียด เช่น <title> .... </title> , <meta> และอื่นอีกมากมาย
3. <title> .......... </title> ในส่วนตัวอักษรที่อยู่ในคำสั่งนี้จะอยู่ใน title bar ของ web page
4. <body> .......... </body> ตัวอักษรที่อยู่ในคำสั่งนี้จะแสดงส่วนแสดงผลของ web browser

           โครงสร้างคำสั่งของ HTML

HTMLการใช้งานหลักจะมีดังนี้

1. คำสั่ง หรือ Tag เป็นลักษณะเฉพาะของภาษา HTML ใช้ในการระบุรูปแบบคำสั่ง หรือการลงรหัสคำสั่ง HTML ภายในเครื่องหมาย less-than bracket ( < ) และ greater-than bracket ( > ) โดยที่ Tag HTML แบ่งได้ 2 ลักษณะ คือ

Tag เดี่ยว เป็น Tag ที่ไม่ต้องมีการปิดรหัส เช่น <HR>, <BR> เป็นต้น

Tag เปิด/ปิด รูปแบบของ tag นี้จะเป็นแบบ <tag> .... </tag> โดยที่

<tag> เราเรียกว่า tag เปิด

</tag> เราเรียกว่า tag ปิด

2. Attributes เป็นตัวบอกรายละเอียดของ tag นั้นเช่น <span align = 'left'> ... </span> เป็นการบอกว่าให้อักษรที่อยู่ใน tag นี้ชิดซ้าย

3. not case sensitive หมายถึง คุณจะพิมพ์ <BR> หรือ <br> ก็ได้ ผลลัพธ์ออกมาไม่ต่างกัน

          โครงสร้างของหลักของ HTML

โครงสร้างหลักของ HTML ก็จะเริ่มด้วย <html> และจบด้วย </html> เสมอ ซึ่งชุดคำสั่งที่ใช้จะแยกเป็น 2 ส่วนคือ

1. head คำสั่งที่อยู่ในส่วนนี้จะใช้บรรยายรายละเอียดเกี่ยวกับ web page ซึ่งจะไม่แสดงผลที่ web page โดยตรง

2. body คำสั่งที่อยู่ในส่วนนี้จะใช้ในการจัดรูปแบบตัวอักษร จัดหน้า ใส่รูปภาพ ซึ่งตัวอักษรในส่วนนี้จะแสดงที่ web brower โดยตรง
<html>

    <head>

             คำสั่งในหัวข้อของ head

    </head>

    <body>

             คำสั่งในหัวข้อของ body ในส่วนนี้จะเป็นส่วนที่ใช้แสดงผล

    </body>

</html>
1. คำสั่งในหัวข้อของ head (Head Section)
     Head Section เป็นส่วนที่ใช้อธิบายเกี่ยวกับข้อมูลเฉพาะของหน้าเว็บนั้นๆ เช่น ชื่อเรื่องของหน้าเว็บ (Title), ชื่อผู้จัดทำเว็บ (Author), คีย์เวิร์ดสำหรับการค้นหา (Keyword) โดยมี Tag สำคัญ คือ

<HEAD>

            <TITLE>ข้อความอธิบายชื่อเรื่องของเว็บ</TITLE>

            <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">

            <META NAME="Author" CONTENT="ชื่อผู้พัฒนาเว็บ">

            <META NAME="KeyWords" CONTENT="ข้อความ 1, ข้อความ 2 ">

</HEAD>

TITLE
     ข้อความที่ใช้เป็น TITLE ไม่ควรพิมพ์เกิน 64 ตัวอักษร, ไม่ต้องใส่ลักษณะพิเศษ เช่น ตัวหนา, เอียง หรือสี โดยข้อความในส่วนนี้จะแสดงผลใน title bar ของ web browser

META
     Tag META จะไม่ปรากฏผลบนเบราเซอร์ แต่จะเป็นส่วนสำคัญ ในการจัดอันดับบัญชีเว็บ สำหรับผู้ให้บริการสืบค้นเว็บ (Search Engine เช่น google , yahoo)
     charset=TIS-620 ใช้บอกว่าใช้ชุดตัวอักษรแบบใดในการแสดงผล ภาษาไทยเราใช้ charset=TIS-620 หรืออาจเป็น charset=windows-874 ก็ได้ ตอนนี้แนะนำให้ใช้เป็น charset=utf-8
     keyword ดังภาพด้านบนจะเห็นว่าเราสามารถใช่ keywords มากกว่า 1 คำได้โดยใช้เครื่องหมาย (,) ในการคั่นระหว่างคำ
การพิมพ์ชุดคำสั่ง HTML สามารถพิมพ์ได้ทั้งตัวพิมพ์เล็ก ตัวพิมพ์ใหญ่ หรือผสม การย่อหน้า เว้นบรรทัด หรือช่องว่าง สามารถกระทำได้อิสระ โปรแกรมเบราเซอร์จะไม่สนใจเกี่ยวกับระยะเว้นบรรทัดหรือย่อหน้า หรือช่องว่าง

2. คำสั่งในส่วนของ (Body Section)
     Body Section เป็นส่วนเนื้อหาหลักของหน้าเว็บ ซึ่งการแสดงผลจะต้องใช้ Tag จำนวนมาก ขึ้นอยู่กับลักษณะของข้อมูล เช่น ข้อความ, รูปภาพ, เสียง, วีดิโอ หรือไฟล์ต่างๆ
     ส่วนเนื้อหาเอกสารเว็บ เป็นส่วนการทำงานหลักของหน้าเว็บ ประกอบด้วย Tag มากมายตามลักษณะของข้อมูล ที่ต้องการนำเสนอ การป้อนคำสั่งในส่วนนี้ ไม่มีข้อจำกัดสามารถป้อนติดกัน หรือ 1 บรรทัดต่อ 1 คำสั่งก็ได้ แต่มักจะยึดรูปแบบที่อ่านง่าย คือ การทำย่อหน้าในชุดคำสั่งที่เกี่ยวข้องกัน ทั้งนี้ให้ป้อนคำสั่งทั้งหมดภายใต้ Tag <BODY> </BODY> และแบ่งกลุ่มคำสั่งได้ดังนี้

กลุ่มคำสั่งเกี่ยวกับการจัดรูปแบบเอกสาร

กลุ่มคำสั่งจัดแต่ง/ควบคุมรูปแบบตัวอักษร

กลุ่มคำสั่งการทำเอกสารแบบรายการ (List)

กลุ่มคำสั่งเกี่ยวกับการทำลิงค์

กลุ่มคำสั่งจัดการรูปภาพ

กลุ่มคำสั่งจัดการตาราง (Table)

กลุ่มคำสั่งควบคุมเฟรม

กลุ่มคำสั่งอื่นๆ

อ้างอิง http://www.hellomyweb.com/

วันเสาร์ที่ 21 พฤษภาคม พ.ศ. 2559

Responsive คืออะไร?

RESPONSIVE WEB DESIGN 

    
     Responsive Web Design เป็นแนวการคิดออกแบบ web layout ให้สามารถนำเสนอ content ได้อย่างถูกต้องและเหมาะสมกับการใช้งาน Mobile Device อย่าง Tablet และ Smartphone โดยเฉพาะในช่วงเวลาปัจจุบัน ที่กำลังเข้ามาแทนที่การใช้งาน PC และ Laptop
     แนวคิดนี้ ยังไม่ได้ถูกตีกรอบตายตัว และยังรวมเข้ากับหลายๆ ศาสตร์ มีทั้ง User Interface Design, User Experience Design, Color Theory, Adaptive Web Design, Designing for mobile screen, และ Human Interaction design เป็นต้น ศึกษากันได้อย่างสนุกสนาน ซึ่งหนึ่งในเทคโนโลยีที่จะเห็นว่าออกมาสนับสนุนแนวการคิดนี้ก็คือ CSS Media Queries ซึ่งเริ่มใช้กันแพร่หลายแล้ว     โดยหัวใจสำคัญ ของการออกแบบ Mobile Web Design ในแนวการคิดของ Responsive Web Design คือการเข้าใจพื้นฐานของ web technology เพื่อที่จะปรับใช้กับการนำเสนอข้อมูลผ่าน Internet ในยุค Mobile device ได้อย่างสมบูรณ์  



รูปภาพจากเว็บไซต์ www.dotcominfoway.com

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

ประโยชน์ของการออกแบบเว็บไซต์แบบ Responsive

  • แสดงผลได้สวยงาม บนขนาดหน้าจอที่แตกต่าง
  • ออกแบบเพียงครั้งเดียว แต่สามารถใช้ได้กับขนาดหน้าจอที่หลากหลาย
  • มี Experience ในการใช้งานที่ดีกว่า ดูข้อมูลได้ง่าย โดยไม่ต้อง Zoom
  • ประหยัดเวลา และ ค่าใช้จ่ายได้มากกว่าการทำ 2 เว็บไซต์
  • ช่วยในเรื่องของการทำ SEO (Search Engine Optimization)


    ข้อดีของ RESPONSIVE 

    • Responsive WebDesign ได้รับการรับรองจาก google ช่วยให้ติด index google ได้ทั้ง desktop และ mobile ในหน้าเดียว
    • การทำ Responsive เพียงแค่ไซต์เดียวก็รองรับทุกอุปกรณ์ และไม่ต้องทำหลายๆหน้า ช่วยให้ไม่หนักเซิฟเวอร์
    • ประหยัดค่าใช้จ่ายในการจัดทำ โดยที่เราไม่ต้องทำหน้าต่างแยกกันระหว่าง mobile และ desktop นอกจากนี้ยังประหยัดเวลาลดระยะเวลาในการทำงานหลายๆหน้า โดยที่เราก็วางแผนครั้งเดียว และทำเพียงแค่หน้าเดียวเท่านั้นเอง
    • รวดเร็วในการดูแล จัดการเว็บไซต์ ไม่ยุ่งยาก และไม่ต้องไปเปลี่ยนแปลงเว็บไซต์หลายๆหน้า
    • รองรับผู้ใช้ทุกอุปกรณ์ เพราะสุดท้ายผู้คนจากหลายอุปกรณ์ก็มีความต้องการเดียวกัน
    • เว็บไซต์ไม่ต้อง redirect หน้าไปหาหน้า mobile ให้เสียเวลา ช่วยให้เซิฟเวอร์ไม่ทำงานหนักและไม่วุ่นวาย
    • Googlebot-Mobile จะสนใจกับไซต์ที่รองรับอุปกรณ์ประเภท mobile ดังนั้นมั่นใจได้เลยว่า Googlebot-mobile จะเข้ามาเก็บข้อมูลในเว็บไซต์ที่ทำออกมารองรับ mobile ของคุณอย่างแน่นอน หลังจากนี้เราก็มาเริ่มทำ seo ผ่าน mobile กันต่อไป 
    • ช่วยทำให้การค้นหาผ่าน mobile เป็นไปได้ง่ายมากยิ่งขึ้น


      ข้อเสียของ RESPONSIVE 

      • User Experience ในการใช้งานบน Mobile Site อาจไม่เต็มที่นัก เพราะเน้นแค่ให้ Layout เปิดได้บนมือถือเฉย ๆ บางส่วนเช่น Navigation, Slider อาจจะยังใช้บนมือถือไม่ได้
      • เว็บ Desktop เป็นเว็บที่หนัก มี Component มากมาย (โดยเฉพาะคนที่ชอบใช้ Bootstrap ซึ่งค่อนข้างหนักเว็บไซต์) พอเปิดในมือถือเหมือนกับพยายามเอาช้างไปยัดใส่ตู้เย็นเล็ก ๆ เลยครับ
      • เว็บโหลดช้าลงทั้งในมือถือและในคอม เพราะเขียนโค้ดมากขึ้นเพื่อให้ไปรองรับ Responsive ยิ่งมือถือเน็ตช้า ๆ ยิ่งช้าเข้าไปอีก
      • บาง Device ไม่รองรับ Media Query ทำให้เปิดไม่เจอเวอร์ชั่น Responsive ถึงแม้จะแก้ได้โดยการใช้ Javascript ช่วย แต่ทำให้เว็บหนักขึ้นไปอีก ดังนั้นทำแบบ Mobile First จะครอบคลุมมากกว่า
      • เป็นวิธีที่ค่อนข้างฉาบฉวย คือทำแบบนี้จะไม่ใช่ Responsive ที่ทำให้ User บนมือถือได้รับประโยชน์อย่างแท้จริง (อาจจะให้โทษมากกว่า)



      ข้อมูลอ้างอิง www.designil.com , www.siamhtml.com , library.stou.a