2010»二月»雅虎的用戶界面博客（YUIBlog）

在為2010年2月26日，野生

2010年2月26日，10:48上午由埃里克米拉利亞|在野生 | 1條評論

銳界，它一直在與一些偉大的新畫廊模塊（存儲精簡版，簡單的菜單，和更多的好的未來）一個星期激動人心的情侶。這裡有一些其他的最新消息，具有多產的基督教海爾曼（兩個漂亮的銳銳影院演示，誰是最近談論如何成為多產的建設新的偉大演示）和YUI的相關寶石從卡洛斯·布埃諾和哈文森特。使用下面的意見，或發現，在我們@ YUILibrary讓我們知道我們錯過了什麼。

在YUI的“自動完成”折疊口音“卡洛斯@ alistapart布埃諾：在世界的F2E我們最喜歡的作家之一，是卡洛斯·布埃諾，他有另一個優秀的，及時的文章-這一次編寫好自動完成實現採用國際挑戰字符集。這裡是卡洛斯如何能說明問題：
考慮這個地址簿：
- fulanito洛佩斯
- 埃里克Lørgensen
- 洛雷納·史密斯
- 詹姆斯·勞
如果我組成一個新的消息，然後鍵入“LO”在To：“字段中，應該發生什麼呢？在許多應用中，只有奧會顯示出來。這些應用程序“支持Unicode，”在某種意義上說，他們不腐敗或BARF上，但僅此而已。
卡洛斯去上顯示問題的方法，並說明了這種方法，使用珍妮·唐納利銳2自動完成控制。這種方法被稱為“折疊口音。”口音的折疊功能基本上映射Unicode字符對應的ASCII碼。任何地方，您申請的情況下折疊，你應該考慮口音折疊，正是由於同樣的原因。與口音折疊，不要緊， 咖啡廳 ， 咖啡廳 ，甚至咖啡用戶搜索;是否的結果將是相同的“退房。更完整的文章，包括複製粘貼的例子。我已經把運作版本的示例代碼，如果你想嘗試一下。
GeoPlanet總管-一個新的YQL的/銳從@ codepo8哈克：寫入基督教的：“前幾天，加里·蓋爾 ping通我的使者，並隨後進行了一杯咖啡，我的辦公桌上，纏著我的另一個挑戰。這一次，他談到如何豐富和涼爽GeoPlanet數據是，它向人們展示一個簡單的界面這是艱難的。在內部，我們有幾個漂亮的清涼測試和分析數據的工具，但其中大部分是太只為有地緣民間的理解與信息加載。因此，在本質上，地質技術在雅虎仁慈的霸主要求建立一個簡單的界面，導航的GeoPlanet數據。“
哈文森特的SVG使用YUI動畫演示哈文森特和他的同事們一直努力工作一段時間基於SVG在瀏覽器中，他們已經發布了一個新的網站上一些證據的概念， http://svg-wow ORG / 。許多演示，包括上圖中的光桌和歌詞演示，引擎蓋下使用3 YUI的動畫庫。
YQL的+銳+基督教海爾曼+奧運電視= Winterolympicsmedals.com ：我們注意到基督教海爾曼的第一個基於YUI的3“在野外”最後劈，我們沒有等待他的第二長： WinterOlympicsMedals.com 。這其中使用YQL的後端今年舉辦冬季奧運會有關的數據，由國家通過事件，而更多。銳3和銳2（DataTable中）正在這裡利用。
馬特·伍德沃德，“解決CSS的UI插件使用Grails的問題” ：寫的Matt：“我工作的另一個Grails應用程序，我用了意想不到的Grails UI插件很多UI控件。 Grails的用戶界面是一個非常好的Grails的友好周圍的包裝YUI組件，包括像一個對話框，日曆控件，豐富的文本編輯器，和很多更多的東西。這是我第一次真正涉足，將使用這個插件，所以我開始用一個簡單的模式對話框的人在一個簡單的列表，將顯示聯繫信息的詳細信息。這篇文章的主要觀點是，勾勒出簡單的解決我所看到的CSS問題，因為我花了一段時間來弄清楚發生了什麼事情，但我想我概述了一些Grails和Grails的UI沿途的魔力。 “ 檢查出他的整篇文章。
照片標註使用YUI的2 ASP.NET編輯： Neodynamics已經發布了演示，“讓用戶上傳照片，然後添加一個標註或講話泡沫可以拖動和形象定位，調整大小。多虧了YUI是可能為標註的箭頭提示，以及氣泡的大小的部件，其中包括提供處理程序。 ImageDraw是從服務器端生成標註的形狀，而用戶交互與編輯負責。“
K.傑克遜的亞倫YUI壓縮NAnt的腳本：如果你使用免費的網構建工具南特和你想使用YUI壓縮機，以縮小您的JS和CSS，檢查出亞倫K.傑克遜的YUI的壓縮機NAnt的腳本。

