杏吧app下载，关婷娜被揉胸视频直播，杏吧之春暖花开有你

array(23) {
  ["id"] => string(2) "96"
  ["siteid"] => string(1) "1"
  ["type"] => string(1) "1"
  ["m_id"] => string(1) "0"
  ["p_id"] => string(1) "0"
  ["name"] => string(6) "服務(wù)"
  ["thumb"] => string(63) "/modules/cms/uploads/recommend/2018/05/15/05797102164099283.png"
  ["image"] => string(0) ""
  ["desc"] => string(0) ""
  ["pdir"] => string(0) ""
  ["dir"] => string(7) "service"
  ["url"] => string(0) ""
  ["setting"] => array(15) {
    ["is_html"] => int(1)
    ["content_is_html"] => int(0)
    ["urlrule"] => int(1)
    ["contenturlrule"] => int(0)
    ["meta_title"] => string(88) "定制開發(fā)-APP定制開發(fā),微信定制開發(fā),小程序定制開發(fā),網(wǎng)站定制開發(fā)"
    ["meta_keywords"] => string(75) "APP定制開發(fā),微信定制開發(fā),小程序定制開發(fā),網(wǎng)站定制開發(fā)"
    ["meta_description"] => string(0) ""
    ["category_template"] => string(0) ""
    ["list_template"] => string(0) ""
    ["show_template"] => string(21) "show_page_dingzhi.tpl"
    ["formid"] => string(0) ""
    ["url"] => string(0) ""
    ["target"] => string(0) ""
    ["pri_grade_visit"] => array(0) {
    }
    ["pri_grade_add"] => array(0) {
    }
  }
  ["order"] => string(1) "1"
  ["sethtml"] => string(1) "0"
  ["stat"] => string(1) "2"
  ["flowid"] => string(1) "0"
  ["image_mo"] => string(63) "/modules/cms/uploads/recommend/2018/05/25/05805654599261264.jpg"
  ["page_num"] => string(1) "0"
  ["wxstat"] => string(1) "0"
  ["scope"] => string(0) ""
  ["modelname"] => NULL
  ["son"] => array(9) {
    [0] => array(22) {
      ["id"] => string(3) "187"
      ["siteid"] => string(1) "1"
      ["type"] => string(1) "1"
      ["m_id"] => string(1) "0"
      ["p_id"] => string(2) "96"
      ["name"] => string(15) "小程序開發(fā)"
      ["thumb"] => string(0) ""
      ["image"] => string(0) ""
      ["desc"] => string(112) "專業(yè)微信小程序解決方案|各種場景核心功能，提前布局微信新生態(tài)，搶占第一波紅利"
      ["pdir"] => string(0) ""
      ["dir"] => string(6) "wechat"
      ["url"] => string(0) ""
      ["setting"] => array(15) {
        ["is_html"] => int(1)
        ["content_is_html"] => int(0)
        ["urlrule"] => int(1)
        ["contenturlrule"] => int(0)
        ["meta_title"] => string(107) "小程序_商城小程序_門店小程序_微圈小程序_餐飲小程序開發(fā)-藝源科技小程序開發(fā)"
        ["meta_keywords"] => string(103) "小程序開發(fā),商城小程序開發(fā),門店小程序開發(fā),微圈小程序開發(fā),餐飲小程序開發(fā)"
        ["meta_description"] => string(269) "專注提供專注提供小程序、商城小程序、門店小程序、微圈小程序、餐飲小程序開發(fā)，專業(yè)團(tuán)隊(duì),一對一服務(wù),助企業(yè)快速生成自己的移動端微商城平臺. 藝源科技小程序采用高性能數(shù)據(jù)架構(gòu),系統(tǒng)穩(wěn)定安全。"
        ["category_template"] => string(0) ""
        ["list_template"] => string(0) ""
        ["show_template"] => string(17) "show_page_xcx.tpl"
        ["formid"] => string(0) ""
        ["url"] => string(0) ""
        ["target"] => string(0) ""
        ["pri_grade_visit"] => array(0) {
        }
        ["pri_grade_add"] => array(0) {
        }
      }
      ["order"] => string(1) "0"
      ["sethtml"] => string(1) "0"
      ["stat"] => string(1) "2"
      ["flowid"] => string(1) "0"
      ["image_mo"] => string(0) ""
      ["page_num"] => string(1) "0"
      ["wxstat"] => string(1) "1"
      ["scope"] => string(0) ""
      ["modelname"] => NULL
    }
    [1] => array(22) {
      ["id"] => string(3) "199"
      ["siteid"] => string(1) "1"
      ["type"] => string(1) "1"
      ["m_id"] => string(1) "0"
      ["p_id"] => string(2) "96"
      ["name"] => string(9) "APP開發(fā)"
      ["thumb"] => string(0) ""
      ["image"] => string(0) ""
      ["desc"] => string(0) ""
      ["pdir"] => string(0) ""
      ["dir"] => string(3) "APP"
      ["url"] => string(0) ""
      ["setting"] => array(15) {
        ["is_html"] => int(1)
        ["content_is_html"] => int(0)
        ["urlrule"] => int(1)
        ["contenturlrule"] => int(0)
        ["meta_title"] => string(65) "app開發(fā)_app定制開發(fā)_app制作開發(fā)公司【藝源科技】"
        ["meta_keywords"] => string(53) "app開發(fā),app定制開發(fā)公司,app制作開發(fā)公司"
        ["meta_description"] => string(0) ""
        ["category_template"] => string(0) ""
        ["list_template"] => string(0) ""
        ["show_template"] => string(17) "show_page_app.tpl"
        ["formid"] => string(0) ""
        ["url"] => string(0) ""
        ["target"] => string(0) ""
        ["pri_grade_visit"] => array(0) {
        }
        ["pri_grade_add"] => array(0) {
        }
      }
      ["order"] => string(1) "1"
      ["sethtml"] => string(1) "0"
      ["stat"] => string(1) "2"
      ["flowid"] => string(1) "0"
      ["image_mo"] => string(0) ""
      ["page_num"] => string(1) "0"
      ["wxstat"] => string(1) "0"
      ["scope"] => string(0) ""
      ["modelname"] => NULL
    }
    [2] => array(22) {
      ["id"] => string(3) "244"
      ["siteid"] => string(1) "1"
      ["type"] => string(1) "1"
      ["m_id"] => string(1) "0"
      ["p_id"] => string(2) "96"
      ["name"] => string(12) "快抖霸屏"
      ["thumb"] => string(0) ""
      ["image"] => string(0) ""
      ["desc"] => string(0) ""
      ["pdir"] => string(0) ""
      ["dir"] => string(7) "kuaidou"
      ["url"] => string(0) ""
      ["setting"] => array(15) {
        ["is_html"] => int(1)
        ["content_is_html"] => int(0)
        ["urlrule"] => int(1)
        ["contenturlrule"] => int(0)
        ["meta_title"] => string(71) "快抖霸屏_抖音快手霸屏_短視頻營銷獲客技術(shù)提供商！"
        ["meta_keywords"] => string(69) "快抖霸屏,抖音快手霸屏,快抖短視頻搜索,同城爆店碼"
        ["meta_description"] => string(161) "藝源智能云推廣系統(tǒng)13325455411專注快抖霸屏,抖音快手霸屏,同城爆店碼,一款線下與線上流量緊密結(jié)合的營銷爆客解決方案。"
        ["category_template"] => string(0) ""
        ["list_template"] => string(0) ""
        ["show_template"] => string(20) "show_page_douyin.tpl"
        ["formid"] => string(0) ""
        ["url"] => string(0) ""
        ["target"] => string(0) ""
        ["pri_grade_visit"] => array(0) {
        }
        ["pri_grade_add"] => array(0) {
        }
      }
      ["order"] => string(1) "2"
      ["sethtml"] => string(1) "0"
      ["stat"] => string(1) "2"
      ["flowid"] => string(1) "0"
      ["image_mo"] => string(0) ""
      ["page_num"] => string(1) "0"
      ["wxstat"] => string(1) "0"
      ["scope"] => string(27) "需要短視頻推廣排名"
      ["modelname"] => NULL
    }
    [3] => array(22) {
      ["id"] => string(3) "207"
      ["siteid"] => string(1) "1"
      ["type"] => string(1) "1"
      ["m_id"] => string(1) "0"
      ["p_id"] => string(2) "96"
      ["name"] => string(14) "AI智能名片"
      ["thumb"] => string(0) ""
      ["image"] => string(63) "/modules/cms/uploads/recommend/2019/07/04/06155550417466502.jpg"
      ["desc"] => string(0) ""
      ["pdir"] => string(0) ""
      ["dir"] => string(2) "ai"
      ["url"] => string(0) ""
      ["setting"] => array(15) {
        ["is_html"] => int(1)
        ["content_is_html"] => int(0)
        ["urlrule"] => int(1)
        ["contenturlrule"] => int(0)
        ["meta_title"] => string(68) "藝源AI智能名片_名片小程序_智能名片_讓銷售更簡單"
        ["meta_keywords"] => string(97) "藝源AI智能名片,名片小程序,智能名片_讓銷售更簡單,電子名片,二維碼名片"
        ["meta_description"] => string(184) "藝源AI智能名片-讓銷售更簡單。藝源AI智能名片為企業(yè)提供名片小程序,智能名片,企業(yè)名片,小程序名片,電子名片,二維碼名片等相關(guān)的服務(wù)。"
        ["category_template"] => string(0) ""
        ["list_template"] => string(0) ""
        ["show_template"] => string(16) "show_page_ai.tpl"
        ["formid"] => string(0) ""
        ["url"] => string(0) ""
        ["target"] => string(0) ""
        ["pri_grade_visit"] => array(0) {
        }
        ["pri_grade_add"] => array(0) {
        }
      }
      ["order"] => string(1) "3"
      ["sethtml"] => string(1) "0"
      ["stat"] => string(1) "2"
      ["flowid"] => string(1) "0"
      ["image_mo"] => string(0) ""
      ["page_num"] => string(1) "0"
      ["wxstat"] => string(1) "0"
      ["scope"] => string(0) ""
      ["modelname"] => NULL
    }
    [4] => array(22) {
      ["id"] => string(3) "201"
      ["siteid"] => string(1) "1"
      ["type"] => string(1) "1"
      ["m_id"] => string(1) "0"
      ["p_id"] => string(2) "96"
      ["name"] => string(12) "版權(quán)登記"
      ["thumb"] => string(0) ""
      ["image"] => string(63) "/modules/cms/uploads/recommend/2021/08/04/06814062280145708.jpg"
      ["desc"] => string(0) ""
      ["pdir"] => string(0) ""
      ["dir"] => string(9) "copyright"
      ["url"] => string(0) ""
      ["setting"] => array(15) {
        ["is_html"] => int(1)
        ["content_is_html"] => int(0)
        ["urlrule"] => int(1)
        ["contenturlrule"] => int(0)
        ["meta_title"] => string(0) ""
        ["meta_keywords"] => string(0) ""
        ["meta_description"] => string(0) ""
        ["category_template"] => string(0) ""
        ["list_template"] => string(0) ""
        ["show_template"] => string(23) "show_page_copyright.tpl"
        ["formid"] => string(0) ""
        ["url"] => string(0) ""
        ["target"] => string(0) ""
        ["pri_grade_visit"] => array(0) {
        }
        ["pri_grade_add"] => array(0) {
        }
      }
      ["order"] => string(1) "4"
      ["sethtml"] => string(1) "0"
      ["stat"] => string(1) "2"
      ["flowid"] => string(1) "0"
      ["image_mo"] => string(63) "/modules/cms/uploads/recommend/2021/08/04/06814063838873717.jpg"
      ["page_num"] => string(1) "0"
      ["wxstat"] => string(1) "0"
      ["scope"] => string(0) ""
      ["modelname"] => NULL
    }
    [5] => array(22) {
      ["id"] => string(3) "203"
      ["siteid"] => string(1) "1"
      ["type"] => string(1) "1"
      ["m_id"] => string(1) "0"
      ["p_id"] => string(2) "96"
      ["name"] => string(12) "商標(biāo)注冊"
      ["thumb"] => string(0) ""
      ["image"] => string(63) "/modules/cms/uploads/recommend/2021/08/03/06813359170749750.jpg"
      ["desc"] => string(0) ""
      ["pdir"] => string(0) ""
      ["dir"] => string(9) "trademark"
      ["url"] => string(0) ""
      ["setting"] => array(15) {
        ["is_html"] => int(1)
        ["content_is_html"] => int(0)
        ["urlrule"] => int(1)
        ["contenturlrule"] => int(0)
        ["meta_title"] => string(131) "商標(biāo)注冊_商標(biāo)注冊流程_商標(biāo)注冊流程及費(fèi)用_西安商標(biāo)注冊_西安商標(biāo)注冊代理-「源知果」藝源科技"
        ["meta_keywords"] => string(103) "商標(biāo)注冊,商標(biāo)注冊流程,商標(biāo)注冊流程及費(fèi)用,西安商標(biāo)注冊,西安商標(biāo)注冊代理"
        ["meta_description"] => string(182) "「源知果」西安提供代理版權(quán)登記，代理商標(biāo)注冊，代理專利申請，代理企業(yè)貫標(biāo)，代理高新技術(shù)企業(yè)認(rèn)定的服務(wù)；咨詢電話：13325455411。"
        ["category_template"] => string(0) ""
        ["list_template"] => string(0) ""
        ["show_template"] => string(23) "show_page_trademark.tpl"
        ["formid"] => string(0) ""
        ["url"] => string(0) ""
        ["target"] => string(0) ""
        ["pri_grade_visit"] => array(0) {
        }
        ["pri_grade_add"] => array(0) {
        }
      }
      ["order"] => string(1) "5"
      ["sethtml"] => string(1) "0"
      ["stat"] => string(1) "2"
      ["flowid"] => string(1) "0"
      ["image_mo"] => string(63) "/modules/cms/uploads/recommend/2019/06/11/06135617157272716.png"
      ["page_num"] => string(1) "0"
      ["wxstat"] => string(1) "0"
      ["scope"] => string(0) ""
      ["modelname"] => NULL
    }
    [6] => array(22) {
      ["id"] => string(3) "205"
      ["siteid"] => string(1) "1"
      ["type"] => string(1) "1"
      ["m_id"] => string(1) "0"
      ["p_id"] => string(2) "96"
      ["name"] => string(12) "網(wǎng)站建設(shè)"
      ["thumb"] => string(0) ""
      ["image"] => string(63) "/modules/cms/uploads/recommend/2019/06/21/06144566585327511.jpg"
      ["desc"] => string(149) "節(jié)約IT成本/降低運(yùn)維成本/網(wǎng)站安全穩(wěn)定/不滿意全額退款|節(jié)約IT成本/降低運(yùn)維成本/網(wǎng)站安全穩(wěn)定/不滿意全額退款"
      ["pdir"] => string(0) ""
      ["dir"] => string(7) "website"
      ["url"] => string(0) ""
      ["setting"] => array(15) {
        ["is_html"] => int(1)
        ["content_is_html"] => int(0)
        ["urlrule"] => int(1)
        ["contenturlrule"] => int(0)
        ["meta_title"] => string(80) "西安商城網(wǎng)站建設(shè)_政府網(wǎng)站建設(shè)_學(xué)校網(wǎng)站建設(shè)就選藝源科技"
        ["meta_keywords"] => string(113) "西安網(wǎng)站建設(shè),西安網(wǎng)絡(luò)公司,西安網(wǎng)頁設(shè)計(jì),商城網(wǎng)站建設(shè),政府網(wǎng)站建設(shè),學(xué)校網(wǎng)站建設(shè)"
        ["meta_description"] => string(248) "「藝源科技」是西安一家專業(yè)的西安商城網(wǎng)站建設(shè),政府網(wǎng)站建設(shè),學(xué)校網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司，咨詢電話:029-88810146/150 9401 9029。公司擁有10年實(shí)踐經(jīng)驗(yàn),為您提供一條龍的互聯(lián)網(wǎng)應(yīng)用解決方案。"
        ["category_template"] => string(0) ""
        ["list_template"] => string(0) ""
        ["show_template"] => string(21) "show_page_website.tpl"
        ["formid"] => string(0) ""
        ["url"] => string(0) ""
        ["target"] => string(0) ""
        ["pri_grade_visit"] => array(0) {
        }
        ["pri_grade_add"] => array(0) {
        }
      }
      ["order"] => string(1) "6"
      ["sethtml"] => string(1) "0"
      ["stat"] => string(1) "2"
      ["flowid"] => string(1) "0"
      ["image_mo"] => string(63) "/modules/cms/uploads/recommend/2019/06/24/06146855992801864.jpg"
      ["page_num"] => string(1) "0"
      ["wxstat"] => string(1) "0"
      ["scope"] => string(0) ""
      ["modelname"] => NULL
    }
    [7] => array(22) {
      ["id"] => string(3) "208"
      ["siteid"] => string(1) "1"
      ["type"] => string(1) "2"
      ["m_id"] => string(1) "0"
      ["p_id"] => string(2) "96"
      ["name"] => string(15) "云服務(wù)平臺"
      ["thumb"] => string(0) ""
      ["image"] => string(0) ""
      ["desc"] => string(0) ""
      ["pdir"] => string(0) ""
      ["dir"] => string(0) ""
      ["url"] => string(0) ""
      ["setting"] => array(15) {
        ["is_html"] => int(0)
        ["content_is_html"] => int(0)
        ["urlrule"] => int(0)
        ["contenturlrule"] => int(0)
        ["meta_title"] => string(0) ""
        ["meta_keywords"] => string(0) ""
        ["meta_description"] => string(0) ""
        ["category_template"] => string(0) ""
        ["list_template"] => string(0) ""
        ["show_template"] => string(0) ""
        ["formid"] => string(0) ""
        ["url"] => string(21) "http://www.qulvkj.com"
        ["target"] => string(6) "_blank"
        ["pri_grade_visit"] => array(0) {
        }
        ["pri_grade_add"] => array(0) {
        }
      }
      ["order"] => string(1) "7"
      ["sethtml"] => string(1) "0"
      ["stat"] => string(1) "2"
      ["flowid"] => string(1) "0"
      ["image_mo"] => string(0) ""
      ["page_num"] => string(1) "0"
      ["wxstat"] => string(1) "0"
      ["scope"] => string(0) ""
      ["modelname"] => NULL
    }
    [8] => array(22) {
      ["id"] => string(3) "202"
      ["siteid"] => string(1) "1"
      ["type"] => string(1) "1"
      ["m_id"] => string(1) "0"
      ["p_id"] => string(2) "96"
      ["name"] => string(9) "SEO優(yōu)化"
      ["thumb"] => string(0) ""
      ["image"] => string(63) "/modules/cms/uploads/recommend/2021/08/03/06813061683398516.jpg"
      ["desc"] => string(0) ""
      ["pdir"] => string(0) ""
      ["dir"] => string(3) "seo"
      ["url"] => string(0) ""
      ["setting"] => array(15) {
        ["is_html"] => int(1)
        ["content_is_html"] => int(0)
        ["urlrule"] => int(1)
        ["contenturlrule"] => int(0)
        ["meta_title"] => string(90) "【西安SEO優(yōu)化_西安網(wǎng)站優(yōu)化_關(guān)鍵詞排名優(yōu)化】-SEO優(yōu)化公司藝源科技"
        ["meta_keywords"] => string(81) "西安SEO優(yōu)化,西安SEO優(yōu)化公司,西安網(wǎng)站優(yōu)化,西安網(wǎng)站優(yōu)化公司"
        ["meta_description"] => string(244) "藝源科技（yysweb.com）,專注為企業(yè)提供百度等搜索引擎整站SEO優(yōu)化服務(wù),針對不同行業(yè)、網(wǎng)站情況給出不同策略、報(bào)價(jià)和SEO建議;是您值得信賴的seo診斷、顧問咨詢等云SEO技術(shù)服務(wù)外包商。"
        ["category_template"] => string(0) ""
        ["list_template"] => string(0) ""
        ["show_template"] => string(17) "show_page_seo.tpl"
        ["formid"] => string(0) ""
        ["url"] => string(0) ""
        ["target"] => string(0) ""
        ["pri_grade_visit"] => array(0) {
        }
        ["pri_grade_add"] => array(0) {
        }
      }
      ["order"] => string(1) "8"
      ["sethtml"] => string(1) "0"
      ["stat"] => string(1) "2"
      ["flowid"] => string(1) "0"
      ["image_mo"] => string(63) "/modules/cms/uploads/recommend/2021/08/03/06813062712033401.jpg"
      ["page_num"] => string(1) "0"
      ["wxstat"] => string(1) "0"
      ["scope"] => string(0) ""
      ["modelname"] => NULL
    }
  }
}
當(dāng)前位置： 首頁 > 售后 > 藝源智庫
講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？
時(shí)間：2019-06-20 10:07:39
文章發(fā)布：李陽
原創(chuàng)作者：未知
來源：互聯(lián)網(wǎng)

