隨著Web應用越來越廣泛，Web安全威脅日益凸顯。黑客利用網站操作系統的漏洞和Web服務程序的SQL注入漏洞等得到Web服務器的控制權限，輕則篡改網頁內容，重則竊取重要內部數據，更為嚴重的則是在網頁中植入惡意代碼，使得網站訪問者受到侵害。這也使得越來越多的用戶關注應用層的安全問題，對Web應用安全的關注度也逐漸升溫。下面向大家推薦8款非常有用的免費 Web安全測試工具。

N-Stalker Free Version

N-Stalker Web 應用程序安全2012免費版本能夠為您的Web 應用程序清除該環境中大量常見的漏洞，包括跨站腳本（XSS）、SQL 注入（SQL injection）、緩存溢出（Buffer Overflow）、參數篡改（Parameter Tampering）等等。

Netsparker Community Edition

Netsparker Community Edition 是一款SQL 注入掃描工具，是Netsparker的社區免費版本，提供了基本的漏洞檢測功能。使用友好，靈活。

Websecurify

Websecurify 是一款開源的跨平台網站安全檢查工具，能夠幫助你精確的檢測Web 應用程序安全問題。

Exploit-Me

Exploit-Me 是一套Firefox 的Web 應用程序安全測試工具，輕量，易於使用。

OWASP WebScarab Project

WebScarab 一個用來分析使用HTTP和HTTPS協議的應用程序框架，通過記錄它檢測到的會話內容（請求和應答）來幫助安全專家發現潛在的程序漏洞。

X5s

x5s 是一款Fiddler 插件，用於輔助滲透測試人員發現跨站點腳本（XSS）漏洞。

IE 選擇器Hack

1
2
3
/* IE 6 and below */
* html .selector {}
.suckyie 6 .selector {} /* .suckyie6 can be any unused class */
1
2
/* IE 7 and below */
.selector, {}
1
2
3
4
/* IE 7 */
*:first-child+html .selector {}
.selector, x:-IE 7 {}
*+html .selector {}
/* Everything but IE 6 */
html > body .selector {}
1
2
3
/* Everything but IE 6/7 */
html > /**/ body .selector {}
head ~ /* */ body .selector {}
1
2
3
4
5
/* Everything but IE 6/7/8 */
:root *> .selector {}
body:last-child .selector {}
body:nth-of-type( 1 ) .selector {}
body:first-of-type .selector {}
IE 屬性/值Hack

1
2
3
/* IE 6 */
.selector { _color : blue ; }
.selector { - color : blue ; }
1
2
3
/* IE 6/7 - acts as an !important */
.selector { color : blue !ie; }
/* string after ! can be anything */
1
2
3
4
5
6
7
/* IE 6/7 - any combination of these characters:
! $ & * ( ) = % + @ , . / ` [ ] # ~ ? : < > | */
.selector { ! color : blue ; }
.selector { $ color : blue ; }
.selector { & color : blue ; }
.selector { * color : blue ; }
/* ... */
1
2
3
/* IE 8/9 */
.selector { color : blue \ 0 /; }
/* must go at the END of all rules */
1
2
/* IE 9/10 */
.selector:nth-of-type( 1 n) { color : blue \ 9 ; }
1
2
3
/* IE 6/7/8/9/10 */
.selector { color : blue \ 9 ; }
.selector { color /*\**/ : blue \ 9 ; }
1
2
/* Everything but IE 6 */
.selector { color /**/ : blue ; }
IE Media Query Hack

1
2
/* IE 6/7 */
@media screen \ 9 {}
1
2
/* IE 8 */
@media \ 0 screen {}
1
2
/* IE 9/10, Firefox 3.5+, Opera */
@media screen and (min-resolution: + 72 dpi) {}
1
2
/* IE 10+ */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none ) {}
1
2
/* IE 6/7/8 */
@media \ 0 screen\, screen \ 9 {}
1
2
/* IE 8/9/10 & Opera */
@media screen \ 0 {}
1
2
/* IE 9/10 */
@media screen and ( min-width : 0 \ 0 ) {}
1
2
/* Everything but IE 6/7/8 */
@media screen and ( min-width : 400px ) {}
IE JavaScript Hack

1
2
3
/* IE 6 */
(checkIE = document.createElement( "b" )).innerHTML = "<!--[if IE 6]><i></i><![endif]-->" ;
var isIE = checkIE.getElementsByTagName( "i" ).length == 1;
1
2
3
4
/* IE 7 */
(checkIE = document.createElement( "b" )).innerHTML = "<!--[if IE 7]><i></i><![endif]-->" ;
var isIE = checkIE.getElementsByTagName( "i" ).length == 1;
navigator.appVersion.indexOf( "MSIE 7." )!=-1
1
2
/* IE <= 8 */
var isIE = '\v' == 'v' ;
1
2
3
/* IE 8 */
(checkIE = document.createElement( "b" )).innerHTML = "<!--[if IE 8]><i></i><![endif]-->" ;
var isIE = checkIE.getElementsByTagName( "i" ).length == 1;
1
2
3
/* IE 9 */
(checkIE = document.createElement( "b" )).innerHTML = "<!--[if IE 9]><i></i><![endif]-->" ;
var isIE = checkIE.getElementsByTagName( "i" ).length == 1;
1
2
/* IE 10 */
var isIE = eval( "/*@cc_on!@*/false" ) && document.documentMode === 10;
1
2
/* IE 10 */
var isIE = document.body.style.msTouchAction != undefined;
Firefox 瀏覽器

　　選擇器Hack
1
2
/* Firefox 1.5 */
body:empty .selector {}
1
2
/* Firefox 2+ */
.selector, x:-moz-any-link {}
1
2
/* Firefox 3+ */
.selector, x:-moz-any-link; x: default {}
1
2
/* Firefox 3.5+ */
body:not(:-moz-handler-blocked) .selector {}

　　媒體查詢Hack
1
2
/* Firefox 3.5+, IE 9/10, Opera */
@media screen and (min-resolution: + 72 dpi) {}
1
2
/* Firefox 3.6+ */
@media screen and (-moz-images-in-menus: 0 ) {}
1
2
/* Firefox 4+ */
@media screen and (min--moz-device-pixel-ratio: 0 ) {}

　　JavaScript Hack
1
2
/* Firefox */
var isFF = !!navigator.userAgent.match(/firefox/i);
1
2
/* Firefox 2 - 13 */
var isFF = Boolean(window.globalStorage);
1
2
/* Firefox 2/3 */
var isFF = /a/[-1]== 'a' ;
1
2
/* Firefox 3 */
var isFF = ( function x(){})[-5]== 'x' ;
Chrome 瀏覽器

　　選擇器Hack
1
2
/* Chrome 24- and Safari 5- */
::made-up-pseudo-element, .selector {}
　　

　　媒體查詢Hack
1
2
/* Chrome, Safari 3+ */
@media screen and (-webkit-min-device-pixel-ratio: 0 ) {}
　　

　　JavaScript Hack
1
2
/* Chrome */
var isChrome = Boolean(window.chrome);
　　

Safari 瀏覽器

　　選擇器Hack
1
2
3
/* Safari 2/3 */
html[xmlns*= "" ] body:last-child .selector {}
html[xmlns*= "" ]:root .selector {}
1
2
/* Safari 2/3.1, Opera 9.25 */
*|html[xmlns*= "" ] .selector {}
1
2
/* Safari 5- and Chrome 24- */
::made-up-pseudo-element, .selector {}
　　

　　媒體查詢Hack
1
2
/* Safari 3+, Chrome */
@media screen and (-webkit-min-device-pixel-ratio: 0 ) {}
　　

　　JavaScript Hack
1
2
/* Safari */
var isSafari = /a/.__proto__== '//' ;
　　

Opera 瀏覽器

　　選擇器Hack
1
2
/* Opera 9.25, Safari 2/3.1 */
*|html[xmlns*= "" ] .selector {}
1
2
/* Opera 9.27 and below, Safari 2 */
html:first-child .selector {}
1
2
/* Opera 9.5+ */
noindex:-o-prefocus, .selector {}
　　

　　媒體查詢Hack
1
2
/* Opera 7 */
@media all and ( min-width : 0px ){}
1
2
/* Opera 12- */
@media all and (-webkit-min-device-pixel-ratio: 10000 ), not all and (-webkit-min-device-pixel-ratio: 0 ) {}
1
2
/* Opera, Firefox 3.5+, IE 9/10 */
@media screen and (min-resolution: + 72 dpi) {}
1
2
/* Opera, IE 8/9/10 */
@media screen {}
　　

