HTML Designer Tip by p’kob

ข้อควรระวังในขั้นตอนการเปลี่ยนจาก Design เป็น html

เนื่องจากลูกค้า เวลา Test จะใช้ ทุก Browser (IE, FF, Chrome) ข้อควรระวังคือ

1. ใน CSS ไม่ควรใช้

-webkit-…….

-moz…….

เพราะมันจะทำงานได้เฉพาะ FF กับ Chrome เท่านั้น

ซึ่งตอนนี้ตัว Render Web จะมีหลัก ๆ 3 อันคือ

1. Webkit ใช้กับ Chrome, Safari

2. Gecko สำหรับ FF

3. IE Render (ขึ้นอยู่กับแต่ละ Version)

ซึ่งถ้าจะใช้ควรหาอันที่มันรองรับทั้ง 3 Render Engine เช่น การลงสีแบบงไล่สี สามารถทำให้แสดงผลได้ทั้ง 3 Browser (IE6 ใช้ ไม่ได้อยู่ดี)
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#fe7575′, endColorstr=’#ffb0b0′); /* for IE */

background: -webkit-gradient(linear, left top, left bottom, from(#fe7575), to(#ffb0b0)); /* for webkit browsers */

background: -moz-linear-gradient(top,  #fe7575,  #ffb0b0); /* for firefox 3.6+ */

2. ไม่ควรใช้ Feature ของ CSS version 3 เช่น text-shadow เพราะ IE ไม่รองรับ CSS3 จะทำให้การแสดงผลต่างจาก FireFox, Chrome และส่งผลให้ลูกค้าอาจจะถาม

Blog ที่น่าสนใจ   —> 30 HTML Best Practices for Beginners

credit:  p’kob @ AJ