文本輸入框幾乎是每個UI設(shè)計(jì)師都必須用到的設(shè)計(jì)控件，它們無處不在，對于用戶體驗(yàn)的影響無疑是巨大的。雖然看起來很簡單，但是一個設(shè)計(jì)成熟的文本輸入框，其實(shí)是要滿足許多“潛規(guī)則”的，這些規(guī)則你是否都了解？

當(dāng)新用戶開始使用一款A(yù)PP或者入駐某個網(wǎng)站的時(shí)候，至少基本的信息都需要通過文本輸入來完成。產(chǎn)品經(jīng)理、設(shè)計(jì)師和開發(fā)者也都明白，這才是解決方案。

今天的文章，我們專注于文本的字段輸入應(yīng)當(dāng)注意的一些核心因素。這些大都是常見的規(guī)則，同時(shí)每一個規(guī)則都有一些值得注意的例外情況。

文本輸入框

文本輸入框是UI設(shè)計(jì)中常見的控件，在絕大多數(shù)的場合用來給用戶輸入少量的文字。無論你使用的是哪個APP，大都需要你借助文本輸入框來獲取少量的個人信息（用戶名等）。當(dāng)你想要搜索某些信息的時(shí)候，打開谷歌，至少也要通過搜索框輸入來完成起碼的搜索請求。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

