Web | The Will Will Web

The Will Will Web

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

介紹好用工具:RWD Bookmarklet (測試行動版網站的利器)

前陣子在 Tech‧Days Taiwan 2012 演講【使用 HTML5 打造友善網頁】這個主題,課程中提到幾個不錯的 RWD (Responsive Web Design) 書籤工具,可以很方便的快速切換網頁裡可顯示的網頁範圍,以便測試你的網頁在不同視窗大小之下如何顯示。這幾套 RWD 書籤工具厲害的地方在於完全以 JavaScript 寫成並能跨瀏覽器執行,所以不管你用甚麼瀏覽器都可以使用,讓你不用安裝任何瀏覽器外掛或擴充功能就能使用。

... 繼續閱讀 ...

網站建置不是件簡單的事 @ 跨瀏覽器網頁設計密技 (3)

網站建置的過程中一定會不斷的打開瀏覽器測試,先測試完常用的瀏覽器,然後再測另一個瀏覽器,就這樣測試、修改、測試、修改的循環,說實在也挺累人的,無奈瀏覽器種類跟版本又是出奇的多,話說白了,網站建置根本不是「人」能做的工作,所以我們一定需要一些幫助我們測試網頁在各瀏覽器呈現的工具,本次文章主要會介紹幾款免費與付費的跨瀏覽器測試工具,幫助網頁設計人員完成繁複且困難的測試工作。

... 繼續閱讀 ...

網站建置不是件簡單的事 @ 跨瀏覽器網頁設計密技 (2)

設計跨瀏覽器網頁經常要在不同瀏覽器版本之間進行微調,調整的地方不一定只有 CSS 樣式,我們有時候會為了避開一些瀏覽器在特定版本下的 JavaScript 臭蟲,也會需要針對不同的瀏覽器版本撰寫不同的程式碼來因應,在這篇文章裡我會介紹各瀏覽器 CSS Hack 技巧以及 IE 條件式註解,幫助各位更輕易的設計出跨瀏覽器網頁。

... 繼續閱讀 ...

Windows 7 內建的〔微軟正黑體〕在顯示粗體文字時需注意

前幾天我們公司的合作伙伴 EZTABLE 在他們的部落格發佈了一篇〔來用手機訂位吧!〕文章,當介紹到我們公司開發的〔一筵為訂 EZTABLE〕WP7 芒果版 App 時,卻發現我們的「一筵為訂」名稱被拆成了兩段,從畫面上看來會直覺的認為他們在我們 App 名稱中間加上了個「全形空白」,但實際去檢查原始碼又沒有發現空白的存在,到我的噗浪發問才得知,原來是〔微軟正黑體〕在顯示 粗體 時會有特定文字會出現奇怪空白,這還是我第一次遇到這種事。

... 繼續閱讀 ...

個資保護、Google Hacking 與 robots.txt 的關係與設定技巧

我想大部分人都應該知道 robots.txt 檔案的功用 (如果不知道可參考我之前的文章),因為 robots.txt 是給網頁爬蟲機器人 (Web Crawler) 看的,搜尋引擎要來抓網站網頁進行索引前,都會「禮貌性」的先抓取 robots.txt 檔案回去分析,若特定 URL 真的允許抓網頁回去才會繼續下載網頁,不過看這個檔案的 人類就不一定這麼有禮貌,讓駭客知道了你「不想被抓的目錄」後,反而讓駭客產生興趣,進而企圖攻擊這些你不想被知道的網頁路徑,所以選擇不將這些路徑放到 robots.txt 定義檔裡,然而,這觀念是正確的嗎?No!!! 請繼續看下去…

... 繼續閱讀 ...

網站建置不是件簡單的事 @ 跨瀏覽器網頁設計密技 (1)

自從上次發表【網站建置不是件簡單的事 @ 打造網站的步驟】之後收到許多網友熱烈的迴響,因此萌生撰寫系列文章的想法,為了要延續【網站建置不是件簡單的事】系列,我想對設計師來說最痛苦的事莫過於跨瀏覽器網頁設計,我們通常在設計好網頁後,會進入「跨瀏覽器相容性測試」的步驟,這時幾乎 100% 都會遇到網頁相容性的問題,同一份網頁在不同瀏覽器裡顯示時多少都會有些差異,接下來的文章就是分享一些我們經常使用的跨瀏覽器網頁設計技巧,礙於篇幅考量,我會依據不同主題拆成多篇文章撰寫。

... 繼續閱讀 ...

