網站

臺中榮民總醫院埔里分院

姓名

張家綺

日期

2017-11-29

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

1366 * 768

作業系統版本

Windows 7 專業版（SP1）
macOS 10.12.6（16G29）

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

Chrome：版本 61.0.3163.100 (正式版本) (64 位元)
Safari：版本 11.0（12604.1.38.1.7）

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

無

有跑版（影響閱讀）問題

首頁：狀態列按鈕破圖、點選進任一類別也會

[首頁][最新動態][藥品異動訊息][點選較長的標題]： 最新消息區，字數過多時版型會跑掉

[[首頁][認識本院][院長的話]] (http://www.pulivh.gov.tw/web/02about/01super_7.htm)：院長圖片下方版型跑掉

[首頁][便民服務][相關連結]：第二頁版型大跑版

[首頁][便民服務][網路申辦][健檢線上預約][處理情況查詢]：破圖

有出現亂碼

無

有壞掉的連結

無

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

無

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

[首頁][便民服務][網路申辦][健檢線上預約][作業流程說明] ：右方病例釋出線上申辦按鈕消失

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

相同問題，都是文字超出圖片，換個圖就好了

[首頁][認識本院][編年表] 各連結破圖

[首頁][醫師團隊][內科]上方各醫生連結超過範圍

[首頁][醫師團隊][外科]上方各醫生連結超過範圍

[首頁][就醫指南][門診時刻表]連結超過範圍

[首頁][就醫指南][門禁管制措施]上方連結超過範圍

[首頁][就醫指南][樓層服務指引]：內文上方連結破圖
[首頁][健康資訊][衛教新知]：內文上方連結破圖
[首頁][健康資訊][衛教短片]：內文上方連結破圖

[首頁][團隊介紹][護理團隊][內科病房] 文繞圖格式不佳

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

☆☆中間設計排版可以統整，只要顯示風格一致就好多了。
最好把上面的類別導覽bar修正即可。

問題：

首頁：狀態列按鈕破圖、點選進任一類別也會

可能原因：

td 背景圖片重複

建議修改：

添加

td {
    background-repeat: no-repeat;
}

另外按鈕建議使用文字形式，圖片容易壓縮或跑版

補充：修改後的版面如下

問題：

[首頁][最新動態][藥品異動訊息][點選較長的標題]： 最新消息區，字數過多時版型會跑掉

建議修改：

此部分使用 table 排版而造成跑版，建議使用 bootstrap 排版。
另外建議文字部分使用 html ，不要使用圖片。

問題：

[[首頁][認識本院][院長的話]] (http://www.pulivh.gov.tw/web/02about/01super_7.htm)：院長圖片下方版型跑掉

可能原因：

使用很多 br tag （原因不明）

原始程式：

<td align="center" background="../img/dr_bg01.gif"><table width="50%" border="0" align="center" cellpadding="0" cellspacing="0" summary="position of table">
                                  <tbody><tr>
                                    <td align="center"><img src="img/01super_07_pic.jpg" alt="葛光中 院長" width="157" height="153"><br></td>
                                </tr>
                                </tbody></table>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                              <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                                  <br>
                              <br></td>

建議修改：

移除之

<td align="center" background="../img/dr_bg01.gif"><table width="50%" border="0" align="center" cellpadding="0" cellspacing="0" summary="position of table">
                                  <tbody><tr>
                                    <td align="center"><img src="img/01super_07_pic.jpg" alt="葛光中 院長" width="157" height="153"><br></td>
                                </tr>
                                </tbody></table>
                                 </td>

補充：修改後的版面如下

問題：

[首頁][便民服務][相關連結]：第二頁版型大跑版
[首頁][便民服務][網路申辦][健檢線上預約][處理情況查詢]：破圖
[首頁][便民服務][網路申辦][健檢線上預約][作業流程說明] 右方病例釋出線上申辦按鈕消失
[首頁][認識本院][編年表] 各連結破圖
[首頁][醫師團隊][內科]上方各醫生連結超過範圍
[首頁][醫師團隊][外科]上方各醫生連結超過範圍
[首頁][就醫指南][門診時刻表]連結超過範圍
[首頁][就醫指南][門禁管制措施]上方連結超過範圍
[首頁][就醫指南][樓層服務指引]：內文上方連結破圖
[首頁][健康資訊][衛教新知]：內文上方連結破圖
[首頁][健康資訊][衛教短片]：內文上方連結破圖
[首頁][團隊介紹][護理團隊][內科病房] 文繞圖格式不佳

可能原因：

上述問題皆是因為全網站使用 table 排版造成跑版

建議修改：

改使用 bootstrap 排版。

因為 table 排版造成的問題在每個子頁面都相似，強烈建議全網站重新規劃排版。