清晰

清晰的文本標(biāo)簽

用戶想要知道他們輸入的字段到底是什么樣的數(shù)據(jù)，自然是需要文本標(biāo)簽清晰的告訴他們。當(dāng)然，有時(shí)候用戶也是借助字段相關(guān)的圖標(biāo)來了解輸入框?qū)?yīng)字段含義的（比如用戶通?？吹椒糯箸R的圖標(biāo)會意識到這是一個搜索框）。但是在絕大多數(shù)的情況下，文本的標(biāo)簽是必須有的。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

Apple iOS 中的搜索框同時(shí)放置了標(biāo)簽和放大鏡圖標(biāo)

清晰的標(biāo)簽讓用戶更加自信，正確理解，并且正確地操作。

短文本標(biāo)簽

標(biāo)簽并非幫助性的說明，所以你應(yīng)該使用的是簡短（幾個字）的描述性的短語作為標(biāo)簽，以便用戶能夠快速掃視。如果有額外的信息，通過上下文或者額外的幫助性的說明來讓用戶有所了解，而不是超長的標(biāo)簽。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

之前Amazon 的注冊頁面就因?yàn)槌L的標(biāo)簽文本導(dǎo)致注冊過程緩慢。目前的版本強(qiáng)多了。

合理的輸入框尺寸

