是時候好好安利下LuLuUI框架了！

官方網站：l-ui.com/

專案主頁：github.com/yued-fe/lul…

API文件：LuLu UI API中文文件

你好，LuLu！

LuLu UI是一個基於jQuery，針對PC網站，相容IE8+或IE7+的前端UI框架，包含20+靜態或動態UI元件。

貼近使用者

LuLu UI更溫暖，更自然，更親近，更關注細節和使用者體驗，對使用者側非常友好，因此，非常適合面向外部使用者的網站開發。有別於Ant Design這類更適合中後臺開發的UI框架。

上手簡單

LuLu整個專案就是提供一些UI元件的JS和CSS，很純粹的JS和CSS，沒有任何矯揉造作的“變身”處理。

因此，想要使用LuLu UI，直接引入CSS和JS檔案地址就可以使用了。HTML還是原來的HTML，CSS還是原來的CSS。什麼Vue什麼MV*什麼高大上概念完全不需要掌握，參照文件，複製複製，貼上貼上，效果就出來了。

API文件參見：LuLu UI API中文文件

使用場景廣泛

LuLu UI既保留了jQuery外掛即插即用的特性，也支援適合多人合作的模組化載入方式，因此適用場景更加廣泛。

例如：

• 單人完成的某個簡單運營活動頁，需要個彈框提示功能，可以直接引入LuLu UI中的Dialog.js，就可以使用了。
• 某網站看中了LuLu UI某一個元件，例如日期選擇功能，想拿過來使用，<script>引入日期選擇JS，然後就可以使用了。
• 對於多人合作大型專案，可以使用類似seajs這樣的載入器進行模組化載入與開發。

所有元件無論是單獨使用，還是體系內使用，文件均提供了demo演示。

成熟

LuLu UI 2015年就誕生了，到現在已經有3年了，跟那些年輕的UI框架不同，LuLu UI可是見過很多世面的，謙遜內斂不聒噪，沒必要大肆鼓吹，口碑說話。

開源是件嚴肅的事情，LuLu UI一直認為，如果元件還沒有達到不動如山的境地，那就應該繼續埋頭打磨。這麼多年過去了，經過對內對外多個大中小型專案的驗證與打磨，無論是互動細節還是程式碼本身細節，LuLu UI現在都已經可以做到不顯山露水了。

體驗好

LuLu UI不會把什麼“極致體驗”掛在嘴上，極致是沒有盡頭的。LuLu UI也就做到使用者使用無感知這種程度。

舉個例子，如果使用者是通過滑鼠點選按鈕開啟的彈框，則彈框介面平平無奇；如果使用者是通過ENTEREnter鍵點選按鈕開啟的彈框，則彈框中的按鈕預設會outline高亮！

見下面截圖示意：

除了多年不斷優化的無數互動小細節，LuLu UI還適配retina視網膜螢幕，同時支援螢幕閱讀裝置無障礙訪問，以及很少UI框架支援的keyboard鍵盤無障礙訪問。坐下，坐下，都是基本操作而已。

程式碼學習素材

LuLu UI的JS程式碼非常適合萌新參考與學習。

層次簡單，邏輯清晰，註釋詳盡與規範，程式碼樸實無華，沒有炫技，非常適合閱讀和理解，是不可多得的學習素材。

與眾不同的設計思想

表現為3點：

1. 面向設計理念；
2. 沒有版本概念；
3. 面向HTML開發

面向設計理念讓LuLu UI在視覺和互動表現上更有情感，更有溫度；摒棄面向功能那種大而全開發思想，於是LuLu UI的程式碼更加簡約，元件更輕便靈活。

LuLu UI框架是沒有版本的概念，只有一個唯一的母體在慢慢迭代。當面對一個新的專案，拷貝這個母體，然後這個拷貝的LuLu UI就和專案耦合在一體，與母體沒有任何關係，你就可以根據設計需求、產品需求任意修改專案中的LuLu UI的CSS和JS，從而保證視覺還原，產品品質和開發質量。

面向HTML開發，使得LuLu UI更語義，對輔助裝置更友好，同時技術棧更偏向HTML和CSS，也使得廣大JS相對偏弱，在視覺表現較強的前端更容易上手，可以更友好地還原設計和增強體驗。

LuLu UI所有與眾不同的設計思想，都是方便外部使用者，方便體驗側前端同學進行開發，方便設計師視覺還原和創意實現，歸根結底可以有更好的使用者體驗和產品品質。如果是面向中後臺開發的UI框架，則會面向資料，面向功能設計，元件應用會規避書寫CSS和HTML，以方便開發側前端同學進行開發。可見不同產品形態和不同使用者群體決定了不同了UI框架設計理念。

設計師同事一定會很喜歡LuLu UI框架的。

稀缺性

既懂設計又會程式碼同時在體驗方向有較多積累的前端是稀缺的。所以，LuLu UI也是稀缺的，在PC端使用者側網站開發上，LuLu UI有著不可匹敵的競爭力！

閱文前端榮譽出品

感謝前騰訊諸位同事，現閱文諸位同事在LuLu UI建設上的幫助。

原文釋出時間為：2018年06月27日

原文作者：掘金

本文來源：掘金 如需轉載請聯絡原作者