勞動部-穆邦妮

網站

中華民國勞動部

姓名

穆邦妮

檢測日期

2018-04-02

檢測裝置

iphone 6

作業系統 與 瀏覽器版本

ios 11.2

解析度(手機螢幕)

375x667 pixels

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

壞掉的連結


跑版(影響閱讀)問題

  1. 首頁>本部簡介>聯絡資訊
    交通路線(地圖+搭乘方式)地方被卡掉了,無法發大或縮小頁面。解法連結
    (圖一)以下為手機板

    (圖二)以下為正常的網頁板

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

出現亂碼

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

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

閱讀模式

有些無法有些可以

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

首頁>業務專區>工作規則>工作規則參考手冊展開
出現不明指示物(手機板與網頁板都有問題)
(圖一)solution


(圖二)正常指示如下圖
2018-04-02 (5)


  1. 首頁>相關連結>國外勞工業務網站>國外勞工運動與工會組織
    輕微跑版,但不影響觀看內容
    (圖一)手機板solution

    (圖二)正常網頁板

3.首頁>重大政策>施政績效
此頁輕微跑版(無法放大/縮小解決),但不影響觀看內文。
(圖一)以下為手機板


(圖二)以下為正常的網頁板

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

  1. 勞動部>民意信箱>操作常見問題
    沒有選取頁碼過後的痕跡,且通常會有下一頁或上一頁的選項

問題:

表格突出

可能原因:

圖片寬度寫死造成表格邊界超出

原始程式:

<img style="width: 500px; height: 498.4615384615385px;" src="/media/3810815/map03.jpg?width=500&amp;height=498.4615384615385" alt="" data-id="32212">

建議修改:

<img style="width: 100%; height:100%;" src="/media/3810815/map03.jpg?width=500&amp;height=498.4615384615385" alt="" data-id="32212">

補充

建議嵌入google map.
ref

結尾(選填,可增加網站建議)

問題:

排版不佳

可能原因:

寫死寬度沒設min-width

原始程式:

<td width="1%" align="center" valign="middle">1</td>

建議修改:

add min-width

<td width="1%" align="center" valign="middle" style="
    min-width: 30px;
">1</td>

補充

建議使用 <ol>
ref

結尾(選填,可增加網站建議)

問題:

圖片突出

可能原因:

除片寬度寫死

原始程式:

<img style="width: 500px; height: 375px;" src="/media/3809670/投影片1.jpg?width=500&amp;height=375" alt="" data-id="25984">

建議修改:

圖片寬高改responsive 或是重寫

補充

結尾(選填,可增加網站建議)

問題:

被藏起來了

可能原因:

overflow: hidden;

原始程式:

code

.ac-container article ul {background: rgba(255, 255, 255, 0.5);margin-top: -1px;overflow: hidden;height: 0px;position: relative;/* z-index: 10; */-webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;-moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;-o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;-ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;transition: height 0.3s ease-in-out, box-shadow 0.6s linear;}

code

.ac-container label {padding: 10px 100px 10px 17px;margin: 0;position: relative;z-index: 20;display: block;color: #333;line-height: 25px;font-size: 1.063em;background: #ffffff;background: -moz-linear-gradient(top, #ffffff 1%, #eaeaea 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #ffffff), color-stop(100%, #eaeaea));background: -webkit-linear-gradient(top, #ffffff 1%, #eaeaea 100%);background: -o-linear-gradient(top, #ffffff 1%, #eaeaea 100%);background: -ms-linear-gradient(top, #ffffff 1%, #eaeaea 100%);background: linear-gradient(top, #ffffff 1%, #eaeaea 100%);filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eaeaea', GradientType=0);box-shadow: 0px 0px 0px 1px rgba(155, 155, 155, 0.3), 1px 0px 0px 0px rgba(255, 255, 255, 0.9) inset, 0px 2px 2px rgba(0, 0, 0, 0.1);}

建議修改:

刪除 overflow: hidden;
刪除 z-index;

補充

結尾(選填,可增加網站建議)