勞動及職業安全衛生研究所-楊喻文

網站

勞動及職業安全衛生研究所

姓名

楊喻文

檢測日期

2018-04-28

檢測裝置

OPPO A57

作業系統 與 瀏覽器版本

Android 6.0.1
Chrome版本:Chrome 65.0.3325.109

解析度(手機螢幕)

320x640 pixels

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


壞掉的連結


跑版(影響閱讀)問題






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


出現亂碼


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


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

閱讀模式

我使用安卓


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


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

  • 網站設計的蠻漂亮的,首頁部分可以看到他不同區塊(內容)用了不同顏色為底,讓使用者可以更方便的去閱讀

問題

可能原因

非RWD設定(長寬固定)

建議修改

位置:https://www.ilosh.gov.tw/menu/1153/1164/三-職業安全衛生研究策略/ :559

<img style=" width: 100% ; height:100%;" src="/media/1193/三-1.jpg?width=500&amp;height=288.4353741496599" alt="2016-2019年安全衛生研究主軸" data-id="1574">

補充

圖片

問題

可能原因

請大家好好善用bootstrap這個工具,bootstrap它很棒有幫table儘可能做自適應
還有不要再幫image外面包一層p tag了

原始程式

(原始碼找不到位置,反正有table的地方就對了)

<div>
	<table class="table table-striped" rules="all" id="MainContent_DetailsView1" style="width:730px;border-collapse:collapse;" cellspacing="0" border="1">
		<tbody><tr>
			<td style="width:130px;">其他出版品名稱</td><td>職場樂活‧工作壓力、過勞、憂鬱百寶箱</td>
		</tr><tr>
			<td>出版單位......
......
<p align="center"><img alt="封面" src="/UserFiles2/Image/manual/melancholy/LOHAS.jpg"></p>

建議修改

<div class="table-responsive">
	<table class="table table-striped" rules="all" id="MainContent_DetailsView1" style="width:730px;border-collapse:collapse;" cellspacing="0" border="1">
		<tbody><tr>
			<td style="width:130px;">其他出版品名稱</td><td>職場樂活‧工作壓力、過勞、憂鬱百寶箱</td>
		</tr><tr>
			<td>出版單位

......
<div style="align: center"><img alt="封面" src="/UserFiles2/Image/manual/melancholy/LOHAS.jpg"></div>

問題

可能原因

非RWD設定,長度以px固定

原始程式

位置:https://www.ilosh.gov.tw/menu/1153/1154/ : 534

<div id="gotop" class="uk-icon-angle-up">回頁首</div>

建議修改

電腦版跟手機可能要用@media區分開來,因為電腦版比手機版多了一些資訊,左邊多了一個nav,所以shift會是不太一樣的

<div id="gotop" class="uk-icon-angle-up" style="margin-left: 30vw;margin-right: 40%;">回頁首</div>

補充

圖片