標準檢驗局-高偉庭

網站

標準檢驗局

姓名

高偉庭

檢測日期

2018-04-20

檢測裝置

Samsung Galaxy S7 edge

作業系統 與 瀏覽器版本

Android 7.0
Chrome版本:Chrome 64.0.3325.109

解析度(手機螢幕)

360x640 pixels

是否會自動跳入行動版欄位?

壞掉的連結

  1. 首頁>影音專區>相片欣賞
    首頁>台北總局>重大政策>經濟部重大政策
    連到經濟部的網站但是似乎壞掉了(解法回文連結)
  2. 首頁>花蓮分局>公告
    2018-04-20_225640
    顯示此節點未開放解法回文連結
  3. 首頁>台南分局>展示室
    網頁一直跑不出來解法回文連結

跑版(影響閱讀)問題

  1. 首頁>台北總局>服務窗口>業務申辦
    首頁>台北總局>便民服務>服務項目
    首頁>台北總局>便民服務>相關單位電話及地址>相關單位電話
    表格顯示不全解法回文連結
    2018-04-20_220908

  1. 首頁>台北總局>法規服務>標準法規(裡面的每一項)
    首頁>台北總局>法規服務>商品檢驗法規(裡面的每一項)
    首頁>台北總局>法規服務>其他法規(裡面的每一項)
    有一些標題很大但內文很小,有一些全部字都很小,醜死ㄌ(btw這些應該不是手機版網站?)解法回文連結
    2018-04-20_221721
    2018-04-20_221753

  1. 首頁>台北總局>法規服務>度量衡法規>膜式氣量計型式認證技術規範第3版(只要有表格的)
    表格裡的字大小不一很難讀
    2018-04-20_222039

  1. 首頁>台北總局>法規服務>法規查詢>法規內容查詢
    首頁>台北總局>法規服務>法規查詢>歷史法規區
    搜尋欄位顯示不全
    2018-04-20_222654

  1. 首頁>台北總局>法規服務>法規查詢>法令解釋和實質法規命令查詢
    排版跑掉解法同上
    2018-04-20_222622

  1. 首頁>台北總局>影音專區>影片欣賞(裡面每一項)
    內插的youtube影片顯示不全解法回文連結
    2018-04-20_223026

  1. 首頁>基隆分局>活動訊息(裡面每一項)
    首頁>基隆分局>政令宣導>消除歧視性別平等
    首頁>新竹分局>活動快訊(裡面有圖片的的分頁)
    圖片顯示不全解法同上
    2018-04-20_224936

無法操作的網頁元素(如按鈕不能按、選單不能選等)

  1. 首頁>台北總局(每個分局的頁驗都有這個問題)
    往下拉,點按任何一個分頁進去(e.g. 單一窗口)後跳轉的那個頁面,左右上角的反回與回首頁按紐都不能點。而且在台北總局首頁左上的漢堡也不見了,很麻煩解法同上
    2018-04-20_223739
  2. 首頁>新竹分局>下載專區
    無法點按解法回文連結

出現亂碼

不能用的外掛程式(Flash、ActiveX、Applet、Silverlight、…)

網站載入緩慢(相對一般網站)

閱讀模式

不適用

其他(無法判斷屬於以上那個分類的都放在這邊)

  1. 首頁>資訊公開個資檔案資訊
    首頁>標準與正字標記>國家標準編修資訊
    首頁>台北總局>重大政策>施政計畫
    首頁>高雄分局>居家商品安檢
    首頁>高雄分局>商品安全學堂
    首頁>高雄分局>安全商品採購講習
    首頁>高雄分局>水產品鱻聯盟
    首頁>高雄分局>鋼鐵產品鑫聯盟
    沒有手機版網頁
  2. 首頁>台北總局(其他每個分局都一樣)的左側漢堡
    漢堡點開後的上方顯示標題項目,有點像是沒做完的感覺
    2018-04-20_232048

