automjump

今天發現的有趣的命令列工具 autojump ,它會記錄你常用的目錄位置,然後之後就可以用簡單的關鍵字跳到路徑符合關鍵字,又最常用的目錄,以我為例,我最近常常會跑到某個位置的 vim-plugins 目錄,然後我又沒有其它目錄名稱和 plugin 相似,那不論我在哪,我都可以執行下面的指令跳到 vim-plugins:

j plugin

我目前使用上是都沒什麼大問題,不過 hlb 說他的 vim 檔名自動完成會爛掉,可能要在研究看看問題在哪了。


eregex.vim

新開始維護的 eregex.vim,一開始的動機是因為我有小東西要修改,然後就開了 git repo,後來覺得乾脆就自己維護,順便推廣,所以目前主要貢獻幾乎都是在翻譯說明文件。

簡單介紹,eregex.vim 是讓 Vim 可以使用 Perl/Ruby 形式的正規表示式,因為實在是很不習慣 Vim 的正規表示式寫法,安裝後,把以下兩行加到 .vimrc 檔案裡:

nnoremap / :M/
nnoremap ,/ /

這樣就可以用 / 和 Perl 形式的表示式進行搜尋了,如果要取代可以用 :S (大寫S),不過這頂多是平常編輯文件時使用,要開發 plugin 的話還是只能用內建的語法寫。


WAI-ARIA 介紹之三

這篇文章是翻譯 Dev.Operv 的 Introduction to WAI ARIA 這篇文章,分成三篇刊載。由於原文為 CC-BY-NC-SA-2.5 授權,故此篇文章也採用同樣授權方式。系列文章:

ARIA 可以做什麼用?

使用 ARIA 並不會有不好的副作用,所以你可以馬上開始使用他,而且主流的四個瀏覽器都已經支援或已經有計劃支援了,Opera 9.5 和 Firefox 1.5 已經有支援 ARIA , IE8b 也有支援, Safari 所使用的 WebKit 框架也發表說他們將會開始支援 ARIA , 輔助科技也廣泛的支援 ARIA ,JAWS 7.1、Window-Eyes 5.5+、NVDA、Zoomtext 9+ 和其他輔助科技都有基本的支援,而且還會越來越好。

現在就參與使用

由於使用 ARIA 並沒有任何不好的副作用,而且相關的支援都已經到位,現在就參與使用百利而無一害,即使你的網站非常簡單,你也可以使用文件地標讓使用者有更好的導覽系統可以使用。

閱讀「WAI-ARIA 介紹之三」全文

jQuery Code Style

隨著 jQuery 1.4.3 發佈,還有一份 jQuery Code Style 文件也一起公開了,相較於 Google 的 JavaScript Code Guide,我覺得 jQuery 的 code style 比較有趣可以講:P。

jQuery 在某個版本開始有注意 coding style ,而使用的檢查工具就是 JSLint ,不過直到這次新版才公開講,使用上其實有故意忽略了幾個錯誤訊息,其中特別有趣的是 "Expected an identifier and instead saw 'undefined' (a reserved word)." 這個。

在 JavaScript 中 undefined 不是保留關鍵字,而且它是全域的,所以任何 script 都可以把它覆寫掉,然後下面這樣判斷變數是否宣告過的方法就會爛掉了:

if (foo === undefined) {
    // ....blah....
}

有一個作法可以解決這問題,我以前也有提過,就是把自己的程式碼用一個 closure 包起來,然後故意少傳一個參數:

(function (document, undefined) {
    // ....blah....
})(document);

這樣 closure 內部的 undefined 就不用怕被其他地方的程式覆寫過了,不過 JSLint 會告訴你第一行的 undefined 不該使用來作為變數名稱,而應該要作為保留字,所以才會忽略這項錯誤訊息。

那既然 undefined 的問題解決了,在下面的 TYPE CHECKS 的 undefined 檢查中的全域變數還要用 typeof 來檢查呢?

typeof variable === "undefined"

那是因為只要一存取到沒定義的全域變數就會噴出錯誤訊息,所以必須要用 typeof 來判斷它的類別。