　　JavaScript Hack
1
2
/* Opera 9.64- */
var isOpera = /^ function \(/.test([].sort);
1
2
/* Opera 12- */
var isOpera = Boolean(window.opera);

各種程式開發手冊大全，各種名詞解釋及定義用法等等

線上有的程式包含以下

Python
jQuery
NodeJS
PHP
Java
Ruby
Javascript
ActionScript
CSS

http://overapi.com/

Here is a 100px × 100px div with a 30px border:

height: 100px;
width: 100px;
border: 30px solid #999;

Watch what happens when each border has a different colour:

height: 100px;
width: 100px;
border-top: 30px solid #C66;
border-bottom: 30px solid #6C6;
border-left: 30px solid #66C;
border-right: 30px solid #CC6;

Now if we drop the setting of height and explicitly set the width of the div to be 0, we get the following:

width: 0;
border-top: 30px solid #C66;
border-bottom: 30px solid #6C6;
border-left: 30px solid #66C;
border-right: 30px solid #CC6;

Drop the top border and make the left and right borders transparent and you get this:

width: 0;
border-bottom: 30px solid #6C6;
border-left: 30px solid transparent;
border-right: 30px solid transparent;

The side borders don’t have to be the same size as the bottom border. Here’s 30px bottom with 52px sides:

width: 0;
border-bottom: 30px solid #6C6;
border-left: 52px solid transparent;
border-right: 52px solid transparent;

And here’s a div with a top border instead of a bottom border:

width: 0;
border-top: 30px solid #6C6;
border-left: 52px solid transparent;
border-right: 52px solid transparent;

Put a 104px × 60px div with a background colour between them and you get:

width: 0;
border-bottom: 30px solid #6C6;
border-left: 52px solid transparent;
border-right: 52px solid transparent;

width: 104px;
height: 60px;
background-color: #6C6;

width: 0;
border-top: 30px solid #6C6;
border-left: 52px solid transparent;
border-right: 52px solid transparent;

And that’s how we get a hexagon in CSS. The 30:52 ratio in the border widths is approximately 1:√3 which is ratio required for a hexagon.

A similar approach can be used to get a hexagon rotated 30°. We just flip around some of the directions, use float: left and drop the explict setting of width to 0.

float: left;
border-right: 30px solid #6C6;
border-top: 52px solid transparent;
border-bottom: 52px solid transparent;

float: left;
width: 60px;
height: 104px;
background-color: #6C6;

float: left;
border-left: 30px solid #6C6;
border-top: 52px solid transparent;
border-bottom: 52px solid transparent;

Both orientations of hexagons can easily be tiled. The first orientation involves a margin-bottom of -26px and margin-left of 3pxon each hexagon and a margin-left of 53px on even rows:

.hex {
    float: left;
    margin-left: 3px;
    margin-bottom: -26px;
}
.hex .top {
    width: 0;
    border-bottom: 30px solid #6C6;
    border-left: 52px solid transparent;
    border-right: 52px solid transparent;
}
.hex .middle {
    width: 104px;
    height: 60px;
    background: #6C6;
}
.hex .bottom {
    width: 0;
    border-top: 30px solid #6C6;
    border-left: 52px solid transparent;
    border-right: 52px solid transparent;
}
.hex-row {
    clear: left;
}
.hex-row.even {
    margin-left: 53px;
}

The second orientation involves a margin-right of -26px and margin-bottom of -50px on each hexagon as well as a margin-top: 53px on even columns:

.hex {
    float: left;
    margin-right: -26px;
    margin-bottom: -50px;
}
.hex .left {
    float: left;
    width: 0;
    border-right: 30px solid #6C6;
    border-top: 52px solid transparent;
    border-bottom: 52px solid transparent;
}
.hex .middle {
    float: left;
    width: 60px;
    height: 104px;
    background: #6C6;
}
.hex .right {
    float: left;
    width: 0;
    border-left: 30px solid #6C6;
    border-top: 52px solid transparent;
    border-bottom: 52px solid transparent;
}
.hex-row {
    clear: left;
}
.hex.even {
    margin-top: 53px;
}

And to finish things off, here’s a quick demo of a CSS 3D perspective transform applied to the hex grid:

-webkit-transform: perspective(600px) rotateX(60deg);
-moz-transform: perspective(600px) rotateX(60deg);
-ms-transform: perspective(600px) rotateX(60deg);
-o-transform: perspective(600px) rotateX(60deg);
transform: perspective(600px) rotateX(60deg);

Addendum

Will Hardy suggested on Twitter the following use of :before and :after to reduce the necessary divs to one:

.hex:before {
    content: " ";
    width: 0; height: 0;
    border-bottom: 30px solid #6C6;
    border-left: 52px solid transparent;
    border-right: 52px solid transparent;
    position: absolute;
    top: -30px;
}

.hex {
    margin-top: 30px;
    width: 104px;
    height: 60px;
    background-color: #6C6;
    position: relative;
}

.hex:after {
    content: "";
    width: 0;
    position: absolute;
    bottom: -30px;
    border-top: 30px solid #6C6;
    border-left: 52px solid transparent;
    border-right: 52px solid transparent;
}

jawns pointed out on Hacker News that there's a Unicode code point U+2B22:

360搜索引擎：http://info.so.360.cn/site_submit.html

百度搜索引擎：http://www.baidu.com/search/url_submit.htm

google搜索引擎：http://www.google.com/intl/zh-CN/add_url.html

Yahoo中國搜索引擎：http://cn.yahoo.com/search/

dmoz.org搜索引擎：http://dmoz.org/Regional/Asia/China/

新浪搜索引擎：http://search.sina.com.cn/

搜狐搜索引擎：http://dir.sohu.com/

網易搜索引擎：http://search.163.com/

soso搜搜搜索引擎：http://www.soso.com/help/usb/urlsubmit.shtml

em指的是什麼？

em指字體高，任意瀏覽器的默認字體高都是16px。所以未經調整的瀏覽器都符合: 1em=16px。那麼12px=0.75em, 10px=0.625em。為了簡化font-size的換算，需要在css中的body選擇器中聲明Font-size=62.5%，這就使em值變為16px*62.5%=10px, 這樣12px=1.2em, 10px=1em, 也就是說只需要將你的原來的px數值除以10，然後換上em作為單位就行了。

em有如下特點：

1. em的值並不是固定的；

2. em會繼承父級元素的字體大小。

國內大大小小的都使用12px作為網站的主要字體大小。10px太小，眼睛很容易疲勞，14px雖容易看清，卻破壞頁面的美感。唯獨12px在審美和視力方面都恰到好處。

WebToJpeg

來自日本的一家在線縮略圖生成網站，輸入網站地址之後會在片刻內生成縮略圖。WebToJpeg提供外部調用網站縮略圖，同時還可以按照需要自己選擇縮略圖的尺寸，以及外部調用的一些簡單樣式設置。

網址：http://x-row.cc/webtojpeg/index.php

ShrinkTheWeb

ShrinkTheWeb所提供的功能略顯簡單，因為它只生成兩種尺寸的縮略圖。不過，在註冊賬號之後，所有在該網站生成的縮略圖都會保存在你的賬戶下，除了可以免除日後再生成之外，你可以在ShrinkTheWeb外部調用這些縮略圖。這對於寫日誌或者是分享給朋友使用是足夠的。

網站：http://www.shrinktheweb.com/

Super Screenshot

Super Screenshot的Super絕對不是吹的，因為該網站的主打是網站整版截圖，無論你的網頁有多長。Super Screenshot也可以設定不同尺寸，同時還可以選擇輸出縮略圖的格式為jpg或者是png。

網址：http://www.superscreenshot.com/

WebThumb

進入WebThumb，在首頁的地址欄輸入你想要製作縮略圖的網站地址，馬上就可以產生4種不同尺寸的網站縮略圖：80*60、160*120、 320*240和640*480，還有一個網站左上角的截圖[估計是截取Logo的]，​​點擊右鍵另存為即可把縮略圖保存下來。同時WebThumb還提供zip壓縮文件打包下載，你可以一次性把所有縮略圖下載下來。

網站：http://bluga.net/webthumb/

ToLib© WebThumb Capter

進入ToLib© WebThumb Capter，在Enter your URL處輸入你想要製作縮略圖的網站地址，稍等片刻該網站便會生成四種不同尺寸的網站縮略圖。通過右鍵另存為方式保存縮略圖。

網址：http://thumb.tolib.com/

1. Google PageSpeed​​ Insights

首先介紹的這款網站速度和性能測試工具出自Google，通過分析網頁內容來為開發者提供提升網站加載速的建議。PageSpeed​​ 的測試包含移動設備和桌面設備兩方面，使您的網頁在所有設備上都能快速加載。

2. Yslow

YSlow是最常用的網站性能分析工具之一，相信  Web  開發者特別是前端開發人員一定很熟悉。YSlow基於一組高性能網頁規則來給你提供建議，如何優化可以讓網站更快。 

3. Pingdom

Pingdom 是一個偉大的工具，幫助用戶確定網站加載時間並生成大量的報告，例如頁面大小、瀏覽器緩存、性能等級等。它允許您跟踪性能歷史和從不同的地理位置進行測試。在線檢查網站每個元素的加載速度，生成非常詳細的測試報告，幫助你輕鬆優化網站。

4. Load Impact

Load Impact幫助你為  Web  應用程序進行負載測試和性能測試。選擇一個全球的負荷區，然後測試模擬客戶、帶寬、數據接受、每秒的請求等等。該工具顯示一個漂亮的圖表來測量加載時間。

5. Which Loads Faster

這是一款開源的工具，可以在線對比兩個網站的速度，例如Google vs Bing，Apple vs Adob​​e 等，幫助你了解哪個網站加載更快。 

6. Show Slow

Show Slow 是一個開源工具，幫助你監控各種網站性能指標。能夠測試網站在YSlow，Page Speed​​，WebPageTest 和dynaTrace AJAX Edition 中的情況。

7. GT Matrix

GTmetrix 可以幫助你開發更快速，高效以及用戶體驗良好的網站。GTmetrix 結合了最流行的Firefox 的性能組件YSlow 和谷歌網頁速度測試工具。Gtmetrix 給目標網站評分並提供改進網站存在的問題的建議。

8. Neustar Free Load Testing & Performance Test

這是一款快速生成網站的性能數據的工具，通過對目標網站進行監控和加載測試，幫助你快速解決網站性能問題。

9. Web Page Analyzer

Web Page Analyzer 是一個強大的速度測試工具，為您提供了分析和描述性的網站測試結果以及如何改進它。它提供了各種功能網頁速度報告，加載時間、分析和建議等等。

10. WebPage Test

借助WebPage Test，你可以運行簡單的測試或執行先進的測試包括多級事務、視頻捕捉、內容阻塞等。你的結果將提供豐富的診斷信息，包括資源加載瀑布圖，頁面速度優化檢查和改進的建議。

11. Free Speed​​ Test

Free Speed​​ Test 是一個在線的網站速度測試工具，通過在全球範圍內多個數據中心來檢查加載時間和速度。這將讓你能夠知道你的網站在世界各個角落的實際加載時間。

12. Octa Gate Site Timer

它允許您監控用戶需要多長時間下載一個或多個Web站點頁面。當頁面加載的時候，SiteTimer會統計每個項目需要多長時間下載，包含了多少數據，然後把信息展示在一個表格中

簡介內容超出部分文字隱藏省略的語法特效

點我下載

網站地圖 / 網站導航 /site map
公司簡介 / PROFILE or COMPANY Profile or Company
公司設備 / EQUIPMENT Equipment
公司榮譽 / GLORIES Glories
企業文化 / CULTURE Culture
產品展示 / PRODUCT Product
資質認證 / quality certification
企業規模 / SCALE Scale
業務網站 / 營銷網絡 / Sales Network
組織機構 / orGANIZATION organization
合作加盟 / Join in Cooperation
技術支援 / 技術力量 / TECHNOLOGY Technology
長官的話 / 經理致辭 / Manager`s oration
發展沿革 / 展歷程 / Development history
工程案例 / Engineering Projects
業務範圍 / Business Scope
分支機構 / Branches
支援訊息 / 供求信息 / Supply & Demand
經營理念 / Operation Principle
產品銷售 / SALES Sales
聯絡我們 / 聯繫我們 /CONTACT US Contact Us
訊息發佈 / 信息發布  / INFORMATION Information
首頁 / 返回首頁 / HOMEPAGE Homepage
產品訂購  / 產品定購 / orDER order
分類瀏覽 / Browse by category
電子商務 / E-Business
公司實力 / STRENGTH Strength
版權所有 / Copy right
友情連結 / Hot link
應用領域 / Application Fields
人力資源 / Human Resource HR
創辦人理念 / 領導致辭 / Leader`s oration
企業資質  / Enterprise qualification
產業消息  / 行業新聞 / Trade news
產業趨勢  / 行業動態  /Trends
客戶留言  / Customer Message
客戶服務 / Customer Service
最新消息  / 新聞動態  / News & Trends
公司名稱  / Company Name
銷售熱線 / Sales Hot-line
聯絡人  / 聯繫人 / Contact Person
您的要求Your requirements
建設中In construction
證書CERTIFICATE Certificate
地址ADD Add
郵編POSTAL CODE Zipcode
電話TEL Tel
傳真FAX Fax
產品名稱Product Name
產品說明DESCRIPTION Description
價格Price
品牌Brand
規格Specification
尺寸Size
生產廠家MANUFACUTURER Manufacturer
型號Model
產品標號Item No.
技術指標Technique Data
產品描述Description
產地Production Place
銷售信息Sales Information
用途Application
論壇Forum
在線訂購On-line order
招商Enterprise-establishing
招標Bid inviting
綜述General
業績Achievements
招聘Join Us
求賢納士Join Us
大事Great Event
動態Trends
服務Service
投資Investment
行業Industry
規劃Programming
環境Environment
發送Delivery
提交Submit
重寫Reset
登錄Enter
註冊Login
中國企業網技術支持Powered by ce.net.cn
社區Community
業務介紹Business introduction
在線調查Online inquiry Inquiry
下載中心Download
會員登陸Member Entrance
意見反饋Feedback
常見問題FAQ
中心概況General Profile
教育培訓Education & Training
遊樂園amusement park
在線交流Online communication
專題報導Special report

Photoshop升級到cs版本以後，原來7.0時，可以直接在windows系統窗口中預覽psd文件的功能就沒有了。

解決方法：原因是生成縮略圖的psicon.dll不再包括在CS版的安裝程序中，如果是從老版本升級到CS的話就可以。

把psicon.dll拷貝到：C:\Program Files\Common Files\Adobe\Shell文件夾下，就可以預覽了。

在這提供psicon.dll文件的下載

點我下載

台新銀行網路客服

台新網路銀行無法使用客服信箱

csrbank@taishinbank.com.tw

CSS3線上開發預覽網站

你們中有許多人可能已經聽到過有關CSS3的不少傳言，但是我們現在能真正用到的CSS3技巧又有哪些呢？本文，我將向你展示一些與眾不同的CSS3技巧，這些技巧在一些主要的流覽器中表現良好（如Firefox，Chrome，Safari，Opera流覽器）。這些效果會在不支持的流覽器中降級渲染（如IE流覽器）。使用流覽器特定的聲明，許多提議的CSS3樣式都可以馬上拿來使用。

如果你不知道流覽器的特定聲明是什麼，你只需要記住它們都是CSS樣式屬性前與內核提供商有關的特定首碼。因為CSS3目前還沒得到全面的支援，所以我們需要使用這些特定聲明。具體的形式如下：

Mozilla/Firefox/Gecko流覽器的首碼: -moz-
Webkit (Safari/Chrome)流覽器的首碼: -webkit- （注意：一些Wbkit的首碼只能在Safari下使用，Chrome不支援。）
你可能已經看到了，使用這些聲明的有一個缺點，那就是如果我們想在Firefox，Safari和Chrome中都得到CSS3的效果，我們需要使用到上面所有這些首碼。也不用驚訝，IE流覽器不支持CSS3，因此也就不像其他主要流覽器有一個特定的首碼聲明。

好了，我們已經講的夠多了，我們馬上嘗試一下。注意：樣式聲明去掉這些首碼就是W3標準的實際規範提議。

關於這個頁面的Demo（實例）說明
所有這些例子都是在這個頁面裡面，如果你不能正常查看實例的效果（或者只能查看部分），那說明你正在使用的流覽器並不支持這些CSS3效果

陰影效果
陰影效果接受多個參數值。第一個是陰影的顏色，它還接受另外四個長度（lenght）值，前兩的長度值分辨是X（水準）偏移量和Y（垂直）偏移量。接下一個參數是反映模糊度的數值。第四也是最後一個值是用來定義模糊的散佈程度。

box-shadow: #333 3px 3px 4px;
-moz-box-shadow: #333 3px 3px 4px;
-webkit-box-shadow: #333 3px 3px 4px;

漸變效果
CSS3的漸變樣式剛開始很容易讓人混淆，尤其-moz 和-webkit的漸變之間還存在不同。在-moz中，你首先需要定義漸變的方向，然後定義起始和終止的顏色。而-webkit的漸變則稍稍複雜一些，首先你需要定義漸變的類型，然後接下來兩個值定義方向，最後兩個值定義了漸變的起始顏色和終止顏色。

-moz-linear-gradient(-90deg,#1aa6de,#022147);
-webkit-gradient(linear, left top, left bottom, from(#1aa6de), to(#022147));

RGBA顏色模式
RGBA的顏色定義實際用起來沒有給人的感覺那麼複雜，它接受四個參數值，以此是：紅色值，綠色值，藍色值，以及透明度。我們不用hex（#）16進制值的顏色，我們以RGB的模式來設置顏色，其中，透明度可以設置顏色的透明效果。透明度的取值範圍在0到1之間，0是完全不透明，1是顏色完全透明。下面這些演示例子的透明度都是0.5，元素的透明度是50%，rgba不需要附加任何特定的流覽器首碼聲明。

background-color: rgba(0, 54, 105, .5);

HSL色彩模式（色調H，飽和度S ，亮度L）
除了RGBA，CSS3也支援HSL顏色模式。這給我們在顏色和色調的選擇上提供了充足的餘地。在HSL這種色彩模式中的H代表色調，S代表色度，L代表亮度。色調是色盤上角度值  ，而保飽和度和亮度則是顏色的百分比值。
 
background-color: hsl(209,41.2%, 20.6%);

邊框顏色
要使用這一CSS樣式，你需要分別定義border-top, border-right, border-bottom, 和border-left 才能獲得下面的效果。你注意到定義一個8圖元的邊框，然後邊框又定義了8種不同的顏色。這因為邊框的顏色數量必須與邊框的圖元寬度值相對應。

border: 8px solid #000;
-moz-border-bottom-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-top-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-left-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-right-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
 
文本選擇顏色設置
我不得不要說文本選擇顏色的定義是一個相當激動人心的新功能。當我第一次在CSS技巧上看到這個是，我在覺得它非常貼心。有了::selection這對偽物件（pseudo-element），你可以在使用者選一段文本元素時改變顏色和背景。如果你問的看法，我會覺得這非常漂亮。雖然::selection已經從目前的CSS3草案中移除鳥，但是我們希望稍後它在添加進來。
 
::selection {background: #3C0; /* Safari */color: #90C;}::-moz-selection {background: #3C0; /* Firefox */color: #90C;}


變形
有了變形樣式，你可以讓元素的外觀在滑鼠懸停時變大。給Scale（比例）值設置一個大於1的數值，元素就會便打。反過來或，如果值小於1，元素的大小就會縮小。除了Scale比例，它還有其他許多不同的變形方式可用。你可以訪問Firefox的開發者頁面，查看它們所能實現的效果

-moz-transform: scale(1.15);-webkit-transform: scale(1.15);

多欄佈局
有了這個新的多欄佈局樣式，你可以給文本呈現類似”報紙“排版的效果。跟在CSS2中的實現方法相比，CSS3中，我們實現這類效果要簡單的多。下面，我指定鳥所需要的列數量，以及分離的規則類型，欄與欄之間的空隙有多大。用起來很簡單是吧
 
-moz-column-count:3;-moz-column-rule: solid 1px black;-moz-column-gap: 20px;

總結
我希望跟我一樣，對CSS3的這些特性感到激動。他給網頁設計師和開發者更多的力量，並且讓許多方面都簡化不少。現在，我們只需等待所有流覽器支持它。當然，我這裡演示的知識CSS3新功能的冰山一角。如果你想瞭解更多資訊，技巧和説明，我建議你訪問下面這些網站學習。

我們的網頁因為CSS而呈現千變萬化的風格。這一看似簡單的樣式語言在使用中非常靈活，只要你發揮創意就能實現很多比人想像不到的效果。特別是隨著CSS3的廣泛使用，更多新奇的CSS作品湧現出來。這篇文章給大家帶來的是純CSS繪製五角星、六角形、五邊形、六邊形、心形等等。

Star (6-points)

#star-six {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 100px solid red;
position: relative;
}
#star-six:after {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 100px solid red;
position: absolute;
content: "";
top: 30px;
left: -50px;
}


Star (5-points)

#star-five {
margin: 50px 0;
position: relative;
display: block;
color: red;
width: 0px;
height: 0px;
border-right: 100px solid transparent;
border-bottom: 70px solid red;
border-left: 100px solid transparent;
-moz-transform: rotate(35deg);
-webkit-transform: rotate(35deg);
-ms-transform: rotate(35deg);
-o-transform: rotate(35deg);
}
#star-five:before {
border-bottom: 80px solid red;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
position: absolute;
height: 0;
width: 0;
top: -45px;
left: -65px;
display: block;
content: '';
-webkit-transform: rotate(-35deg);
-moz-transform: rotate(-35deg);
-ms-transform: rotate(-35deg);
-o-transform: rotate(-35deg);

}
#star-five:after {
position: absolute;
display: block;
color: red;
top: 3px;
left: -105px;
width: 0px;
height: 0px;
border-right: 100px solid transparent;
border-bottom: 70px solid red;
border-left: 100px solid transparent;
-webkit-transform: rotate(-70deg);
-moz-transform: rotate(-70deg);
-ms-transform: rotate(-70deg);
-o-transform: rotate(-70deg);
content: '';
}


