CSS 網頁字型 @font-face 使用教學與範例

這裡介紹 CSS 的 @font-face 使用方式與範例,讓網頁設計者可以在網頁的字型使用上更有彈性。 @font-face 這個 CSS 的 at-rule 可以讓網頁設計者可以使用網路上的字型檔來顯示網頁中的文字,甚至還可以讓設計者使用自己所提供的字型檔,讓網頁的設計更具有彈性,在選擇字型時就可以不需要考慮一般的電腦是否有安裝,凡是放在網路上的任何字型檔都可以使用。而 @font-face 除了在 CSS 的頂層設定上使用之外,在任何 CSS 條件群組(conditional-group)at-rule 中也可以使用。 ...

December 31, 2013 · G. T. Wang

網路的延遲(Latency)與頻寬(Bandwidth)是什麼?

這裡介紹網路的延遲(Latency)與頻寬(Bandwidth)是什麼,以及它們對於我們的網路有什麼影響。 在過去幾年中,網路效能最佳化(web performance optimization,簡稱 WPO)這個產業快速成長,這個現象也顯示了網路速度對於使用者而言也越來越重要,如果一個網站可以提供比較快速的網路服務,除了改善使用者經驗之外,連同網站的流量與其附帶的效益也都會跟著增加。 ...

December 27, 2013 · G. T. Wang

HTML5 Please:提供各種 HTML5 與 CSS 語法在瀏覽器相容性問題上的使用建議

HTML5 Please 整理了各種新的 HTML5 與 CSS 語法在各種瀏覽器上的相容性狀況,並提供使用上的建議。 在開發網頁的應用程式時,開發者所撰寫的 HTML5 或 CSS 程式碼通常都要面對許多不同瀏覽器的相容性問題,而 HTML5 Please 是一個可以查詢各種 HTML5 與 CSS 的語法在各種瀏覽器中被支援的狀況,並且建議你是否應該使用,你可以依據哪一些瀏覽器支援哪一些語法來選擇要使用的語法。 ...

December 20, 2013 · G. T. Wang

Grunt:自動化網頁應用程式開發流程的 Node.js 工具

Grunt 是一個以 Node.js 為基礎所開發的命令列工具,在經過適當的設定之後,它可以幫助程式開發者將一些重複性的工作自動化,減輕開發者與開發團隊的負擔。 Grunt 可以處理的事情很多,例如精簡 CSS 程式或網頁的大小、編譯 CoffeeScript、unit test、linting 等,舉凡一般性的重複動作多半都可以使用這個工具來處理。 ...

December 19, 2013 · G. T. Wang

Flickr 現在可以讓你把照片內崁至網頁中了

Flickr 最近推出了內崁照片的功能,現在你可以直接把 Flickr 上的照片直接放進網頁中顯示了。 現在如果你想要在一般的網站或部落格中顯示 Flickr 的照片,可以使用 Flickr 最新的照片內崁功能,將產生的 HTML 程式碼複製起來再貼在網頁上,就可以直接顯示 Flickr 的照片了。 ...

December 19, 2013 · G. T. Wang