https://www.youtube.com/watch?time_continue=85&v=alp9UI0SeIY

Fixed websites have a set width, and resizing the browser or viewing it on different devices won’t affect on the way the website looks. This can require horizontal scrolling and a site that doesn’t look good on tablets or smartphones.

Fluid websites are built using percentages for widths. As a result, columns are relative to one another and the browser, allowing it to scale up and down fluidly.

Adaptive websites introduce media queries to target specific device sizes, like smaller monitors, tablets, and mobile.

Responsive websites are built on a fluid grid and use media queries to control the design and its content as it scales down or up with the browser or device.

1) Static Layout – Layout แบบกำหนดขนาดกว้าง คงที่ จัดการและควบคุมคอนเทนต์ง่าย
2) Fluid layout – Layout รองรับหน้าจอหลายขนาด
3) Adaptive layout – Layout รองรับได้หลาย Device
4) Responsive layout – รองรับหลาย Device และ ทุกหน้าจอ (ยุคนี้ Device เยอะเกินจะเขียนทีละ Layout แล้ว)
5. Elastic Page Layout
6.) Mobile site layout – สำหรับเปิดเว็บ รองรับการใช้งานบนมือถือ เน้นเร็ว และ ง่าย จะตัดฟังก์ชั่นบางอย่างที่ไม่จำออกไป เพื่อให้เกิดประสิทธิภาพ การใช้งานอย่างสูงสุด ยกตัวอย่าง pantip.com จะมีโมบายไซต์ m.pantip.com , facebook.com จะมี โมบายไซต์ m.facebook.com
7. web app เช่น facebook , instagrame ที่ต้องมีการติดตั้งบน มือถือ
8. PWA (Progressive Web App) ไม่ต้องติดตั้ง และ ไม่ต้องต่อเน็ต ถ้าเคยเข้าไปใช้งานเเล้ว

แบบไหนดี?
1.ขึ้นอยู่กับ จุดประสงค์การใช้งาน
2.งบประมาณ

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

แต่สามารถทำได้ในส่วนของ หน้าด้านในๆ หรือ เว็บที่เกียวการขายสินค้าออนไน์ เพื่อสร้างความสะดวก

+https://www.markupbox.com/blog/fixed-vs-fluid-vs-adaptive-vs-responsive-layout/
+https://www.algorithmtut.com/อยากเป็น-web-design-ทำไง-ตอนที่-2-web-layout/