好像有些人誤以為這篇是在嗆巴哈工程師
不過這真的只是在介紹網頁前端工程師容易忽略的問題
也沒有說全部用原生物件就一定好，要視情況而定
發這篇文單純的想讓剛入門網頁設計的開發者了解，網頁原生的物件具備哪些特定
像是很常有那種遊戲官網的介紹，使用圖片取代文字，這樣在搜尋引擎就搜尋不到這些文字
要先知道原生網頁具備什麼特性，才不會搞半天結果事倍功半
巴哈最近改版頻繁，界面跟功能有著大幅度的進步
眼尖的人可能注意到了
圖片上傳的小視窗已經俏俏改版，不再是那個陽春的界面
舊版的
新版的
有學過網頁設計的人一定一眼就能看出，舊版的那是原生的網頁物件
只要一行「<input type="file">」就能產生上傳檔案的網頁物件
這個上傳檔案的物件並不能進行太多樣式的修改
所以這時候很多經驗不足的設計師就會犯下一個致命錯誤
不使用原生物件，而是製作一個具有相同功能的物件來取代
這聽起來很容易，實際上非常困難
每個瀏覽器解析出來的網頁都會有些許差異，甚至現在還有行動裝置，要完美實現「原生物件的所有功能」是非常困難，而且非常容易出現BUG的「挑戰」
以巴哈做例子，新版的界面導致「拖曳上傳」的功能失效了
網頁原生的檔案上傳物件是支援拖曳上傳的
像是這樣，把檔案直接拖拉到框裡面即可上傳
在這巴哈新版的界面辦不到
還有另一個初學者常犯的錯誤
覆寫網頁捲軸
這是 北京故宮 的網站
http://www.dpm.org.cn/Home.html
界面做的非常漂亮，但對我而言使用者體驗非常糟糕
糟糕到我一個字都看不下去，就只因為他覆寫了原生的網頁捲軸
當使用者捲動網頁的速率與一般網頁不一樣，就會認定「這個網頁很LAG」
除了捲動看起來卡頓外，這還會讓使用者沒辦法按下滑鼠中間的滾輪來快速捲動網頁
(這個功能在MAC或一些Linux上面似乎沒有
其他還有很多，像是
覆寫超連結，改用JavaScript來切換網頁
原生的超了連接具備了以下功能：
- 超連結點過後會改變顏色，因為有安全性限制，js或css都沒辦法模擬此功能
- 增加在搜尋引擎的曝光率，也就是所謂的SEO
- 按著Ctrl點擊超連結，會使用新分頁打開
- 用滑鼠中間的滾輪點擊超連結，會使用新分頁打開
覆寫img標籤，使用DIV的背景圖來顯示圖片
原生的img具備以下功能：
- 增加在搜尋引擎的曝光率，設定title屬性的話可以二次增加
- 使用者可以直接拖拉圖片到桌面或資料夾裡面，來進行儲存圖片
- 使用者可以把圖片拖拉到瀏覽器上方分頁的位置，就會用新分頁開啟圖片
- 電腦可以右鍵儲存圖片，手機可以長按儲存圖片
使用圖片或其他物件替代文字
文字具備以下功能：
- 增加在搜尋引擎的曝光率
- 使用者可以透過瀏覽器的設定修改文字大小或字體
- 使用者可以選取複製文字
- 因為有 ClearType 之類的技術，所以在螢幕看起來會比較舒服
1為ClearType線
2是普通的反鋸齒線
3和4分別為1和2的四倍放大圖
5是1實際顯示在液晶顯示器上的放大示意圖。如圖所示，ClearType充分利用LCD色條排列特性，顯示出更為完美的斜線
補充
我在 js深色主題 裡面有幫巴哈修復了圖片不能拖曳上傳的問題
https://forum.gamer.com.tw/C.php?page=1&bsn=60076&snA=2621599
原理其實很簡單讓原本的<input type="file">變成透明的
然後覆蓋在新版的『檔案上傳物件』上面就行了
也就是說，使用者操作的是『原生的檔案上傳物件』
但因為『原生物件』設定成透明的，所以使用者看到的是在下面的『新版的檔案上傳物件』
如此一來就能同時具備原生功能與漂亮外觀
.dialogify .uploadimage-old {
position: relative;
}
.dialogify .uploadimage-old input[type="file"] {
display: block;
position: absolute;
left: -320px;
top: 0px;
opacity: 0;
width: 310px;
height: 35px;
}