如果你的輸入框尺寸是按照輸入內(nèi)容的長短、尺寸來設(shè)計(jì)的話，會更加適宜用戶閱讀和輸入。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

輸入框焦點(diǎn)

對于輸入框，當(dāng)用戶選中準(zhǔn)備輸入的時(shí)候，應(yīng)當(dāng)提供清晰的視覺提示，比如外發(fā)光的輸入框，或者閃動的光標(biāo)，都行。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

輸入提示

數(shù)據(jù)的呈現(xiàn)方式多種多樣。所以，當(dāng)你在設(shè)計(jì)輸入框的時(shí)候，應(yīng)當(dāng)與用戶輸入信息的類型、格式相互匹配。不過要做到完全的對應(yīng)并不容易。

舉個例子，電話號碼的輸入就存在多種不同的方式，比如我們常見的“+86”，而更多的情況下大家可能會直接輸入一串11位的手機(jī)號，座機(jī)號碼的情況則更加復(fù)雜，有的人習(xí)慣加上區(qū)號，而又的人則不會。面對這種復(fù)雜的情況，你可以通過設(shè)計(jì)輸入框，加入輸入提示來“格式化”輸入內(nèi)容。還是以電話號碼的輸入為例：

這個輸入框的電話號碼格式已經(jīng)固化了，讓用戶可以清楚的知道應(yīng)該輸入哪種類型，多少位。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

