衛生福利部食品藥物管理署-謝茵安

網站

衛生福利部食品藥物管理署

姓名

謝茵安

檢測日期

2018-04-27

檢測裝置

SAMSUNG-J700F

作業系統 與 瀏覽器版本

Android 5.1.1
Chrome版本:Chrome 65.0.3325.181

解析度(手機螢幕)

螢幕解析度 360X640

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

壞掉的連結

1.外部網站連結顯示404
首頁>業務專區>區管理中心>美國帶骨牛肉及牛肉製品邊境聯合查驗
image
2.外部連結網頁無法使用
首頁>消費者專區>打擊不法藥物成果
首頁>消費者專區>衛生局不法藥物檢舉獎金辦法之辦理情形
image


跑版(影響閱讀)問題

1.網址跑掉(部分網頁有此問題) 解法回文連結
首頁>公告資訊>活動訊息>敬邀參加107年度健康食品查驗登記法規暨常見缺失宣導溝通說明會
首頁>公告資訊>食藥闢謠專區>聽說蜂蜜和大蒜不可以同時吃,這是真的嗎?
首頁>業務專區>醫療器材>許可證申請,變更,展延>聯絡方式
image
2.表格跑掉 解法回文連結
首頁>機關介紹>署長介紹
首頁>業務專區>管制藥品>管制藥品製藥工廠>銷售藥品一覽表
首頁>消費者專區>各縣市衛生局網站
image
3.文字不對齊 解法回文連結
首頁>機關介紹>組織法
首頁>業務專區>管制藥品>管制藥品管理使用手冊
image
4.內文跑版 解法回文連結
首頁>機關介紹>署徽設計說明
首頁>消費者專區>相關法規
首頁>交通位置圖
image


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

1.圖片無法顯示
首頁>業務專區>食品>預防食品中毒宣導-肉毒桿菌專區>防治肉毒桿菌食品中毒海報
image

出現亂碼

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

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

閱讀模式

Android系統

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

1.有些表格比較窄,像電話這類的連絡資訊就會完全被壓縮,造成觀看不易。(多個網頁都有此問題)
首頁>機關介紹>機關聯絡資訊
image
2.搜尋欄位打了文字後,沒有任何可以搜尋的按鈕,用手機按Enter也無法進入搜尋結果的頁面。
首頁>一站式搜尋
image
3.點進連結,跳出一個視窗說:您尚未安裝UPKI元件或是將元件停用
首頁>外銷食品證明線上申辦系統
image

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

1.圖片可以另開新視窗,放大,這一點很好。
2.公告消息的重點有些會用紅字標示,這點非常方便閱讀。
3.有些網頁會像這樣,文章內附一張圖片,下面的附件又附了一張一樣的。同樣的照片出現了兩次。建議可以保留下面那張可放大的就好。
首頁>機關介紹>使命,願景及目標
image
4.有些頁面字體忽然變小,建議能把所有網頁的字體統一。(少部分頁面有此問題)
首頁>業務專區>化妝品>化妝品相關法規>相關函釋>有關 貴局函詢「蜂毒」、「蛇毒」成分是否可以添加於化粧品或為原料,及其限量標準乙案,復如說明段
首頁>業務專區>化妝品>化妝品臨櫃業務>含藥化粧品許可證展延臨櫃作業
首頁>業務專區>管制藥品>管制藥品相關委員會>管制藥品審議委員會
首頁>業務專區>邊境查驗專區>日本輸入食品輻射管制措施
image
5.內文排版怪。明明右側還有空間,文字卻全部擠到左邊。
首頁>業務專區>通報及安全監視專區>食品專區>國外健康食品衛生網站連結
image

問題:

可能原因:

超連結為連續英文字串,無法自動換行。

原始程式:

位置: view-source:無相關資料
927行

<a style="font-size: 14pt; font-family: Arial" href="http://www.cde.org.tw/news/activity_more?id=248">http://www.cde.org.tw/news/activity_more?id=248</a>

建議修改:

將超連結的style標籤中加入word-break: break-all;

