cob_js_switch

 
一段網站運行的網頁程式，總會出現很多種不同的情況，像人生一樣，但位處 JavaScript 的網站程式，就可以藉著JavaScript Switch來管理不同情況時如何去處理。
switch(選擇項) {
case x:
// 當身處情況x時，如何處理?
break;
case y:
// 當身處情況y時，如何處理?
break;
case z:
// 當身處情況z時，如何處理?
break;
default:
// 當身處默認情況時，如何處理?
}
JavaScript Switch 的運算程序是由上而下，當進入了switch選擇項後，會逐個情況(case)查看是否符合條件，若果符合就會運動該情況的指令，若不符合就會查看下一個情況，若所有情況皆不然，就會運行默認(default)的程式段。
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top
JavaScript If Else 運用技巧 @ compbrother 腦爸打

人生世上總會遇上多次如果所以的因果關係，在JavaScript的網站程式編程世界一樣，也有著If Else 如果所以的因果鏈。
If 常見的JavaScript格式 Syntax
if (條件比對) {
  //  條件為真時執行的代碼塊
}
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top
網站變更網址，如何不影響 Google SEO 的表現? @ compbrother 腦爸打

 
小知識教學類型: SEO搜尋引擎優化
不管是任何的原因，若果需要把網站的網址 (Domain) 變更，都不是一件值得鼓勵的事情，因為或多或少若處理不善都會大大影響到 Google / Yahoo / Bing 等SEO的表現，過往做的種種SEO功夫都可能白費了。 但若果真的非把網站變更網址不可，其實都有辦法把SEO的影響減到最低:
1) 把舊網站內容完整搬到新網站
- 第一步當然是把舊網站內容完整搬到新網站，「完整」的意思是把括 source code, data base, images, videos 及最好連網站架構也不變的情況完全一樣地搬到新網站裡。
2) 像過往小編教大家對待新網站的方法，新網站創建sitemap，並於各大搜尋引擎中的 webmaster admin 創健新網站資料，並把sitemap上戴
3) 然後非常關鍵的一步是，在各大搜尋引擎中的 webmaster admin中，使用「提交網址變更請求」，以完成３０１重新網址導向（轉址）。
Google: 登入網站管理員， 按網址變更，輸入轉址資料完成操作
Bing: 登入網站管理員， 按診斷與工具，再按網站移動，輸入轉址資料完成操作
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top
進階jQuery Mobile CSS Classes @ compbrother 腦爸打

前文，我們一齊了解過jQuery Mobile可以好像html的編程，使用慣常的CSS Classes來控制手機的UI界面排列和設計，今文我們更深入地去看看更多的jQuery Mobile CSS Classes:
Theme Classes:
ui-bar-(a-z) 指定bar的顏色 - 頁眉、頁腳和其他bar
ui-body-(a-z) 指定內容塊的顏色 - 頁面內容窗格、列表視圖項、彈出窗口、可折疊項、加載程序、滑塊和Panel
ui-btn-(a-z) 指定按鈕（和圖標）的顏色
ui-group-theme-(a-z) 指定控件組、列表視圖和可折疊集的顏色
ui-overlay-(a-z) 指定對話框、彈出窗口和其他頁面容器出現在其頂部的頁面的背景顏色
ui-page-theme-(a-z) 指定頁面的顏色
Grid Classes (有五個可以使用的佈局網格)
ui-grid-solo 1列 100% 列寬 ui-block-a
ui-grid-a 2列 50% / 50% 列寬 ui-block-a|b
ui-grid-b 3列 33% / 33% / 33% 列寬 ui-block-a|b|c
ui-grid-c 4列 25% / 25% / 25% / 25% 列寬 ui-block-a|b|c|d
ui-grid-d 5列 20% / 20% / 20% / 20% / 20% 列寬 ui-block-a|b|c|d|e
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top


