โฆษณาชวนให้ Upgrade IE8 !

คิดดูนะว่าว่า Yahoo! ลงโฆษณา Browser ของ Microsoft (IE8) ใน Google Adsense อืมมม สมาฉันกันแล้วเหรอ 3 ค่ายนี้ หรือร่วมมือกันฆ่า IE6 โดยเฉพาะ ? ;P

2009-06-05_110507

แล้วก็เข้า http://downloads.yahoo.com/th/internetexplorer/

2009-06-05_110607

Yahoo ประเทศไทย ลงทุน !!! มาแนวเดียวกับ Google เลยทีเดียว แต่รอบนี้ IE 8 ไม่ใช่ Firefox !

ร่วมด้วยช่วยกัน Say No To IE 6! สำหรับเว็บที่ใช้ jQuery (และพวก Prototype JavaScript ตัวอื่น ๆ ด้วย)

จาก entry หมดเวลา Internet Explorer 6 แล้ว เลิกใช้มันได้แล้ว !!! และจาก Campaign “Say No To IE 6!” จากเว็บ SaveTheDevelopers.org นั้นเค้าให้เอา code ด้านล่างนี้ไปใส่

แต่ถ้าเว็บใครใช้ jQuery นี่อาจจะไม่ได้ แบบ Theme K2 ของผม วิธีอีกแบบที่สามารถทำได้ และทำงานร่วมกับ jQuery ได้ก็คือใช้ CSS – Conditional comments นั้นเอง โดยกำหนดไว้ว่าถ้า IE ที่ version น้อยกว่า 7 ให้โชว์ตัว popDown นี้ขึ้นมาครับผม

  1. <!--[if lt IE 7]>
  2. < ![endif]-->

เสร็จแล้วในไฟล์ savethedevelopers.js ก็ปรับแก้เป็นแบบนี้ครับ

javascript

  1. jQuery(document).ready(function(){
  2.     var now = new Date();
  3.     var time = now.getTime();
  4.     var div = document.createElement('a');
  5.     var id = 'saynotoie6_div_' + time;
  6.     div.setAttribute('id',id);
  7.     div.setAttribute('href','http://www.savethedevelopers.org/');
  8.     div.setAttribute('target','_blank');
  9.     div.style.display = 'block';
  10.     div.style.color = '#1d1d1d';
  11.     div.style.textAlign = 'left';
  12.     div.style.fontFamily = 'Arial';
  13.     div.style.fontSize = '11px';
  14.     div.style.background = 'url(http://webhost.domain/path/to/savethedevelopers/PopDown.gif)';
  15.     div.style.padding = '0';
  16.     div.style.position = 'absolute';
  17.     div.style.top = '0';
  18.     div.style.right = '40px';
  19.     div.style.zIndex = '999999';
  20.     div.style.width = '330px';
  21.     div.style.height = '63px';
  22.     div.style.marginTop = '-80px';
  23.     div.style.filter = 'alpha(opacity=95)';
  24.     document.body.appendChild(div);
  25.    
  26.     var animate = function(){
  27.         var myDiv = document.getElementById(id);
  28.         var value = parseInt(myDiv.style.marginTop)
  29.         myDiv.style.marginTop = value + 1 + 'px';
  30.         if(parseInt(myDiv.style.marginTop) < -1){
  31.             var timer = setTimeout(animate,30 * 80/Math.abs(value) * .27);
  32.         }else{
  33.             var timer = setTimeout(hide,25000);
  34.         }
  35.     }
  36.    
  37.     var hide = function(){
  38.         var myDiv = document.getElementById(id);
  39.         var value = parseInt(myDiv.style.marginTop)
  40.         myDiv.style.marginTop = value - 1 + 'px';
  41.         if(parseInt(myDiv.style.marginTop) > -80){
  42.             var timer = setTimeout(hide,1.4 * 80/Math.abs(value) * 3.70);
  43.         }
  44.     }
  45.    
  46.     setTimeout(animate,1000);
  47. });

ลองเทียบกับของเก่าเค้าก็ได้นะครับ อันนี้ผมปรับให้โชว์ไว้สัก 25 วินาทีครับผม ส่วนถ้าเอาไปใช้กับ mootools หรือตัวอื่น ๆ ก็เปลี่ยนการ windows.onload เป็นแบบอื่น แทนการใช้ jQuery(document).ready(); ครับ

เรามาร่วมด้วยช่วยกันประกาศครับผม เอาพวกไม่ได้มาตรฐานออกไปจากสังคมสักทีนึงครับผม

หมดเวลา Internet Explorer 6 แล้ว เลิกใช้มันได้แล้ว !!!

พอดีว่าวันนี้ทำ Theme ‘K2’ ให้ support กับ IE 6 ให้มากที่สุด เล่นซะหมดแรงเลย ซึ่ง จริง ๆ K2 มันก็สนับสนุนอยู่แล้ว แต่ว่าบางส่วน และไม่ทั้งหมด ไป ๆ มา ๆ เลยยอมแพ้ ช่างมัน ใครใช้ Internet Explorer 6 เข้ามาก็เจออะไรเหว่ง ๆ หน่อยก็อย่าไปคิดมากแล้วกัน และแนะนำให้ไปใช้ Internet Explorer 7, Firefox 2 หรือ Opera แทนแล้วกันนะ เพราะว่าตัว Internet Explorer 6 นี่มันทำให้คนทำเว็บสูญเสียพลังงานในการทำให้เว็บต้องไปสนับสนุนมันมาก ยิ่งในประเทศไทย ที่ร้อยละ 70 ของเครื่องคอมพิวเตอร์ใช้ Windows เถื่อนนี่ยิ่งเแล้วใหญ่ ส่วนใหญ่มักไม่กล้า upgrade software ต่าง ๆ เนื่องจากกลัวโดย block ไม่ให้ใช้งาน ทำให้พลาดความสามารถใหม่ ๆ ของโลกเทคโนโลยีรุ่นใหม่ ๆ ไปเยอะ ซึ่งเป็นเรื่องที่น่าเสียดายมาก ๆ T_T