Pentagon

#pentagon {
position: relative;
width: 54px;
border-width: 50px 18px 0;
border-style: solid;
border-color: red transparent;
}
#pentagon:before {
content: "";
position: absolute;
height: 0;
width: 0;
top: -85px;
left: -18px;
border-width: 0 45px 35px;
border-style: solid;
border-color: transparent transparent red;
}




Hexagon

#hexagon {
width: 100px;
height: 55px;
background: red;
position: relative;
}
#hexagon:before {
content: "";
position: absolute;
top: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 25px solid red;
}
#hexagon:after {
content: "";
position: absolute;
bottom: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 25px solid red;
}


Octagon

#octagon {
width: 100px;
height: 100px;
background: red;
position: relative;
}

#octagon:before {
content: "";
position: absolute;
top: 0;
left: 0;
border-bottom: 29px solid red;
border-left: 29px solid #eee;
border-right: 29px solid #eee;
width: 42px;
height: 0;
}

#octagon:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
border-top: 29px solid red;
border-left: 29px solid #eee;
border-right: 29px solid #eee;
width: 42px;
height: 0;
}


Heart

#heart {
position: relative;
width: 100px;
height: 90px;
}
#heart:before,
#heart:after {
position: absolute;
content: "";
left: 50px;
top: 0;
width: 50px;
height: 80px;
background: red;
-moz-border-radius: 50px 50px 0 0;
border-radius: 50px 50px 0 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
-o-transform-origin: 0 100%;
transform-origin: 0 100%;
}
#heart:after {
left: 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: 100% 100%;
-moz-transform-origin: 100% 100%;
-ms-transform-origin: 100% 100%;
-o-transform-origin: 100% 100%;
transform-origin :100% 100%;
}

joomla網站多語系簡繁設定

鼎益盛獨家開發的joomla元件功能

通常多語系網站上都會有一個切換的語系的控制區或選項

或是用IP地區來判定語系

但是這些做法對鼎益盛來說都已經落伍的古老方式了

你怎麼能確定在大陸的華人就一定是簡體使用者呢?

相對的，在香港或馬來西亞的華人就一定是繁體嗎?

因應 鼎益盛許多國際客戶的需求，我們將網站的UX技術精進的更符合使用者習慣

鼎益盛獨家開發了joomla自動轉跳語系的外掛功能

讓簡體使用者一打開網站就直接顯示簡體

不需要再多一個手動切換的動作

測試方式-->將瀏覽器更改語系開啟網站後便會自動顯示語系

人人都知道上網的人對於網站的速度耐性有限，所以你的網站的效能和顯示速度，是網站的可用性，甚至成功與否的關鍵。Jacob Gube 在他的網誌分享了 20 個線上測試網站速度的工具，可以用來測試網站的速度，和找出哪裡是效能的瓶頸，他建議你同時運用其中數個工具 (沒有一個工具具備所有功能)，作為恆常性的測試手段。

1. Page Speed Online

Google 的 Page Speed Online 是瀏覽器 Chrome 網站開發擴展元件 Page Speed 的網上版，它根據 Google 「網頁效能最佳做法」(Web Performance Best Practices) 來分析網站的效能，這是一組 Google 建議的優化前端效能的規則，你可從這個方便的工具得到大量的資訊，其中包括一個流動裝置最佳效能的最佳做法分析。

2. Pingdom Tools

Pingdom 是一間提供伺服器、網絡、和網站的檢查服務的公司，它的免費線上網站速度測試工具，提供幾個頗有用的報告，包括網頁中每一個物件的下載時間 (如圖像、樣式表、和 JavaScript 程式庫)，和流覽器還存的效能級別等，還有一個很有用的網頁分析報告，提供諸如下載時間、網頁大小和請求訊息等。

3. Free Website Performance Test(BrowserMob)

這項免費的網站速度和性能測試工具由 BrowserMob 提供，這是一家提供網站負載測試和監察服務的公司，這項工局提供大量有關網頁速度的資訊，包括平均下載時間、網頁總大小、及網頁物件的數量。它從四個不同的地方連接到你的伺服器，讓你可以得到網站性能的全局視野。

4. Which Loads Faster?

這個有趣的工具直接比較兩個網站的下載速度，例如你可以測試一下 Google 是否比 Bing 下載得更快，你可以用它來測試你的網站是否比同類的網站有更好的表現。必須一提，這項工具是一個開源的專案，程式碼存放在 GitHub。

5. WebPagetest

這個漂亮的線上工具測試網頁在真實瀏覽器的渲染速度 (Chrome、Firefox 和 IE)，並讓你選擇來自世界各地的數個地點進行測試，它還可以模擬不同的互聯網連接速度 (例如 DSL 及 56K 撥號上網)，更可以選擇性地攔截廣告，使你知道那些廣告對網頁的效能負擔有多大。

6. Web Page Analyzer

這個簡單的網頁速度分析器的第一個版本在 2003 年發佈，可能是最歷史悠久的工具之一，它告訴你網頁的大小、物件和下載時間，它還給你改善效能的建議。

7. Show Slow

這是基於同名稱的開源網站應用程式 (Show Slow) 的網上版本，Show Slow 容許你同時監察多個網址，並定期從三個測試工具取得結果：YSlow、Page Speed 和 dynaTrace。順帶一提，使用這項工具需要註冊的。

8. Site-Perf

這個網上的網站速度測試工具體工很多有關網頁渲染時間的數據，例如總下載時間、連接的數量、請求的數量等等。它也有一些附加功能，例如它可以測試一些需要登入的頁面 (你只須提供網頁所需的密碼)，也可以模擬不同的互聯網連接速度。

9. Load Impact

Load Impact 的免費線上負在測試和效能工具，給你大量網站處理流量的能力的數據，這個網站效能評估工具可以提供多樣化的圖表，包括用戶下載時間 (由一個自動化的虛擬機器進行)及每秒處理請求的數量。

10. OctaGate SiteTimer

OctaGate SiteTimer是一個相當簡單的線上工具：輸入要測試的網址，它便會輸出一個條形圖，顯示了網頁內所有物件的資訊，包括下載的開始、結束和持續的時間，這項工具對於找出做成網頁下載瓶頸的物件特別有幫助。

其它網站速度測試工具

• Web Site Performance Test (Gomez) – 實時的網站效能工具，顯示一些如查找 DNS 的時間和連接時間等資訊。
• Webslug – 它與前面介紹的 Which Loads Faster 相似，這個網上工具會比較兩個網站的效能。
• WebWait – 一個基本的網站速度計時器，你可以自定發出請求的數量和間隔 (例如在 10 秒內發出 5 個請求)。
• Website Speed Test (Searchmetrics) – 提供大量網頁速度的數據，包括在各種類型的互聯網連接下的估計下載時間。
• GTmetrix – 一個使用 YSlow 和 PageSpeed 的線上工具，評估網站前端的效能，提供容易理解的資訊。
• Website Speed Test (WebToolHub) – 一個相當基本的線上工具，提供諸如如網頁大小、下載時間，下載速度和平均速度等資訊，以表格顯示數據。
• Yottaa Site Speed Optimizer – 這個網站效能分析器輸出漂亮的報告，使用此工具需要註冊。
• Zoompf Free Web Performance Scan – 此工具會掃描網頁，並收集有關的網頁效能的數據。你需要提供並驗證你的電郵地址才可以進行測試。
• Site speed checker – 這個網站速度工具容許你同時測試 10 個網址。
• Free web site speed test (Self SEO) – 這個簡單的網站速度測試工具讓你選擇輸入 10 個網址同時進行測試。

原文網址:http://www.hkpug.net/2012/03/16/20-20個線上測試網站的工具

Joomla講師經歷簡介:

joomla講師介紹 aj lin 林玉潔

鼎益盛網頁設計有限公司經歷優勢:

◆joomla!Taiwan唯一邀請主講客製化應用的網頁設計廠商。

◆全台十場以上joomla客製化程式應用主講。

◆全台灣joomla大型購物網站最多作品集，連同非購物車joomla作品超過100件以上。

◆joomlataiwan2012年度推廣北中南巡迴演講主講電子商務及購物車運用。

◆joomla!Taiwan2010唯一邀請主講客製化應用的網頁設計廠商。

◆joomla2.5素人架站作者 郭順能在書中介紹指名推薦廠商。

◆受邀為Joomla！素人架站計畫Power Pack一書寫推薦序。

◆受邀為資策會app開發課程，手機介面設計講師。

◆受邀為資策會中區joomla架站講師。

◆公家單位企業內訓配合講師。

◆受南開科技大學邀請為業界講師主講joomla架站。

◆受健行科技大學邀請，為四系聯合演講新世代網路行銷。

◆受南臺科技大學邀請為業界講師主講新世代的電子商務。全不懂開始到最後一天能發表joomla成果展。

◆受邀樹人護專主講電子商務應用及joomla架站應用。

鼎益盛獨家開發joomla電子書ebook套件，利用joomla文章自動產生成電子書之外，也兼具了SEO mata 搜尋優化功能。

讓公家機關及學校單位能發布定期期刊，也能應用在各種屬性行業的電子型錄運用。

簡化了目前市面上電子書製作的不便，只要新增文章就能產生電子書。

鼎益盛獨家開發技術

將k2的附件上傳下載功能做二次開發成支援中文檔名，讓公家機關及學校單位能更有效的管理文件及活動。

宜蘭佛光大學實務實習計劃-joomla架站三天研習營

教育部寒暑假實習計畫概念: 讓學生從完全不懂ＨＴＭＬ，ＣＳＳ到最後一天架出一個完整網站並發表創作理念

藉由工作職位角色扮演讓同學能夠更了解業界實際運作方式

學習與不同部門窗口做溝通協調來完成一個實際的專案

本實習計畫強調互動性及訓練學生的邏輯思考與表達溝通的能力

研習營的途中會視情況給予學生不同的問題，狀況劇，

例如:專案進行的過程中，客戶突然要求改設計該如何處理? 誰要負責協調，工程師IT或網管人員該如何應對

讓學生實際了解每個職位的各個執掌分別為何? 在寒暑假實務研習營結束後對於將來的自我生涯規劃也能更有概念

幫助學生與社會業界做無縫接軌。

參加對象：資訊應用系 不限年級

第一天：理論概念介紹，組別分組討論

第二天：實際上機操作

第三天：早上做微調，下午開始發表成果

活動照片相簿

https://www.facebook.com/media/set/?set=a.10202977620993031.1073741838.1579232949&type=1&l=cb0e308e2d

學生分組joomla作品集成果展網站

http://se.ai.fgu.edu.tw/~s1011227/
http://se.ai.fgu.edu.tw/~s1011179/
http://se.ai.fgu.edu.tw/~s1021814/
http://se.ai.fgu.edu.tw/~s1021226/
http://se.ai.fgu.edu.tw/~s1011222/
http://se.ai.fgu.edu.tw/~s1021811/
http://se.ai.fgu.edu.tw/~s1011207/
http://se.ai.fgu.edu.tw/~s1011181/ 
http://se.ai.fgu.edu.tw/~s1011203/
http://se.ai.fgu.edu.tw/~s1011162/
http://se.ai.fgu.edu.tw/~s1011171/
http://se.ai.fgu.edu.tw/~s1011199/
http://se.ai.fgu.edu.tw/~s1001581/
http://se.ai.fgu.edu.tw/~s1001576/

joomla 的好處是有下載不完的現成模版及套件元件

各國都有許多非法的模版網站能讓使用者輕易下載到檔案

那你一定會問 『那為什麼我還要付錢去買?』

 相對的也會對網頁設計公司有懷疑，[你們一定也是這樣賣給客戶吧?]

有這個懷疑是正常的，但是我們鼎益盛不會這樣做，為什麼不會這樣做？

