欢迎光临缘震官方网站
缘震优势

网站建设中关于默认字体你需要了解

2017-11-17 09:19:21

  网站建设 中关于默认字体你需要了解


        首先要从浏览器默认字体说起,浏览器中的样式往往在不同的浏览器、不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏览器的默认设置保证各个浏览器样式一致性的做法。


    拿字体来说,各个浏览器默认的字体种类、字体大小和字体行高都不一样,比如IE8的中文版在Windows XP下显示网页时默认字体是宋体,而英文版肯定不会如此。所以我们需要统一设置默认的字体样式,以便实现一致的显示效果来保证设计的一致性和提高开发效率。

 

    第一:字体arial


     我们页面的绝大部分内容字符都是中文,毫无疑问目前为止在网页上最常用也是最通用的显示中文的字体是宋体,但是宋体在显示英文、数字和英文符号时过于糟糕,比如©字符,所以我们一般期望通过CSS来实现用更好的字体样式来显示它们,然后用宋体来显示中文和中文符号。之所以选择arial是因为:


    1,Windows和Mac都预装了这款字体,应该是使用最广泛的网页字体了。它的潜在对手tahoma和helvetica就没有这么幸运了。


     2,视觉设计的专业人士可能会认为在Windows中使用tahoma、在Mac中使用helvetica更好,比如淘宝的默认字体样式是font: 12px/1 Tahoma, Helvetica, Arial, "\5b8b\4f53", sans-serif;

      这是一个很不错的选择,但是你也会发现Google、YAHOO、Youtube、Bing甚至MSN的新版都使用arial作为第一默认字体。所以从美观和可读性上来讲arial应该是完全可以接受的。

