')}.navbar-light .navbar-text{color:rgba(0,0,0,.5)}.navbar-light .navbar-text a,.navbar-light .navbar-text a:focus,.navbar-light .navbar-text a:hover{color:rgba(0,0,0,.9)}.navbar-dark .navbar-brand,.navbar-dark .navbar-brand:focus,.navbar-dark .navbar-brand:hover{color:#fff}.navbar-dark .navbar-nav .nav-link{color:hsla(0,0%,100%,.5)}.navbar-dark .navbar-nav .nav-link:focus,.navbar-dark .navbar-nav .nav-link:hover{color:hsla(0,0%,100%,.75)}.navbar-dark .navbar-nav .nav-link.disabled{color:hsla(0,0%,100%,.25)}.navbar-dark .navbar-nav .active>.nav-link,.navbar-dark .navbar-nav .nav-link.active,.navbar-dark .navbar-nav .nav-link.show,.navbar-dark .navbar-nav .show>.nav-link{color:#fff}.navbar-dark .navbar-toggler{color:hsla(0,0%,100%,.5);border-color:hsla(0,0%,100%,.1)}.navbar-dark .navbar-toggler-icon{background-image:url('data:image/svg+xml;charset=utf-8,')}.navbar-dark .navbar-text{color:hsla(0,0%,100%,.5)}.navbar-dark .navbar-text a,.navbar-dark .navbar-text a:focus,.navbar-dark .navbar-text a:hover{color:#fff}.card{position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border:1px solid rgba(0,0,0,.125);border-radius:.25rem}.card>hr{margin-right:0;margin-left:0}.card>.list-group{border-top:inherit;border-bottom:inherit}.card>.list-group:first-child{border-top-width:0;border-top-left-radius:calc(.25rem - 1px);border-top-right-radius:calc(.25rem - 1px)}.card>.list-group:last-child{border-bottom-width:0;border-bottom-right-radius:calc(.25rem - 1px);border-bottom-left-radius:calc(.25rem - 1px)}.card>.card-header+.list-group,.card>.list-group+.card-footer{border-top:0}.card-body{flex:1 1 auto;min-height:1px;padding:1.25rem}.card-title{margin-bottom:.75rem}.card-subtitle{margin-top:-.375rem}.card-subtitle,.card-text:last-child{margin-bottom:0}.card-link:hover{text-decoration:none}.card-link+.card-link{margin-left:1.25rem}.card-header{padding:.75rem 1.25rem;margin-bottom:0;background-color:rgba(0,0,0,.03);border-bottom:1px solid rgba(0,0,0,.125)}.card-header:first-child{border-radius:calc(.25rem - 1px) calc(.25rem - 1px) 0 0}.card-footer{padding:.75rem 1.25rem;background-color:rgba(0,0,0,.03);border-top:1px solid rgba(0,0,0,.125)}.card-footer:last-child{border-radius:0 0 calc(.25rem - 1px) calc(.25rem - 1px)}.card-header-tabs{margin-bottom:-.75rem;border-bottom:0}.card-header-pills,.card-header-tabs{margin-right:-.625rem;margin-left:-.625rem}.card-img-overlay{position:absolute;top:0;right:0;bottom:0;left:0;padding:1.25rem;border-radius:calc(.25rem - 1px)}.card-img,.card-img-bottom,.card-img-top{flex-shrink:0;width:100%}.card-img,.card-img-top{border-top-left-radius:calc(.25rem - 1px);border-top-right-radius:calc(.25rem - 1px)}.card-img,.card-img-bottom{border-bottom-right-radius:calc(.25rem - 1px);border-bottom-left-radius:calc(.25rem - 1px)}.card-deck .card{margin-bottom:15px}@media (min-width:576px){.card-deck{display:flex;flex-flow:row wrap;margin-right:-15px;margin-left:-15px}.card-deck .card{flex:1 0;margin-right:15px;margin-bottom:0;margin-left:15px}}.card-group>.card{margin-bottom:15px}@media (min-width:576px){.card-group{display:flex;flex-flow:row wrap}.card-group>.card{flex:1 0;margin-bottom:0}.card-group>.card+.card{margin-left:0;border-left:0}.card-group>.card:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.card-group>.card:not(:last-child) .card-header,.card-group>.card:not(:last-child) .card-img-top{border-top-right-radius:0}.card-group>.card:not(:last-child) .card-footer,.card-group>.card:not(:last-child) .card-img-bottom{border-bottom-right-radius:0}.card-group>.card:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.card-group>.card:not(:first-child) .card-header,.card-group>.card:not(:first-child) .card-img-top{border-top-left-radius:0}.card-group>.card:not(:first-child) .card-footer,.card-group>.card:not(:first-child) .card-img-bottom{border-bottom-left-radius:0}}.card-columns .card{margin-bottom:.75rem}@media (min-width:576px){.card-columns{-webkit-column-count:3;column-count:3;-webkit-column-gap:1.25rem;column-gap:1.25rem;orphans:1;widows:1}.card-columns .card{display:inline-block;width:100%}}.breadcrumb{display:flex;flex-wrap:wrap;padding:.75rem 1rem;margin-bottom:1rem;list-style:none;background-color:#e9ecef;border-radius:.25rem}.breadcrumb-item+.breadcrumb-item{padding-left:.5rem}.breadcrumb-item+.breadcrumb-item:before{float:left;padding-right:.5rem;color:#6c757d;content:"/"}.breadcrumb-item+.breadcrumb-item:hover:before{text-decoration:underline;text-decoration:none}.breadcrumb-item.active{color:#6c757d}.pagination{display:flex;padding-left:0;list-style:none;border-radius:.25rem}.page-link{position:relative;display:block;padding:.5rem .75rem;margin-left:-1px;line-height:1.25;color:#007bff;background-color:#fff;border:1px solid #dee2e6}.page-link:hover{z-index:2;color:#0056b3;text-decoration:none;background-color:#e9ecef;border-color:#dee2e6}.page-link:focus{z-index:3;outline:0;box-shadow:0 0 0 .2rem rgba(0,123,255,.25)}.page-item:first-child .page-link{margin-left:0;border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.page-item:last-child .page-link{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.page-item.active .page-link{z-index:3;color:#fff;background-color:#007bff;border-color:#007bff}.page-item.disabled .page-link{color:#6c757d;pointer-events:none;cursor:auto;background-color:#fff;border-color:#dee2e6}.pagination-lg .page-link{padding:.75rem 1.5rem;font-size:1.25rem;line-height:1.5}.pagination-lg .page-item:first-child .page-link{border-top-left-radius:.3rem;border-bottom-left-radius:.3rem}.pagination-lg .page-item:last-child .page-link{border-top-right-radius:.3rem;border-bottom-right-radius:.3rem}.pagination-sm .page-link{padding:.25rem .5rem;font-size:.875rem;line-height:1.5}.pagination-sm .page-item:first-child .page-link{border-top-left-radius:.2rem;border-bottom-left-radius:.2rem}.pagination-sm .page-item:last-child .page-link{border-top-right-radius:.2rem;border-bottom-right-radius:.2rem}.badge{display:inline-block;padding:.25em .4em;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.badge{transition:none}}a.badge:focus,a.badge:hover{text-decoration:none}.badge:empty{display:none}.btn .badge{position:relative;top:-1px}.badge-pill{padding-right:.6em;padding-left:.6em;border-radius:10rem}.badge-secondary{color:#fff;background-color:#6c757d}a.badge-secondary:focus,a.badge-secondary:hover{color:#fff;background-color:#545b62}a.badge-secondary.focus,a.badge-secondary:focus{outline:0;box-shadow:0 0 0 .2rem rgba(108,117,125,.5)}.badge-danger{color:#fff;background-color:#dc3545}a.badge-danger:focus,a.badge-danger:hover{color:#fff;background-color:#bd2130}a.badge-danger.focus,a.badge-danger:focus{outline:0;box-shadow:0 0 0 .2rem rgba(220,53,69,.5)}.App{display:flex;flex-direction:column}.App>.pageContent{flex:1 1;overflow:auto;padding-top:10px}.navbar-nav{flex-direction:row}.navbar-nav>*{padding-left:10px}.container{width:100%;max-width:1170px;padding-left:15px;padding-right:15px}@media only screen and (min-width:768px){.container{display:flex;flex-wrap:wrap;padding-left:30px;padding-right:30px}.container.dir-column{flex-direction:column}}.eu-cookie-notification-dialog{position:fixed;left:20px;bottom:-300px;padding:15px;width:310px;z-index:10000;font-size:12px;border-radius:4px;box-sizing:border-box;color:#555;background-color:#f4f6f8}.eu-cookie-notification-dialog .notification-title{font-size:14px;font-weight:700}.eu-cookie-notification-dialog .notification-content{padding:12px 0;line-height:1.4;display:inline-block}.eu-cookie-notification-dialog .link-text{margin:0 5px;color:#555;text-decoration:underline}.eu-cookie-notification-dialog .link-text:hover{color:#555}.eu-cookie-notification-dialog .notification-footer{display:flex;align-items:center}.eu-cookie-notification-dialog .common-button{cursor:pointer;color:#fff;font-size:12px;font-weight:700;padding:6px 10px;margin-right:10px;border-radius:4px;text-align:center;letter-spacing:normal;background-color:#4b5056}.eu-cookie-notification-dialog .setting-btn{color:#4b5056;background-color:#fff;border:1px solid #4b5056}.eu-cookie-notification-dialog .cancel-link{cursor:pointer}.eu-cookie-setting-dialog{width:100%;position:fixed;top:50%;left:50%;display:none;padding:20px;z-index:10000;max-width:500px;border-radius:5px;box-sizing:border-box;color:#555;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);background-color:#f4f6f8;-webkit-animation:slide_in_animation .3s ease-in-out;animation:slide_in_animation .3s ease-in-out}.eu-cookie-setting-dialog .setting-title{font-size:14px;font-weight:700}.eu-cookie-setting-dialog .setting-item{display:flex;margin-top:20px;align-items:flex-start}.eu-cookie-setting-dialog .item-content{font-size:12px;margin:0 8px}.eu-cookie-setting-dialog .cookie-checkbox{cursor:pointer}.eu-cookie-setting-dialog .cookie-checkbox.necessary{cursor:not-allowed}.eu-cookie-setting-dialog .item-label{line-height:1;font-weight:700}.eu-cookie-setting-dialog .item-text{margin-top:5px;line-height:1.5}.eu-cookie-setting-dialog .setting-footer{margin-top:20px;text-align:right}.eu-cookie-setting-dialog .save-btn{cursor:pointer;color:#fff;font-size:12px;font-weight:700;padding:8px 10px;border-radius:4px;display:inline-block;letter-spacing:normal;background:#4b5056}.eu-cookie-setting-mask{position:fixed;display:none;top:0;left:0;width:100%;height:100%;z-index:10000;cursor:pointer;background:rgba(0,0,0,.4);-webkit-animation:slide_in_animation .2s ease-in-out;animation:slide_in_animation .2s ease-in-out}@-webkit-keyframes slide_in_animation{0%{opacity:0}to{opacity:1}}@keyframes slide_in_animation{0%{opacity:0}to{opacity:1}}.rtl-layout .eu-cookie-notification-dialog{right:20px;left:auto;text-align:right}.rtl-layout .eu-cookie-notification-dialog .common-button{margin-right:0;margin-left:10px}.rtl-layout .eu-cookie-setting-dialog-wrapper{text-align:right}.rtl-layout .eu-cookie-setting-dialog-wrapper .setting-footer{text-align:left}@media only screen and (max-width:520px){.eu-cookie-notification-dialog{width:100%;left:0}.rtl-layout .eu-cookie-notification-dialog{left:auto;right:0}}
如何正確編寫和設定“錯誤訊息”? - 建立你的網站 - Strikingly眾所周知,最好的錯誤訊息是永遠不會出現的錯誤訊息。然而,無論我們的設計有多好,準備得有多妥善,系統突發性的偶然錯誤都是不可避免的。越多瀏覽者使用你的網站,錯誤發生的機率就越高。
當你能正常使用,登入或瀏覽網站,並且沒遇到系統癱瘓的情況時,你可能不會意識到錯誤訊息的存在。但不論你是瀏覽者還是網站擁有者,你都需要知道錯誤訊息是用戶體驗的重要組成部分。用戶經常透過錯誤訊息來評估一個網站的完整性。編寫不當的錯誤訊息將會導致瀏覽者對你的網站感到失望。那要如何編寫和設定好錯誤訊息呢?別著急,這篇文章將一步步帶你了解。
錯誤訊息提示頁面是用戶最不想看到的顯示頁面。一般來說,它們討厭的不是錯誤訊息本身,而是錯誤訊息的出現往往意味著不流暢的瀏覽體驗,這可能是用戶在註冊或登入時輸錯資訊而導致,也可能是網站系統工作中途出現癱瘓所形成,再不然就是網址被遷移了而導致無法被正確加載的情況。如果你的網站還在架設中,那訪客透過網址進入的也將會是錯誤訊息頁。
編寫和設定錯誤訊息的目的就是要幫助用戶在遭遇這些問題時盡可能冷靜,且幫助掌握和解決問題。在編寫此類訊息時,你可以閱讀以下的一些錯誤訊息編寫原則:
如何正確設定錯誤訊息?
1. 具體的提示
2. 保持簡短且攜帶足夠資訊
3. 避免使用技術性用語
4. 使用禮貌性用語
5. 給用戶提供說明和引導
6. 提供糾正方案
7. 正確的設計
1. 具體的提示
錯誤訊息應該以清晰和易於了解的方式編寫。你需要幫助用戶在看到錯誤訊息時就能馬上掌握情況。如果錯誤訊息含糊不清,用戶將無法確定導致問題的原因,這樣的錯誤訊息本身就是一種錯誤。如下圖所示,你需要清楚提示用戶導致錯誤的原因。
範例:Strikingly頁面加載錯誤訊息
圖片取自Strikingly產品
2. 保持簡短且攜帶足夠資訊
錯誤訊息中應包含必要的資訊。就像設計網站內容一樣,大多數情況下,用戶不願意閱讀冗長的內容。所以請寫一個對用戶有意義的簡短描述,讓他清楚地了解問題以及明白該如何解決它。避免過度溝通以及使用多餘的重複性句子。
範例:Strikingly 錯誤訊息提示 - 信箱或密碼無效導致無法登入
圖片取自Strikingly產品
3. 避免使用技術性用語
大多數用戶對問題的技術複雜性不感興趣。如果你的錯誤訊息包含技術用語或高技術性詞彙時,用戶就會感到困惑。所以請避免在編寫錯誤訊息時使用術語或過於專注技術細節。如果必須提及技術或複雜的細節,請將它們放在故障排除部分並提供詳細指導,以便用戶可以快速解決問題。
4. 使用禮貌性用語
沒有人喜歡不禮貌的溝通方式,即使它是一則錯誤訊息。所以在編寫錯誤訊息時,盡量使用禮貌性用語避免冒犯用戶。就像你在架設網站時不可避免地遇到難題一樣,你的用戶也會在瀏覽網站時遇到問題。這個時候,你的目的是要幫助用戶,而不是譴責他。你的職責是適當且禮貌地提醒他的錯誤,而不是兇惡地警告他不要再犯。
5. 給用戶提供說明和引導
一條好的錯誤訊息應包含三個部分,即問題的識別,原因和解決方案。當用戶遇到錯誤時,他們希望盡快解決。錯誤訊息應該為用戶提供足夠的資訊來幫助他擺脫不正常的瀏覽狀況。如果可以,請為用戶提供解決方案或選項。
圖片取自Strikingly產品
6. 提供糾正方案
面對錯誤訊息時的操作選項是必不可少的。正確的指示和引導將為用戶提供下一步該做什麼的方向。你可以透過使用自訂按鈕來設定幾個選項(不多於3個),並且讓用戶自己作出選擇。
7. 正確的設計
錯誤訊息應隨時保持準備呈現的狀態。也正是因為它隨時可能在錯誤發生時出現在用戶面前,因此,你需要使用高對比度的文本和背景圖像/顏色使內容更為突出並易於閱讀。一般來說,錯誤訊息的重要內容是紅色的。有時設定者會選擇加入黃色,橙色,和紅色的感嘆號元素來使其更為突出。要呈現反差視覺效果的話,可以考慮使用灰色以及黑色等暗沉顏色來呈現部分內容。
文章總結:
正確地編寫和設定錯誤訊息是非常重要的,不僅能幫助用戶解決瀏覽問題,還能直接影響用戶對網站的整體滿意度。就如設定其他的網站系統內容一樣,要做好錯誤訊息設定工作也是不容易的。如果你剛好想重建或升級你公司的網站,或者想為網站添加一些新的設計理念或功能,請不要忘了為你的網站正確編寫錯誤訊息。
圖片取自Strikingly產品
如果你對假架設網站缺乏經驗,你可以使用像 Strikingly 這樣的網站架設器,它不僅專業,還非常易於使用。你可以透過它輕鬆為你的客戶創造難忘的瀏覽體驗。Strikingly 已發展成為面向全球初創企業、小型企業和專業人士的首選免費網站設計平台,擁有超過 300 萬用戶。Strikingly團隊總是以用戶體驗為先,旨在為瀏覽者提供更全面的網站功能和正面體驗。你需要做的只是馬上建立一個Strikingly免費帳戶,在海量免費架站模板中選出心儀的,以拖曳方式完善網站內容,之後一鍵發布便可。如果對內容有疑問,可以透過 support@strikingly.com 與我們聯絡。
Cookie的使用
我們使用cookie來改善瀏覽體驗、保證安全性和資料收集。一旦點擊接受,就表示你接受這些用於廣告和分析的cookie。你可以隨時更改你的cookie設定。了解更多