我先解釋為什麼我們公司不會這樣做，再解釋使用非法下載的模版會有什麼後遺症。

為什麼鼎益盛不會這麼做？道理很簡單   定位不同

為什麼定位不同?

觀點一:

鼎益盛的專業並不是一般非本科系去職訓局受訓2個月就出來接案的SOHO族可以比較的。

我們不論工程師，設計師的業界資歷都超過10年以上，不論開發元件或設計版型對我們都是很簡單輕鬆的事情

鼎益盛的專業是客製化視覺設計、joomla客製化元件開發

專業的工程師和設計師是不喜歡撿別人的東西的

這就好比你拿網路流傳的DIY自製手工皂的步驟流程 給阿原肥皂或是精油品牌店家說

[我這裡有步驟流程耶!你要不要留起來?] 他們一定會尷尬地笑說，謝謝，你自己留吧。

又好像是買了阿基師的食譜就想開店做生意一樣，你覺得這樣的餐廳能開多久？

只有非專業的人，才會對速成且便宜的工法趨之若鶩

那為什麼我們鼎益盛也賣模板，這不也是便宜速成嗎？

視覺是非常主觀的東西，一般人對未知的結果是沒有安全感的

「我怎麼知道我付了設計費，設計出來的東西是不是我要的？不是我要的怎麼辦？錢不就白花了」

對，這是一個去蕪存菁的年代，以前的不安全感已經可以解決，就是請您自己挑模板

網路上有看不完的模板，完完全全可以解決所謂「設計出來跟我想的差很多」這些風險問題。

1.可以降低計失敗風險，2.可以降低設計成本，3.可以網路上版型可以挑到海枯石爛

而我們做的都是技術客製化，客戶省錢壓成本自行上網挑模板來讓我們改成他要的樣子

例如：他挑了一個70%符合需求的版型，再讓我們鼎益盛來改剩下的30%

通常客戶喜歡這個模板是因為特殊的特效，或是其中的一個功能

但可能其他的東西不是他要的，他想要放自己的logo或改成自己公司的設計

或是他沒有多餘的時間來重新學習這些架站細項的設定。

於是請我們協助完成後續工作，上資料上產品，網站後台設定等等

最重要的協助後台設定，讓整個後台是無技術性的，不用頭腦的，方便維護的，讓網站能自己維護，自行更新資料

整個網站才有經濟價值。

一個模板從免費~3000元不等，光是溝通、修改視覺、修圖、教育訓練的成本就不只這幾千了

拿你買過的模板再去賣別人二手，實在沒有那個經濟效益。為什麼對我們沒有經濟效益？

我解釋給你聽，我要花時間說服你買別人的二手，你不可能馬上決定，我們一定要見面談版型，要把原來工作排開，出門要交通費，回來要趕上原來的工作進度，耽誤到下班時間，可能原來有的私人聚會要取消，光是講到這裡，如果順利和你談成的話，我可能賺你個一千塊，但是！！如果我沒有出門和你談這個別人用過的二手版型，卻是和客制化的公司談案子，或是去學校演講（請參照鼎益盛業界講師記錄），或是做企業內訓，不論是哪一種都比賺你一千塊更有經濟效益。總結以上就非常現實的實際面來講，不花時間賣你這二手版型對我來說就是賺錢。

再說  一樣是陽春麵，不是每個人都喜歡吃同一攤的。你喜歡的版型，別人不一定喜歡

或許這樣的行為對散接的soho族有很大的效益，但是為我們專精JOOMLA開發的團隊公司來講

這樣的行為就像 做客製化手工沙發的工廠，把撿剩下的零碎皮布花布再次拼組成一個沙發賣別人一樣

我們都為DV籃球開發了一套全亞洲唯一的華人joomla購物車系統了，

其實各行各業只要走向專業導向，便不能和速成便宜的做比較

專業的價值是用廣度和深度來比較的，其中牽一髮而動全身的網路行銷諮詢，SEO表現，任何手持裝置RWD顯示，UI、UX體驗等等

Joomla要活用才有價值，甚麼情況用甚麼模組會有更好的網路表現，後台要用哪一種模組操作比較容易上手無技術性等等。

重點是使用免費的模板（盜版模板）的壞處是什麼？

你想想，一群人這麼費心地改偽裝的語法放到模板裡再讓你免費輕易的下載，不賺你任何錢，真的有這麼好心嗎?

還是用你的網站來做其他你不知道的事情?

沒錯

1.盜版的模板大部分都被改過了部分原始碼其中都包含了木馬程式，你的網站會變成大量發信的跳板

   進而害主機空間的IP被列為黑名單，主機商為了自保，主動將你網站關閉，直到你自行解決問題為止。

解決辦法:完全刪除惡意程式，這些惡意程式通常會寫偽裝，讓你不容易找到，刪除不乾淨還是會自動生成。

除非你有一個很好的神人朋友不收你錢，不然我實在想不出來有比花幾千塊買正版模板的更便宜方式了。

（其他解決方式：花錢請專業人士來處理，相信我，這絕對不是幾千塊能解決的）

2.盜版的模板 因為改過了原始碼，部分會導致模組失效不能正常運作，或是網站怪怪的，無法點選，樣式出不來等等

例如：我看demo明明有這個特效，為什麼我自己裝好那個特效就不見了？

這種情況通常都是跟購買的模板商請求技術支援就行了。他們會協助解決到好。

但是因為你是盜版的，不能詢問原廠/原設計公司，除非你自己花時間爬文解決，再來就是趕快去認識神人朋友，拜託他放下手邊所有工作來幫你找錯誤，排除問題，如果你沒有神人朋友，那就厚臉皮去相關社團拜託神人了，如果神人沒空，那....就只好出動新台幣了，joomla困難問題排除要多少錢？肯定比正版兩三千塊的模板貴。

總結

千萬不要為了貪小便宜而造成更大的損失，也不要為了貪小便宜找不專業的建置商來幫你架網站

各行各業都一樣，便宜的東西是沒有售後服務和保固的。

既然都要比價錢了，何不連經歷資歷專長背景一起比呢?

A .J

joomla內建的編輯器並不支援這些語法崁入

所以要下載JCE編輯器便能解決這些問題

joomla taiwan的站長eddy  曾經把JCE中文化

我們只要下載之後 到JCE元件的設定，就能輕鬆地將 這些文法崁在自訂HTML模組或是文章裡。

設定路徑joomla 後台-->JCE元件-->編輯器設定檔-->編輯器參數-->將允許javascript、允許CSS、允許PHP

以下是原始預設值設定

只要更改成以下，便能輕鬆達到 崁入youtube影片等語法

JCE編輯器點我下載

JCE編輯器中文翻譯下載 joomla taiwan eddy站長翻譯版 點我下載

A.J

CSS3 屬性支援一覽表

IE每次更新之後網路銀行總是會出現一片災難

為了大家的美好生活不要被這種愚蠢的蝴蝶效應所影響

強烈建議大家 沒事不要手賤去升級IE

IE只有兩個功能

1.網路轉帳

2.重灌後安裝其他瀏覽器

堅持使用IE的結果會讓你在網海的人生

會浪費很多時間再做一件無意義、明明很簡單卻又一直做好不好的事情

莫名其妙的增加了很多挫折感

如果你想鼓勵長輩學電腦，切記切記，不要讓他的世界裡有IE這個東西!

悲劇案例

明明使用的是IE，但是網路銀行卻跳出[ 本功能目前僅支援適用IE，是否要繼續?]

連用微軟元件開發的網路銀行平台都認不得自家的新瀏覽器

這種做事方法在一般民間企業怎麼可能會發生

光是客訴就接不完了

解決辦法

必須每一次打開前都要按F12-->模擬文件-->選擇IE9、IE10

(根據本人測試最穩定的網路銀行IE版本是IE8，使用IE8你的人生會夭壽順暢)

所以不要再更新最新版本來折磨自己了，別再搶著當白老鼠啦!~

降等之後重新開機就會回到 IE10

但是按下F12之後仍然會發現 出現兩種模式 如下圖

IE的文件模式出現IE7的設定是因為網站的語法裡面加入了指定指令

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

這種寫法會造成一些jQuery的特效運作失敗

例如特效選單點下去沒反應之類的狀況

解決方式是將語法改成

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

讓文件顯示配合最新版本便能減少一些不必要的網頁衝突的問題

但是實際情況還是得看各家開發的方式為主

結論....

IE爆炸之後就會世界和平了。(對~我就是討厭IE~丟筆)

XAMPP安裝教學

下載XAMPP

1.請進入「www.apachefriends.org/download.html」網站

 白色的字

2.右上角可將網頁設成繁體中文

3.選擇所需版本下載

安裝XAMPP

1.執行安裝檔

2.選擇Yes

3.選擇OK

4.選擇Next

5.再選擇Next

6.先選擇安裝路徑，之後點擊Next。

XAMPP需要解壓縮到磁碟機的最上層目錄，這樣在執行時比較不會出問題。例如「C:\xampp\」或「D:\xampp\」這樣的目錄中。如果直接在桌面解壓縮，有可能會因為中間的目錄（資料夾）名稱是中文，造成無法執行。

7.選擇Next

8.再選擇Next

9.安裝完畢之後，選擇Finish。

設定XAMPP

1.安裝完畢之後會跳出XAMPP_Control_Panel視窗，按點Apache右邊的「Start」按鈕，和MySQL右邊的「Start」按鈕，Apache和MySQL就可以啟動了。

2.如果電腦中有安裝防火牆軟體（這裡以小紅傘Avira為例），應該會出現對於Apache和MySQL的警告視窗，對於這些視窗要點按「允許」讓Apache和MySQL可以存取網路的資源。

另外如果目前的電腦中已經用安裝IIS、其他的AMP軟體、Skype等軟體，有可能會衝突到Apache和MySQL所需的網路埠。需要先關閉這些軟體或服務才會正常執行。

3.正常啟動後可看見此畫面

4.進入XAMPP的根目錄當中，執行「setup_xampp.bat」檔，再按下任意鍵，這個程式會協助設定XAMPP的目錄。

5.在瀏覽器的網址中輸入「localhost」可以看到下面的畫面，代表XAMPP已成功執行，點按"中文"可以進入中文的控制畫面。

接下來的步驟及資訊 (可選擇 )：

1.由於XAMPP預設的MySQL資料庫的最大權限root帳號沒有設定密碼，因此可以進入網址「localhost/security/xamppsecurity.php」進行密碼設定。

2.XAMPP的預設網站根目錄是在根目錄的「htdocs」目錄中，Joomla!接下來需要解壓縮在這裡面。

3.XAMPP的Apache設定檔在根目錄的「apache\conf\httpd.conf」檔案。

4.XAMPP的PHP設定檔是在根目錄的「php\php.ini」檔案。

在XAMPP下安裝Joomla！

設定MySQL

1.在瀏覽器的網址輸入「localhost/phpmyadmin」，以進入資料庫登入畫面，輸入使用者名稱、密碼，選擇執行進入。

2.選擇使用者

3.選擇新增使用者

4.設定帳號，主機選擇本地，設定密碼，並勾選（建立與使用者同名的資料庫並授予所有權限），全域權限點選「全選」，最後點右下角執行。

下載Joomla!

1.進入台灣Joomla社群網站「www.joomla.org.tw」，下載主程式和繁中語言包。

2.將主程式解壓縮到XAMPP根目錄的htdocs目錄中（htdocs為網頁根目錄），並將資料夾名稱改成簡單一點。

安裝Joomla!

1.在瀏覽器的網址輸入「localhost/joomla」，會看見Joomla的安裝畫面，選擇繁體中文後按右上角的下一步。

2.注意紅色框框部分必須都為「是」，才能順利安裝，確認後按下一步。

3.授權規定，不猶豫直接下一步。

4.設定Joomla的帳號、密碼，資料庫名稱輸入剛剛設定好的資料庫「hello」，按下一步。

5.這裡直接按下一步。

6.設定網站名稱，輸入Email帳號、Joomla的帳號及密碼，按下「安裝範例資料」，然後下一步。

7.最後按下「移除安裝資料夾」就大功告成了!

安裝Joomla！繁體中文語言包

1.在瀏覽器的網址「localhost/joomla/administrator」，進入Joomla後台登入畫面，輸入帳號、密碼後，按下Log in。

2.進入後台->Extensions->Extension Manager

3.選擇檔案，找到下載好的Joomla繁中語言包壓縮檔，按下上傳與安裝。

4.Extensions->Language Manager

5.Installed-Site->將中文（繁體-台灣）設成預設

6.Installed-Administrator->將中文（繁體-台灣）設成預設

7.大功告成!!!

===========================================

版權所有

如要轉貼，請註明原文來源。

鼎益盛網頁設計有限公司

DES Web Design Co., Ltd.

網址：des13.com

電話：04-23174836

Email：des13@des13.com

編輯：GC

最後修改日期：2014-02-12

============================================

小米手機最新一代的低價機種紅米手機一推出就造成搶購，其人民幣 799 元的訂價更讓創下第一批十萬台新機，在網路上只花了 90 秒就被各方的消費者搶購一空，而紅米手機的爆紅，除了沿襲小米手機先前的強勢外，更進一步帶動了中國千元智能機市場一陣波瀾。

根據全球市場研究機構 TrendForce 針對紅米手機的規格進行解析，其使用的零組件以來自友達的 4.7 吋 IPS 視網膜面板占整機的成最高，達到了 22%，不過其 312ppi 高畫質面板規格與目前一般中國千元智慧型手機2 20ppi 的面板畫質上拉出明顯差距。其次為聯發科的 MT6589(T) 處理器，占整機成本 20%，經由零組件成本表估算，紅米手機在 2013 年第四季的整機成本目前估算約為85美金，而市售價 799人 民幣的價格折合每金大約為 130 美金，一般手機廠商若僅藉由硬體銷售則難以在這種銷售價格下獲利。

由於小米並未採取傳統的通路銷售模式，倚重網路銷售，並將紅米手機做為硬體平台，把營利重心放在軟體收入以及廣告等收益，發展出智慧型手機新的獲利模式。TrendForce 分析紅米訂價如此低廉，主要是因為小米掌握三大成本控制要素。

