Saturday, January 13, 2007, 04:47 - 話設計 about design
在進行網頁排版工作時，經常會遇到的問題就是瀏覽器的相容性，其實不僅只是排版，程式 debug 的時候，瀏覽器的相容性也常是個測試指標，不同版本的瀏覽器，往往有它各自的刁鑽問題存在，舉例來說：當你使用 Dreamweaver MX 進行網頁排版時，預設的 <META> 標籤位置是在 <TITLE> 之後，乍看之下只是很尋常的順序問題，很難令人聯想到會造成多麼嚴重的問題，但是這樣的順序當你的網頁語系是使用 utf-8 時，在 Internet Explorer 5+ 上，將會發生網頁內容顯示為空白的現象，而 Internet Explorer 本身並不支援在一個作業系統上，安裝多個不同的版本，這使得除錯與測試有了麻煩，幸好， evolt.org 提供給大家多種選擇，在它的 Browser Archive 中，提供了許多不同瀏覽器的各式版本，當然它也提供了從 Internet explorer 3 開始到 Internet Explorer 6 針對不同環境的單機運行版下載，更多版本的 Internet Explorer？聽起來著實有點可怕，不過為了能夠更方便的測試，只好讓它們在你的電腦裡開 home party 了！
從 evolt.org 下載各個版本的 Internet Explorer
9 回應 »
(2預覽)
| 0 引用
| 
( 3.2 / 1924 )
Friday, January 12, 2007, 23:11 - 鮮玩意 fresh gadgets
Apple.Inc 終於發表了大家期待已久的 iPhone，不過亞洲地區要等到 2008 才會上市，等不及的朋友就先自己做一隻吧！
雖然不是第一手消息，不過也許還有人沒看過，貼上來分享一下，順便感謝我每天必上的 Engadget Chinese。
Original：
GIZMODO [Apple iPhone Papercraft Model]
90 回應 »
(310預覽)
| 0 引用
| 
( 2.8 / 104 )
Friday, December 29, 2006, 01:04 - 話設計 about design
郵局便利箱／便利袋推出也已經有一段時間了，其中也經歷過幾次改版，經手過的就有三個版本，獲得來源都是網路拍賣，而在郵局曝光的電視廣告中，就有一隻是以網路拍賣為主題拍攝，顯而易見，郵局便利箱／便利袋確確實實的瞄準了廣大的網拍族群，實惠的價格、全省均一價投遞服務與全國郵局及郵政代辦所數千個通路點加上可重複利用的設計，對於從事通路多年的宅急便，不啻是一個相當具有威脅性的競爭對手。
而難能可貴的是，以往在印象中，公家機關的宣傳物總是保守而缺乏新意，甚至會出現一些急就章或水準參差的品項，而於 2006 年 9 月問世的版本，充滿日式簡約風格的設計相當令人驚艷，設計者採用了環保味十足的綠色以及鴿子的圖像來象徵便利箱環保與郵遞的特性，並且以色塊的方式勾勒出整個版面，整體畫面相當乾淨而清新，盒面上也有許多貼心的使用提示，側面更是規劃了一個個人廣告的區塊提供網拍族群運用，當我收到這個版本的便利箱時，這個區塊的設計不禁令我會心一笑，細看之後更覺得這是值得收藏的一款設計良品，無論是在視覺上以及使用性上，都是經過思考的理性結果，一個好的設計，本當如此。
同場加映：J-MALL TOKYO FASHION EXPRESS
實際在 J-MALL 購物的次數並不多，一來是因為該網站不完全支援 Firefox（有同樣問題的東森購物也讓我敬謝不敏），另一方面是J-MALL訴求的對象較為年輕，而有些東西雖然是日本品牌，但是由於 Made in China 使得質感不是那麼好，某些丹寧產品使用的染料甲醛的含量似乎過高。
這個網站是由豐華唱片出資經營的，透過與日系潮流雜誌的合作來打開市場，雖然在產品本身可能需要篩選才能買到真正的良品，但是在配送時的包裝外盒，也有可嘉許之處，外觀設計上比較沒有可以稱頌之處，J-MALL採用學院風徽章來設計外盒商標，原色的紙材也是相當環保，比較值得一提的是它採用抽屜式的開闔方式，消費者可以把它當作一個收藏物品的小抽屜使用，而鞋盒般的尺寸可以搭配大部分的產品寄送，產品本身也會使用白報紙先包裝過再裝盒，隨盒都會附贈品牌貼紙一份，對於品牌的推廣也有一定的作用，J-MALL 在配送上的包裝可說盡善盡美，在網路購物廣泛使用的現今，的確可做為經營網路購物網站者參考的典範。
Related Link：
郵局 便利箱(袋)品牌
74 回應 »
(244預覽)
| 0 引用
| ( 2.9 / 1071 )
Thursday, December 28, 2006, 05:53 - 鮮玩意 fresh gadgets
;)
Written by Hank Green
Sunday, 17 December 2006
Bicycle commuting rocks. It's healthy, safe, fast, cheap and the only emission is what the biker breathes out. But it does have it's problems. One is that bikes generally have a very awkward shape. If there is no bike rack, or if you want to go somewhere with your bike, you're reduced to lugging a very cumbersome package around with you.
Well what if there was a bike you could fit in your trunk, that was the size of a briefcase, or that you could take on the subway. That sure would be nice.
Thus, the concept of the folding bike. You might be surprised to learn that there are actually quite a lot of these guys out there. They range from the practical to the nonsensical and from frugal to near-car prices. And today, at EcoGeek, we're going to show you the best of the folding bikes.
[continue reading...]
延伸閱讀：摺疊的行動力
11 回應 »
(20預覽)
| 0 引用
| ( 3 / 598 )
Monday, November 20, 2006, 21:03 - 話設計 about design
什麼是無障礙呢？簡單來說，即是在網頁上具備無障礙空間，讓身體上、心理上、以及技術上有障礙的朋友能夠順利閱讀的網頁，習慣瀏覽聲光效果滿載網頁的一般使用者，可能很難想像，在視盲、弱視、色盲甚至肢體殘障的狀況之下，能夠瀏覽的網頁會是長什麼樣，其實除非是完全以 Adobe Flash (Macromedia Flash) 技術所製作的網站之外，一個設計良好的網站，在加入了無障礙存取技術之後，單憑外觀你甚至會無法分辨，這個網站是否符合無障礙規範。
雖然 Dive Into Accessibility 提供了一個非常完整的無障礙親和力設計示範，不過其實一個符合標準的無障礙網頁，不一定需要長得像它這麼乾淨（或陽春）。
行政院研究發展考核委員會於九十一年六月開始推動「無障礙網頁開發標準暨標章核發作業」委外案，以 W3C 協會（The World Wide Web Consortium）所屬之 Web Accessibility Initiative (WAI) 組織的無障礙網頁內容標準相關規範 Web Content Accessibility Guidelines (WCAG) 以及各國在制訂無障礙網頁相關政策等相關措施，訂定我國的「無障礙網頁開發規範」，並且歸類為三個等級，從政府機關的網站開始落實實施，以循序漸進的方式，從全面性通過無障礙 1A 級標章開始。
那麼執行成果好不好呢？
在數年前，有機會提早閱讀了 Dive Into Accessibility 這本電子書，對於無障礙的觀念有了基本的認識，接著在一次公家機關的提案中，正式的著手開始撰寫符合無障礙網頁規範的網頁，我接受了 Jeffrey Zeldman 在他著作 design with web standards 中的建議，使用過渡技術以及結構化的 XHTML 搭配 CSS (Cascading Style Sheets) 來撰寫，並且使用@import的方式讀入樣式表 (CSS) ，使過舊的瀏覽器略過 CSS 直接顯示結構化的單純頁面，這種做法在移除樣式表 (CSS) 的狀況之下，仍然可以正常閱讀網頁內容，也就是說在舊版瀏覽器或是親和力瀏覽器（例如：螢幕朗讀軟體）上，使用者可以看到正常顯示且標題與段落相對關係清楚的內容，在這方面的排版技術上， css Zen Garden 上提供的範本清楚告訴你他們在這方面有多麼地內行。
在我製作的過程中，我也不斷地去瀏覽線上已經通過無障礙網頁規範的政府機關網站，不過很可惜的是，幾乎所有的網站都沒有考慮到將網頁的內容結構化這個部份，多半都採取在 <table> 表格中使用註解以通過自動檢測系統，雖然使用簡單的表格來作版面配置，並不會違反 WAI 或是 Section 508 甚至是我國的「無障礙網頁開發規範」，但是一旦拿掉樣式表或是在文字瀏覽器上，就成了結構紊亂的奇妙頁面，這樣的做法，對於無障礙存取除了沒有幫助以外，反而造就了另外一種使用動線上的障礙。
截至目前為止，我陸續經手了三個無障礙網頁開發案，不敢說對無障礙的技術已經非常了解，但是我認為結構化的標記語言搭配樣式表的做法，就使用性而言，絕對是無障礙網站的基本需求（即使使用 <table> 排版依舊可以輕鬆的通過無障礙自動檢測），可惜的是，我幾乎沒有看到落實這種做法的政府機關網站，甚至也有使用多個巢狀表格來排版的不良示範（但他們都掛著無障礙標章），只能感嘆這樣的做法在我的觀點來看可以說是流於徒具形式了。而在 Jeffrey Zeldman 的著作中也提到，應儘可能使用多種瀏覽器對網頁進行測試，以避免無效的 CSS 規則，很可惜的是經過瀏覽器大戰之後，許多網頁設計師選擇西瓜偎大邊，僅針對 IE 支援來設計網頁，這可以說又是一項違反無障礙精神的做法，然而這樣的案例卻不鮮見於這些通過無障礙規範的政府機關網站中，以推動無障礙規範的政府機關來說，可以說是相當不良的示範。
儘管設計範疇之廣，但是設計的共通原則卻是不變的，即是以使用者為出發點的概念，而關懷弱勢的精神更是一個良善設計中不可或缺的環節，希望藉由此篇文章的呼籲，能夠將無障礙以及跨平台的網頁設計概念，傳達給大環境中的執業設計師，不要讓無障礙的設計僅止於通過檢測獲得標章，而能夠真正地正視使用者的需求，讓殘障人士能夠在網際網路的世界中更貼近通行無阻。
Related Link：
Web Accessibility Initiative (WAI)
Section 508
Dive Into Accessibility
無障礙網路空間服務網
design with web standards
留住訪客，從掃除路障做起
瀏覽器大戰
21 回應 »
(207預覽)
| 1 引用
| ( 3 / 2195 )
前一頁 下一頁