ASP.NET 發現重大資安弱點影響範圍涵蓋 ASP.NET 1.1 ~ 4.0

幾天前從 ScottGu's Blog 得知了一個 ASP.NET 的重大資安弱點,微軟緊急的在最短時間內推出安全性更新,目前已正式發佈至 Windows Update 網站,各位 IT 人員隨時都能透過 Windows Update 套用這次的安全性重大更新,以確保 ASP.NET 網站能夠正常運作。由於這次的安全性更新被歸類為「重大」等級,所以各位還是盡可能早更新早安心,不要等出事了才反應喔!

... 繼續閱讀 ...

TechEd 中國 2011 微軟技術大會:ASP.NET MVC 3 性能優化

上週我獨身前往參加 Tech•Ed 2011 微软技术大会 擔任 ASP.NET MVC 3 性能優化 這門課的講師,從參與講師徵選到前往與會的過程都充滿著驚奇與震撼,總體來說實在不虛此行,且在這幾天裡也結交了不少新朋友,每個都是才華洋溢、百煉成鋼的「年輕人」,在中國這個大環境下還真培育出不少武林高手,也只有在這種會議裡才能一次見到那麼多高端的菁英份子,幸會、幸會。

... 繼續閱讀 ...

網站建置不是件簡單的事 @ 打造網站的步驟

在筆者這十多年的工作歲月中,大部分的時間都與網站建置這件事糾纏不清,最早期剛接觸網頁時還是用HE5 (漢書) 或 Notepad 開始撰寫 HTML 開發網站,偶爾回想起來感覺當時寫網頁好辛苦,都沒有設計工具或開發工具可用,不過若換個角度想,其實當時才是最幸福的,你想想今日的網頁設計即便有那麼多好用的工具支援,但設計網頁的過程中有變簡單嗎?有太多網頁設計相關的問題需要被克服,像是跨瀏覽器相容性的問題、互動網頁的挑戰、伺服器端的程式開發、針對海量網頁要求的架構、AJAX、JSON、HTML5、CSS3、…,有太多東西要學了。

... 繼續閱讀 ...

如何在Windows作業系統安裝 Node.js 執行環境 (WebMatrix)

昨天本來很想去參加HTML5與Node.js在台灣聯合技術小聚,礙於有要事在身無法參加實在可惜,最近剛好看到 Tomasz Janczuk 開發出 iisnode 專案,一整個超強的,可以用非常直覺的方式在 Windows 平台與 IIS 來管理 node.js 應用程式,還能用 WebMatrix 進一步整合開發環境,所以特別撰文告知 node.js 迷這個好消息。 :-)

... 繼續閱讀 ...

上傳檔案至 IIS 的檔案名稱有三個字元最好禁止使用: % # +

上個月有個客戶提到他們從後台上傳的檔案不知為何在前台就是看不到,我查看了一下發現檔名中有個加號 ( + ),但奇怪的是原本網站明明就是好的。後來我才想起來客戶最近主機升級了,從 Windows Server 2003 升級到 Windows Server 2008 R2,可能是因為這樣才導致這個問題發生,我研究了一會兒終於明白問題發生的原因,並不是 IIS7 有問題,而是變的更安全了,也因為這個問題讓我更加意識到在實做檔案上傳功能時應該注意到的事情!

... 繼續閱讀 ...

如何利用 IE 或 Firefox 查詢中文域名轉碼(Punycode)

我前陣子替我的部落格註冊了一個好記的中文域名 ( 保哥.台灣 ),如果各位有註冊過中文域名的話,應該會知道在設定 DNS 的時候必須要先將中文域名轉成 Punycode (中文域名轉碼微代碼) 才能到 DNS 伺服器進行設定,不過一般來說都要靠線上版的 Punycode 轉換器幫我們查詢出結果,若遇到網路安全性特別嚴謹的單位設定,有可能連對外的網頁都不能瀏覽,這狀況就非常適合用我今天要介紹的小技巧來查詢 Punycode 了!

... 繼續閱讀 ...

如何將 Windows Live SkyDrive 的網路空間掛載成網路磁碟

昨天登入到 SkyDrive 時突然發現整個網站的瀏覽速度大增,至少有比以前快了數十倍之多,實在不誇張,有在用的人可以登入上去體驗一下。除此之外,今天森哥又分享了另一個連結介紹如何將 Windows Live SkyDrive 的網路空間掛載成網路磁碟的方法,我覺得挺實用的,因此寫了篇文章來分享這個小技巧。

... 繼續閱讀 ...