1. 善用期貨式的整機價格行銷：由於小米的新機發表會上公布的時間點，與消費者真正取得的時間點，通常已經相隔一個季度以上，小米手機的訂價就是爭取這一兩個季度內電子零件跌幅的期望值。
2. 庫存控制：藉由預購網路模式銷售，小米能精確掌握預購數量，整批下單生產，因此在庫存控制上比其他公司更精準，可以避免銷售不如預期時發生的庫存壓力與跌價損失。
3. 社群行銷：藉由社群網路行銷，降低廣告費用，同時減少了銷售通路經手所轉嫁的成本，因此新產品價格每每能在市場上造成一股旋風。

這種破壞性的售價對中國智慧型手機市場的訂價策略產生了一定程度的影響，有可能影響其他智慧型手機製造商調整中低價位產品的訂價策略。小米目前主要銷售市場仍以中國為主，在外銷部分雖然態度積極，但是成果相當有限。後續在對中國市場以外的區域，是否也能影響其他品牌手機的訂價策略，仍要視其外銷比重能否進一步成長而定。

由於智慧型手機整機成本下降，2014 年 150 美元以下的低價位智慧型手機出貨比重由 2013 的 11% 提升至 14%，而介於 150 至 450 美金之間的中價位智慧型手機 2014 年全年出貨比重也超越五成，因此中低價位產品對智慧型手機廠商拓展市占率版圖具有決定性的影響力。而小米手機便是看準了這趨勢推出紅米手機。

TrendForce 表示，小米品牌中長期策略，除了持續拓展中國本地市場外，還需藉由高性價比的產品順利敲開外銷市場的大門。先前小米手機創辦人雷軍就曾在微博上表示 WCDMA 版的紅米手機正在開發中，如果真的順利推出並維持此一價位，相信對其他市場造成巨大的衝擊。

另外小米主要盈利來自於社交平台服務與軟體服務，當走出華人市場後，仍需開發出新的軟體服務與社群網路獲利模式，吸引華人圈以外的消費者加入，才能進一步順利擴張。而近期以高估值完成募資的小米銀彈充足，未來在拓展海外市場部分，也許積極併購當地企業也是一種進入本地市場的捷徑，同時也可以將更多資源運用在確保產品生產進度上，讓產品能準時交付到客戶手上，改善長期以來小米為人詬病的缺點。

1月15日消息，據BusinessInsider網站報導，移動支付和電子錢包正在進入我們的生活的各個方面，但是對於這一新生的事物，人們知道的並不清楚，以下尋修網為您盤點關於它需要知道的10件事：

1、在線支付領域的“三巨頭”

少數幾個公司已經在電子在線支付領域取得領先地位：谷歌、亞馬遜和PayPal。現在他們在嘗試進軍日常生活業務了。谷歌錢包服務允許人們把錢存在手機中，然後在實體商店或是網站上進行消費，同時藉助NFC近場通訊技術，具有兼容功能的安卓手機就可以變成一個支付卡。

2、谷歌錢包推出了實體版

你最喜歡的飲品店沒有接入谷歌錢包系統？不必擔心，谷歌剛剛發布了一款實體的谷歌錢包，你可以在全美任何支持萬事達卡（Mastercard）的地方使用它。實際上它就是一個普通的借記卡，只不過它和谷歌銀行掛鉤了。

3、萬能的Coin卡

售價100美元的Coin去年夏天在美國發布了，它最大的亮點在​​於可以憑藉一卡之力完成你口袋裡其它所有卡片的功能，無論是藉記卡還是超市會員卡，統統可以合併在其中。它會掃描這些卡片後的磁條，然後用電子方式複制這些磁條特徵並存儲在自己的卡片中。你只需要按一個按鈕就可以從借記卡支付切換到信用卡支付，還可以調出會員卡來進行積分，切換起來非常方便。

4、Square的崛起

電子錢包有一個非常糾結的問題：遇到不接受它們的商店就完全無法使用，而如果沒有顧客使用，商店就不會考慮安裝支持系統。

Twitter聯合創始人Jack Dorsey的新公司Square提供一種新想法，你可以使用手機的耳機接口接入一個附件，通過這個附件來進行支付。但Dorsey的終極目的也在於頂替所有卡片。所有使用Square進行支付的商店都會支持顧客使用Square app進行支付，而且他們得到了星巴克的支持，目前Square app已有相當數量的用戶。

5、電子錢包在美國相當流行

谷歌錢包，Coin卡，Square，在美國以外的地區都無法使用。當然標準商務模式是一大原因，在英國卡片模式已經從磁條轉成更安全的芯片系統，為這種卡編寫應用變得更加困難。當前電子錢包的前景還很不明朗，比如沒人清楚像Coin卡這樣的卡片能否替代芯片卡來進行支付。

6. iZettle

一些公司開始研發​​密碼刷卡技術。總部位於斯德哥爾摩的iZettle開發的技術能夠使商店使用iPhone或iPad接受信用卡付款。但是這項更複雜的技術成本可不低。PayPal和Square在美國提供免費的磁卡閱讀器，而iZettle的密碼閱讀器卻要花費近100英鎊。

7. 尚未成功的NFC支付

早在2011年，英國就出現了通過手機進行非觸碰式支付的技術，但是該項技術並沒有取得太大的成功。因為能夠支持此項技術的手機很少。多數時候，該服務要求用戶設置獨立的電子錢包，而不是直接和銀行賬戶連接。這就使用戶和資金之間又多了一道程序。

8.各自為政的電子錢包系統

每個公司都擁有屬於自己的、不可轉讓的電子錢包應用程序，但是這種各自為政的方法也給電子錢包造成了可怕的碎片。在2014年，由於沃達丰、 EE和O2將共同組成移動錢包服務“Weve”，這種情況可能會結束。但是要想讓電子錢包和信用卡一樣便於使用，還不是一天兩天的事。

9.比特幣

儘管新聞故事總是把比特幣描述成閃閃發光的金屬般的物品，但比特幣實際上不過是硬盤裡的數據塊而已。它們能夠用“真正”的錢買入，或者通過複雜的數學得到。比特幣具有純數字化的特徵，因此它有可能成為國際貨幣。同時，用戶們也可以不經過銀行而直接進行比特幣轉賬。

10.蘋果有可能大舉進軍電子錢包領域

一些人懷疑蘋果還在醞釀一個新的計劃：蘋果擁有大量的信用卡數據，再加上觸摸ID指紋掃描儀和新的短距離通信的“ iBeacon ”技術，這些都可能使蘋果成為一個強有力的競爭對手。

對於Mobile Web來說，現在是快速成長時代。由於採用了HTML5和CSS3技術，移動瀏覽器的性能加強了許多，同時，移動app的框架也擴展了，這意味著為移動設備創建豐富的互動的web體驗的可行性又提升了。

本文通過對四種常用的框架進行比較，看看新技術帶來了哪些改變。

採用諸如PhoneGap這樣的封裝軟件，您就可以使用native app Store以及單個代碼庫，就可以分佈式部署iPhone，iPad和Android等不同的目標平台了。

對於Mobile Web的開發人員來說，切換框架代價很高：因為動畫的轉換，工具欄，按鈕，列表的顯示，以及線下存儲等都很麻煩。因為大部分上述功能都是新技術，以及這些領域的技術還在迅速地改變。作者玩轉了許多Mobile Web的框架並且對它們進行了分析比較，下面將為您講解他的研究發現。

一、jQTouch

jQTouch易用性強，相關文檔也很全面。它的特色是在使用HTML,CSS和JavaScript創建iPhone App方面擁有出色的能力。jQTouch使用漸進增強的方案，在您相應的HTML頂層來實現像iPhone那樣的用戶體驗。它簡單易用，提供了一個基礎的小工具集以及動畫方案，開發人員只需要編程控制其動態行為即可。

不過在作者的簡單測試中發現app的性能存在一定的問題，頁面在轉換時可能出現跳轉或者缺失的情況，以及在響應tap事件的時候還有周期性延遲。該項目在技術上還活躍著，不過原作者的進展和部署都顯得太慢了。

只需要遵守MIT的license許可就可以使用jQTouch了，MIT lic是作者最喜歡的開源許可之一。

二、jQueryMobile

jQuery Mobile是這個領域的新丁，2010年8月才正式宣布成立，但是已經迅速進展到功能豐富的阿爾法2測試版本了。jQuery Mobile跟jQTouch相比很相似，但是更加標準，更有適應性，感覺很像jQTouch的後繼版本，對用戶接口和style的支持範圍更加寬廣了。

jQuery Mobile的性能是不穩定的，（雖然比jQTouch好一些）特別是在響應TAP事件的動畫延遲補償的時候。此外，還缺少一些關鍵的程序hook，所以不能輕鬆地讓app更加具有動態性能。例如：當一個頁面啟動的時候事件觸發了，這時候卻無法通知響應的代碼頁面將轉向哪個用戶接口，也不能傳遞附加的信息給處理模塊。針對上述問題，創建工作區來解決還是可行的，但是在這裡作者希望其將來的版本能從jQTouch那裡學習一下，並把現在的功能缺陷處理掉。

jQuery Mobile的相關文檔資料很零散但是有所改進，作者很希望它們能變得像核心jQuery庫那樣具有魯棒性。（請注意，jQuery Mobile是和jQuery UI相輔相成的，並不是建在單純jQuery之上的）

想獲得jQuery Mobile只需獲得MIT或者GPL2 license。

三、Sencha Touch

這是個與Ext JS框架完全不同的產物，其方案與jQTouch/jQuery完全不同：Sencha生成自己的DOM（基於用JavaScript創建的對象）代替了先前存在的HTML增強方式。如此，使用Sencha工作的感覺不像是web編程，而更像是使用Java或者Flex等技術來做app的樣子。比起jQuery來，Sencha的感覺更像是YUI。作者個人比較偏好漸進增強的方案，儘管其性能還真有些不盡人意的地方。

sencha跟其競爭對手們相比，擴展性強了很多：它擁有大量的用戶接口組件，直接的iPad支持，擁有JSON和HTML5線下存儲技術使得存儲和數據綁定更加方便。（使用Sencha的數據結構來操作app的數據十分酷~它可以實時響應列表的更新）此外，Sencha還是唯一在工具欄上支持內嵌的對象支持，其他方式都是滾輪列表的樣子。

在作者的測試程序中，使用Sencha與jQTouch/jQuery相比，雖然app很明顯地不那麼輕量級，但是其性能和可靠性方面明顯提高了，不過其初始化加載時間略慢。

當您使用庫library或者框架frame進行開發的時候，不遵守框架或者​​用你自己的方式通常都不會獲得成功。但Sencha的支持範圍足夠寬廣，這意味著您可以使用Sencha的開發方式來實現任何需求。作者最開始用的是WebKit的內嵌SQLite數據庫來做線下存儲，但是最終還是因為其複雜性和各種bug問題的煩惱而放棄了，轉而使用了Sencha數據存儲的功能。

在文檔方面，Sencha做的不太好，雖然很廣泛，但是又有很多舊版本的老漏洞沒有及時更新，作者就在這些框架中與bug作鬥爭，調試過程浪費了很多時間，因為文檔不夠健全，很多問題難以追踪或理解。而在開發者論壇響應作者提問的頻率還算較高，不過最終感覺還是不太夠。Sencha提供的付費技術支持起價是$300每年，作者很強烈地打算付費了，但是Sencha的回應是很好奇地打聽為啥這麼急著給他們送錢，真搞不懂。

獲取Sencha需要遵守GPL3 license，以及在某種不是GPL標準又很相似LGPL的授權下也能用，以及遵循非商業license也可以獲得。

四、TitaniumMobile

與Sencha Touch很相似，Appcelerator公司的Titanium Mobile可以讓您使用Javascript API來編寫app。不過與Sencha不同的是，Titanium把你的代碼編譯成Native的iPhone或Android app，這意味著它並不是一個真正的Web框架，而是一個兼容層或者編譯器。（請注意Titanium Mobile的近親Titanium Desktop是一個基於web的，讓您可以使用HTML /js來編寫桌面封裝的本地應用的一款軟件）

這麼說來Titanium允許web開發人員使用JavaScript和一點點XML之類的其他相關技術，可以實現高性能、更換皮膚很方便的Native App，而不需要額外去學習Objective-C或者Cocoa Touch等技術了。作者的簡單測試表明其性能不錯，吹散了框架方面的疑雲，而且整合起來也不是太難。

不過這個優點也是其致命的缺點，您只能作出Titanium所支持的平台上面的應用，你被它們的開發工具限制住了。作者想證明這一點只需要換一個不是iPhone的平台上來跑一下就知道了。同時，Titanium的調試器也不怎麼樣，不能使用XCode方式運行或者調試，就算在其仿真器上面程序跑的還算不錯，還是需要作者自己去實際機器上自己再找問題。

分析

作者在這4個框架上面挑選了3種並編造了自己的app來試一試，過程雖然很冗繁，但是收穫也頗豐。作者很喜歡jQTouch，但是不太相信它會在現有版本上再前進多少了。對於jQuery Mobile，很讚賞其簡單易用性以及其以web為中心的開發方法，不過它的缺點是缺少核心特色，跟Sencha比性能差很多。

用一個阿爾法2版本的產品來跟一個1.0版本的正式版相比或許有失公平，但是在用戶具有很強烈的剛性用戶需求時就必須做出選擇了，於是作者選擇了Sencha Touch。作者最初被其強大的性能和寬廣的支持程度所吸引，最終更喜歡其開發風格。隨著開發的深入，其文檔的漏洞讓作者十分沮喪，但是其廣泛的支持程度依舊吸引著作者，漸漸適應了其開發風格。如果他們願意回复郵件的話，作者很有意向付費以獲取技術支持。不過現在，Pints​​的發布已經是一個基於Sencha的app了。

結論

作者還沒有回答最大的問題呢：一個基於web的app在沒有本地app的情況下能否hold住局面？如果可以的話，實現這樣的技術是否值得捨棄原來那種單一代碼庫方式所帶來的代價呢？

鑑於兩星期以來Pints​​的實際應用，作者傾向於說不。Pints​​在性能和bug方面陷入僵局，平均每隔10-15秒頁面就亂跳，在滾動頁面的時候容易亂跳，動畫效果也不是很連貫。