<a style="font-size: 14pt; font-family: Arial; word-break: break-all;" href="http://www.cde.org.tw/news/activity_more?id=248">http://www.cde.org.tw/news/activity_more?id=248</a>

補充:

(修正後之截圖)
61

問題:

可能原因:

表格因應螢幕水平縮放,導致內容壓縮影響閱讀。

原始程式:

位置: view-source:署長介紹 - 機關介紹 - 衛生福利部食品藥物管理署
892行

<table width="100%" border="0" cellspacing="5" cellpadding="5">
  <tbody>
    <tr>
      <td width="40%">
        <p align="center"><img width="200" height="269" title="吳秀梅 署長" alt="吳秀梅 署長" border="0" style="HEIGHT: 269px; WIDTH: 200px" src="/upload/e_images/%E5%90%B3%E7%A7%80%E6%A2%85%E7%BD%B2%E9%95%B7_1.jpg"></p></td>
      <td width="60%" align="left" valign="middle">
        <div style="BACKGROUND-COLOR: rgb(255,255,255)">
          <p><strong>吳秀梅 署長</strong><br><br></p>
          <p><strong>學歷</strong></p>
          <ul class="dotList">
            <li>高雄醫學院藥學研究所博士</li>
            <li>高雄醫學院藥學研究所碩士</li>
            <li>高雄醫學院藥學系學士<br></li>
          </ul>
        </div>
        <p style="BACKGROUND-COLOR: rgb(255,255,255)"><strong>經歷</strong></p>
        <ul class="dotList">
          <li>
            <div style="BACKGROUND-COLOR: rgb(255,255,255)">美國維吉尼亞大學化學系研究學者 
            </div></li>
          <li>
            <div style="BACKGROUND-COLOR: rgb(255,255,255)">日本德島大學藥學系研究學者 
            </div></li>
          <li>
            <div style="BACKGROUND-COLOR: rgb(255,255,255)">高雄醫學大學藥學院院長 
            </div></li>
          <li>
            <div style="BACKGROUND-COLOR: rgb(255,255,255)">高雄醫學大學藥學系主任 
            </div></li>
          <li>
            <div style="BACKGROUND-COLOR: rgb(255,255,255)">高雄醫學大學香粧品學系主任 
            </div></li>
          <li>
            <div style="BACKGROUND-COLOR: rgb(255,255,255)">高雄醫學大學藥學系教授<br>
            </div></li>
        </ul></td>
    </tr>
  </tbody>
</table>

建議修改:

將表格結構重新排列,解法如下:

  1. <head>...</head>裡放入:
<style>
@media (max-width: 736px) {
  .table-rwd{min-width: 100%;}
  .table-rwd td {
    text-align: left;
    font-size: 15px;
    overflow: hidden;
    width: 100%;
    display: block;
    }
   .table-rwd td:before {
    display: inline-block;
    text-transform: uppercase;
    font-weight: bold;
    margin-right: 10px;
    color: #0c5904;
  }
  .table-rwd.table-bordered td,.table-rwd.table-bordered th,.table-rwd.table-bordered{border:0;}
  
}
</style>
  1. <table>標籤中加入class="table-rwd"
<table class="table-rwd" width="100%" border="0" cellspacing="5" cellpadding="5">

補充:

(修正後之截圖)
62

問題:

可能原因:

文字間有空格,導致換行時跑版。

建議修改:

將文字間的空格移除。

問題:

可能原因:

圖片寬度設為固定數值,導致跑版。

原始程式:

位置: view-source:署徽設計說明 - 機關介紹 - 衛生福利部食品藥物管理署
898行

<img width="600" height="378" title="署徽" alt="署徽" border="0" style="HEIGHT: 378px; WIDTH: 600px" src="/upload/e_images/署無全銜_去背.gif">

建議修改:

將圖片寬度設為百分比。

<img width="100%" title="署徽" alt="署徽" border="0" src="/upload/e_images/署無全銜_去背.gif">

補充:

(修正後之截圖)
63