這個輸入框中加入了說明性質(zhì)的文本占位符，清晰的說明了應(yīng)當(dāng)輸入怎樣的號碼。它的缺陷在于用戶輸入的時(shí)候，占位符會消失。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

幫助信息

幫助信息（或相關(guān)文字）應(yīng)當(dāng)出現(xiàn)在需要的地方，比如表單中用文字說明為何需要填寫信用卡號，以及生日日期填寫之后的福利，又或者“服務(wù)條款”鏈接的存在。它們適時(shí)地出現(xiàn)，幫助用戶解釋了一些令人困惑的問題。一般說來，這類幫助信息不要超過100字。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

僅限移動端：鍵盤類型與文本輸入的匹配

在APP上用戶常常要輸入不同類型的文本，當(dāng)輸入框需要輸入數(shù)字的時(shí)候，結(jié)果彈出的是全鍵盤自然不方便，而需要輸入文本的時(shí)候則出現(xiàn)數(shù)字鍵盤就更加不合適了。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

可訪問性

目標(biāo)：確保不同狀況的用戶都能無障礙地、輕松瀏覽和填寫輸入框

避免使用大寫文本標(biāo)簽

永遠(yuǎn)不要使用全部是大寫字母的文本標(biāo)簽，這樣的標(biāo)簽通常都很難快速瀏覽，因?yàn)樽帜傅拇笮「叨榷际且恢碌?，對于非英語言國家的用戶尤其麻煩。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

