หน้าเว็บบนมือถือเป็นสัตว์ที่มีลักษณะเฉพาะ ไม่เหมือนหน้าเว็บที่เหมาะสำหรับเดสก์ท็อปซึ่งออกแบบมาสำหรับหน้าจอขนาดใหญ่และการคลิกเมาส์ที่แม่นยำหน้าเว็บบนมือถือมีขนาดเล็กสำหรับหน้าจอและการแตะนิ้วอย่างไม่ถูกต้อง นอกจากนี้เว็บไซต์ที่ทันสมัยมีหน้าที่เผยแพร่ทั้งในรูปแบบเดสก์ท็อปและอุปกรณ์เคลื่อนที่ทำให้สามารถสร้างหน้าเว็บได้ทุกๆครั้ง
01 จาก 08
ขนาดหน้าจอและ 'อสังหาริมทรัพย์' ต่างกัน
นี่คือความแตกต่างที่เห็นได้ชัดที่สุดระหว่าง หน้าเว็บบน เดสก์ท็อปและ มือถือ ในขณะที่จอภาพเดสก์ท็อปส่วนใหญ่มีขนาด 19 นิ้วถึง 24 นิ้วเป็นเส้นทแยงมุมแท็บเล็ตทั่วไปจะมีเส้นทแยงมุม 10 นิ้ว สมาร์ทโฟนมีเส้นทแยงมุม 4 นิ้ว การซูมออกอย่างง่ายไม่ประสบความสำเร็จในการแปลงหน้าเว็บให้เหมาะกับอุปกรณ์เคลื่อนที่เนื่องจากจะทำให้ข้อความไม่สามารถอ่านได้ ในทำนองเดียวกันการแตะนิ้วมือจะกลายเป็นไปไม่ได้ในการทำอย่างถูกต้องบนหน้าเว็บที่ซูมออก นักออกแบบเว็บบนมือถือจำเป็นต้องเปลี่ยนแนวทางทั้งหมดในการจัดวางหน้าเว็บ โดยทั่วไปนักออกแบบจำเป็นต้องนำแถบด้านข้างและรูปภาพที่ไม่จำเป็นออกเลือกรูปภาพขนาดเล็กเพิ่มขนาดตัวอักษรและยุบเนื้อหาลงในวิดเจ็ตที่ขยายได้ ข้อ จำกัด ด้านอสังหาริมทรัพย์นี้ได้ก่อให้เกิดความคิดที่หลากหลายทั้งในหมู่นักออกแบบเว็บ
02 จาก 08
วิดเจ็ตและ 'Sliders' อยู่ใน; Sidebars และ whitespace Out Out
คุณสามารถคาดหวังว่าหน้าเว็บที่เหมาะกับอุปกรณ์เคลื่อนที่ส่วนใหญ่จะนำลิงก์การนำทางด้านข้างบางส่วนหรือทั้งหมดออกและแทนที่ด้วยวิดเจ็ตเมนูแบบพับเก็บได้ ในทำนองเดียวกันคาดหวังว่าจะไม่มีช่องว่างด้านซ้ายและด้านขวาของเนื้อหาและช่องว่างมากน้อยเท่าที่นักออกแบบมุ่งมั่นที่จะเพิ่มการใช้แท็บเล็ตและอสังหาริมทรัพย์สมาร์ทโฟน03 จาก 08
การแตะนิ้วมือไม่แม่นยำกว่าการคลิกเมาส์
ไม่เหมือนตัวชี้เมาส์ที่แม่นยำบนเดสก์ท็อปของคุณนิ้วของมนุษย์เป็นหยดและการ แตะนิ้ว จะต้องมีเป้าหมายขนาดใหญ่บนหน้าจอสำหรับการเชื่อมโยงหลายมิติ คาดว่าจะเห็นเป้าหมายการแตะรูปสี่เหลี่ยมผืนผ้าขนาดใหญ่ ('กระเบื้อง') บนหน้าเว็บบนมือถือและการเชื่อมโยงหลายมิติแบบข้อความน้อยลง นอกจากนี้เมนูจะถูกแทนที่ด้วยปุ่มขนาดใหญ่และแท็บขนาดใหญ่เพื่อรองรับความไม่แม่นยำของก๊อปปี้
04 จาก 08
URL ของหน้าเว็บมือถือแตกต่างกัน
หน้าเว็บที่เหมาะกับอุปกรณ์เคลื่อนที่มักมีตัวอักษร 'm' เป็นส่วนสำคัญของที่อยู่ (คลิกที่นี่เพื่อเป็นตัวอย่าง) URL บนอุปกรณ์เคลื่อนที่จะถูกเลือกให้คุณโดยอัตโนมัติเมื่อคุณท่องเว็บด้วยแท็บเล็ตหรือสมาร์ทโฟนมือถือ ในบางกรณีคุณจะเห็นลิงก์ที่ใช้ไม่ได้ซึ่งจะช่วยให้คุณเปลี่ยนไปใช้หน้าเว็บเดสก์ท็อปเวอร์ชันปกติได้
05 จาก 08
โฆษณาสามารถลดหรือลบออกได้
ใช่นี่เป็นเรื่องที่ยอดเยี่ยมสำหรับผู้อ่าน แต่เป็นจุดเจ็บที่แท้จริงกับผู้ลงโฆษณาทางเว็บ เนื่องจากมีห้องพักที่ลดลงบนแท็บเล็ตหรือสมาร์ทโฟนการวางกลุ่มลิงก์ผู้สนับสนุนและ โฆษณาแบนเนอร์ ขนาดใหญ่จึงไม่เป็นผล อย่างไรก็ตามคาดว่าจะเห็นโฆษณาแบบป๊อปอัปขนาดเล็กพิเศษบนหน้าเว็บบนมือถือซึ่งมักจะอยู่ตรงกลางด้านล่างของหน้าจอ การโฆษณาขนาดเล็กที่ฉลาดอื่น ๆ กำลังมีการพัฒนาขึ้นเมื่ออุปกรณ์เคลื่อนที่เป็นผู้ใหญ่
06 จาก 08
ช่องทำเครื่องหมายและลิงค์ขนาดเล็กจะทำให้ไม่พอใจ
เมื่อผู้เผยแพร่โฆษณาเว็บไม่ทำการออกแบบเนื้อหาใหม่ให้สมบูรณ์สำหรับหน้าจอขนาดเล็กพวกเขามักจะบังคับให้คุณและฉันใช้นิ้วมือหยดของเราเพื่อคลิกที่ช่องทำเครื่องหมายเล็ก ๆ บังคับให้ผู้ใช้ใช้การทดลองและข้อผิดพลาดหรือการซูมนิ้วเพื่อให้สามารถแตะช่องทำเครื่องหมายได้อย่างถูกต้อง07 จาก 08
การเข้าสู่ระบบรหัสผ่านอาจกลายเป็นข้อมูลที่บดบังหรือเล็กเกินไป
ใช่นี่เป็นเรื่องน่ารำคาญสมัยใหม่กับหน้าเว็บบนมือถือจำนวนมาก เนื่องจากผู้เผยแพร่เว็บจำนวนมากยังคงคิดในแง่ของหน้าจอขนาด 22 นิ้วพวกเขาจะตั้งประสบการณ์การใช้งานมือถือที่น่ารำคาญให้คุณสองอย่างคือฟิลด์การเข้าสู่ระบบและ รหัสผ่าน ของคุณจะเล็กและยากที่จะแตะและแป้นพิมพ์มือถือแบบเลื่อนของคุณจะครอบคลุมฟิลด์การเข้าสู่ระบบและรหัสผ่านของคุณ . คุณจะต้องปรับตัวโดยใช้การหยิกการซูมเพื่อให้ช่องการเข้าสู่ระบบสามารถมองเห็นได้และคุณจะต้องเลื่อนหน้าจอและปิดคีย์บอร์ดเพื่อหาปุ่มล็อกอินที่ซ่อนอยู่ หวังว่าผู้เผยแพร่เว็บสมัยใหม่จะหาวิธีที่ชาญฉลาดในเรื่องนี้ได้อย่างรวดเร็ว
08 ใน 08
กลายเป็นภาพที่โดดเด่นมากขึ้น
โดยทั่วไปรูปถ่ายจะหดตัวเพื่อให้พอดีกับหน้าจอขนาดเล็ก ในกรณีที่หายากบางรูปถ่ายจะถูกขยายเพื่อขยายความกว้างของแท็บเล็ตหรือหน้าจอสมาร์ทโฟน