小知識教學類型: 網頁設計、網站製作
網站程式中的內容，常見的如數字和字串，往往都可能會出現運算上邏輯性的比較，例如數值A是否大於數值B? 字串A是否等同於字串B? 這些運算的邏輯比較，提供了網頁設計員JavaScript的編程需要和彈性。
常見的邏輯運算比較:
== 等於
=== 相等的值和相等的類型
!= 不等於
!== 不等值或不等類型
> 大於
< 小於
>= 大於或等於
<= 小於或等於
以上的邏輯運算比較通常會用於conditional statements中，例如 JavaScript if，而conditional statements中的比較連貫，通常也包括:
&& 及
|| 或
! 非
好好配合JavaScript 運算的邏輯比較，就可以把網站程式中的數值和字串運算比較掌握好!
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top
SEO 不是 Google 的代名詞! @ compbrother 腦爸打

 
小知識教學類型: SEO搜尋引擎優化
當我們談到SEO很自然，今天第一個會想到的必定是Google，但其實拆解SEO來看， Searching Engine Optimization 搜尋引擎優化，指的是所有有著搜尋引擎的，只要嘗試去作出優化，也可理解為SEO。
搜尋引擎平台的SEO優化:
Google是世界搜尋引擎平台的一哥，當然要做好SEO必數Google，小編也在無數的SEO排名優化文章，集中說的也是Google。 但世界上其它的搜尋引擎平台也不能忽視，因為仍然生存到今天，也一定有著他的使用者，當中包括雅虎Yahoo、Bing和百度等等。
社交平台的SEO優化:
除了搜尋引擎平台，另一邊廂也十分多人使用及搜尋資訊的是社交平台，例如 Facebook 、Instagram 、Linkedin 、Pinterest 等等，當中的SEO優化概念每個平台也有其特別之處，例如 Instagram 的 Tag 就影響著很多人的搜尋習慣。
其它網站平台的SEO優化:
網站平台多有自己的站內的搜尋功能，而排名則受著眾多平台自身定義的條件所影響著，例如以 OpenRice 和 美髮網為例，如何增加餐廳或髮型屋在站中的搜尋排名? 例如好評數、瀏覽數等等都會是決定的條件。
因此，廣議上要做好SEO，可真不容易，而且要兼顧很多方面的考量，但都是一句老話兒 Content is King，把內容做好，自然在各大平台上你也會有著好的迴響!
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top
jQuery Mobile Navigation Bars 手機應用程式 清晰頁面關係配置 @ compbrother 腦爸打

 
小知識教學類型: 手機應用程式開發
手機應用程式Apps與網頁程式一樣，都有著頁面中有著頁面的架構，當一個頁面跳到另一個頁面，再由新頁面跳向再新一個頁面，或從後置頁面往前推返回前面等等，jQuery Mobile Navigation Bars 都可以提供到清晰頁面關係的配置。
jQuery Mobile Navigation Bars 通常放置於手機應用程式Apps的頂端Header或尾端Footer，一方面不會阻礙到用戶瀏覽頁面內容，另一方也可提供到清楚資訊讓用戶知道自己身處手機應用程式Apps的何方。
以頂端Header配置 jQuery Mobile Navigation Bars 作為範例:
在 data-role="header" 的div 內再加上 data-role="navbar" ，然後再使用常用的 ul 和 li 列點清單由上而下去列出 jQuery Mobile Navigation Bars 的頁面次序。
為更清晰和簡單易明 jQuery Mobile Navigation Bars 中的頁面次序和內容訊息，jQuery Mobile Navigation Bars 更提供了 data-icon 的選項，可讓 Navigation Bars 中的按鈕加上 icon，例如:
data-icon="home" (主頁)
data-icon="arrow-r" (向右箭咀)
data-icon="search" (搜尋)
jQuery Mobile Navigation Bars 亦提供了 data-iconpos 用作配置和排位 jQuery Mobile Navigation Bars 中的頁面按鈕排位，例如:
data-iconpos="top" 頂部圖標對齊
data-iconpos="right" 右圖標對齊
data-iconpos="bottom" 底部圖標對齊
data-iconpos="left" 左圖標對齊
而在jQuery Mobile Navigation Bars 中的頁面按鈕一連串的排列中，用戶究竟如何知道自己身處那個頁面中，這時相關的頁面按鈕配置上 class="ui-btn-active" 就清楚得多了！
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top
js_booleans

 
小知識教學類型: 網頁設計、網站製作
人類世界的對錯是一個十分複雜的課題，當中可以涉及倫理道德亦可以涉及世界各地不同的行為規範，或有些地方更是位處中間的灰色地帶，總而言之，人類實體世界的對錯並沒有劃一的標準線。但對於網頁程式世界的對錯，則簡單得多了，對錯完完全全視乎於數理邏輯的推論!
Boolean(): 返回對(TRUE) 或錯 (FALSE), 例如 Boolean(3 > 1) 會返回 對(TRUE)，而 Boolean(1 > 6) 則會返回 錯 (FALSE)
關於條件性(Conditions)的比較(Comparisons)可分為以下常用的三類:
== 等於
> 大於
< 少於
在 JavaScript網頁程式的世界中，所有事物只要有著值(Value)都是對(TRUE)，而相反沒有值(Value)都是錯 (FALSE)，例如0, -0, 沒有值的字串(empty string)等等
因著而要，有些網頁程式員會把 JavaScript Booleans 當成是 Object去使用但切記數點:
- JavaScript Booleans Object 無需去 new 去創建
- JavaScript Booleans Object 之間的比較永遠返回 錯 (FALSE)
網頁程式世界的運算對錯十分重要，可連貫程式運算的邏輯及可減少程式網寫時的bug !
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top
如何減低網頁跳出率(Bounce Rate)，從而提升網站SEO? @ compbrother 腦爸打

 
小知識教學類型: SEO搜尋引擎優化
網頁跳出率(Bounce Rate)素來都被視為影響著網站SEO的關鍵指標之一，那究竟什麼是跳出率(Bounce Rate)? 又如何去減低跳出率(Bounce Rate)從而提升網站 Google SEO 排名?
什麼是網頁跳出率(Bounce Rate)?
跳出率(Bounce Rate) = 用戶到達網站頁面 (Landing Page)後沒有作出任何活動總人數 / 進入網站頁面 (Landing Page)的總人數
怎樣算是用戶到達網站頁面 (Landing Page)後沒有作出任何活動?
- 到達網站頁面 (Landing Page)後，立即關閉browser沒有再作瀏覽
- 到達網站頁面 (Landing Page)後，按browser back按鈕返回上一頁
- 到達網站頁面 (Landing Page)後，立即按超連結外連新視窗進入其它網站
- etc等等
如何減低網頁跳出率(Bounce Rate)?
- 到達網站頁面 (Landing Page)留到訪客，大前提當然是網站頁面 (Landing Page)內容文字/圖片/影片等內容content夠吸引，自自然然大眾來到你的網站也不願意離開，很想繼續瀏覽
- 連接外連時，採用開新視窗選項 (target blank)
- 連接內連時，避免採用開新視窗選項 (target blank)，應選用同一視窗的操作
- 當用戶閑置時間過長時，可以使用例如popup message的方法增加與用戶的互動，減低閒置時間和比率
- etc等等
網頁跳出率(Bounce Rate)雖然是SEO界是常出現的老朋友，但要做得好從而提升網站 Google / Yahoo / Bing SEO 排名並不是想像中的容易，希望「腦爸打」以上的一些小精華SEO簡介教學能幫助到各位!
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top
妙用 jQuery Mobile Toolbars 設計及製作手機應用程式 @ compbrother 腦爸打

 
小知識教學類型: 手機應用程式開發
手機應用程式Apps 並不像網站程式有著足夠大的空間，在有限的手機界面中如何有效地整理及展示資訊，是每位手機應用程式開發者必需要處理的課題，而jQuery Mobile Toolbars則提供了這方面的方便性。
Header Bars
- 手機程式頂端的Toolbars，通常位處logo旁，可以分為左上或右上的工具列，例如:
data-role="header", class="ui-btn ui-icon-home ui-btn-icon-left" 用以創建左上角的 Mobile Header Toolbars 按鈕
data-role="header", class="ui-btn ui-btn-right ui-icon-home ui-btn-icon-left" 用以創建右上角的 Mobile Header Toolbars 按鈕
Footer Bars
- 手機程式底端的Toolbars，通常位處底部中間的工具列，例如:
data-role="footer", class="ui-btn ui-icon-plus ui-btn-icon-left"
而 Header Bars 或 Footer Bars 皆可以重新被Positioning:
- Inline - 默認選項，頁頂和頁腳與頁面內容內聯
- Fixed - 頁頂和頁腳將保持在頁面的頂部和底部
- Fullscreen - 表現得像固定的，頁頂和頁腳將保持在頂部和底部，但也位於頁面內容之上，也有點透視感
手機應用程式開發員只要好好善用jQuery Mobile Toolbars，就可以在有限的手機界面上有條理地展示上資料，對手機UI有著莫大的幫助!
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top


