【家庭】無線網路分享器 - 設定注意事項 ( ZyXEL NBG4104 & EDiMAX BR-6478n )

中華電信附的無線分享器，居然是要外接一台，好遜。

型號是 ZyXEL NBG4104，

來記錄一下設定的部份吧。

【系統】jpegtran : 將 JPEG 做最佳化 - 壓縮

在 Chrome 中的 PageSpeed 中，可以看到網頁需要改善的地方。
之前有看到裡面有一個 Optimize images 的建議。
覺的這個還不錯，因為會減少圖片不小的 Size。

【系統】Lighttpd : SSL

如果是要自已產生認證的話，就是

【WEB】影片 Share 到 FB 時，不能直接播放

像 Youtube 的影片，分享到FB後，點擊後，可以直接在FB上播放。

但最近發現自從我的 FB 啟用了 Secure Browsing 後。

原本 Xuite Vlog 的影片可以直接播放，但現在卻不能了。

後來發現，原來是要在程式中加上 og:video:secure_url

【程式】PHP : debug_backtrace - Generates a backtrace

最近看到error log，有一些錯誤，是參數傳到空的…
但又不知道是那裡傳進來的…
所以就要想辦法來trace，到底是誰Call 了 X function.
一直以為只有 php 5.3.0 以上才會有這個功能。
ex : get_called_class
但Google後，才知道，早就有這種類似的功能了。

【系統】Webgrind : Xdebug Profiling Web Frontend in PHP

最近改了個東西，想要看一下效能有沒有變好，
但覺得有時還蠻慢的，所以就想用一下 Xdebug 來看一下問題在那裡。
但之前是用 KCachegrind 這套軟體來看結果，可是他要在 Linux 下，
見： 【系統】Profiling PHP with Xdebug & KCachegrind
但我現在改用 Mac了，所以就要用別的方式來看Xdebug的結果啦。
所以看到這套 Webgrind，是 php 的版本。
所以只要放到網站上就可以看了。

【網頁】SEO : 提交 Sitemap 到 Google & Bing

產生完Sitemap，接著就是要提交到 Google 或是 Bing 啦。
他們都有各自的Webmaster 頁可以去管理你的網站。
從那裡就可以提交了。
Google : http://www.google.com.tw/webmasters/
Bing : http://www.bing.com/toolbox/webmaster
照他們的方式做完驗證後，就可以使用啦。
Bing 我覺的好慢…有點鳥…不過還是得用一下。

【網頁】SEO : Microdata

又是一個新的東西…For SEO...
網頁光塞這堆東西都落落長了…
不過這個聽說 Bing, Google, Yahoo 都會吃哩。
好吧，那就只好跟著用啦。
影音的部份就看： http://schema.org/VideoObject
其它類型的就再到 http://schema.org 去找找看吧。

【網頁】SEO : Canonical Tag

Canonical 這個 Tag 真的是很好用的一個東西。
如果網址
http://www.web.com/a.php
跟
http://www.web.com/b.php
都是連到
http://www.web.com/index.php
那你就在網頁的<head>....</head>中，塞入這個Canonical  Tag 如下：
<link rel="canonical" href="http://www.web.com/index.php" />
這樣子，Google 在 Parsing 時，就會將網址 http://www.web.com/index.php 當成主要的網頁。

【網站】Blogger : LinkWithin - 縮圖顯示相關文章

LinkWithin的相關文章做的很棒，而且在Blogger中安裝真的超容易的啦。
你先到 LinkWithin 的網站，然後在下圖中的表格中填入你的資訊。
接著按 Get Widget! 就會到 Install Widget on Blogger 的畫面了。

【Web】Open Graph Protocol

The Open Graph Protocol enables you to integrate your Web pages into the social graph. It is currently designed for Web pages representing profiles of real-world things — things like movies, sports teams, celebrities, and restaurants. Including Open Graph tags on your Web page, makes your page equivalent to a Facebook Page. This means when a user clicks a Like button on your page, a connection is made between your page and the user. Your page will appear in the "Likes and Interests" section of the user's profile, and you have the ability to publish updates to the user. Your page will show up in the same places that Facebook pages show up around the site (e.g. search), and you can target ads to people who like your content. The structured data you provide via the Open Graph Protocol defines how your page will be represented on Facebook.

