法務部司法官學院-許家瑀

ray 法務部
#1

網站

法務部司法官學院

姓名

許家瑀

日期

2017-11-23

瀏覽器解析度（iOS的Safari填裝置名稱 macOS填瀏覽器解析度）

iPad Pro
1366 * 768

作業系統版本

iOS 11.1 (15B93)
window 10（1703）

瀏覽器版本（iOS的Safari填iOS版本）

Chrome：版本 62.0.3202.94 (正式版本) (64 位元)
Safari：版本 11.1

有發現表格排版影響閱讀問題（大量table爆炸可以截示意圖列出位置就好）

無

有跑版（影響閱讀）問題

多處微超版
範例1首頁

範例2首頁>學院簡介>院長簡介

首頁>學院簡介>院徽簡介：safari跑版
chrome
safari

首頁>學院簡介>院長簡介：safari 字微重疊

有出現亂碼

無

有壞掉的連結

首頁>數位課程：兩個子網站都死了

首頁>首頁>常見問題：兩個項目都死了

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

safari 多處無外掛
範例1 首頁>學院簡介>院徽簡介
chrome
safari

有不能運作的網頁元素（如按鈕不能按、選單不能選等）

無

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

網址應為：http://www.tpi.moj.gov.tw/mp092.html

網站裡多附件是以json型式提供下載，便民程度有待商榷(是否可閱)?。
在safari檢視下會呈現下列情況：
範例1首頁>學院簡介>組織架構

範例2首頁>學院簡介>院長簡介

首頁>學院大事紀>國際交流：似乎忘了附上日期

chrome的字體都是以標楷體顯示，但safari似乎只能呈現新細明體。
chrome
safari

對此網站建議（給個建議吧）

建議行距可以不必這麼擁擠。如附圖。

建議[首頁>圖書查詢>圖書室簡介]可不必有A畫面，直接進入B畫面即可
A
B

首頁>圖書查詢>圖書室簡介：文字部分建議加上格線

格線擁有畫龍點睛之作用，請在每一處該點上的地方加上，謝謝～
範例：

覺得好緊好密，看了不舒服><

#2

問題描述

可能原因

頁面尾部不當的表格排版導致超出頁面寬度，而上方的公告單純因為 width: 100% 而跟著一起撐大

修改前

修改後

建議修改

參考

#3

問題描述

可能原因

參考

#4

問題描述

可能原因

全形空白格排版…

建議修改

可以考慮使用項目清單

#5

問題描述

可能原因

行高問題

行高使用 px 作為單位，但文字大小使用 pt 作為單位，因此會出現行高不夠，導致文字重疊

可參考

建議修改

不建議使用 px 作為文字相關設定的單位，可改用 rem / em 等作為設定基準

#6

問題描述

建議

json 型式作為開放資料格式其實不錯（適合做 API），但是資料內容的 key 可能不要使用中文比較好。

針對是否便民這一點，下載的附件資訊本身在網頁已可以檢閱，民眾不必需下載即可觀看內容。

若考慮下載資料是做其他應用， json 是適合提供給程式利用資料的好格式，但就如前述，資料的 key不要使用中文比較好

#7

問題描述

可能原因

因為 Mac OSX / iOS 本身沒有標楷體，標楷體是微軟的專有字體。

P.S. Mac OSX / iOS 呈現的是系統內建黑體 (可能是黑體繁/蘋方體)

建議修改

不要使用標楷體作為網頁字型，標楷體的稜角過多並不是和螢幕閱讀，應僅作為印刷之用。