共享和擴展：書籤del.icio.us Digg它！ | reddit！

YUI的劇院-菲利普·勒Hégaret：“下一個開放Web平台”（52分鐘）

2010年2月26日，6:28上午由埃里克·米拉利亞| 銳劇院 | 評論關閉

菲利普W3C互動領域的樂Hégaret，誰負責，停止由雅虎最近關於HTML5的談話。儘管HTML5規範本身實際上並沒有包含許多新功能，新的網絡平台，常常為HTML5標記，並有許多新的功能。這些範圍從HTML視頻到SVG的CSS動畫或網絡插座。菲利普的談話給出了一個概述什麼是擺在我們面前，在最新一代的Web瀏覽器使用的具體示範。我們感謝菲利普訪問權限分享視頻銳劇院。

如果下面嵌入視頻不會出現在你的RSS讀者選擇正確，請務必通過點擊觀看視頻銳劇院的高分辨率版本。

注意：未定義指數：高清/網站/劇院/ blog.php第29行

下載視頻（M4V）
下載幻燈片
YUI劇院網站上提供高分辨率，這次談話的轉錄版本

其他最近的銳劇院視頻：

道格拉斯克羅克福德：對JavaScript克羅克福德-第三幕：函數的極限 -雅虎的JavaScript建築師道格拉斯·克羅克福德繼續與JavaScript編程語言JavaScript功能的討論，他的系列講座。 “函數是JavaScript的最好的部分，克羅克福德說。 “這是地方的權力是，它是美麗的地方。” 觀看視頻了解為什麼。
道格拉斯克羅克福德：克羅克福德的JavaScript -第2章：再有就是JavaScript的 -雅虎的JavaScript建築師道格拉斯·克羅克福德調查JavaScript編程語言的特點。
道格拉斯克羅克福德：對JavaScript克羅克福德-卷1：民國初年 -道格拉斯克羅克福德了其適當的歷史背景下的JavaScript編程語言，跟踪語言的結構和公約（和它的一些怪癖）回到他們的根在電腦初科學。
基督教海爾曼：YQL的和YUI：積木，快速應用 -雅虎開發者網絡的國際傳道基督教海爾曼討論他的哲學思想，為建立快速，功能強大，有吸引力的應用，使用雅虎查詢語言（YQL），和雅虎的用戶界面庫（銳）。

訂閱銳戲劇：

共享和擴展：書籤del.icio.us Digg它！ | reddit！

YUI團隊的前端工程作業

| 前端工程工作，2010年2月25日下午4:11由埃里克·米拉利亞雅虎 | 1條評論

注：現在，我們已經聘請了這一立場。額外銳在雅虎的相關工作，請檢查YUI工作頁

如果喜歡的人一起工作道格拉斯克羅克福德和團隊創建銳（特里普盧克·史密斯，馬特·斯威尼，亞當·摩爾， DAV玻璃，珍妮·唐納利，橋樑，艾倫拉比諾維奇， Satyen德賽，其他）聽起來像一個很好的方式來度過你時間，閱讀：我們聘用。

我們正在尋找一個偉大的工程師，以幫助我們的YUI項目的各個方面。（注：這個角色除了是我們幾個星期前宣布）的生成/ CI的位置。這可能是你的偉大的工作，如果你是：

熟悉前端工程的最佳做法（例如，這個視頻應該引起你的共鳴）;
不折不扣的JavaScript怪胎（例如，這個視頻，這個視頻應該是那種東西，你別激動下載並在高清大屏幕上觀看）;
有人認為決策訝異的快速Web應用程序是一個道義上的責任;
的人認為，原料藥應該很容易使用，同時解決難問題，有人知道如何創建這樣的API;
有人認為用戶將如何與你的工作互動，如果他們不擅長用鼠標或不能直觀地閱讀電腦屏幕;
一個充滿激情的傳播者，以及一個充滿激情的開發。
閱讀完整的職位描述，了解更多詳情。

任何技術工作的最好的部分是有機會做有影響力的環境中工作，既是挑戰，也是支持你的成長。 YUI團隊提供只是，合流的特點：一個巨大的用戶和開發人員，從事社會和團隊合作提高項目每天的輝煌工程師。