【Web】oEmbed

最近發現有些網站的內容多了oEmbed這個東西。
就問了一下Google。
結果發現是個很不錯的東西耶。
就個人的初步瞭解，就是你可以將你網頁中想第三方網網站使用的各種資源，
像是Video or Photos等元件，清楚的制定在oEmbed中，
這樣第三方網站要使用時，就可以直接取用，而不用去Parsing 整個網頁。

【Web】Gmail : CSS 沒用!!

因為習慣性都會把 CSS 利用 Class 的方式來套用。
以減少程式碼，又方便維護。
但這個方式，會讓你包含Html 的信件在Gmail上，看不到你套用的CSS。

【廣告】CNN : News U Can't Ignore

這系列的照片，拍的真有梗，最後一張還挺好笑的~~

From : KEN ANDERSON

【好站】Free CSS Templates

freeCSStemplates.org 這個網站很棒喔，上面有很多不錯的 CSS Template。

而且又是免費的，商業用途也OK。

之後想要換換版型，就可以來這裡挑樣式了~~棒!!

 

 

About FreeCSSTemplates.org

First of all, welcome to my site :) Here you'll find a number of free CSS templates I've created, all of which are:

• Released for FREE under the Creative Commons Attribution license
• Very lightweight (ie. minimal use of images) and fast loading
• Tables-free (ie. no tables used for layout purposes)
• W3C standards compliant and valid (XHTML Strict)
• Provided with public domain photos, generously provided by PDPhoto.org and Wikimedia Commons

All of my templates are free for any personal or commercial use (provided you follow the license) so you do not have to pay me anything to use them. All I ask is that you link back to my website (see the license for more details). I update my site with new templates regularly so check back for even more free CSS templates. Have fun :)

【Xuite】只要打 blog.xuite.net / UID 就可以自動導到個人日誌頁 !!

之前要到我的日誌都要打好長~~

如下：

blog.xuite.net/chingwei/blog

現在只要打

blog.xuite.net/chingwei

就可以自動導到我的Blog了，真棒。

不過如果有二本以上的日誌的話，還是會導到日誌列表頁，如下圖：

這頁真的有點醜……看了有點難過，能跳過這頁真是太好了~~

 

這是我之前提給 Xuite 的建議~~~~真的做出來了耶~~

Xuite 就肛心~~

 

PS. 因為有點久沒發文了~~貼個東西~~証明我還存在~~哈~~

【誌】Xuite 後台更新了!!

剛突然進到後台，發現Xuite後台整個畫面都變了耶~~

感覺好看很多耶~~

希望能愈來愈好用~~

【網】I Need to Read This : 快速保存沒空閱讀的文章

I Need to Read This，這個網站的名稱再明顯不過了。

就是可以幫你把想讀，但又沒時間讀的文章先記下來，之後有空的時候再慢慢讀。

平常我都是先加到Browser的Bookmarks中~但~~通常是不會再打開來看了。

而且時間一久BookMarks就超亂的。

現在這個網站可以輕易的做到這件事。

首先先註冊，要輸入帳號密碼還有E-mail，但他不會寄mail認証，
如果不想E-mail外洩，就亂輸入吧。

接著就用你剛輸入的帳號密碼登入！

登入後，點擊上方的bookmarklets，就會進到上面這個頁面，
把頁面中的【I Need to Read This】托曳到Browser上方的Bookmarks工具列中。
之後只要看到不錯的文章，沒時間看的話，只要點Bookmarks上面的I Need to Read This，
他就會幫你記起來，之後你再到網站登入後，就可以看到待閱讀的文章有那些了。

 

上面就是我待閱讀的文章，看完的文章就會消失了，但還是可以點擊【show old articles too】
顯示之前的文章。