字體尺寸

在設(shè)置字體尺寸的時(shí)候，應(yīng)該確保字體足夠大，盡量讓它們清晰可辨。網(wǎng)頁上設(shè)置正文字體的時(shí)候，安全的選擇是16px，當(dāng)然，大小的選取主要還是取決于實(shí)際的頁面設(shè)計(jì)，如果識別性問題，應(yīng)當(dāng)適當(dāng)調(diào)大一些。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

標(biāo)簽顏色

標(biāo)簽的色彩應(yīng)當(dāng)依從于你的APP或者網(wǎng)頁的整體配色方案，并且確保對比度（不能太暗，也別太耀眼）。W3C 在正文文本對比度上有如下的要求：

·較小的文本應(yīng)當(dāng)確保至少和背景之間有4.5:1的對比度比率
·較大的文本（14pt粗體，18pt常規(guī)）應(yīng)當(dāng)確保和背景之間的對比度超過3:1

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

提供舒適的點(diǎn)擊區(qū)域

無論你所設(shè)計(jì)的是網(wǎng)頁還是APP，都應(yīng)當(dāng)考慮用戶在手機(jī)上點(diǎn)擊屏幕時(shí)的體驗(yàn)。你需要確保用戶點(diǎn)擊輸入框的時(shí)候的觸發(fā)區(qū)域足夠?qū)捤墒孢m，而不是很難點(diǎn)擊。一般說來，拇指的觸發(fā)區(qū)域應(yīng)當(dāng)控制在 45~57px之間，但是在移動端上，控件看起來太大會讓人覺得不舒服，所以你的文本框高度應(yīng)該設(shè)計(jì)在32~40px之間，這樣看起來足夠友好，又不會太大。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