如果這聽起來像你夢想的工作，如果我在上面的人提到像你每天要工作的人的聲音，我很想聽到你的。告訴我你為什麼對這個角色的合適人選，其中包括一個鏈接到您的簡歷和專業組合，通過電子郵件YUI [衝刺]工作[]雅虎inc.com。（校長;沒有招聘）。

注：一個美國的工作簽證需要為這個位置;雅虎不能在此期間招聘週期贊助一個新的H-1B簽證。

共享和擴展：書籤del.icio.us Digg它！ | reddit！

銳劇院-道格拉斯克羅克福德：“克羅克福德的JavaScript -第三幕：函數的極限（73分鐘）。”

2010年2月24日，8:24上午由埃里克·米拉利亞， YUI劇院 | 開發 | 3評論

第三批的克羅克福德的JavaScript系列提供了對JavaScript函數的深潛。道格拉斯開始這樣的談話：

我們打算今晚說，有關職能。函數是JavaScript的最好的部分。這是大部分的權力是，它是美麗的地方。像在JavaScript中的其他一切，他們是不完全正確，但你可以解決的，這裡有很多好東西。

73分鐘後，你將擁有的功能更好地理解 - 是什麼使得JavaScript的獨特而強大的更深的理解。如果你錯過了其中前兩個系列講座，或如果您想參加餘下的兩個之一，參觀克羅克福德的JavaScript系列頁。

如果下面嵌入視頻不會出現在你的RSS讀者選擇正確，請務必通過點擊觀看視頻銳劇院的高分辨率版本。

其他最近的銳劇院視頻：

道格拉斯克羅克福德：克羅克福德的JavaScript -第2章：再有就是JavaScript的 -雅虎的JavaScript建築師道格拉斯·克羅克福德調查JavaScript編程語言的特點。
道格拉斯克羅克福德：對JavaScript克羅克福德-卷1：民國初年 -道格拉斯克羅克福德了其適當的歷史背景下的JavaScript編程語言，跟踪語言的結構和公約（和它的一些怪癖）回到他們的根在電腦初科學。
基督教海爾曼：YQL的和YUI：積木，快速應用 -雅虎開發者網絡的國際傳道基督教海爾曼討論他的哲學思想，為建立快速，功能強大，有吸引力的應用，使用雅虎查詢語言（YQL），和雅虎的用戶界面庫（銳）。
基督教海爾曼：Bausteine 皮草網站 -基督教海爾曼“國際傳播者DES雅虎開發者網絡erklaert圍網哲學的和zeigt蒂普斯和技巧魏某人網站Applikationen GANZ einfach UND施奈爾erstellt indem人奧夫Bausteinen魏某模具雅虎查詢語言（YQL），und明鏡雅虎用戶接口庫（銳）aufbaut“。
約翰Resig的測試 - 性能分析，和jQuery 1.4的Mozilla的John Resig的，流行的jQuery JavaScript庫的創始人，為JavaScript和預覽在jQuery 1.4的顯著變化的性能測試和分析評論的選項。

訂閱銳戲劇：

共享和擴展：書籤del.icio.us Digg它！ | reddit！

在YUI 3畫廊：瑞安Grove的存儲精簡版的跨瀏覽器的存儲庫

2010年2月23日，7:46上午由Ryan樹叢，在發展中， YUI 3圖庫 | 6評論

瑞安樹叢（ @ yaypie ）是一個Web開發和餡餅鑑賞家（為前雅虎搜索和後者的樂趣）。 他曾像搜索輔助，搜索墊，以及最近的搜索重新設計的特點，目前正在幫助遷移雅虎搜索YUI的2至3銳。

隨著越來越多的瀏覽器增加的支持HTML5 Web存儲API ，未來正在尋找良好的Web應用程序，需要持久的客戶端數據存儲。不幸的是，保持與舊的瀏覽器不支持Web存儲的兼容性，可以是一個挑戰，放棄對舊的瀏覽器的支持是很少可以接受的辦法。

存儲精簡版銳3庫模塊，這是開發上使用雅虎搜索，旨在解決這個問題，通過一個簡單的，輕量級的API的包裝，沒有任何形式的外部插件的依賴關係（甚至不閃光）提供多種客戶端持久性存儲機制。它的重量在約2.6KB後微小和前GZIP，是HTML5的localStorage API類似，作品在IE6 +，Firefox 2中+，Safari 3.1中，鉻4 +和Opera 10.5。

