國立科學工業博物館-俞雋

網站

國立科學工藝博物館

姓名

俞雋

檢測日期

2018-4-16

檢測裝置

ASUS ZENFONE 3;型號:ASUS_Z017DA

作業系統 與 瀏覽器版本

作業系統:Android 8.0.0

瀏覽器版本:Chrome 65.0.3325.109

解析度(手機螢幕)

360*640 pixels, 24 bit

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

壞掉的連結

1.跳轉網頁無法正常顯示

首頁>參觀資訊>單一窗口服務>單一服務窗口>蒐研活動報名及查詢

首頁>網站服務>互動交流>FAQs>團體如何預約呢?

首頁>網站服務>志工園地>相關網站>衛生福利部志願服務資訊網

說明:跳轉後無法正常呈現,詳情見圖(一)、(二)。

圖(一)

圖(二)


跑版(影響閱讀)問題

1.未嚴重跑版但造成閱讀不便

首頁>訊息公告>訊息專區>全部訊息

說明:部分訊息所列表格於行動中會超出頁面,造成閱讀不便,詳見圖(三)。

解法回文連結

圖(三)


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

1.元件點擊後無反應

首頁>訊息公告>行事曆

首頁>教育資源>刊物出版品

首頁>教育資源>數位典藏

首頁>網站服務>網路資源

說明:網路元素無法操作,詳情可見下圖(四)

圖(四)


出現亂碼


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


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


閱讀模式

Android測試生


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


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

1.網站麵包穴機制運作不順暢,使用者無法以麵包穴跳轉回自己想回去的頁面,建議改進。

2.在檢測網站的時候發現會有相異站點內容卻相同的狀況,比如「教育資源」中「科學教育」下的「業務主軸」及「數位教材」內容相同,建議可以加以整併以精簡網站結構。

3.網頁底部並未設有標明頁數的網頁元件,讓使用者難以挑選頁面瀏覽,詳見圖(五)。

圖(五)

問題:

可能原因:

表格跑版頁面:【夏令營】小小程式設計師-Scratch程式的異想世界
表格寬度設置固定數值,導致跑版。

原始程式:

位置:view-source:https://www.nstm.gov.tw/ActivitiesDetailC001110.aspx?Cond=fe4c1d7b-1bb3-43ee-8e09-06654c9bddcf
874行

	<tbody>
		<tr>
			<td colspan="3" style="background-color:whitesmoke; width:446.95pt">
			<p style="text-align:center"><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><strong><span style="font-family:標楷體"><span style="color:#333333">Scratch</span></span></strong><strong><span style="font-family:標楷體"><span style="color:#333333">與物聯網玩程式寫遊戲</span></span></strong></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:#abbaeb">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><strong><span style="font-family:標楷體"><span style="color:#333333">課程名稱</span></span></strong></span></span></p>
			</td>
			<td style="background-color:#abbaeb; width:133.45pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">上課時間</span></span></span></span></p>
			</td>
			<td style="background-color:#abbaeb; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">課程內容</span></span></span></span></p>
			</td>
		</tr>
		<tr>
			<td rowspan="6" style="background-color:whitesmoke">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><strong><span style="font-family:標楷體"><span style="color:#333333">Scratch </span></span></strong><strong><span style="font-family:標楷體"><span style="color:#333333">基礎篇</span></span></strong></span></span></p>
			</td>
			<td rowspan="6" style="background-color:whitesmoke; width:133.45pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">7/24(</span></span><span style="font-family:標楷體"><span style="color:#333333">二)09:00~16:00</span></span></span></span></p>
			</td>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">學程式、寫遊戲</span></span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">1.</span><span style="font-family:標楷體">行星介紹</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">2.</span><span style="font-family:標楷體">貓咪鋼琴</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">3.</span><span style="font-family:標楷體">小熊接蛋</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">4.</span><span style="font-family:標楷體">章魚射擊</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">5.</span><span style="font-family:標楷體">獵殺鯊魚</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td rowspan="7" style="background-color:whitesmoke">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><strong><span style="font-family:標楷體"><span style="color:#333333">Scratch</span></span></strong><strong><span style="font-family:標楷體"><span style="color:#333333">碰上 Arduino 實戰進擊篇</span></span></strong></span></span></p>
			</td>
			<td rowspan="7" style="background-color:whitesmoke; width:133.45pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">7/25(</span></span><span style="font-family:標楷體"><span style="color:#333333">三)09:00 ~16:00</span></span></span></span></p>
			</td>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">Scratch</span><span style="font-family:標楷體">碰上Arduino</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">1.</span><span style="font-family:標楷體">模擬紅綠燈</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">2.</span><span style="font-family:標楷體">射擊大白鯊</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">3.</span><span style="font-family:標楷體">我是作曲家</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">4.</span><span style="font-family:標楷體">誰是大聲公</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">5.</span><span style="font-family:標楷體">天黑請開燈</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">6.</span></span><span style="font-family:標楷體"><span style="color:#333333">雙人桌球賽</span></span></span></span></p>
			</td>
		</tr>
	</tbody>
