หลุดรายละเอียด Bootstrap 4 พร้อมรูป Doc สไตล์ Flat !!

designil

อัพเดท: ตอนนี้ทุกท่านสามารถ ดาวน์โหลด Bootstrap 4 ตัวเต็ม ได้แล้วนะคร้าบ

สำหรับคนทำเว็บไซต์แบบ Responsive ต้องได้ลองจับ CSS Framework อันดับ 1 อย่าง Bootstrap กันมาบ้างครับ แอดมินมีโอกาสได้ใช้ตั้งแต่ Bootstrap 2 จนตอนนี้ Bootstrap 4 จะออกมาแล้ว

บทความแนะนำ: รวมสุดยอด Web Design CSS Framework ที่คนทำเว็บต้องรู้จัก !!

ล่าสุด Mark Otto หนึ่งในผู้ก่อตั้ง Bootstrap ก็ได้เปิดเผยข้อมูลเกี่ยวกับ Bootstrap 4 ทาง Blog ของ Bootstrap ซึ่งมีการเปลี่ยนแปลงหลายส่วนสำคัญ ๆ ที่คนทำเว็บด้วย Bootstrap อย่างเราควรจะเตรียมตัวไว้ครับ

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

สำหรับเวอร์ชั่น 4 นี้ก็เช่นกัน เป็นการอัพเดท Bootstrap ไปสู่เทรนด์การทำเว็บไซต์แบบปัจจุบัน มาดูกันว่าเป็นอย่างไรบ้างครับ

หลุดข้อมูล Bootstrap 4 สไตล์ Flat Design

รูป Bootstrap 4
รูปจาก Dribbble ของ @mdo ผู้สร้าง Bootstrap

จากรูปด้านบนจะเห็นว่า Bootstrap 4 ได้ขยับไปทาง Flat Design เต็มตัว คนที่ชอบทำเว็บแบบ Flat นี่ยิ้มเลยครับ (แอดมินก็ชอบ) เพราะก่อนหน้านี้ถ้าจะทำ UI Bootstrap 3 ให้เป็น Flat ต้องแก้ CSS เยอะมาก หรือหา Bootstrap Theme มาใช้ครับ

 

ทีนี้มาดูถึงความเปลี่ยนแปลงต่าง ๆ ของ Bootstrap 4 กันบ้าง:

  • เลิกซัพพอร์ท IE8 !!
  • เพิ่มขนาด Grid อีก 1 ขนาดสำหรับมือถือ (คิดว่าจะได้แยกมือถือแนวตั้งกับแนวนอนให้ชัดเจนครับ โดยเฉพาะพวก iPhone 6)
  • เพิ่ม Component ใหม่มาใช้แทน panels, thumbnails, wells
  • Navbar เปลี่ยนใหม่ หน้าตาจะเรียบง่ายกว่าเดิม (คงเป็นสไตล์ Flat ครับ)
  • เปลี่ยนหน่วย px ทั้งหมดเป็น rem, em เพื่อให้ง่ายต่อการปรับขนาดแบบ Responsive
  • เพิ่มลูกเล่นให้ Form อีกมากมาย
  • เพิ่ม Animation กับ Transition สำหรับหลาย ๆ Component
  • เพิ่มซัพพอร์ท UMD (Universal Module Definition) สำหรับปลั๊กอิน Javascript
  • แก้ไขปลั๊กอิน Javascript: Tooltip, Popover, Dropdown ให้จัดตำแหน่งถูกต้องมากขึ้น
  • Documentation ตัวใหม่ เขียนด้วย Markdown
  • หน้า Config Bootstrap แบบใหม่

และอื่น ๆ อีกมากมาย… ต้องรอดูกันครับว่าจะมีอะไรบ้าง

โดย Bootstrap 4 Alpha จะปล่อยในอีกไม่กี่สัปดาห์ครับ เตรียมตัวลองใช้กันได้เลย !

designil

designil

Data engineer & WordPress Developer ทำงานที่บริษัทแคนว่า ซิดนีย์ออสเตรเลีย ปัจจุบันเป็นเจ้าของเว็บไซต์ Designil, DataTH ชอบอ่านบทความใหม่ๆ ตลอดเวลา และชอบสรุปเรื่องราวเกี่ยวกับเทคโนโลยีให้ภาษาที่เข้าใจง่าย ยินดีที่ได้รู้จักทุกคนนะครับ
บทความทั้งหมด