一般情况下设置font-family都会在最后设置通用字体族以保证其安全性,比如Google的设置为font-family:arial,sans-serif;,但是至少在非中文版的Win7下当编码是GBK时,IE8会因sans-serif来渲染宋体,导致字体出现变形,这就是为什么淘宝需要在sans-serif前加上宋体而Google无需这样做的原因。


     因为中文字体的选择非常有限,所以目前所有的主流浏览器都设置使用宋体来显示中文。Baidu的首页和搜索结果页使用font-family:arial;可以从侧面说明这样做的安全性。可能有人注意到Firefox中国版默认显示的中文字体是微软雅黑,这是因为谋智网络擅自修改了用户自定义样式,不允许网页的样式覆盖浏览器设置的样式。也是由于类似的情况,我们要弹性设计网页非常重要。


     使用英文字体作为第一默认字体会导致的问题之一就是中英文以及符号混排时的对齐问题、通过设置行高和hasLayout能解决绝大部分情况,但是都不会很完美,如果把字体改成“宋体”能彻底的解决问题。很明显,这个问题只出现在IE上。所以,如果你的网站很少使用英文、数字和英文符号,那么直接设置{font-family:\5b8b\4f53;}也是很合理的选择。

     第二:样式优先级


     通常用户看到的页面的样式会受到三层控制:


     1,浏览器的默认样式; 2,网页定义样式; 3,用户自定义样式。


    和CSS一样,后面的优先级高于前面的,也就是说网页定义样式可以覆盖浏览器的默认样式,而用户自定义样式优先级最高。不过,当有 !important 时,网页样式可以覆盖用户自定义样式。用户!important > 网页!important > 用户 > 网页 > 浏览器默认。


      第三:大小12px


      12px是宋体能显示的极限,虽然微软雅黑能显示更小的字体,但目前的应用环境尚未成熟。由于宋体基本上是目前显示中文唯一的通用Web字体,所以12px成为最常用的字体大小。我们当然可以依据产品的需要来修改这个默认值。


      不用考虑基于字体大小(em)的设计。


       在Chrome3.0之后的中文版中,字体大小最小值是12px,比如你设置最小字体为10px,最后也变成12px。


       第四:行高1.5倍


       这是一个经验值,不同的产品对这个值要求可能不同,但我们一般会设置最常用的为默认值。比如YUI的font中是font:13px/1.231 arial,helvetica,clean,sans-serif;即字体大小默认值是13px,行高是13*1.231=16.003px,默认的行高是默认字体的1.231倍。对于中文来说,常用的字体大小12px、14px、16px、18px等偶数大小,在IE6和IE7设置其行高也为偶数能解决一些特殊情况下的字体对其问题。


        在IE6和IE7中,行高值必须大于字体的2px才能保证字体的完整显示或当其作为链接时能有效显示下划线。


        设置line-height时,注意不要使用单位(包括%在内),因为子节点会继承经过运算后的line-height值,所以当使用单位后浏览器会把line-height计算成第一次定义的绝对值,而不会随着字体大小的变化而变化,而无单位的数值表示是所在容器的font-size的倍数,所以设置为无单位的数值是最佳选择。

 

       五:性能和效率第


       1,大部分平台都有arial,减少浏览器的查找时间。


       2,代码最少,书写方便。arial基本上是名字最短的字体了,可以节约CSS的大小。


        3,所有的字母都小写,目前Google就是这样做的,好处是既可以编写更快也能提升Gzip压缩的效率。


         中文最好用unicode表示,比如使用宋体是{font-family:\5b8b\4f53;},使用微软雅黑是{font-family:\5fae\8f6f\96c5\9ed1;},这样的好处是避免编码问题,同时能得到所有的主流浏览器的支持。

 

    通过对中英文及符号混排的测试, 我发现微软雅黑其实表现相当不错,包括英文数字和英文字符以及在IE6和IE7的显示效果上,但唯一的遗憾是在XP下如果安装了微软雅黑字体的用户没有打 开“使用屏幕字体的边缘平滑”选项的话,在firefox、Safari和Opera、特别是IE6下会非常模糊难以辨认。针对这个问题目前并没有很好的 解决方案,所以只有等到IE6使用比率非常小的时候才可能正式的使用它。或许需要到2014年,XP死掉的时候。


     虽然很早就有了@font-face,但是浏览器的支持、网速和商业问题,导致它很少被应用。最近关于字体的好消息是Firefox3.6将支持Web Open Font Forma。关于Web字体未来的相关信息可以看Web 字体的未来、关于 Web 字体:现状与未来和再谈 Web 字体的现状与未来。

 


做网站一定要有好的售后

做网站一定要有好的售后,这一观点非常正确!在互联网技术快速迭代、用户需求多样化的背景下,优质的售后服务不仅是保障网站稳定运行的 “安全网”,更是建立用户信任、提升品牌口碑的关键环节。以下从重要性、核心服务内容、实现方式三个方面展开分析,帮助你理解为何售后是网站建设的 “必修课”:

一、为什么说网站售后至关重要?

1. 技术故障的 “救火员” 角色

  • 紧急响应需求:网站可能面临服务器崩溃、代码漏洞、黑客攻击等突发问题(如电商大促期间服务器过载导致页面崩溃),此时售后团队需在30 分钟内响应、2 小时内修复,避免业务中断造成直接经济损失(据统计,电商网站每小时宕机损失可达数十万美元)。

  • 日常维护必要性:定期巡检服务器状态、更新 SSL 证书、修复系统漏洞(如 WordPress 插件兼容性问题),可预防 80% 以上的常规故障,降低长期运维成本。

2. 用户体验的 “护航者”

  • 功能迭代支持:用户需求可能随市场变化而调整(如新增在线客服模块、会员积分系统),售后团队需提供快速定制开发服务,避免因功能滞后导致用户流失。

  • 操作培训服务:为企业客户提供后台使用培训(如 CMS 系统内容更新、数据分析报表解读),可提升客户自主管理能力,减少重复咨询成本。

3. 品牌信任的 “粘合剂”

  • 售后口碑影响决策:调研显示,75% 的客户会因优质售后而持续合作,反之,一次糟糕的售后体验可能导致 26 个潜在客户流失(White House Office 数据)。

  • 长期合作的基础:通过售后建立的信任,可延伸至二次开发、功能升级等长期合作(如企业官网升级为电商平台、增加 API 对接功能),形成业务增长闭环。

