ทำไมการออกแบบเว็บ“ ตอบสนอง” ไม่ควรพิจารณา?

นี่อาจดูเหมือนคำถามการออกแบบกราฟิกมากกว่าคำถามการเขียนโปรแกรม แต่ฉันคิดว่ามันมีข้อดีทางเทคนิค / การเขียนโปรแกรมมากกว่าการออกแบบกราฟิกที่แท้จริง

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

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

— นิค
แหล่งที่มา

ผู้คนจำนวนมากไม่รู้เพียงและไม่ได้เรียนรู้วิธีการใหม่ ๆ

— Raynos

@ Raynos แต่การเรียนรู้มันสนุกมาก!

— Nic

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

— WinW

ย้ายไปยังผู้ดูแลเว็บหรือไม่

— ปีเตอร์เทย์เลอร์

คำตอบ:

คุณต้องกระโดดผ่านห่วงเพื่อให้มันใช้งานได้จริง สำหรับเว็บไซต์ที่ฉันกำลังพัฒนาฉันใช้@media (max-width:800px)เพื่อกำหนดสไตล์ชีทสำหรับโทรศัพท์และหน้าจอขนาดเล็กอื่น ๆ แต่มันไม่ได้ถูกใช้โดย iPhone เช่น

ปรากฎว่านักพัฒนาเบราว์เซอร์โทรศัพท์คิดว่าผู้คนจะไม่คำนึงถึงหน้าจอขนาดเล็กดังนั้นพวกเขาจึงอยู่ในเอนจิ้นการแสดงผล (iPhone อ้างว่ามีความกว้างมากกว่า 900px เป็นต้น) เว้นแต่คุณจะใส่เมตาแท็กพิเศษเพื่อบอกว่าไม่ได้ โกหก. เมื่อมาถึงจุดที่คุณต่อสู้กับผู้ใช้เบราว์เซอร์คุณเริ่มสงสัยว่ามันคุ้มค่ากับความพยายามหรือไม่

— ปีเตอร์เทย์เลอร์
แหล่งที่มา

ดังนั้นทั้ง Zurb Foundation และ Twitter Bootstrap จึงจัดการได้ดีพอสมควร มันต้องใช้ JavaScript เล็กน้อยเพื่อจัดการกับการเปลี่ยนตามความต้องการ นอกจากนี้ยังมีการตั้งค่า DPI และอื่น ๆ การใช้เฟรมเวิร์ก CSS เหล่านั้นทำให้มันง่ายมาก หรืออย่างน้อยก็ส่วนหนึ่งของพวกเขา

— Berin Loritsch

เป็นที่น่าสังเกตว่าคำถามและคำตอบนี้มาจาก 6 ปีที่แล้วและอาจไม่สะท้อนอัตราการยอมรับในปัจจุบัน

— ปีเตอร์เทย์เลอร์

ขอโทษด้วย มันเป็นฟีดหลักเมื่อวานนี้ด้วยเหตุผลบางอย่าง ไม่คิดที่จะตรวจสอบวันที่

— Berin Loritsch

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

อีกเหตุผลที่อาจใช้ได้คือการแสดงเว็บไซต์แยกต่างหากสำหรับรุ่นมือถือโดยมีแผนผังไซต์แยกต่างหาก ( http://www.google.com/support/webmasters/bin/answer.py?hl=th&answer=34648 ) เป็นวิธีที่ง่ายและเริ่มต้นในการดูแลไซต์

— Pelshoff
แหล่งที่มา

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

— Nic

ดีฉันควรเพิ่มว่าในกรณีของเราลูกค้าเอาต์ซอร์ซเวอร์ชันมือถือให้กับคู่แข่ง :( ฉันจะไปกับแม่แบบส่วนตัวมากกว่าไซต์อื่นด้วย

— Pelshoff

หากคุณสามารถรับประกันได้ว่าจะกู้คืนข้อมูลได้อย่างน่าเชื่อถือทุกอย่างเรียบร้อย

แต่ลองจินตนาการว่ามีบางคนโหลดหน้าเว็บในเบราว์เซอร์ที่มีหน้าต่างของคอมพิวเตอร์เดสก์ท็อป คุณบังคับให้พวกเขาเปิดแบบเต็มหน้าจอเพื่ออ่านทุกอย่างหรือคุณปรับขนาดให้เหมาะสมกับหน้าต่างที่ลดลงและแสดงพื้นที่ว่างจำนวนมากในขณะที่มันขยายใหญ่สุด? คุณให้บริการ CSS ครั้งเดียวที่โหลดหน้าเว็บ!

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

เพียงทำตามแนวทางมาตรฐานในการสร้าง CSS ที่เป็นสากลและปรับขนาดได้และให้เบราว์เซอร์จัดการปรับขนาดหน้าเว็บให้มีความละเอียดที่เหมาะสม

— เอสเอฟ
แหล่งที่มา

มีคุณสมบัติใหม่ใน CSS3 ที่อนุญาตให้ใช้กฎแบบไดนามิกสำหรับขนาดหน้าจอที่แตกต่างกันซึ่งเปลี่ยนแปลงโดยอัตโนมัติ

— Steffan Donal

@Riririze แน่นอน - ใช้ CSS แบบคงที่ที่มีกฎที่ปรับเนื้อหาแบบไดนามิก - โอเค ร้องขอ CSS ที่สร้างขึ้นแบบไดนามิกที่มีกฎการตั้งค่าเนื้อหาสำหรับขนาดหน้าจอของคุณ - ไม่

— เอสเอฟ

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

— Travis Northcutt

@SF: พยายามปรับขนาดหน้าต่าง Google ปฏิทิน (ชุดรูปแบบสีแดงใหม่ไม่ใช่ชุดสีฟ้าที่เก่ากว่า) มันดูเท่มาก ๆ

— โกหกไรอัน

@SF: โพสต์ต้นฉบับกำลังพูดถึงการสืบค้นสื่อไม่ให้บริการ CSS ที่แตกต่างกันตามส่วนหัวหรือ w / e

— Pewpewarrows