點選上方的【settings】會進入上方圖片所顯示的頁面，你可以勾選要不要將你的 To Read List，
發佈成RSS。

發佈後的結果如上。

PS.如果網站是中文，但確是Big-5，訂閱的文字會變成亂碼~~還好Xuite是Utf-8，棒~

END~

【Ｆ】Page Speed : 網頁效能調校

Google 的一套網頁效能評估的Firefox 附加元件：【Page Speed】

安裝方式，一樣是要先裝Firefox + Firebug + Page Speed。

他也有附上教學【Using Page Speed】還有【Web Performance Best Practices】

附上幾張我的截圖，裝完後，一樣按F12，就會出現Firebug，之後你會發現多了二個Tag：

1.Page Speed 2.Page Speed Activity

 

1.Page Speed

點擊Page Speed 裡的Analyze Performance，他就會分析你的網頁，

這裡我們一樣是使用Xuite.net來測式。

有黃色三角型表示，你還有進步的空間，打勾算是合格，游標移到圖示上，

會出現這個項目的分數。但不像YSlow會有全部總合的分數。

點擊+，就會出現詳細資料，點擊文字列，則會連結至此項的說明及教你該如何達成這個項目。

點到Page Speed的時候，上面除了Analyze Performance，還會有Show Resources。

點擊後，就會顯示你這頁的所有元件。

2.Page Speed Activity

按下畫面中的Record Activity，然後Reoad頁面後，上面的

Show Uncalled Functions 及 Show Delayable Functions，

就會變成可以點擊的狀態。

Show Uncalled Functions

Show Delayable Functions

這裡只是簡單的介紹一下，更深入的研究就靠自己吧。

 

END~

 

 

【Ｆ】YSlow : 網頁效能調校

YSlow 是 Yahoo 出的一套 Firefox 附加元件。

可以拿來檢視網站效能，然後他會給你相對的指示，

你可以依照他的指示，去將你的網站優化。

是一個很不錯的東西，之前就有在用，還真的蠻有幫助的。

有興趣的可以到 【Firefox 附加元件-YSlow】來下載。

記得除了要先裝Firefox外~(就算不用YSlow，還是要裝，因為Firefox很好用~)

還要再裝Firebug喔。這樣才可以執行。

而且最近YSlow跟我之前用的長的不太一樣了，有改版了~~

變的更漂亮了，而且功能也變多了。

這裡是 Yahoo YSlow 的官方網站【Yahoo! YSlow for Firebug】

因為是使用Xuite來寫Blog。

所以下面就利用YSlow 來對 Xuite.net 的首頁來做個效能評估吧。

裝完 Firefox + Firebug + YSlow 後，一樣按F12來啟動Firebug。

裡面會看到多一個YSlow的Tab如下圖：點了YSlow的Tab後，會看到下方有四個選項

1.Grade 2.Components 3.Statistics 4.Tools

 

接下來的圖，點擊後可以放大。

1.Grade，我們看到Xuite首頁的成積是58分，應該是裡面的雜七雜八的東西太多，用IFrame從很多不同的網站抓資料，然後一些CSS跟JS沒有用GZip，Expire Header有些也沒加，大概是因為首頁，所以從很多別的網站抓資料，而那些網站沒有好好加上這些東西，真是有點可惜。分數整個被拉下來了~~

 

2.Components，可以看到網站裡面有多少元件，還幫你分類好，點擊後就可以展開看詳細資料~挺清楚明白的。

 

3.Staticstics，顯示沒Cache跟有Cache時的統計資訊。

 

4.Tools，一些工具，挺不錯用的，像All JS Minified，就可以顯示所有的JS Code，並且把註解跟空白都幫你去掉。

 

另外，他的Rulesets旁有一個Edit，點擊後，你可以點選你所要套用的規則。真是有彈性。棒~~

 

仔細的研究，就可以學到更多好用的東西。而且還可以加強觀念，是個很棒的東西。

 

END~