僅限桌面端：對鍵盤輸入友好的輸入框

這是一個歷史悠久的可用性設(shè)計(jì)：用戶應(yīng)當(dāng)能夠僅使用鍵盤就完成全部的內(nèi)容輸入的工作。許多深度用戶有這樣的需求，他們習(xí)慣于使用Tab 按鍵來切換不同的輸入框和控件，無需離開鍵盤就可以填完表單。你可以在W3C的文檔中找到相應(yīng)的說明。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

用戶花費(fèi)

目標(biāo)：盡量減少用戶輸入

智能預(yù)設(shè)

填寫表單本身就是一件苦差事，絕大多數(shù)時(shí)候它都不會變得令人愉悅。因此，許多需要填寫、選取的表單有預(yù)設(shè)的初始值或者內(nèi)容填充在其中，這樣可以讓用戶用起來更加方便——許多內(nèi)容和參數(shù)其實(shí)你可以通過其他的方式計(jì)算并獲得（比如你可以根據(jù)用戶的地理位置來幫他們填寫郵政編碼），也可以通過之前在其他地方輸入的數(shù)據(jù)來填補(bǔ)內(nèi)容。

比如用戶的IP地址在很多時(shí)候就可以預(yù)先填寫。Whatsapp 則調(diào)用系統(tǒng)服務(wù)，幫你將地區(qū)編碼預(yù)先填寫在手機(jī)號碼之前，讓你的填寫體驗(yàn)更加舒適。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