還有一個被忽略的錯誤訊息是 "Use '===' to compare with 'null' ,如果有看過一些關於 JavaScript 的 == (equal) 、 === (strict equal) 和 null 、 undefined 等行為的文章,就會知道它們的行為實在不好搞清楚,所以都會建議盡量使用 === 和 !== 取代 == 和 != , JSLint 則是只有在空字串、0、null、undefined 等數值的比對上才會強迫你使用 === 和 !== ,不過 jQuery 的 lint 檢查卻故意忽略 null 的部份,主要是因為可以用下面的方法來判斷一個變數使否有值,或著是根本還未定義:

if (foo == null) {
    // ....blah....
}

這樣檢查的話,0 或是空字串是會當成有值,如果只是用驚嘆號做 true/false 判斷的話那就會誤判了。所以可以知道,jQuery 現在的程式碼裡面 == (equal) 和 === (strict equal) 的使用應該都是有考慮過的,話雖如此,其實也只有一種情形會使用到 == 就是。


WAI-ARIA 介紹之二

這篇文章是翻譯 Dev.Operv 的 Introduction to WAI ARIA 這篇文章,分成三篇刊載。由於原文為 CC-BY-NC-SA-2.5 授權,故此篇文章也採用同樣授權方式。系列文章:

我是誰?

ARIA 導入了 role 屬性來幫助定義介面元件和頁面結構,介面元件像是滑動條控制器,頁面結構像是導覽區塊,網路應用程式的一個主要問題是任何 HTML 元素都可以用來製作介面元件,但是 HTML 元素都已經有其定義與角色了。 Role 屬性代表的是該元素是什麼東西,它在整個架構中是什麼角色,例如 heading 標題就是輔助科技所可以了解的角色。當使用既有的元素建置介面元件時,輔助科技會以元素的預設角色和定義來認知該元素,而不是它實際上在介面元件中的角色,例如滑動條控制器中的滑塊使用 img 標籤製作並標上適當的替代文字,螢幕閱讀器會讀出「圖形、滑塊」而不是更有意義的「滑動條控制器、值為百分之16。」


Figure 3 -- 滑動條控制器上的滑塊

閱讀「WAI-ARIA 介紹之二」全文

WAI-ARIA 介紹之一

這篇文章是翻譯 Dev.Operv 的 Introduction to WAI ARIA 這篇文章,會分成三篇刊載。由於原文為 CC-BY-NC-SA-2.5 授權,故此篇文章也採用同樣授權方式。系列文章:

引言

HTML最初並不是被設計來製作網路應用程式的,所以它所有的控制介面非常少,而且受限於 client-server 的通訊模式,然後開發者們使用 JavaScript 突破了這層限制,並建置了各式各樣的介面元件。

然而不幸的是,這些突破 HTML 限制的技術通常也不具備親和力,即使這些介面元件看起來用起來都和一般的桌面應用程式沒什麼不同,但是像 screen reader 這些輔助科技並沒辦法存取到這些介面元件的角色(role,這個元件是什麼東西)、狀態(特有的設定,如 checked)和其他重要的資訊,這狀況就如同只是調整樣式讓一段文字看起來像標題,卻不使用正確的標題標籤,造成各種輔助科技並無法知道這段文字是標題一樣。

使用輔助科技的訪客通常不會注意到網頁動態更新的內容,輔助科技通常會認為只有在導航事件,例如開啟連結或是送出表單時,網頁的內容才會變動。網路應用程式使用AJAX這類新技術,會在背後默默的更新網頁的內容,即使輔助科技會去助益網頁內容的更改,使用者仍然可能不會注意到內容有更新,或是不知道如何移動到更新的位置。

WAI-ARIA為這些介面元件提供了角色(role)定義,以及各種角色狀態和屬性的規格,使用輔助科技的訪客便可以理解並使用這些資訊,除此之外,WAI-ARIA還提供了一種機制以確保訪客不會錯過資訊的更新。

閱讀「WAI-ARIA 介紹之一」全文

Google Font 開始提供非拉丁語系字型

