เมื่อออกแบบเว็บไซต์ฉันจะรู้ได้อย่างไรว่าผู้ใช้เห็นสีอย่างไร

เมื่อออกแบบเว็บไซต์ฉันจะรู้ได้อย่างไรว่าผู้ใช้เห็นสีอย่างไร ฉันเห็นสีของเว็บไซต์แตกต่างจาก Macbook และ Windows desktop / notebook โดยเฉพาะฉันไม่เห็นสีอ่อน ๆ บนเดสก์ท็อปเช่นมองไม่เห็นเส้นขอบสีเทาของตาราง

ฉันควรคำนึงถึงเรื่องใดเมื่อออกแบบ ฉันสามารถทำให้หน้าจอทั้งหมดค่อนข้างคล้ายกับโซลูชันการออกแบบหรือไม่

คำตอบสั้น ๆ : คุณทำไม่ได้

คำตอบอีกต่อไป: เป็นไปไม่ได้ที่จะคำนึงถึงการตั้งค่าหน้าจอและการปรับเทียบสถานการณ์และความสามารถในการมองเห็น (dis) ทั้งหมดของผู้ชม นั่นคือเหตุผลที่มีแนวทางสำหรับเช่นความคมชัดของข้อความและพื้นหลังของมันเพื่อรับประกันการใช้งานบางอย่างในกรณีส่วนใหญ่อย่างน้อย

เวิร์กโฟลว์ส่วนตัวของฉันมีมอนิเตอร์ที่ไม่ได้ปรับเทียบอย่างน้อยสองตัวและการทดสอบบางอย่างสำหรับอุปกรณ์มือถือที่แตกต่างกันในสถานการณ์แสงที่แตกต่างกัน

ของ W3C ได้ทำหลักเกณฑ์บางประการเกี่ยวกับการใช้สีและความคมชัดที่จำเป็นซึ่งคุณสามารถอ่านได้ที่นี่ โดยส่วนตัวแล้วฉันใช้เครื่องมือความเปรียบต่างนี้สำหรับข้อความโดย Lea Verou เพื่อตรวจสอบว่าสีข้อความของฉันเป็นไปตามหลักเกณฑ์หรืออย่างน้อยที่สุด

คุณทำไม่ได้และคุณไม่สามารถควบคุมหรือบังคับใช้การตั้งค่าเดียวกันบนจอภาพ / อุปกรณ์ของทุกคน วิธีที่ดีที่สุดที่คุณสามารถทำได้คือใช้โปรไฟล์สี sRGB เมื่อส่งออกภาพแรสเตอร์สำหรับเว็บ

sRGB เป็นพื้นที่สีมาตรฐานทั่วโลกสำหรับการสร้างสีบนเว็บ

สิ่งนี้จะช่วยได้ในระดับหนึ่ง แต่ในที่สุดความต้องการของผู้ใช้เองก็จะเป็นตัวตัดสินว่ารูปภาพจะดูอย่างไรในอุปกรณ์ เห็นได้ชัดว่านี่เป็นภาพแรสเตอร์ไม่ใช่องค์ประกอบกราฟิกอื่น ๆ ในหน้า

เบราว์เซอร์และคอมพิวเตอร์ที่ทันสมัยในปัจจุบันไม่ค่อยมีปัญหาในการแสดงสีที่ถูกต้อง (ดูhttps://websafecolors.info/learnสำหรับข้อมูลบางอย่างเกี่ยวกับเรื่องนั้น)

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

ฉันอยากจะแนะนำให้ใช้ Inspect Element และดูรหัสฐานสิบหกของสีในแต่ละแพลตฟอร์ม หากเหมือนกันคุณก็รู้ว่ามันเป็นจอแสดงผล การแก้ปัญหาคือการใช้สีที่มีความเปรียบต่างกันมากขึ้นเพื่อให้พวกเขามีโอกาสโดดเด่นในทุกหน้าจอ หรือลองใช้เส้นขอบที่หนากว่าหรือแม้แต่แผ่นรองที่ไม่มีขอบก็ได้! ผู้ใช้ส่วนใหญ่มีหน้าจอความละเอียดสูงซึ่งเปิดโอกาสในการออกแบบตารางซึ่งโดยทั่วไปจะใช้ข้อความและการจัดรูปแบบหนาพิกเซล

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

background-color: #D2B48C