對此網站建議(非程式問題皆放置這裡)

  1. 首頁>台北總局
    明明點入的是台北總局,但是最上方顯示的都是經濟部標準檢驗局,這樣蠻怪的,我覺得應該標上台北總局比較好
  2. 點進各總局、分局的網頁,分成首頁往下滑的選單、與左上漢堡兩處選單,蠻混亂的
  3. 整體手機版的架構很怪,雖然一開始先分成各個分局點按,但是各分局點入首頁往下滑的資料都一模一樣,各分局左上漢堡按開資訊也大同小意。建議可以直接做成一個總網站就好,如果有各分局各自的活動訊息、新聞,再在總網站下的活動訊息與新聞欄位分開放。另外,很明顯的手機版網頁與電腦版網頁有資訊落差,除了排版、項目差很多之外,某些資訊的頁面也只有網頁版。

問題

可能原因

圖片
如上圖,multimenu.js這個檔案載入失敗,請先檢查一下檔案狀態
其次是jquery版本可能太舊了,同時要用jquery的話其實也不用下載到自己的資料夾,可以用CDN服務就好

原始程式

位置:經濟部標準檢驗局 : 13

<script type="text/javascript" src="xslgip/mobileHL/js/jquery-1.9.1.min.js"></script>

建議修改

<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="  crossorigin="anonymous"></script>

問題

可能原因

這是原本應該去的連結網址
從網指名猜測應該是開了8080這個port
可以看一下你們家網頁後端8080 port有沒有出事嗎?

問題

可能原因 & 建議修改

我這邊看雖然表格雖然需要左右滑動才可以看完,但是至少不會影響資料顯示
如果真的要改的話,比較快的方法應該是使用bootstrap的table-responsive
當然其實還是不推薦使用table,這種排版方式對RWD手機排版非常不友好,如果可以還是建議使用display: flex; 或是 display: grid;等css語法

問題

可能原因 & 建議修改

這篇是圖片太擠的解法,把img tag換成p tag,基本上就是改成grid排版,不然這種排版問題其實也沒救,最多每段文字加一段空間區隔,看要用div還是最直接的br

問題

可能原因

明明youtube內容都用百分比當單位了,最外面的iframe一旦用了px就什麼都沒有了

原始程式

位置:https://www.bsmi.gov.tw/wSite/ct?xItem=58211&ctNode=4627&mp=86 : 45

<p><IFRAME title="104年行動電源短片 40秒版" height=315 src="https://www.youtube.com/embed/AnFkWkVXUOg" frameBorder=0 width=560 allowfullscreen></IFRAME><BR><BR>影片字幕:<BR>為什麼<BR>你的行動電源有商品檢驗標識嗎<BR>商品檢驗標識<BR ......

建議修改

自適應的iframe這邊有兩種解法

<!--script這邊要放在head tag 裡面-->
<script type="text/javascript">
function SetCwinHeight()
{
var iframeid=document.getElementById("iframe01"); //iframe id
  if (document.getElementById)
  {  
   if (iframeid && !window.opera)
   {  
    if (iframeid.contentDocument && iframeid.contentDocument.body.offsetHeight)
     {  
       iframeid.height = iframeid.contentDocument.body.offsetHeight;  
     }else if(iframeid.Document && iframeid.Document.body.scrollHeight)
     {  
       iframeid.height = iframeid.Document.body.scrollHeight;  
      }  
    }
   }
}
</script>


<!--這邊則是放在body對應原本iframe的位置-->
<IFRAME id="iframe01" title="104年行動電源短片 40秒版" height=315 src="https://www.youtube.com/embed/AnFkWkVXUOg" frameBorder=0 width=100% allowfullscreen></IFRAME> ......

問題

可能原因

位置:view-source:https://www.bsmi.gov.tw/wSite/mp?mp=88 : 44

<a href="#" class="menupic menu_icon06">
									下載專區
								</a>

這是假連結…