原文出處：dapp開發者

這張圖 是高雄醫學大學校內建置joomla站的轉換分析圖

高醫大在一年之內將所有的各處室單位系統慢慢轉換成了Joomla  這是為什麼呢? 讓我們來聽聽他們的評估結果 

圖資室超級低調負責架站的先生說:

我們的經費嚴重不足。並且有開發時程的壓力，因此放棄自建系統。開源也是我們學校的風格。

在比較過幾個開源的CMS後，我認為WordPress雖然最為普遍、方便，但較偏向部落格等信息發布類的平台。

Drupal 則是要有超高度客制化能力，才能改製成對一般行政人員容易操作。

至於 Django 則是語言環境的問題。

我認為不是哪個 CMS 較好，而是適配性的問題，因此我們選用了 Joomla!

 隨便比喻：

WordPress是隨手可取得的美工刀，但是改造一下也是可以具有強大的殺傷力

Drupal 應該是把武士刀

Django 把它看成雙截棍?!

 我的目標是煮個晚餐，我不太想花時間改造美工刀、也不想拿拿武士刀來切西瓜，更別說用雙截棍了

所以我們用了 Joomla! 這把菜刀~~~~

 --

我覺得也有許多人投入對 Joomla! 的開發與維護，具有為數不少且時常更新的擴充套件，
我個人對 Joomla! 還有許多要學習和投入的部分，我先前也參考了不少你們的網站資源。

--

Joomla! 有不錯的前端語系呈現和後台語系支援度。

Joomla! 雖然在國內的討論不那麼熱烈，但是要找尋相關問題，Google Search總是有作者群或廣大網友的解答；足見有一定的族群在維護。

MVC Model，這時代講到Web應該都具有了（這部分 Django倒是比較老實說MTV，我本身是被MVC弄模糊的那一群）
 

最擔心的則是資安問題，因此真的挑開源軟體要挑族群夠大、夠強壯，有人、有高手群在維護，更版要夠快。

Joomla 這方面表現不錯。

---------------------------------

所以高醫大在一年之內轉換了80個以上的校內站轉換為 joomla站.

你也有很多問題想問他嗎? 歡迎來參加我們Joomla的南部推廣活動，他會負責主講一個神祕主題，我相信肯定會讓大家滿載干貨回家的!

請持續關注 Joomla 活動推廣    或 AJ 的FB 不定時有Joomla聚會，歡迎想了解，大概了解，想來踢館的朋友們都來聊聊唄!~讓我們來推廣開源吧!!

1.K2

k2是一套功能強大的文章管理系統，能輕鬆的分類各種單元頁的格式配置，也支援各種影音圖片多媒體格式管理，同時也有K2Store能擴充成輕量級的購物車系統。

2.JCE

JCE 編輯器能讓你在管理網站更簡單有效率，原裝內建的編輯器不支援程式語法，有時候想插入一些程式語法就必須從原始檔去寫入使用JCE可以直接在joomla後台就能寫入ＰＨＰ，ＣＳＳ，ＪＳ等等的程式語法。

3.SW menu pro

joomla的原裝選單功能並不那麼的完美，也無法隨心所欲的創造各種層級來符合各種不同形態的網站架構，這個joomla下拉式選單模組可以解決這個問題。

4.Akeeba backup

5.SH404SEF

joomla SEO優化擴充套件，這個擴充套件能加速提升以及SEF URL或URL重寫，google analytics分析等等，但是不代表說裝了這個套件網站排名就會馬上爬到第一名噢！

6.Tabs

joomla頁籤模組其實分很多種，一種是把一篇很長的文章為了方便閱讀切斷成好幾頁的，一種是可以崁入不同模組的

現在介紹的這個是單純文章管理用的，在ＪＣＥ編輯器中就能夠實現。

7.Simple image gallery

如果你再找一套簡單管理，又方便改寫開發的相簿展示模組，這是一個很好的選擇。

Adobe發布了一款名為Edge Reflow的工具，可以用於響應式設計的可視化創作，提高通過HTML5和CSS3技術在不同設備上所進行的網頁開發效率。

目前Reflow提供了免費的下載，而通過註冊成為Adobe Creative Cloud付費會員可以繼續獲得免費的軟件更新。

Reflow的主要功能是通過在設計的過程中將所有的“斷點”“模組”進行可視化的展示，讓開發者可以在工具中一邊進行間距的調試，一邊測試展示效果。

這些功能在佈局、樣式的調試效率上都有很大的改進。

開發者通過Reflow的幫助，可以更加輕鬆的在同一個界面中完成多項開發工作，調試各種尺寸的設備上所展示的網頁。

在佈局上使用直觀的用戶界面，可以在設計的過程中針對不同的屏幕尺寸設置斷點。

在樣式的設計上，Reflow提供的調試功能，能準確的實現你的設計，用更直觀的界面幫助開發人員進行細節變換。這些功能可以讓多種設備上設計流程變得更加便捷，協助開發人員改進效率。

Adobe一直在設計工具上提供多種便捷的功能，這次在Adobe Edge Reflow上也保留了這樣的特性。而至於RF在響應式設計的領域裡能佔據怎樣的地位，還要我們拭目以待。

介面設計

User Interface簡稱 UI，亦稱用戶介面，定義廣泛，包含了人機互動與圖形使用者介面，凡參與人類與機械的訊息交流的領域都存在著使用者介面。UI設計的核心價值是Usability易用性。構成Usability易用性的元素為

• 可學習性 (Learnability)

• 效率 (Efficiency)

• 可記憶性（Memorability）
• 很少出現嚴重錯誤 (Errors)

• 滿意度 (Satisfaction)

人機介面 MMI: Man–Machine Interface或人機互動介面

（Human–Computer Interface或Human–Machine Interface）大量運用在工業與商業上，簡單的區分為「輸入」（Input）與「輸出」（Output）兩種，輸入指的是由人來進行機械或設備的操作，如把手、開關、門、指令 (命令)的下達或保養維護等，而輸出指的是由機械或設備發出來的通知，如故障、警告、操作說明提示等，好的人機介面會幫助使用者更簡單、更正確、更迅速的操作機械，也能使機械發揮最大的效能並延長使用壽命，而目前市面上所指的人機介面則多是狹義的指在軟體人性化的操作介面上。

圖形使用者介面GRAPHICAL USER INTERFACE，簡稱GUI

以「各種美觀、而不單調的視覺訊息」提示使用者「狀態的改變」，勢必得比簡單的文字訊息呈現，花上更多的計算能力，計算「要改變顯示器哪些光點，變成哪些顏色」。

結論:介面+互動+視覺;利用程式觸發器來快速達到執行的目的。使用者面對所需使用的資訊產品介面，僅需當下進行「辨識」工作，一看便知，而不需要耗費腦力去「回想」這工作有什麼意義？如何進行？

1.一般性搜尋引擎：Google雖然最好用，但有時還是可以搭配Yahoo對比一下。而百度作為中國那邊最重要的搜尋引擎，如果想要找大陸的中文資料也不可以忘了百度（而且在百度中輸入繁體會自動幫你轉簡體，下面的百度知道亦有相同功能，但百度貼吧則不行）。
Google網頁搜尋：http://www.google.com.tw/
Yahoo搜尋：http://tw.search.yahoo.com/
百度搜尋：http://www.baidu.com/

2.知識庫搜尋引擎：想要找某個看不懂的關鍵字、專有名詞或概念的意義，首先就應該試試看下面這幾個搜尋器。
中文維基百科：http://zh.wikipedia.org/
英文維基百科：http://en.wikipedia.org
Yahoo知識+：http://tw.knowledge.yahoo.com/
百度知道：http://zhidao.baidu.com/

3.部落格搜尋引擎：想要找各種有個性、有見解的部落格文章，那麼就應該先從網誌專用的搜尋器開始找起，這些搜尋器還會照顧到部落格的特色，給予你時間上特殊的排序方式。
Google網誌搜尋：http://blogsearch.google.com.tw/
Yahoo部落格搜尋：http://tw.blogs.search.yahoo.com/blog

4.地圖搜尋引擎：想到哪個景點玩不知道怎麼去？在大城市裡不知道怎麼坐交通運輸工具？都可以利用地圖搜尋來幫你，其中我覺得urMap還是比較適合台灣用戶，交通資訊很豐富，可惜我沒有辦法將urMap成功加入搜尋列中。
Google地圖：http://maps.google.com.tw/maps
urMap：http://www.urmap.com/

5.新聞搜尋引擎：透過下面這些搜尋器你可以快速找到最熱門的、來自各種線上電子報的新聞內容。而之所以列上百度貼吧，是因為上面對熱門話題的討論有時候還滿好玩的，可以挖挖八卦，消磨一下無聊時間。
Google新聞：http://news.google.com.tw/nwshp?ned=tw
Yahoo新聞：http://tw.info.search.yahoo.com/news
百度貼吧：http://tieba.baidu.com/

6.多媒體搜尋引擎：想要找一些圖片、影片素材，就可以直接透過下面幾個搜尋引擎來完成，不過使用時要注意版權的問題。
Flickr：http://flickr.com/
deviantART：http://www.deviantart.com/
Google圖片搜尋：http://images.google.com.tw/
YouTube：http://tw.youtube.com/

7.藝文評論搜尋引擎：娛樂生活對於人來說是不可或缺的，看電影、聽音樂、看書等等休閒活動都可以為我們帶來很多享受，而如果說想要知道關於這些娛樂的網路評價，就可以透過下面的搜尋器來找到。
IMDB電影資料庫：http://www.imdb.com/
豆瓣：http://www.douban.com/
aNobii網路書櫃：http://www.anobii.com/anobii_home

8.商品搜尋引擎：線上購物應該是大多數人都有使用過的網路功能，當你要買東西時，其實也可以透過下面的幾個搜尋器先在網路上比較看看價錢、規格等等資料。當然，也可以透過下面的搜尋引擎快速找到你想要的東西並購買。
奇摩拍賣：http://tw.bid.yahoo.com/
露天拍賣：http://www.ruten.com.tw/
eBay：http://www.ebay.com/
PChome線上購物：http://shopping.pchome.com.tw/
FindBook：http://findbook.tw/
博客來網路書店：http://www.books.com.tw/
Amazon：http://www.amazon.com
A9：http://a9.com/

9.國內社群文章搜尋引擎：其實國內論壇應該很多可以拿來當作搜尋資料庫，不過我自己有加進搜尋列的只有Mobile01，其他的就歡迎大家在留言推薦。而像funP和黑米這種書籤推文社群網站，當然也是找資料的好地方。
funP：http://funp.com/
黑米共享書籤：http://www.hemidemi.com
Mobile01：http://www.mobile01.com

10.微網誌搜尋引擎：為什麼要獨立出這個類別？因為我覺得透過這種微型資訊中心，你還真的能夠找到不少有趣或有用的「資訊線索」，不信你也可以試試看。
Twitter：http://search.twitter.com/
FriendFeed：http://friendfeed.com/

11.國外社群文章搜尋引擎：雖然找到的大多會是英文資料，不過如果你就是想找英文資訊時，不可以錯過下面幾個專門檢索國外群眾智慧寶庫的搜尋器。
Del.icio.us：http://del.icio.us/
Digg：http://digg.com/
Mahalo：http://www.mahalo.com/Main_Page

12.Firefox搜尋引擎：玩Firefox擴充套件、GreaseMonkey和Stylish，就應該擁有下面三個搜尋引擎，讓你隨時可以找到五花八門的工具外掛來試玩。
Firefox擴充套件：https://addons.mozilla.org/zh-TW/firefox/
GreaseMonkey Scripts：http://userscripts.org/

13.中文應用搜尋引擎：中文真的是很重要的；語言是溝通、思考、表達、學習的根本，所以可以說所有的事情都與語言有關，而身在語言上使用中文的國家，當然沒有任何的理由不去學好中文。也因此下面這個搜尋引擎是絕對的必備，我在寫部落格文章時（是的，就是在寫這個看起來跟中文好像沒有關係的電腦玩物時）就常常會上去尋找一些字詞的相關用法與修辭技巧。
國語辭典修訂本：http://dict.revised.moe.edu.tw/

蘋果

• 蘋果人機接口設計指南（中英對照）
  蘋果人機界面指南
• iPhone人機界面設計規範（中英對照）
  iPhone人機界面指南
• iOS MobileHIG

• android ui設計規範

  http://developer.android.com/guide/topics/ui/overview.html

用戶界面風格指南的AJAX相關的可用性指南

• 更多Ajax的可用性指南
• 寫（AJAX）JavaScript的十大良好做法在2005年
• AJAX的可用性指南和Ajax模式

蘋果電腦可用性指南

• 蘋果人機界面指南（Mac OS X的）設計指南
• 蘋果的用戶體驗文檔和資源
• 用戶體驗的蘋果，包括工具，用於擴展OS X Tiger的資源：儀表板，自動監控和更多...

MS Windows的可用性指南

• 微軟的用戶界面指南（點擊在用戶界面設計在左邊的樹......）
• Windows XP的指引
• 微軟Vista的用戶體驗（UI）指南（NEW）
• 官方Vista的“創建體驗”用戶界面概述網站

Sun公司Java的相關

• 耶魯大學網站風格指南（第二版）
• Java的外觀和感覺指引（第1版）
• Java的外觀和感覺準則第2版
• Java的外觀和感覺指引：高級主題

Java Swing的相關

• 一個Java Swing的GUI框架
• Sun的Java外觀類文獻
• 自定義Java Swing的L＆F（外觀）
• 使用的Java Swing的可插入外觀和感覺

開源相關

• 圖案風格指南
• KDE 用戶界面指南
• Gnome的人機界面指南1.0

協同寫作的用戶界面標準和指南（樣例）

• Telstra的網絡標準
• Taligent公司人機界面指南
• 美國科技圖形用戶界面標準和設計指南

政府資助的可用性指南

• 對於MITRE準則設計用戶界面軟件（美國空軍）
• 根據研究網頁設計和可用性指南（健康與人類服務部）
• 癌症研究所的可用性指南
• 美國航空航天局的用戶界面指南
• 加拿大指揮決策輔助技術（COMDAT）操作員人機界面（OMI）風格指南：1.0版（PDF格式）

