DEV-BT

Responsive Web Design with Bootstrap

2 วัน (12 ชม.)/ ช่วงเวลา 9:00 - 16:00 น.

Inhouse

Inhouse Only

*รับเฉพาะ InHouse Training เท่านั้น

Workshope-Certificate

ขอใบเสนอราคา Inhouse

Development

.NET

ดาวน์โหลด Course Outline

TH EN

Responsive Web Design with Bootstrap

หลักสูตรนี้เหมาะสำหรับนักออกแบบเว็บไซต์เพื่อนำเอาเทคโนโลยี Bootstrap ซึ่งเป็นชุดเครื่องมือที่ประกอบด้วย HTML และ CSS มาใช้ช่วยในการออกแบบเว็บไซต์ Responsive ได้อย่างง่ายดาย รองรับการแสดงผลทั้ง Mobile, Tablet และ Desktop version

วัตถุประสงค์

สามารถออกแบบเว็บเพจได้อย่างเหมาะสมกับอุปกรณ์
สามารถเลือกใช้ Component ต่างๆ ได้
สามารถกำหนด Media Query เพื่อควบคุมการแสดงผลได้
สามารถจัด Layout ในการแสดงผลได้

หลักสูตรนี้เหมาะสำหรับ

ผู้ที่ต้องการพัฒนาเว็บเพจที่รองรับการแสดงผลได้อย่างเหมาะสมกับทุกอุปกรณ์

พื้นฐานของผู้เข้าอบรม

มีพื้นฐานการพัฒนาเว็บไซต์
มีพื้นฐานการเขียน HTML, CSS และ JavaScript

ความต้องการของระบบ

ระบบปฏิบัติการ Windows 11 / 10
Microsoft Visual Studio (Community, Professional, or Enterprise)

หัวข้อการฝึกอบรม

•การติดตั้ง Bootstrap
•โครงสร้างไฟล์ Bootstrap
•Basic HTML Template
•Grid System
•Fluid Grid System

•Typography
•Code
•Tables
•Forms
•Buttons
•Images
•Icons

•Dropdown Menus
•Navbar
•Breadcrumbs
•Pagination
•Labels
•Badges
•Typographic Elements
•Thumbnails
•Alerts
•Media Object

•Transitions
•Modal
•Dropdown
•Alerts
•Buttons
•Collapse
•Carousel

•การนำเว็บไซต์ขึ้นใช้บน Server

Road Map

คำถามที่พบบ่อย

ปัจจุบันผู้ใช้งานเข้าถึงเว็บไซต์ผ่านอุปกรณ์หลายประเภท เช่น สมาร์ตโฟน แท็บเล็ต และคอมพิวเตอร์ การออกแบบ Responsive Web Design ช่วยให้เว็บไซต์ปรับขนาดและการจัดวางเนื้อหาให้เหมาะกับทุกหน้าจอโดยอัตโนมัติ เพิ่มประสบการณ์ของผู้ใช้งาน (User Experience) และช่วยให้เว็บไซต์พร้อมรองรับการใช้งานบนอุปกรณ์ที่หลากหลาย หลักสูตรนี้เน้นการออกแบบเว็บไซต์แบบ Mobile-first ด้วย Bootstrap Framework ผ่าน Workshop ที่สามารถนำไปใช้งานได้จริง

Bootstrap Grid System เป็นระบบแบ่งโครงสร้างหน้าเว็บด้วย Columns และ Rows ที่ช่วยให้สามารถจัดวาง Layout ได้อย่างยืดหยุ่น รองรับการแสดงผลบน Mobile, Tablet และ Desktop โดยไม่ต้องเขียน CSS ใหม่สำหรับทุกขนาดหน้าจอ ผู้เรียนจะได้ฝึกออกแบบ Responsive Layout และเลือกใช้ Grid ให้เหมาะกับลักษณะของเว็บไซต์แต่ละประเภท

ครอบคลุม ผู้เรียนจะได้เรียนรู้การใช้งาน Navbar, Dropdown Menu, Breadcrumb, Pagination, Forms, Buttons, Alerts, Modal, Carousel และ Components อื่น ๆ ของ Bootstrap พร้อมแนวทางเลือกใช้ให้เหมาะกับการออกแบบ User Interface เพื่อช่วยลดเวลาในการพัฒนาเว็บไซต์และทำให้หน้าตาเว็บไซต์มีมาตรฐานเดียวกัน

Bootstrap มี Responsive Utilities และ CSS Components ที่ช่วยลดการเขียน CSS ซ้ำ ๆ ได้มาก แต่ผู้เรียนจะได้เรียนรู้การใช้งาน Media Query และการปรับแต่ง Bootstrap เพิ่มเติม เพื่อให้สามารถออกแบบเว็บไซต์ที่มีเอกลักษณ์และตอบโจทย์ความต้องการเฉพาะของแต่ละองค์กรได้อย่างมีประสิทธิภาพ

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