自動完成和自動建議

自動完成是以下拉框的形式根據(jù)你輸入的內(nèi)容進(jìn)行實(shí)時(shí)補(bǔ)完的功能。這樣可以幫助用戶更準(zhǔn)確、高效地填寫信息。對于輸入困難、拼寫困難的用戶尤其有幫助，尤其是當(dāng)這種語言并非他們母語的時(shí)候。

自動建議則會以列表的形式呈現(xiàn)相關(guān)的關(guān)鍵字或者短語，在匹配度上可能不會太多理想。自動完成更多的是在于補(bǔ)完你填寫的內(nèi)容，而自動建議則是為你推薦可能相關(guān)的短語、關(guān)鍵詞。

兩種結(jié)合起來可以讓用戶輸入的體驗(yàn)更加優(yōu)秀，Google搜索就是這么做的。

講真，你真的懂得文本輸入框設(shè)計(jì)的那些潛規(guī)則么？-藝源科技

小程序開發(fā)
標(biāo)簽： ui設(shè)計(jì) 用戶體驗(yàn)
*版權(quán)申明:本站部分文章由藝源科技收集整理，不代表我們的觀點(diǎn)。如果這篇轉(zhuǎn)載侵犯您的版權(quán)，請及時(shí)聯(lián)系我們刪除！
為您推薦
最新文章
掃碼加他，免費(fèi)獲取方案