</table>

建議修改:

將表個加上水平滾輪,讓使用者可以滑動檢視,此不用更動表格結構。
做法:在表格外層加上```<div style=“overflow:auto;>”。

<div style="overflow:auto;>
<table cellspacing="0" style="width:446.95pt">
	<tbody>
		<tr>
			<td colspan="3" style="background-color:whitesmoke; width:446.95pt">
			<p style="text-align:center"><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><strong><span style="font-family:標楷體"><span style="color:#333333">Scratch</span></span></strong><strong><span style="font-family:標楷體"><span style="color:#333333">與物聯網玩程式寫遊戲</span></span></strong></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:#abbaeb">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><strong><span style="font-family:標楷體"><span style="color:#333333">課程名稱</span></span></strong></span></span></p>
			</td>
			<td style="background-color:#abbaeb; width:133.45pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">上課時間</span></span></span></span></p>
			</td>
			<td style="background-color:#abbaeb; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">課程內容</span></span></span></span></p>
			</td>
		</tr>
		<tr>
			<td rowspan="6" style="background-color:whitesmoke">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><strong><span style="font-family:標楷體"><span style="color:#333333">Scratch </span></span></strong><strong><span style="font-family:標楷體"><span style="color:#333333">基礎篇</span></span></strong></span></span></p>
			</td>
			<td rowspan="6" style="background-color:whitesmoke; width:133.45pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">7/24(</span></span><span style="font-family:標楷體"><span style="color:#333333">二)09:00~16:00</span></span></span></span></p>
			</td>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">學程式、寫遊戲</span></span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">1.</span><span style="font-family:標楷體">行星介紹</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">2.</span><span style="font-family:標楷體">貓咪鋼琴</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">3.</span><span style="font-family:標楷體">小熊接蛋</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">4.</span><span style="font-family:標楷體">章魚射擊</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">5.</span><span style="font-family:標楷體">獵殺鯊魚</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td rowspan="7" style="background-color:whitesmoke">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><strong><span style="font-family:標楷體"><span style="color:#333333">Scratch</span></span></strong><strong><span style="font-family:標楷體"><span style="color:#333333">碰上 Arduino 實戰進擊篇</span></span></strong></span></span></p>
			</td>
			<td rowspan="7" style="background-color:whitesmoke; width:133.45pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">7/25(</span></span><span style="font-family:標楷體"><span style="color:#333333">三)09:00 ~16:00</span></span></span></span></p>
			</td>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">Scratch</span><span style="font-family:標楷體">碰上Arduino</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">1.</span><span style="font-family:標楷體">模擬紅綠燈</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">2.</span><span style="font-family:標楷體">射擊大白鯊</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">3.</span><span style="font-family:標楷體">我是作曲家</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">4.</span><span style="font-family:標楷體">誰是大聲公</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體">5.</span><span style="font-family:標楷體">天黑請開燈</span></span></span></p>
			</td>
		</tr>
		<tr>
			<td style="background-color:whitesmoke; width:163.05pt">
			<p><span style="font-size:12pt"><span style="font-family:Calibri,sans-serif"><span style="font-family:標楷體"><span style="color:#333333">6.</span></span><span style="font-family:標楷體"><span style="color:#333333">雙人桌球賽</span></span></span></span></p>
			</td>
		</tr>
	</tbody>
</table>
</div>

補充:

(修正後之截圖)