小知識教學類型: 網頁設計、網站製作
人的生活當中，即使有著因果的種種連鎖關係，但人的一生及世事萬物都有著其隨機性。網站製作上的網頁程式，其實也可模擬現實世界的隨機性，JavaScript Random就是當中的好選擇!
Math.random();
返回 0（包括）和 1（不包括）之間的隨機數：
Math.floor();
可用於返回隨機整數
實際例子:
Math.floor(Math.random() * 10); 返回一個從 0 到 9 的隨機整數：
Math.floor(Math.random() * 11);
返回一個從 0 到 10 的隨機整數：
(Math.floor(Math.random() * 10) + 1; 可達到同樣的效果)
Math.floor(Math.random() * 100);
返回一個從 0 到 99 的隨機整數：
Math.floor(Math.random() * 1000);
返回一個從 0 到 999 的隨機整數：
網頁程式編寫員可以自身藉著創建JavaScript 的 Function 來活用 JavaScript Random，例如，這個 JavaScript 函數總是返回一個介於 min（包括）和 max（排除）之間的隨機數：
function getRandomInteger(min, max) { return Math.floor(Math.random() * (max - min) ) + min; }
善用好網頁程式的隨機編程，可以讓程式運算更活像真實世界，及有助於運算時提供需要的公平性機會率。
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top
妙用 Canonical Link 可有助提升 SEO 搜尋排名 @ compbrother 腦爸打

 
小知識教學類型: SEO搜尋引擎優化
網站包含著很多不同的頁面，但一個頁面又會常可以以不同的連結網址呈現，例如 http://www.abc.com, http://abc.com , http://www.abc.com/index.html 明明是三個網址連結，但都是指向著同一個網址頁面內容。對於 google yahoo 等搜尋引擎會視為重覆性的內容，若要google yahoo 等搜尋引擎把這些重覆的內容索引index，會對SEO搜尋排名結果有著明顯的負面影響!
這個時候，我們可以 head 標記中善用Canonical Link，把指定網頁連結統一指定到某一連結網址，例如:
http://www.abc.com
http://abc.com
http://www.abc.com/index.html
以上這三個連結可以指向至統一的連結網址 http://www.abc.com/index.html
link rel="canonical" href="http://www.abc.com/index.html"
Canonical Link 的正確設定，除了可有助提升 SEO 搜尋排名，亦可有助於網站內容被鏡像(Scrape)的可能性，增加網站系統程的安全性。
(繼續閱讀...)

腦爸打 發表在 痞客邦 留言(0) 人氣()

  • 個人分類：
▲top
1 2 3 4 5
Blog Stats
⚠️

成人內容提醒

本部落格內容僅限年滿十八歲者瀏覽。
若您未滿十八歲，請立即離開。

已滿十八歲者，亦請勿將內容提供給未成年人士。