全球資訊網暨行政政資訊網-龎袿方

網站

全球資訊網暨行政政資訊網

姓名

龎袿方

日期

2017-11-13

瀏覽器解析度(iOS的Safari填裝置名稱 macOS填瀏覽器解析度)

iPad Air (MD789TA/B)

作業系統版本

Windows 10 專業版(SP1)
11.0.3 (15A432))

瀏覽器版本(iOS的Safari填iOS版本)

Chrome:版本 61.0.3163.100 (正式版本) (64 位元)
Safari:版本 11.0.3 (15A432)

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

有跑版(影響閱讀)問題

圖3

圖1

圖1











圖1


















有出現亂碼

有壞掉的連結

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







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

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

對此網站建議(給個建議吧)

資訊很豐富,圖也很美,可是跑版太嚴重了

可能的原因:

圖片寬度高度寫死

原始程式:

<img alt="北觀地圖" src="/Att_FCK/images/ec/%E5%9C%B0%E5%9C%96/%E7%AF%84%E5%9C%8D%E6%93%B4%E5%A4%A7(%E4%B8%AD%E6%96%87).png" width="700" height="369" border="0">

建議修改:

<img alt="北觀地圖" src="/Att_FCK/images/ec/%E5%9C%B0%E5%9C%96/%E7%AF%84%E5%9C%8D%E6%93%B4%E5%A4%A7(%E4%B8%AD%E6%96%87).png" width="100%" border="0">

可能的原因:

高度被寫死

原始程式:

https://www.northguan-nsa.gov.tw/user/css/bagenn2.css

.geoimg2 {
    background: url(../../images/1/notth_geo_d1.jpg) no-repeat top left;
    height: 290px;
    padding: 0 0 0 500px;
}

建議修改:

.geoimg2 {
    background: url(../../images/1/notth_geo_d1.jpg) no-repeat top left;
    padding: 0 0 0 500px;
}

可能的原因:

CSS 設定錯誤 寬度寫死

原始程式:

https://www.northguan-nsa.gov.tw/user/css/bagenn2.css

#outbox_ecologie {
    width: 750px;
    font-size: 12px;
    color: #333333;
    line-height: 20px;
}

建議修改:

#outbox_ecologie {
    font-size: 12px;
    color: #333333;
    line-height: 20px;
}

可能的原因:

寬度寫死

原始程式:

<iframe title="google map" height="450" marginheight="0" src="https://maps.google.com.tw/maps?f=q&amp;source=s_q&amp;hl=zh-TW&amp;geocode=&amp;q=%E9%87%8E%E6%9F%B3+%E7%A5%9E%E6%98%8E%E6%B7%A8%E6%B8%AF&amp;sll=25.232755,121.576615&amp;sspn=0.221121,0.307961&amp;brcurrent=3,0x345d4cdf85f98b05:0x682a7dd59a1398fa,0,0x345d5538b0b6645f:0x5aa90dfa6620edc0&amp;ie=UTF8&amp;hq=%E7%A5%9E%E6%98%8E%E6%B7%A8%E6%B8%AF&amp;hnear=%E9%87%8E%E6%9F%B3&amp;ll=25.204312,121.68812&amp;spn=0.006295,0.006295&amp;output=embed" frameborder="0" width="715" marginwidth="0" scrolling="no"></iframe>

建議修改:

<iframe title="google map" height="450" marginheight="0" src="https://maps.google.com.tw/maps?f=q&amp;source=s_q&amp;hl=zh-TW&amp;geocode=&amp;q=%E9%87%8E%E6%9F%B3+%E7%A5%9E%E6%98%8E%E6%B7%A8%E6%B8%AF&amp;sll=25.232755,121.576615&amp;sspn=0.221121,0.307961&amp;brcurrent=3,0x345d4cdf85f98b05:0x682a7dd59a1398fa,0,0x345d5538b0b6645f:0x5aa90dfa6620edc0&amp;ie=UTF8&amp;hq=%E7%A5%9E%E6%98%8E%E6%B7%A8%E6%B8%AF&amp;hnear=%E9%87%8E%E6%9F%B3&amp;ll=25.204312,121.68812&amp;spn=0.006295,0.006295&amp;output=embed" frameborder="0" width="715" marginwidth="0" scrolling="no" style="
width: 100%;"></iframe>

設計上的問題

可能的原因:

圖片沒有設定百分比寬度

原始程式:

<img border="0" alt="野柳地質公園→金包里老街→金山獅頭山→金山萬里溫泉區→賦歸" usemap="#Map" src="../images/1/tour1_yaliou_map.jpg">

建議修改:

<img border="0" alt="野柳地質公園→金包里老街→金山獅頭山→金山萬里溫泉區→賦歸" usemap="#Map" src="../images/1/tour1_yaliou_map.jpg" style="
width: 100%;">

RWD 設計上的問題