一張圖說明 Responsive Design 的精華



之前有寫 一篇文章 談 Responsive Design 的概念,中文似乎沒有統一,先稱為自適性設計吧

許多知名的網站框架都有導入這樣的概念 (例如:Twitter 所用的 Bootstrap)

可以大幅減少開發的時間

 

這次製作了一張圖,直接說明其意義:

 responsiveDesign

 

如果嫌圖片太小,這裡有原圖可以觀看

http://i.imgur.com/jWuS0.png

 

其中 pixel 所列的數字是大致參考值

確切數字還是必須根據裝置不同而定

 

如果有錯誤,歡迎指正!

台灣區瀏覽器使用率統計



根據 StatCounter Global Stats 從 2011/10 到 2012/10 的統計,以下為台灣區瀏覽器的市占率 :

Source: StatCounter Global Stats – Browser Version (Partially Combined) Market Share

 

只要是統計的東西都不一定客觀,但多少能夠代表一些趨勢

【閱讀全文】

[Javascript] Backbone.js (二) Model



延續上一篇 [Javascript] Backbone.js (一) Hello backbone,本篇來談談 Backbone 當中的 Model

在 MVC 的架構當中,Model 通常被當成資料的容器,在 backbone 當中也不例外,Model 可以承載所有頁面當中常取用的資料,或是 server 回傳的資料等

特別的是,Backbone 當中的 View 採用了 Observer Pattern 的設計,當使用者改變 Model 的值時,對應的事件會被 Trigger,而達成 UI 自動更新或是 Ajax 自動啟動等

 

【閱讀全文】

[Javascript] Backbone.js (一) Hello backbone



image

最近因為進行團隊大型系統的開發,開始學習 backbone.js 這套前端 Javascript 的 Framework

基本上可以把程式碼進行一些分類,避免未來專案持續增大之後而遇到的可怕 maintain 問題

【閱讀全文】

[jQuery] 筆記 (七) – 選擇器 (selector)



jquery 提供 selector 的機制,類似 CSS 抓取 DOM 元素的方式,針對網頁元素進行操控,選擇器背後的原理是 jQuery 寫定的 Regular Expression 方法,所以每次選擇都要跑一次 Regular Expression ,對於效能也有一定的影響。因此,本篇文章紀錄 jQuery 選擇器的相關操作方式,後面還有談到效能的議題。

【閱讀全文】