A jewellery designer client wish to expands his Flash website to be compatible with iPhone and iPad. I make another iPhone/iPad web site version for him.
The YesterdaySkin v2
客戶的網站 The YesterdaySkin 商品進新貨了,縱然跟之前作對比充滿另一份感覺,然而亦依舊貫徹網站宗旨:Let me be your second skin.
Happy new year
轉眼新的一年過了廿多天,對上一次的寫作經已是兩個月前,管理頁標著99篇回響,當中有99篇也是Spam,這網誌荒廢度更乎百分之百,可真嗚乎哀哉。
這段時間,正職的項目開發工作很忙,由初入職五時半放工,到經常性九時十一時才離開銅鑼灣,暈。跟舊工作作個對比,工時反而長了…當然,薪水搭救,為勞累作個安慰。
然而可幸的是工作需忙,但卻很投入其中。一組男家班,一起工作的團隊感覺是我嚮往的,從過去在小公司工作中感受不到的。雖然工時間或長了,但接觸的新事物多了,工作由最初的IE6-SUPPORT的FRONT-END WEB DEVELOPER變成JAVA編程員。由對ATG Commerce零認知到現在還可獨自寫出一些servlet/droplet搭JSP。最意想不到是有一部Mac Book Pro外還負責了iPhone application的編程工作。人工的量價比低了,但獲益良多。
對現在的日間工作尚算滿意,但還是想充份利用餘暇。由上年年尾到今年初,蒼天蠻看顧小弟,接著一單又一單的freelance上門,對新的freelance工作也得選擇一番。當然若果可以,我還是想進行多些web development方面自我增值。像如何寫較好的HTML5網頁,寫較好的jQuery程式。熟習一些Open source、CMS,好使當有新項目時能更快更易開發。
展望新的2011年,大家能事事順利。別再發生一些慘絕人圜的新聞事吧。
이별의 맛 & Be pretty – Color of the City
在網上隨意搜尋間,看到一組韓國 MV,敘述一段兩個人的故事。滿有都市人的味道。可惜不太知道這兩段MV的製作因由,網上找不到相關的製作新聞為介紹呢~ Continue reading 이별의 맛 & Be pretty – Color of the City
牛刀小試 iPhone Obj-C programming
從聽聞寫 iPhone app 來賺錢有可為之後,便期待盡可能找來一台 Mac 機開展 iPhone app 的開發之路。然而,一台 Mac 機的價值不斐,直到轉了新工作,因應工作需要,被賞賜了一台 MacBook Pro,並且得到允許,借回家使用。
星期天花了大半天,在網上網羅了許多不同的教學文件、免費電子書,圖文並茂,有一點眼花瞭亂。幸好自問還算有點編程底子,看著看著把以往編程的概念轉個角度看看、想想,還算能應付理解。
手上第一個 iPhone App 並不是由零開始編寫,而是由外判公司為公司所製作的 iPhone prototype 副本,嘗試進行些小改和 bug fixing。藉這一過程,初嘗了使用 XCode,改動 Objective C 的程式碼、編譯和運行 iPhone Simulator。當看到程式被我改動後仍然「生還」,在simulator中呈現,心底無限亢奮。
當然,這一編程路的故事只是開始。對 Obj C 的認知仍然只屬皮毛。這一初試其實還得感謝一位同事的一些起始指導,還有上司提供機會讓我去作出這一嘗試。真的希望一天不只有二十四小時,能給我多點時間和精神,讓我鑽研這一技能多好呢~
網上有一個港人的網誌有一些其開發 iPhone app 的分享,是一個對 iPhone App 編程有好奇的人來說一份不錯的起始指導:http://eddyl.com/blog/
TypeKit and Web Fonts
For the project I currently come across is a very stylished corporation website. The site’s designer intends to use special font-face to empharise the brand feeling. This allows me find out something call TypeKit and Web Fonts.
In early web development period, whenever web designer need to use special font face, they may require people to download and install that particular font to client machine. When CSS turns out to a more widely used pratice for web layout control, we use font-family for assigning the font-face we use. But these techniques not yet help web designer to achieve something they want: the use of special, non-widely adopted font face, to their web product.
TypeKit and Web Fonts come to the place for this purpose, with the evolution of cloud service development. TypeKit and Web Fonts acts as a font provider for online purpose. They work in this way:
- Web designer sign up for the online font service
- Select font face that provided by TypeKit/Web Fonts and define CSS selector for assign font-face effect
- Generate JavaScript Snipplet for the fonts service
- Put the snipplet to designated web page so as to provides necessary font resource to the web page the snipplet was adopted. Designated CSS selector will take effect with the web font
Therefore, without explicitly storing the font raw file, no installation step on client side. By this mean, web designer can use their ideal font and client side can enjoy the visual effect without any extra font installation.
TypeKit does not provide as many font as Fonts.com Web Fonts provides. And as a Chinese, what I can observe is that TypeKit does not provide any chinese font-face.
Making good use of this technique can definitely help enhancing web layout while not affecting the site SEO concern, say no longer need to use image replacement to show special font design in some case.
Typekit: http://typekit.com/
Fonts.com Web Fonts: http://webfonts.fonts.com/
少女時代(소녀시대) – GEE
Cross Browser Compatibility & Progressive Enhancement
隨著網路的發展,網頁所包含的不單止有文字圖案,不同種類的多媒體應用漸漸被應用於一些尖端前衛的網站上,固有的瀏覽器未必能應付這樣的需求。由Internet Explorer vs Netscape 的年代開始,瀏覽器的戰爭自此沒有停過。林林種種的瀏覽器出現,Firefox, Chrome, Safari, Opera等等,對用家來說是多了選擇,對Web Developer來說分分鐘是惡夢的開始。
假如各門路的瀏覽器能夠把任何一個網頁都一致地呈現,這是最理想的情況。但事實上各家各有自己對網頁的編譯方法,甚至運行上的不同做法,都使 Web Developer 再神勝不過。意思說,作為 Web Developer ,有責任的話,他需要讓其製作的網頁能在絕大部份的瀏覽器 / 視窗平台中順利運行,這就是所謂 Cross Browser Compatibility 。要做到這點,並不是把一切基本網頁編寫的 HTML,JavaScript 學會就是了。還得要從各個瀏覽器的特性方面著手。由標準HTML (W3C Standard HTML)學起,到逐步了解不同瀏覽器對 HTML 的演譯方法,接著學寫標準的JavaScript,並且查找某些JavaScript在不同瀏覽器中編寫文法的例外,到較後學習如何利用CSS對版面作改動,與及留意不同瀏覽器所支援的 CSS 版本,為網頁作出適當的 CSS 調整。
從前 Cross Browser Support 主要依賴人手在各個瀏覽器上作測試,而現在坊間有說多途徑去減化這些測試動作。這個網站羅列了數個測試方法:
7 Fresh and Simple Ways to Test Cross-Browser Compatibility | FreelanceFolder
詳細的不說了,重點就是作為 Web Developer ,對自己所製作的網站傑作,都應該執行 Cross Browser Compatibility 測試,好使自己的作品不會在某些執行環境中出洋相。
當然,在云云瀏覽器存在的世代,正如我說不同瀏覽器對網頁的呈現會有不同的演譯方法,然而強行要將一個網頁完全順利一式一樣的在各個瀏覽器呈現,並不是沒可能,只是不夠實制。比方說,對不同瀏覽器對網頁中的元作執位方面會有偏差,這個還不算太難應對。但對一些網站運用了許多視覺優化,如圓角表單、文字陰影、背景漸變等等,從前人們會用 Table、Div或背景圖來規劃一些組件來製作相關效果。但隨著 CSS 的廣泛應用,CSS版本進展到CSS3,利用它能夠將許多效果實現。這些進化了的效果在較舊的瀏覽器上當然未能完整呈現,但呈現出的結果因背後有 Backward Compatibility 的概念而也不算太強差人意。這個網站有提出一個例子解釋:
When Should You Use Progressive Enhancement
嗯,本文另一個字眼出現了:「Progressive Enhancement」。其大意是一個網頁的表現結果在各個瀏覽器都大致一樣,唯獨對新技術有所支援的瀏覽器中,會展示較好的呈現結果。以上網站顯示了一個表單資料的顯示情況。用較新的瀏覽器觀看網站,會得到較漂亮的版面,然而在較舊的瀏覽器中,亦不失其功能上的表現。當然,對於一些不明白上文所述的一切,又要要求 Web Developer 把網頁做到在任何網站一式一樣的老闆來說,那只有苦了該 Web Developer 去花心機時間做盡一切方法將其老闆的想法實現。
HTML5 vs Flash
算不上是什麼 web development 方面的技術差異的偉大分享,以上純綷是個人對 FLASH 和 HTML5 的一點看法。
雖然花了一段時間學習 HTML5 ,算不上上手,而另一方面則利用 ActionScript 寫了數年 FLASH。老實說,當初還使用著Pentium II 有256MB記憶體的年代,我對FLASH頗有微言。每每遇著一些無謂的網站開場動畫,光飛了些字然後才能進入網站,這些多餘的步驟其FLASH動畫經已耗掉我那台電腦的大部份資源,該些網頁看下去也沒意思。可是,當慢慢接觸多些比較有深度,可看出製作時花了不少心思的FLASH SITE(整個站台也是FLASH建構),與及隨著科技日新月異而多番昇級電腦機件,才能漸漸意會 FLASH 能帶給網路使用者更高層次的視覺享受和使用經歷(Site User Experience)。
無疑,FLASH 的確對其運行的電腦有一定的資源需求。很公平,有華麗效果當然需要相對的運算能力來造就。就正如你也不可能期望飛機能單靠那四個引擎飛上大空,總得附上兩三節推進器來看離地球擺脫地心吸力吧。然而在 HTML5 漸露頭角,人們一窩峰清算 FLASH 如何耗能,預測 HTML5 如何能替代 FLASH 的地位,我倒覺得這還有一段很長的路途。因為就算 HTML5 配搭 JavaScript 可達到編程層次來呈現互動效果,但單靠各家的瀏覽器來作為運行介面,總比不上 FLASH 利用自家經優化運行的 FLASH PLAYER 來執行運算程序來呈現效果來得可靠。FLASH PLAYER 對不同平台為 FLASH 檔案提供相對應的優化,有 ADOBE 來進行技術圍護和發展,這是 FLASH 能由簡單的動畫短片表現界系進化到站台開發與及互聯網應用軟體應用這一個廣域應用。
在細小的網站開發,HTML5可能讓網頁開發員花一點小功夫來把網站變得較美觀和添加互動元素。但論及大型網站開發,現階段 FLASH 仍然勝於 HTML5,至少Flash IDE 能提供一個比較完善的開發介面。
這寫分享其實出於為 FLASH 抱不平的心態,一些人對 FLASH 反感實在只是出於偏見。然而人們若能夠以開放的心態去了解 FLASH 這一門和學習如何好好應用 FLASH 來弄網站,這才能真正讓網頁開發的將來大放異彩。
海洋公園哈囉喂2010宣傳片製作特輯
這一趟實在是首次了解海洋公園哈囉喂是何方神聖。看過這個製作特輯,的確引起我有一份到海洋公園撞撞鬼的衝動。這麼一個哈囉喂,稍稍找找資料不難知道這是當年令海洋公園經歷財困之時起死回生的其中一項項目之一。這麼一轉眼經過十年的進化,由那時的簡單鬼屋谷夜場人氣,到近年愈玩愈出軌,引入鬼后鬼舞,挑戰公共廣播宣傳的尺度,為求越界愈盞鬼。海洋公園我真的佩服你!
Continue reading 海洋公園哈囉喂2010宣傳片製作特輯