全球華文網-高偉庭

網站

全球華文網

姓名

高偉庭

檢測日期

2018-05-07

檢測裝置

Samsung Galaxy S7 edge

作業系統 與 瀏覽器版本

Android 7.0
Chrome版本:Chrome 64.0.3325.109

解析度(手機螢幕)

360x640 pixels

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

壞掉的連結


跑版(影響閱讀)問題


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

  1. 首頁>教學示範影片專區
    在這個網站中的所有影片,在首頁直接點按影片的圖示時可以播放。解法回文連結
    如下圖:

    不過只要點進more,比如首頁>教學示範影片專區>華文網操作more,再點擊圖示或標題就都無法播放影片

出現亂碼

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

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

閱讀模式

不適用

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

  1. 沒有手機版網站
    首頁>其他>最新消息
    首頁>教材下載
    首頁>老師>師資培訊
    首頁>教師部落格
    首頁> 關於本站
    首頁>網站導覽
    首頁> 會員規範
    首頁>著作權聲明
    首頁>資訊安全政策
    首頁>隱私權政策
    首頁>常見問題Q&A
    首頁>維運單位
    首頁>老師>google專區>華語文學習網
    首頁>學生>數位閱讀
    首頁>學生>數位學習
    首頁>其他>資源連結

  1. 首頁
    每一個資訊圖卡的功能設計都不太一樣,有些是圖片下有子分類(如下圖一)、有些是按圖片之後才會跑出子分類(點擊圖片後顯示如下圖二),建議可以統一一種形式,民眾才不會搞混
    2018-05-07_120935
    2018-05-07_120946

3 首頁
資訊圖卡的部份,點擊圖片後才會跑出子分類的形式很不方便,很容易讓人點錯、或是沒有發現有子分類
點擊前:
2018-05-07_121139
點擊後:
2018-05-07_120946

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

  1. 並非所有在首頁顯示的項目都有被放在右上漢堡的清單中(e.g. 教學示範影片專區),容易讓讀者漏掉,建議漢堡清單內要補上所有網頁的分類項目
  2. 大部份網站內容都沒有做成手機版,建議要把整個網站都做出手機版較方便民眾使用

問題:

可能原因:

頁面最下方的分頁工具列外層的div過長,蓋住整個頁面,導致影片無法點擊。

原始程式:

位置:view-source:https://www.huayuworld.org/micro_learning/micro_search.php
294行

<div class="col-md-12">
	<div class="text-center">
		<ul class="pagination pagination-lg">
			<li><a href="#">第 1 頁,共 1 頁</a></li>
			<li><a onclick="goPage(1)" href="javascript:;">最新</a></li>
			<li><a onclick="goPage(1)" href="javascript:;">«</a></li>
			<li class="active"><a onclick="goPage(1)" href="javascript:;">1</a></li>
			<li><a onclick="goPage(1)" href="javascript:;">»</a></li>
			<li><a onclick="goPage(1)" href="javascript:;">最舊</a></li>
		</ul>
	</div>
</div>

建議修改:

  1. 將外面兩層div移除。
<ul class="pagination pagination-lg">
	<li><a href="#">第 1 頁,共 1 頁</a></li>
	<li><a onclick="goPage(1)" href="javascript:;">最新</a></li>
	<li><a onclick="goPage(1)" href="javascript:;">«</a></li>
	<li class="active"><a onclick="goPage(1)" href="javascript:;">1</a></li>
	<li><a onclick="goPage(1)" href="javascript:;">»</a></li>
	<li><a onclick="goPage(1)" href="javascript:;">最舊</a></li>
</ul>
  1. margin改為10%,位置:https://www.huayuworld.org/micro_learning/assets/css/bootstrap.css:4714
.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 10%;
    border-radius: 4px;
}

補充:

更改完後即能正常點擊影片。

1 Like