除了銳3，存儲精簡版不同於現有的YUI 2存儲在幾個方面的效用。銳2存儲是一個強大的和可擴展性的實現，保持更忠實於HTML5的localStorage和sessionStorage的API（例如，它提供了一個變化的事件，一個key()方法，其中存儲精簡版沒有）。 YUI的存儲也屬於Flash或齒輪存儲為舊的瀏覽器，它可以在某些情況下提供更好的持久性和更大的存儲容量。存儲精簡版換為更輕的重量和更好的性能，可擴展性和基於插件的回退，並特別著重模仿只localStorage。

來看看這個持久的記事本示例在操作中看到存儲的精簡版，或通過一個API的快速瀏覽閱讀以下的非交互的代碼示例。

首先，包括腳本：

 <腳本的src =“http://yui.yahooapis.com/combo?3.0.0/build/yui/yui-min.js 
  gallery-2010.02.22-22/build/gallery-storage-lite/gallery-storage-lite-min.js“> </ SCRIPT>

在您的實現代碼，聽取storage-lite:ready事件，這是發射時的存儲機制是準備使用。存儲機制已經準備好後，你可以使用API：

 YUI的（）。使用（畫廊存儲-Lite的功能（Y）{

     / / 6-7與IE瀏覽器的Safari 3.x的完全兼容，聽
     / /存儲精簡版：存儲調用前的準備事件。 如果你不
     / /針對這些瀏覽器，你可以放心地忽略這一步。
     Y.StorageLite.on（存儲建興：準備好'，函數（）{

         / /存儲一個項目，通過以setItem鍵和一個值（兩個字符串）（）。
         Y.StorageLite.setItem（“小貓”，“蓬鬆可愛”）;

         / /如果可選的第三個參數設置為true，你可以使用任何
         / /序列化對象的價值和它會被自動存儲
         / /作為一個JSON字符串。
         Y.StorageLite.setItem（'餡餅'，'蘋果'，'南瓜'，'山核桃']，真實）;

         / /要檢索一個項目，通過對getItem（）的關鍵。
         Y.StorageLite.getItem（“小貓”）; / / =>'蓬鬆可愛“

         / /檢索和自動解析JSON值，設置可選
         / /第二個參數為true。
         Y.StorageLite.getItem（'餡餅'，TRUE）; / / => [“蘋果”，“南瓜”，“山核桃”]

         / / length（）方法返回一個數多少項目是目前
         / /存儲。
         Y.StorageLite.length（）/ / => 2;

         / /要刪除一個單一的項目，通過其關鍵RemoveItem將（）。
         Y.StorageLite.removeItem（“小貓”）;

         / /要刪除存儲中的所有項目，調用clear（）。
         Y.StorageLite.clear（）;

     }）;

 }）;

數據存儲使用存儲精簡版是堅持跨頁面瀏覽量和瀏覽器重新啟動^*，只能從它存儲在同一個域中的訪問。幕後，倉儲Lite使用以下的存儲機制，自動選擇最好的支持：

火狐3.5瀏覽器4 +，Safari 4中，IE8的，歌劇10.5 + HTML5的localStorage -這些現代瀏覽器都支持HTML5草案中定義的核心localStorage功能。
火狐2.x和3.0.x的 壁虎globalStorage的，早期的API類似HTML5的localStorage。
Safari瀏覽器3.1和3.2： HTML5數據庫存儲，因為Safari 3.1和3.2不支持HTML5的localStorage。
在IE6，IE7： userData的持久性，很少用於在網頁上的元素相關聯的字符串數據和堅持之間瀏覽量IE瀏覽器的功能。

有關詳細信息，請參閱存儲精簡版GitHub項目和API參考。

*警告：IE6和IE7堅持跨越瀏覽量的數據，但不能跨瀏覽器重新啟動。

共享和擴展：書籤del.icio.us Digg它！ | reddit！

三個新的導航設計模式

2010年02月22日，4:56下午由基督教Crumlish | 設計 | 5評論

在過去的幾個月裡，我在雅虎的內部設計模式庫的模式進行了審計，盡可能多他們的眼睛朝出版YN系列開放圖書館。為什麼呢？嗯，有一件事，讓他們更多的眼球，以收集更多的反饋和不斷提高的模式。此外，因為很少在圖書館模式包含雅虎特定的信息，替代進程現在是在地方審批雅虎網絡和品牌元器件的具體要求，設計模式集合現在可以更容易地專注於（相對）網絡實現的通用設計原則。