二、优质网站售后的核心服务内容

服务类型具体内容执行标准
技术支持服务器监控与维护、代码漏洞修复、数据备份恢复7×24 小时在线响应,故障处理时效≤4 小时
功能迭代需求分析、模块开发、系统升级需求确认后 5 个工作日内提供开发方案
培训服务后台操作培训、数据分析指导、安全规范讲解提供视频教程 + 现场培训,考核通过率≥90%
安全保障防火墙部署、SSL 证书更新、防攻击策略优化每月进行一次渗透测试,漏洞修复率 100%
数据服务流量分析、用户行为跟踪、业务报表生成每周提供数据简报,季度深度分析报告
客户成功管理定期回访、需求收集、满意度调查季度回访覆盖率 100%,满意度≥95 分

三、如何构建高效的网站售后体系?

1. 建立多层级响应机制

  • 基础服务层:通过智能客服机器人解决 80% 常规问题(如密码找回、后台操作指引),降低人力成本。

  • 技术专家层:组建由开发工程师、运维工程师、产品经理构成的专属服务群,处理复杂需求(如系统重构、高并发架构优化)。

  • 管理层对接:为重要客户配备客户成功经理,定期同步项目进展,协调资源优先级(如 VIP 客户需求 24 小时内启动开发)。

2. 透明化服务流程与定价

  • 服务协议标准化:在合同中明确列出服务范围、响应时效、收费标准(如基础维护费每月 500 元,功能开发按人天计费),避免模糊条款引发纠纷。

  • 进度可视化工具:使用 Jira、Trello 等项目管理工具向客户开放权限,实时查看故障处理进度、需求开发排期,增强信任感。

3. 数据驱动的服务优化

  • 售后问题分类统计:每月分析高频问题(如某行业客户普遍需要 API 对接功能),推动前端开发团队优化产品架构,减少同类问题重复发生。

  • 客户满意度模型:通过 NPS(净推荐值)调查,识别服务薄弱环节(如培训不足、沟通效率低),针对性改进(如增加实操演练环节、指定固定对接人)。

四、不同场景下的售后策略差异

1. 企业官网类项目

  • 重点:保障稳定性与安全性,提供年度维护套餐(含域名续费、服务器托管、安全巡检),费用占项目总金额的 10%-15%。

  • 案例:某制造企业官网遭遇 CC 攻击,售后团队 30 分钟内启用 CDN 加速 + WAF 防护,避免官网瘫痪影响客户合作咨询。

2. 电商平台类项目

  • 重点:支持大促期间的高并发需求,提供弹性扩容服务(如临时增加服务器节点、优化数据库查询语句),并配备应急响应小组。

  • 案例:某电商平台双 11 期间订单系统崩溃,售后团队通过缓存优化 + 读写分离架构,2 小时内恢复系统,挽回预估 500 万元损失。

3. 定制化系统类项目

  • 重点:长期技术合作伙伴关系,提供版本迭代服务(如每年 2 次大版本升级),并建立知识共享机制(如定期举办技术沙龙,同步行业前沿趋势)。

  • 案例:某 SaaS 企业与开发团队合作 3 年,通过持续功能迭代,产品市场占有率从 15% 提升至 35%。

总结:售后是网站价值的 “延长线”

优质的售后不是成本项,而是利润增长点竞争壁垒。对于开发方而言,完善的售后体系可提升客户生命周期价值(LTV),降低获客成本;对于客户而言,可靠的售后意味着更低的技术风险、更高的业务灵活性。因此,在规划网站项目时,务必将售后预算(建议占总投入的 15%-20%)、服务条款纳入前期考量,选择具备技术硬实力 + 服务温度的合作伙伴。


版权所有:上海缘震网络科技有限公司
备案号:沪ICP备15001555号