遊戲設備（J2ME遊戲）

• （諾基亞）

無線和移動（設備）可用性指南

• Palm OS的設計指南
• 奧維GSM 指引
• 奧維為WAP應用十大可用性指南
• 黑莓和RIM 無線手持UI開發人員指南（PDF格式）
• 諾基亞手機
• W3C的移動Web最佳實踐1.0 用戶界面指南

平板電腦用戶界面指南

• 設計界面為平板電腦的挑戰
• 八個要點平板用戶界面的成功
• 八點多規則的平板UI的成功

可訪問性指南

• 對技術的Web內容可訪問性指南1.0

其他可用性和用戶界面指南

• IBM三維設計指南
• Silicon Graphics公司靛藍魔術的用戶界面指南
• 史密斯和莫西爾人機交互指南（1984年，2006年仍然令人驚訝的中肯）
• 用戶界面設計和可用性（鏈接）

通過動態體驗

網站的首頁是網站最重要的一個頁面，一般網站的流量大部分都來自於首頁，網站的跳出率、轉化率的高低也跟首頁有著很大的關係，首頁就是網站的門面，就像人的臉，書的封面，店舖的門面。有一個好的門面，網站的生意才會好，用戶才會喜歡。所以把首頁合理佈置好對於網站而言至關重要，不要什麼都往門面上堆，一個好的首頁應該在美觀豐富的同時滿足用戶的實際需求，那麼網站首頁到底應該放什麼呢？

1、網站LOGO　　

網站LOGO應該是每個頁面都會有的，一方面告訴用戶網站的名字，突出品牌，方便用戶記住，另一方面很多LOGO圖片直接帶有首頁的鏈接，用戶可以通過直接點擊各個頁面的LOGO返回首頁。也有很多時候站長通過給LOGO圖片加鏈接和ALT標籤來強化關鍵詞，因為蜘蛛給予網站第一個鏈接和第一個鏈接的錨文本最高權重，儘管圖片不能作為錨文本，但是可以用ALT標籤的文字彌補，所以LOGO圖片的ALT標籤文字不要胡亂寫，一般都是主關鍵詞，這就是一種圖片關鍵詞的​​手法。木木seo建議按照下圖格式寫網站LOGO圖片代碼。

2、完整的導航

網站導航是每個網站首頁都需要的，首頁的導航一般都是首頁、公司簡介、企業產品、最新新聞、招聘公告、聯繫我們、公司活動等之類的，首頁導航能快速指引蜘蛛和搜索引擎去想去的地方，網站內容很多，但導航欄目有限，所以導航應該放一些用戶最需要了解網站的一些東西，像評論、投稿、地圖之類的就別放在導航了，另外很多用戶需要了解的導航欄目不需要參與排名，比如：聯繫我們，公司簡介，企業招聘之類的。這些欄目可以加上nofollow標籤，甚至可以在收錄之後直接robots屏蔽掉，這樣可以集中網站權重，同時提高蜘蛛在網站的抓取效率。

3、最新文章、行業資訊

一個網站不能老是不更新，特別是首頁需要更新內容，保證網站的活躍度。一方面可以保持網站和搜索引擎的友好關係，另一方面可以很好的和用戶互動，能夠持續的提供給用戶需求的東西，避免了之前網站信息缺少而造成用戶的流失，說白了就是告訴搜索引擎和用戶：大爺還活著，還可以繼續提供需求。 　　

4、核心價值內容

內容是網站的根本，而對於首頁核心的內容顯得更重要，因為首頁篇幅有限，而這僅有的篇幅我們要告訴用戶網站最根本的價值和優勢，這樣才能吸引到用戶繼續瀏覽，所以首頁一定要有最核心價值的內容。這一點是很多網站都沒有做到的，有的產品站整個首頁都是資訊和技術文章，用戶根本看不到產品信息，還有的儘管有核心的產品，但是附帶了很多其他的產品，恨不得將所有產品都拿過來，一句話：雜而亂，簡直就像個雜貨舖，用戶半天都聚焦不到想要的東西，所以首頁一定要在恰當的位置放入網站最核心的內容，最能滿足用戶需求的內容，用戶是來尋找需求的，不是來打醬油的。

5、網站地圖

網站地圖對首頁來說也很重要，能夠幫助蜘蛛和用戶快照獲得對應鏈接，一般而言，網站地圖分為2種，一種是xml格式的，是對蜘蛛展示的，將網站各個頁面快速展現給搜索引擎，並設置好相關插件，方便蜘蛛判斷，另一種是html格式的，這一種是面向用戶的，和xml格式的不一樣，html網站地圖是製作一個簡潔明了的網站各個欄目的全面導航，方便用戶找到需求的內容，而xml網站地圖只是向搜索引擎展示的網址。

6、認證信息

現在有很多做企業網站認證的企業，包括百度、360這些搜索引擎也做網站認證，甚至還有做網站認證的政府部門，為什麼會這樣?因為企業網站有需求，那為什麼網站會需求這些認證呢？很簡單，因為用戶希望看到這些，用戶希望上網安心，網購放心，網站可信，網站權威。所以在網站放一些認證信息，比如網站安全認證、網站備案信息，網站權威認證，工商局認證。這樣用戶進入首頁之後會有安全感、信任感，下意識的就會給你的網站加分。 

7、版權信息與微博微信

   一個網站需要一個正規的版權信息，這就像店鋪要有個營業執照一樣，顯得正規、專業、可信。而隨著社交媒體和移動互聯網的崛起，微博微信也越來越受到各個企業的重視，所以在網站首頁加入網站微信微博二維碼也是一種時尚，也方便用戶在微信微博與網站互動，告訴用戶你的企業也參與到了社交媒體中，顯示企業的實力。就算用戶不去掃描關注，網站上有這些東西也顯得上檔次大氣。

8、統計代碼

  統計代碼是首頁必不可少的，一個首頁設計好之後不是就听之任之，放任不管了，我們需要結合蜘蛛的來訪記錄和統計後台的用戶訪問頁面、跳出率、訪問時間、訪問來源、熱力圖等訪問情況來分析首頁的體驗情況，制定改善調整策略，然後對首頁結構、URL、內容等進行微調，甚至有必要時直接改版。我們需要不斷觀察分析改善首頁，才能持續的滿足用戶和搜索引擎的需要。

總而言之，首頁就是網站的門面，在佈置首頁時我們需要知道用戶需求什麼，搜索引擎喜歡什麼。然後再來合理分配好首頁各個元素。好的首頁能提升網站排名、降低跳出率、提高網站轉化率，不僅對於網站SEO優化意義重大，而且如果首頁作為競價推廣的落地頁，那將會大大降低網站成本。而相反，混亂的首頁會趕走用戶，就算是你的內頁很豐富。所以做好網站的首頁真的至關重要

 6G大小且超大流量的php免費空間

這家免費空間月流量限制是50G/每月，空間支持php和mysql數據庫，支持採用ftp上傳，控制後台使用的是zhcp，速度也不錯，沒有廣告，還可以綁定自己的網址名。不足之處是，該免費空間過於考慮安全問題，所以被禁用了很多函數，大致測試了一下，許多主流程序都無法在此空間上正常使用，很納悶的說。6G大小且超大流量的php免費空間申請地址是：zymic.com


showmywebsite提供2G免費php空間

showmywebsite免費空間的訪問速度，在我今天介紹的這幾款空間當中是最快的，而且採用cpanel控制面板，穩定性肯定不會差到哪裡去。另外，它還支持ssh安全連接，語言方面支持php和mysql數據庫，可以綁定自己的域名，支持採用ftp上傳，不過最大文件限制是100M。每月流量限制10G。還支持htaccess。showmywebsite提供的2G免費php空間申請地址是：showmywebsite.com

南台科技大學是學習風氣很濃厚的學校，連續一個半小時的演講，同學不但不覺得累，在會後還會主動來詢問一些技術面的問題，雖然同學們都很害羞，但是在他們的眼神裡可以感受到求知欲望的熱誠，相信他們的學習態度能很快地幫助他們在社會上佔有一席之地，加油!同學!!

鼎益盛不僅是joomla視覺客製化的專家，同時也是目前joomla開發的專業

以下是鼎益盛的joomla開發作品介紹

1. 高雄青春設計節的微電影全省報名系統+評審評選系統＋票選系統

1.利用歷屆的制式表單，做成單頁java，搭配ajax技術，能輕鬆跳出全省大專院校科系名單填寫完成之後，選擇瀏覽器預覽列印，達到IE7、IE8、IE9、IE10、Chrome、Safarifirefox均完美相容。

2.報名系統支援FB帳號登入
3.後台及時交叉統計各大專院校報名情況EX:朝陽科技大學視覺傳達系3人報名，全省共XXX學校XXX科系XXX人完成報名。
 4.前台顯示最新報名劇組影片及導演簡介、創作理念。
5.後台評選入圍系統
6.Facebook按讚票選最高人氣統計系統。

2.台中特教學校記錄足跡地圖系統
3.中興大學植物系田野調查報告交叉統計物種分析系統

4.virtuemart選單免設定懶人外掛

大家都是知道joomla的選單是不會自動更新的，尤其是購物網站要把選單分類成商品分類都還是要做連結設定為了方便客戶更有效率的管理購物網站，鼎益盛將選單改成自動化，只要在後台新增完商品，前台就會自動更新管理者不需要再做任何的選單設定。

 5.virtuemart免設定商品自對推薦配對外掛

 誠如鼎益盛一向的宗旨是讓客戶更無技術性、最不需要動腦、不需要學習網站操作的方式管理網站，鼎益盛也開發了能自動推薦配對相關商品的外掛，與一般外國人開發套件不同的地方是在於;鼎益盛提供您更廣域、更客製化的推薦，EX:指定輪播推薦商品、條件更細微的比對(0.5克拉的橢圓形寶石搭配可用戒台)

這一切都會由鼎益盛設定好，讓網站自動化，客戶不會看到嚇人的設定介面或發生新進員工操作弄壞的風險。

6.virtuemart新品區免設定程式自動上架下架功能

virtuemart內建功能是有包含設定天數可以自動下架的，但是這樣的功能已經不能夠滿足重度電子商務的客戶，畢竟時間成本也是很重要的無形資產，能避免人工的，鼎益盛就讓程式自動處理就好了，鼎益盛將此功能又做了更有效的運用，搭配選單自動抓取商品的功能，新增了一個<新品區>，讓30天之內新增的商品全都自動歸派到新品區，管理也者不需要逐一設定這個是新品那個不是，這個要在30天之後消失在新品區，鼎益盛將網站做成半自動化，管理者只要將商品正確上架，前台就會自動分派到該有的地方，省去了很多繁瑣的設定步驟，重點整理如下:

原來的購物車設定步驟:

商品上架-->設定分類-->設定上架天數-->設定相關商品-->設定選單-->新增選單-->設定選單商品連結EX:上衣、褲子...-->一次循環完成

鼎益盛改良後的購物車設定步驟:

商品上架-->設定分類-->一次循環完成

想想看，若您有200件商品，您會選擇哪一種上架方式?

7.virtuemart產品圖批次上傳無限多張套件

virtuemart內建原裝的圖片上傳一次只能傳一張，這對產品多的網路商店賣家來講是很麻煩及不友善的事情，如果一個產品有5張圖，就要重複上傳-->選擇圖片-->確定乘以五次，若使用的是免費空間或是規格較低的主機光是看畫圈圈等loading就能把一個人逼瘋了，於是鼎益盛開發了virtuemart圖片批次上傳的功能，讓網站管理者能快速的點選五張-->儲存，讓管理電子商務網站節省更多的時間。

8.各銀行線上刷卡金流

joomla在台灣支援第三方支付的模組套件應該就只有綠界了，但是許多joomla購物網站的老闆還是會選擇直接與銀行合作，鼎益盛目前開發較多的是玉山銀行虛擬帳號、玉山銀行線上刷卡、國泰世華、台新銀行等

每間銀行的規範格式不同，都須依照指定的API文件來製作。瀏覽者下訂單後選擇付款方式便會自動由銀行端的線上刷卡流程來完成交易。

9.立體式3D旋轉產品展示套件

10.外貿網站簡易版詢價系統

一般的外貿網站或公司形象網站要的就是產品展示和詢價功能而已，用virtuemart的話又嫌太龐大，許多老闆看到後台這麼複雜都會連忙搖頭說[我門公司不用這麼複雜的功能]，所以輕量的簡單的詢價系統才是客戶真正想要的。

11.ＦＢ＋邀請朋友按讚換現金優惠卷系統

鼎益盛在joomla taiwan 開發X行動X安全 台中聚會中有介紹過 這個套件的開發方式運用和過程，應用的情況如下:一間新開的餐廳要結合FB按讚分享的優惠活動，吸引客戶上門消費，按讚之後，網站會自動發布100元折價卷至消費者信箱，消費者就可以憑序號至店家消費折抵。joomla會員點數集點模組套件+joomla facebook 會員自動登入模組套件+joomla優惠卷產生序號發送至facebook帳號+joomla優惠卷註銷功能。

12.joomla網站發佈APP同步更新系統

鼎益盛不僅是joomla開發的專家，同時我們也開發各種app，與其他廠商不同的是，鼎益盛將app的成本降低了，也以主動行銷為主，搭配joomla官網來做更多新形態的行銷模式，讓客戶的網站不僅僅是被動的被搜尋，每天無能為力的看著瀏覽人數。主動的行銷模式能讓客戶的促銷訊息在第一時間出現在消費者的手機螢幕上，最重要的是網站管理者只要在網站更新最新消息，FB、APP都會同步更新，讓客戶的行銷操作更簡單更準確更方便!

13.微博同步發佈外掛

隨著微博的普遍許多產業也慢慢地開始經營大陸網站，但是每次都要重複在不同的地方PO一樣的文章是很囉唆麻煩的事情，鼎益盛獨家開發了只要您在joomla網站上PO文，微博帳號就會同步自動更新發布的模組，讓您不會有多餘的工作量。

14.響應式網站顯示外掛/手機版網站外掛（全系列joomla版本都能用）

