勞動力發展署 微型創業鳳凰網站-鐘弘育

ray 勞動部
, ,
#1

網站

微型創業鳳凰網站

姓名

鐘弘育

檢測日期

2018-05-22

檢測裝置

iphone 6

作業系統 與 瀏覽器版本

ios11.3

解析度（手機螢幕）

375x667

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

是

壞掉的連結

無

跑版（影響閱讀）問題 解法回文

首頁
1.導覽列被遮住，要往下滑才會出現
IMG_AE6DCA2247AD-1

2.滑到下面時標籤才會出現，並且導覽列沒有一次列出所有選項，要手動去滑動才會出現下方的選項很奇怪，使用很不方便
IMG_332B9CEC795D-1

3.網站上方的幾個選項佔去太多的版面，影響閱讀

首頁>最新消息
1.多了一個line的圖示 解法回文
IMG_1FDFAEECD9B3-1

2.最新消息內的貼文的所有圖片都會被壓縮得很嚴重 解法回文
IMG_99FE402872FB-1

首頁 > 創業顧問諮詢 > 輔導顧問團
如圖，
1.圖片超出邊界
2.這樣的排版有點太擠會遮住彼此的頭像（雖然根本沒有頭像）解法回文
IMG_E25975FF895A-1

首頁>創業課程>整年度課程查詢
下方表格完全一個大爆炸 解法回文
IMG_BB32A290458A-1

首頁 > 微型創業鳳凰 > 文件下載
首頁 > 下載專區
下方表格也爆炸了 解法回文
IMG_22371F2CB364-1
IMG_53DA3E52844B-1

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

無

出現亂碼

無

不能用的外掛程式（Flash、ActiveX、Applet、Silverlight、…）

無

網站載入緩慢（相對一般網站）

無

閱讀模式

部分可以用

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

無

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

#2

問題：

可能原因：

設計問題

原始程式：

(範例)
位置： style.css:1954

@media screen and (max-width: 769px)
[class*="col-"] + [class*="col-"] {
    margin-top: 3.6rem;
}

建議修改：

他為了把header藏在後面下了一些margin，建議其實可以直接露出來

@media screen and (max-width: 769px)
[class*="col-"] + [class*="col-"] {
    margin-top: -50px;
}

補充

其實我覺得還可以，只是很怪而已，可以一開始進去捨棄最上方的資訊，直接顯示header，可能就不會那麼怪了45

#3

問題：

建議寫法：

兩個都有功能，建議將一個拿掉

#4

建議解法：

height不要寫死，改成auto
05

#5

問題：

可能原因：

RWD 設定錯誤

原始程式：

位置：https://beboss1.wda.gov.tw/upload/cht/webstyle_default/css/style-beboss.css?v=1:155

.consultant-item {
    float: left;
    width: 25%;
}

建議修改：

寫media讓他在小螢幕時

 width: 100%;

補充

27

#6

問題：

補充：

這個問題好像被修正了，目前使用了scroll的方式，但還是建議可以用其他排版方法