這兩天在修理調整 blog 時才發現到 Google 現在開始 提供非拉丁語系的字型 ,不過不用太開心,因為還是沒有中日文漢字,目前只有 cyrillic、greek(希臘字)、khmer(高棉字)三種,先不說有漢字的幾種文字,我還蠻期待他們能提供一些符號的字型,像是占星符號、Rune 等等。


Style Guide for online hypertext

這幾個月有些機緣讓我和 W3C 的距離更加接近,其中一項意外的收穫就是發現 Style Guide for online hypertext 這一系列文章,都是 Tim Bernes-Lee 寫的,內容可以說是建置網站的一些 best practice,是在程式語言、標籤語法以外的東西,講了在建置與維護網站上很多重要的觀念,像是講到 URI ,timbl 就說應該好好設計,設計之後便應該讓它一直有效,還有使用網路標準,不要專為某種設備編寫你的文件、該引言還是該做連結等、甚至還早於 AJAX 這個名詞發明之前說到網路上的內容都應該有個永久連結。雖然文章年代都有點久遠,不過所講述的東西其實很多到今天還是相當適用,當然,很多觀念也是一再有人提出來講的,不過內容都不長,我覺得還是值得花些時間看看,順便再次提醒自己。


幫忙推廣好的 JavaScript 文件

由於在網路上要尋找好的 JavaScript 文件不太容易,所以前陣子舉辦的 JSconf.eu 中,發起了 Promoto JS ! 的運動。事實上網路上是有不錯的 JS 文件,像是 MDN 的,不過搜尋時排序都不在前面,而且還會有些 Java 的資料混在其中,而這個運動就是希望藉由貼紙串連的方式,把 MDN 的文件排序推到前面,每個貼紙的 HTML 碼都會有個連結和寫好的連結描述連到 MDN 的一些頁面,在 Promoto JS ! 的首頁提供的貼紙內容是隨機產生的,貼紙的大小則只有兩種,長條的和方的,你可以重新整理以取得你比較想連結的頁面和你比較想要的貼紙大小,檔然也可以使用 Tweet 小按鈕幫助宣傳這個活動,希望下次我要上 Google 找文件時,不用在手動加上 mdc 這關鍵字了。

promotejsv


彩色 man page

忘了哪裡看到的設定了,用的是 zsh

# colorful man page
export PAGER="`which less` -s"
export BROWSER="$PAGER"
export LESS_TERMCAP_mb=$'\E[38;5;167m'
export LESS_TERMCAP_md=$'\E[38;5;39m'
export LESS_TERMCAP_me=$'\E[38;5;231m'
export LESS_TERMCAP_se=$'\E[38;5;231m'
export LESS_TERMCAP_so=$'\E[38;5;167m'
export LESS_TERMCAP_ue=$'\E[38;5;231m'
export LESS_TERMCAP_us=$'\E[38;5;167m'

效果預覽:

colorful man page


命令列安裝 Dropbox

剛剛試著在命令列安裝 Dropbox ,發現超簡單的,不過還是記錄一下,我安裝的流程是跟著 howto-install-dropbox-in-ubuntu 走的,不過我剛發現 官方的安裝說明 是沒說到要修改套件庫的來源檔,只要執行以下指令:

sudo apt-get update;sudo apt-get upgrade nautilus-dropbox

如果有金鑰問題的話,加入套件庫金鑰的指令如下:

sudo apt-key adv --keyserver pgp.mit.edu --recv-keys 5044912E

接著如果有用 nautilus 的話要把相關的程序全部關掉

nautilus --quit

然後安裝 Dropbox daemon

dropbox start -i

啟動 Dropbox

dropbox start

第一次啟動會看到下面的說明和連結

To link this computer to a dropbox account, visit the following url:
https://www.dropbox.com/cli_link?host_id=01d51f8e353b4f9a45085***********

用瀏覽器開一下那個連結把帳號連結建立起來後就完成了,預設的目錄位置會在 ~/Dropbox 裡面,也可以執行 man dropbox 來看其它使用說明。


更之前的文章