響應式網頁設計(Responsive Web Design)/手機版網站現在已經是必須的建置項目，這個功能讓各種手持裝置都能正常顯示網站(IPAD，手機，小筆電....)，不會再有卷軸拉不完的情況發生，也能讓瀏覽者在第一時間找到他要的資訊，在無形能幫消費者解決很多問題，並且提高品牌信任度，很多老闆都覺得這是一個可有可無的功能，不想花錢在這個功能上，但是他們不知道的是，因為沒有這個功能，消費者的品牌信任度正在逐漸流失中 EX: 朋友聚在一起說等等一起吃飯吧? 大家開始七嘴八舌的google找店家，你很想推薦一間餐廳給大家吃，偏偏手機滑了半天找不到正確的資訊，一點開電腦版的頁面又太大，光是拉到頁腳就要滑半天，其他人都找到餐廳資訊你還在滑，又沒法一心二用參與討論，乾脆索性不滑了去別人推薦的餐廳，在大家開心聊天的氛圍中，最後決定用餐的這間餐廳在大家的心中好感度和品牌信任度整個大提升，消費者都是健忘的，至於滑不到資訊的那一間? 就有緣再見了~ 

鼎益盛不僅僅是作網站而已，我們致力於用各種方式讓客戶能利用網路行銷來幫助提高品牌能見度，許多客戶的網站已經經營多年，也暫時沒有要改版的打算，於是鼎益盛推出了貼心服務，獨家開發了全系列都能支援的手機版模組外掛，即便是joomla1.5版本也能支援手機版網站。

joomla會員註冊出現空白頁 或出現 <could not open socket>字樣

這一樣也是圖形驗證出現的問題

請參考http://des13.pixnet.net/blog/post/54706838

現在官方已經提供補丁解決

只要更新到最新版本就行了

P.S. 

記得要備份!!!!

joomla 圖形驗證碼功能開啟後能抵擋垃圾郵件及機器人灌水的情形

但最近發現同時有許多客戶的驗證碼出現了無法顯示的問題 (如下圖)

原因是因為呼叫recaptcha的網址變更了所以造成顯示不正常

原來的網址是http://api.recaptcha.net

只要更改為http://www.google.com/recaptcha/api 就能正常顯示了

更改位址/public_html/plugins/captcha/recaptcha/recaptcha.php

找到網址更換即可

或是直接下載 修正檔套件更改
http://seepeoplesoftware.com/downloads/patches/patches-recaptchafix1-0.html

HTTP 狀態碼

Access denied for user 

用筆記本打開 刪除這行字就行了

目前台灣這幾大主機商中，只有捕夢網匯出的會經常造成失敗

就是因為他定義了使用者

智邦、遠振都沒有這些問題

雙11後阿里巴巴發布了許多文案來宣揚自己的業績，為了直觀表述，他們是這樣說的：天貓當天一小時賣出200萬條內褲，連起來有3000公里長；11月11日上午10點半，天貓賣出了約6600萬片紙尿褲，以一片紙尿褲吸水1000毫升來算，可以吸乾6個西湖的水。

在喧囂狂躁的雙11期間，這樣的文案更能鼓舞人心士氣，讓人感嘆阿里巴巴的強大。不過人最怕認真二字，偏偏就有認真的江寧公安微博，在計算出差距後徑直指出問題所在。江寧公安表示，200萬條內褲如果連起來有3000公里長的話，每條內褲約為1.5米，不知道這樣的內褲是要用來做什麼的；江寧公安還表示，西湖水量為1000萬立方米，6600萬片紙尿褲，僅能吸走西湖水量的0.6%，如果按天貓文案上所說的吸走6個西湖水，那每片紙尿褲就要吸走一噸水。

阿里巴巴隨後打了個哈哈，誠懇認錯，表示自己是確實算錯了，是小編數學不好，並在隨後編出了馬雲與小編的對話以增強娛樂效果。但我非常不理解的一點就是，如此重要的數據為何會兩次算錯，阿里巴巴內部對數據的嚴肅性到底能隨意到什麼程度。天貓在微博上的宣傳文案頗受關注，被認真者如江寧公安揪出來在常理之中，另外還有大量直接公佈出來而不加修飾的數字，到底是真實的，還是注了水。

雙11進行期間，就陸續有天貓店家被揪出刷銷量，AK男裝店內同一ID反复購買3999元的單品，總數達到了幾十單，其他很多品牌旗艦店中，也都出現了同一ID反复購買的情況。天貓店旗艦店是整個淘寶系中質量最好，銷量最大的店鋪，多為公司化運作，要給天貓繳納高昂的保證金和返點，這樣的店鋪都會在銷量上作假，很難讓人相信阿里巴巴雙11銷量數據的真實性。

阿里巴巴在對外公關上的概念嫁接，幾乎是出神入化的，他們能把紙尿褲銷售量與吸乾西湖水聯繫在一起，更能計算出某商品的銷售量能圍繞地球轉多少圈，當然計算的時候太不嚴謹了，不應該。本次購物節的銷售額，阿里巴巴是這樣公佈出去的：截止11月11日晚24點，天貓“1111”購物狂歡節支付寶成交額為350.19億元。

於是，第二天報紙版面上赫然出現天貓銷售額350億元的數字，這等於在說，阿里巴巴足球隊與新浪足球隊首場比賽以0:5慘敗，第二場籃球賽阿里對新浪以66:59獲勝，比分相加後阿里以總比分7:5戰胜新浪隊。這麼荒謬的概念嫁接，私底下開開玩笑倒還可以，沒想到竟然獲得廣泛認同，甚至成為標籤化的東西，令人捧腹。

讓我們斷一下這句話的含義吧。首先，支付寶成交額不等於天貓銷售額。支付寶除了天貓和淘寶使用外，還提供給很多其他電商網站作為第三方支付工具用，他們通過支付寶的銷售額，也被記到天貓總額中去了。第二，350億不等於天貓銷售額，這裡面還包括淘寶的銷售額，這個活動的名字叫天貓1111購物狂歡節，但顯然並不是天貓一家的事情。阿里官方對外公佈這樣一個巧妙嫁接的說法，目的是為了凸顯天貓的價值以增加上市籌碼，但誰都知道，淘寶銷售額是要比天貓高好幾倍的，而淘寶的銷售額，是收不來返點的。

雙11數據中，唯一有較大價值的是天貓的真實銷售額，因為這一數字直接與阿里的營收掛鉤，但阿里一直都不予公佈，而是大肆宣傳總成交額。設若350億元都為天貓所得，阿里今年4季度僅此一項營收按5%扣點計算，便為17.5億元人民幣。其餘來自淘寶的銷售額，來自話費充值、彩票、虛擬商品及團購酒店餐飲等服務業消費額，動輒數百萬元和上億元的房產、廠房等司法拍賣，類似微信上爆出的2000萬元疑似刷量大單，本質而言並不具備充分的有效性。

但阿里巴巴卻把所有數字都集中在一起，用來向外展示實力，向領導邀功請賞。這如同一個農民養了10頭豬，40隻雞鴨，領導來了問牲畜存欄多少，回答是50頭一樣。阿里並不是不知道家畜和家禽的區別，難的是揣著明白裝糊塗，來回玩那種會使人格分裂的數字和文字遊戲，而且一玩就是幾年。

阿里巴巴雙11當然是中國最厲害的，世界最厲害的，甩出黑色星期五多少條街了，但為了好上加好，突出自己超牛的特質，他們在數據上翻手為雲，嫁接概念，其雙11銷售數據之水，從他們錯誤百出的文案中可見一斑。如果為了迷惑投資者而先把消費者迷惑掉，那為了上市而付出的這個代價，未免也太大了。

我不明白那6個西湖水是怎麼來的，也不明白怎樣的算術才能算出1.5米的內褲，這得把小數點往前移動多少位才能得出此結論，但我很清楚，這個6個西湖水和1.5米的內褲並非孤立事件，同阿里巴巴雙11的數據之間，有著扯不清的千絲萬縷的關係，阿里巴巴人聞者戒吧。

http://read.news.baidu.com/article/2013111703.html

國外主機空間的時間通常的是顯示主機所在地的時間

這對台灣人來講是挺不方便

更改的方法很簡單

只要打開.htaccess檔案

在後面加上這一行就解決了所有目錄下的時區問題

php_value date.timezone Asia/Taipei

Facebook第三季節營收報告：每個企業必須知道的35個重點

1. 在使用Facebook的美國用戶中，平均有48%只利用他們的行動裝置上FB。

2. Mark Zukerberg表示他的首要長遠目標是要“連結全世界”。

3. 消費者在行動裝置上使用app的時間中， 佔了20%是在用Facebook app，包括通訊軟體Messenger和Instagram。

4. Facebook第二個長遠目標是透過每天在Facebook Graph(圖譜)上所發佈的數以十億計的內容去“瞭解這個世界”。

5. Facebook在動態消息流(News Feed)的體驗上的投資最大，因為這是目前為止“在人們的手機上最多人使用的app”。(根據Mark Zuckerberg所言)

6. 世界上有50億人口還沒有發現Facebook(主要指美國以外)，全球成長仍然是FB的首要目標。

7. 貼文搜尋(Post Search)花了兩年的時間開發，用了超過700Terabytes的記憶體去組織，並逐步在美國開始啓用。這個功能可以讓你在圖譜搜尋(Graph Search)中輸入你的查詢，例如：“關於感恩節的貼文”，然後查看所有Facebook用戶設定為“公開”的有關感恩節的PO文－即使他們不是你的朋友。

8. Facebook擁有的Instagram每月有1.5億的活躍用戶。

9. 使用桌面電腦的Facebook每日活躍用戶稍微減少。

10. 由於行動裝置用戶的帶動，現在Facebook的每日活躍用戶為7.28億。

11.  今年第三季，Facebook營收首次超越20億關口。

12. Facebook從每位用戶身上獲得1.72美元的營收。

13. 每日活躍用戶每週與一則廣告作出互動。

14. Facebook現有員工人數為5,800人。

15. 在當季，Facebook針對每位行動用戶投送的廣告次數有所增加。

16. 美國青少年FB用戶維持穩定。

17. Facebook的人工智能小組正在就“瞭解這個世界”的目標上進行領導性的工作，試圖搞懂人們分享的所有內容。目前的研究工作已經進入聲音辨識階段。

18. Facebook的第三順位目標是建立知識型經濟。

19. Facebook持續地建構幫助人們更有效運用資訊的工具。

20. 在Facebook建立知識型經濟的同時，他們將透過更優質的廣告、更深入的瞄準方式、更好的分析工具及更豐富的型式，以改善其廣告產品。

21. Facebook期望透過瞭解世界，可以展示讓人感覺較不干擾、從用戶的生活角度上更精準的廣告。

22. 第三季的廣告營收為18億美元。

23. 行動裝置廣告營收佔總廣告營收的49%。

24. 消費者花在桌面電腦上的時間中，有1/8是在Facebook上。

25. 消費者花在行動裝置上的時間中，有1/5是在Facebook上。

26. Facebook看到來自行動裝置的營收機會，因為：“在今天，在行動媒體時間中，行動裝置佔12%，只是行動廣告預算的3%而已”。(據營運執行長Sheryl Sandberg所言)

27. Facebook持續專注於成果的監測，向品牌展示在Facebook上投放廣告可以帶動銷售。

28. 超過1百萬個企業曾經付費在Facebook上投放廣告。

29. 目前有2,ooo萬個已發佈的Facebook粉絲專頁。

30. 每一家AdAge全球100強的品牌在過去一年都有在Facebook上投放廣告。

31. 有62%的新廣告主開始推廣“專頁貼文”和“專頁按讚”。

32. 在所有動態消息中，約有5%是廣告。這個數字對任何地理位置的用戶都基本一致。

33. 圖譜搜尋已經收錄了1兆個連結(connections)。

34. 在未來幾年中，Facebook的一大焦點是針對已收錄的連結，增加其實用性。

35. Facebook的廣告產品將持續開發，讓廣告符合相關的模式 (如：在Instagram中出現的圖片廣告)。

google search-engine-optimization-starter-guide

google 官方針對自家的搜尋SEO優化提供了教學手冊

下載網址

sitemap網站地圖 製作方式  

google sitemap官方標準規範請參考此連結https://support.google.com/webmasters/?hl=zh-Hant&authuser=1#topic=8476

1.建立sitemap. xml檔 

2.提交給google

接下來會依照個步驟解釋..

joomla最常用的sitemap 套件下載 點我連結網址

安裝之後進入後台會出現網站上的所有選單

可以用拖拉的方式將順序排列  選擇完成之後-->儲存 --->新增選單-->網站地圖-->選擇sitemap -->完成

以上是joomla套件的設定方式

或者是可以利用一些sitemap產生器來 產生檔案，傳到FTP後提交給google

sitemap 產生器網址:http://www.xml-sitemaps.com/

輸入網址之後會自動產生檔案列表，將以下畫紅線的檔案放到網站根目錄即可。

google sitemap提交  

請先進入google網站管理員工具的網址頁面 點我開啟網址

右邊會出現新增的介面，若你是使用FTP上傳的話，直接在空白欄位輸入sitemap.xml 即可。

輸入完畢後再按一下 <測試sitemap> ，會出現成功提交的畫面，這樣就大功告成啦~

就是因為ActiveX 

伺服器端ActiveX元件通常是指執行在服務處理程序中的元件。一個典型應用是在IIS中執行的ASP指令碼建立的ActiveX Data Objects，也稱ADO。

專業技術文請參考維基百科的ActiveX

以下是白話懶人包解釋...

簡單的說就是看建置規劃的廠商有多少預算

就好像你可以把無障礙設施做得非常好，但是建置花費成本很高
或者是只在門口做了一段小斜坡，卻不顧人行道都是停滿的摩托車

把工期預算評估起來，結論人一樣能到建築物裡面

各位想想長官們會選擇預算高的還是預算低的?

這就是為什麼很多銀行都是IE ONLY

因為當初就選擇了只有IE能解讀的數位簽章建置方式

要每個瀏覽器都支援不是做不到

是預算會飆高

而客戶並不會因為IE ONLY就流失

於是 我們就會不斷地看到 IE ONLY的字樣了