The Will Will Web

記載著 Will 在網路世界的學習心得與技術分享

善用 CSS 中的 table-layout 屬性加快 Table 的顯示速度

在很久以前我們都是用 Table 在排版的,我相信現在還是有不少人還是在用 Table 進行排版而非現在較為流行的 CSS 排版,使用 Table 排版最大的好處就是版面在各瀏覽器中顯示比較不會亂掉。但最大的缺點就是版面調整不像 CSS layout 那麼方便,而且網頁出現的時間比較長,版面的問題應該無解,但表格顯示的速度卻可以利用 table-layout 屬性的設定達到目標。

... 繼續閱讀 ...

使用 CSS Sprites 設計網頁但不用 background-image 的技巧

使用 CSS Sprites 技巧可以有效減少 HTTP Request 的數量並且加速網頁載入與顯示的速度。簡單的來說,CSS Sprites 就是將頁面中會用到的背景圖檔全部集中放在一個圖片檔中,並利用 CSS 的 background-image 與 background-position 屬性將欲顯示的背景圖部分露出,對瀏覽器來說,如果整頁的背景圖原本有 30 張就會有 30 個 HTTP Request,但全部合在一張圖片後就只需要一個 HTTP Request 而已,還可以透過 HTTP Cache 技巧將圖片快取在瀏覽器中。

... 繼續閱讀 ...

手邊有一張速查表(Cheat Sheets)是件很方便的事

我個人有習慣收集一些網路上別人整理的速查表,因為程式開發的細節真的太多了,要能全部背起來不太可能,也沒什麼意義,甚至於有人說程式設計就是一件查詢、複製、貼上的工作而已。對我來說,寫程式首重觀念與經驗,有了完整而正確的觀念,就算記不得要怎麼寫,查詢一下就馬上能寫了;而有了經驗,對於一些難解的 Bug 自然能夠迅速解開。

... 繼續閱讀 ...

電子報的版型越來越難設計了

由於我們公司有提供電子報發送平台的服務,目前也有不少客戶利用我們的平台發送與管理電子報,有些客戶僅僅發送 E-DM 都是提供整張圖片發送出去,所以比較沒有版型壞掉的問題,但有些客戶發的是有許多內容的電子報,這樣的電子報若是經過網頁設計師精心設計過的話,恐怕是會失望大過於成就感的。

... 繼續閱讀 ...

分享 30 多種動態的頁籤(Tab)介面與 Accordion 相關程式

我想大家都知道何謂頁籤(Tab)頁面,不過你知道網路上大家都怎麼使用頁籤嗎?最近看到一則 30+ Animated Tab-Based Interface and Accordion Scripts 文章,裡面介紹了 30 多種頁籤介面,每一個頁籤介面都有原始碼可以下載,也都有提供預覽(Preview)頁面可供線上測試,多看看別人的創意,自己也會想出不少新點子。

... 繼續閱讀 ...

介紹好用工具:Firebug ( Web 開發人員必備的工具 )

Firebug 應該是所有開發人員必備的工具了,這是一個 Firefox 的外掛程式,它提供一大堆跟 Web 開發相關的工具,可以幫助你編輯、修改網頁的 DOM 物件,對 JavaScript 除錯,可以查看任何一個元素的 CSS, HTML 設定,還可以分析網頁下載的效能,甚至於還可以自己寫程式擴充 Firebug 的功能,功能多到很難一下學會所有功能。

... 繼續閱讀 ...

撰寫跑馬燈/廣告輪播的好工具:jQuery Cycle Plugin

jQuery 是我最常用的 JavaScript Library,而且外掛程式超多,有空的人是可以多上去看看有什麼新玩意,保證有許多驚喜!我大約是在一年前得知有 jQuery Cycle Plugin 這個 jQuery 外掛套件吧,當時為了找一個可以「跨瀏覽器」的廣告輪播套件找了好久,也試用了好幾套,不過大部分廣告輪播或跑馬燈的 JavaScript Library 都不盡理想,最後才選擇用 jQuery Cycle Plugin 來做為跑馬燈/廣告輪播的撰寫工具。

... 繼續閱讀 ...

修正 IE 5.5 / 6 不支援 PNG 圖片透明背景的問題

IE 5.5 / 6 只要遇到有使用「透明背景」設定的 PNG 圖片,就會發生問題,原本應該要透明的部分都會變成灰色的,而這個小瑕疵一直到 IE 7 才做出修正,不過現在還有很多人還在使用 IE 6 瀏覽器,像我 Blog 的訪客當中,就還有 49.5 % 的使用者是使用 IE 6 的版本,是所有瀏覽器中所佔的百分比最多的。

... 繼續閱讀 ...