แต่อีกอย่างคือเว็บของกระทรวงต่าง ๆ ในไทย รวมถึงพวกเว็บของหน่วยงานราชการต่าง ๆ ยังคงทำเว็บแบบไม่สนใจ web standard เลย ซึ่งเป็นการเลือกปฎิบัติอย่างมาก ยิ่งเว็บ rd.go.th นี่ตอนลงทะเบียน หรือกรอกข้อมูลภาษีนี่ให้ใช้แต่ Internet Explorer 6 เท่านั้น ซึ่งผมก็เซงอย่างรุนแรง ผมว่าคนทำระบบมันไม่มีความสามารถให้รองรับได้หลากหลาย Browser มากกว่า หรือว่ามันขี้เกียจก็ไ่ม่รู้ หรือไม่แน่นะ ความสามาถอาจจะไม่ถึงก็ได้ แต่ดันโดนให้มาทำระบบนี้พอดี -_-‘ อืมมม น่าคิดนะ

Current Campaign

Say No To IE 6!
Our current campaign focuses on assisting users in upgrading their Internet Explorer 6 web browser. This campaign will result in former IE 6 users having a more enjoyable experience on the web while (hopefully) creating a less stressful and complicated environment for web developers by hastening the retirement of an outdated browser.

SaveTheDevelopers.org :: Making The Web A Better Place, One Campaign At A Time…

แก้ปัญหาจุกจิกหลาย ๆ อย่างใน IE 5/6 ด้วย IE7 { css2: auto; }

เจ้า IE7 { css2: auto; } นั้นตอนนี้เป็น version ที่ 0.9 (alpha) แล้ว และหยุดพัฒนาตั้งแต่ปี 2005/08/19 โดยหลัก ๆ ที่เอามาใช้เพราะนำมาแก้ไขปัญหา PNG alpha transparency ใน IE5/6 นั้นเอง และ JavaScript ตัวแก้ไขตัวนี้ก็ทำงานได้ดีตลอดมา ผมนำไปใช้กับ Siampod.com และได้ผลดีมาก ๆ แต่เว็บ blog ตัวเองก็ยังไม่ได้ใส่มัน -_-‘ เดี่ยวใส่วันสองวันนี้แหละ เริ่มวาง ๆ แล้ว ;)

IE7 is a JavaScript library to make IE behave like a standards-compliant browser. It fixes many CSS issues and makes transparent PNG work correctly under IE5 and IE6.

  • supports the following CSS selectors:
    • namespace|selector
    • parent > child
    • adjacent + sibling
    • adjacent ~ sibling
    • [attr], [attr="value"], [attr~="value"] etc
    • .multiple.classes (fixes bug)
    • :hover, :active, :focus (for all elements)
    • :first-child, :last-child, only-child, nth-child, nth-last-child
    • :check, :disabled, :enabled
    • :root, :empty, :contains(), :not()
    • :before/:after/content:
    • :lang()
  • works with both HTML and XML documents
  • supports imported style sheets
  • preserves the cascade of the style sheet
  • does not alter the document structure
  • does not repeatedly query the DOM tree using JavaScript
  • uses pure CSS to enforce style sheet rules
  • supports the W3C box model in both standards and quirks mode
  • supports fixed positioning (flicker free)
  • supports overflow:visible
  • supports min/max-width/height
  • fixes broken (X)HTML elements (abbr, object)
  • standardies forms behavior
  • supports PNG alpha transparency
  • lightweight script (22K)
  • completely modular (add/remove fixes)
  • works for Microsoft Internet Explorer 5+ (Windows only)

[Update 11/11/2007 1:38am]

นั่งแก้ มันทำไมใช้ไม่ได้ก็ไม่รู้ พอหา ๆ ใน Google เจอคนมีปัญหาแบบเดียวกัน แต่สรุปได้ว่า เพราะใช้ Themes K2 นี่เอง T_T คนใช้ IE 6 ก็เศร้ากันไปนะครับ อันนี้ช่วยไม่ได้ ฮา ….

Web Browser หลักที่ควรเอาไว้ทดสอบ Web Site ของเรา

มีคนถามมาว่าใช้อะไรทดสอบเว็บบ้าง สำหรับผมก็มีเท่านี้แหละ

  • Firefox 2 (Default and Debug)
  • IE 6 (on VPC 2007)
  • IE 7
  • Opera
  • Safari for Windows

รวมแล้วก็ 5 ตัว เวลาส่งงานจะได้สบายใจ และ user ของเว็บที่เราส่งงานไปเค้าจะได้ไม่ด่าเราตอนหลังว่าทำเว็บห่วย ๆ ไม่รองรับ web browser ที่เค้าใช้ ;)

จริง ๆ ยังมี Tools อีกหลายตัวที่เอาไว้ทดสอบเพิ่มเติมอย่าง The Proxomitron สำหรับลอง Monitor packet ของ HTTP หรือพวก Firebug เอาไว้ดูพวก error ในเว็บ (เป็น Extension ของ Firefox) เดี่ยวไว้ว่าง ๆ จะเอา review ครับ (จริง ๆ มีเว็บที่เค้า review อยู่หลายเว็บนา …… ลองหาก่อนก็ได้ หุๆๆ )