HTML最佳实践

一,HTML最佳实践

1,在构建页面的时候,经常会要添加图片,但是图片是以<img>元素存在?还是背景图方式存在?

答:如果图片是作为页面内容的一部分,则应该使用<img>元素,如果图片是起装饰作用,则应该使用背景图方式。

2,给空标签中添加隐藏文字,用于说明标签的实际功能(一般设置text-indent来达到隐藏文字的目的如:text-indent:-9999px)

二,页面构建标题结构的最佳实践

(1)在页面内容的标题部分使用<hx>标签

(2)页面中只使用一个<h1>标签

(3)<hx>标签使用过程中不要调级

(4)不要单纯使用<hx>标签给内容设置样式

三,表单的构建最佳实践

html结构如下:

<form>
        <fieldset>
            <legend>Sign in to begin</legend>
            <label for="userName">User Name:</label>
            <input type="text" id="userName" name="userName" placeholder="" tabindex="1"/>
            <label for="password">Password:</label>
            <input type="text" id="password" name="password" placeholder="" tabindex="2"/>

            <input type="checkbox" id="staySigned" name="staySigned" tabindex="3"/>
        </fieldset>
        <input type="submit" value="Login" tabindex="4"/>
    </form>

(3)如有必要,給输入空间设置tab顺序

<input type="text" tabindex="2"/>

(4)使用HTML5引入的表单控件

HTML中引入多个输入控件的类型(如url、email、date、search和number)

原文地址:https://www.cnblogs.com/qianxunpu/p/9271347.html

时间: 2024-10-03 08:42:35

HTML最佳实践的相关文章

基础入门_Python-模块和包.运维开发中watchdog事件监视的最佳实践?

简单介绍: 说明:  此模块是一个跨平台的PY库和SHELL工具,可以监视文件系统事件(增加/删除/修改) 快速安装: pip install --upgrade watchdog 日志记录: event_handler = LoggingEventHandler() -> event_handler 说明: 创建一个日志处理句柄,其实LoggingEventHandler是继承自FileSystemEventHandler类,只是重写了增删查改的回调函数,直接调用logging模块写到对应lo

基础入门_Python-内建函数.运维开发中eval内建函数的最佳实践?

简单介绍: 说明: 在指定命名空间中计算参数字符串的有效表达式,并返回一个对象, Help on built-in function eval in module __builtin__: eval(...)     eval(source[, globals[, locals]]) -> value          Evaluate the source in the context of globals and locals.     The source may be a string 

45个实用的JavaScript技巧、窍门和最佳实践

如你所知,JavaScript是世界上第一的编程语言,它是Web的语言,是移动混合应用(mobile hybrid apps)的语言(比如PhoneGap或者Appcelerator),是服务器端的语言(比如NodeJS或者Wakanda),并且拥有很多其他的实现.同时它也是很多新手的启蒙语言,因为它不但可以在浏览器上显示一个简单的alert信息,而且还可以用来控制一个机器人(使用nodebot,或者nodruino).掌握JavaScript并且能够写出组织规范并性能高效的代码的开发人员,已经

毫秒必争,前端网页性能最佳实践

你愿意为打开一个网页等待多长时间?我一秒也不愿意等.但是事实上大多数网站在响应速度方面都让人失望.现在越来越多的人开始建立自己的网站,博客,你的网页响应速度如何呢?在这篇文章中我们来介绍一下提高网页性能的最佳实践,以及相应的问题解决方案,让站长或者即将要成为站长的朋友了解如何去测试和提高网站响应速度,对自己的网站更有信心. 最佳实践 最佳实践我们引用的来自yahoo前端性能团队总结的35条黄金定律.原文猛击这里.下面我们分门别类将每条的关键点总结一下. 网页内容 减少http请求次数 减少DNS

atitit.手动配置列表文件的选择and 数据的层次结构 attilax总结最佳实践--yaml

atitit.手动配置列表文件的选择and 数据的层次结构 attilax总结最佳实践--yaml 1. yaml是个好的选择.. 1 2. 数据的层次结构--结构:hash,list,和block literal. 1 3. yaml跟json的实现区别 1 4. xml的优点及json的问题 2 4.1. ide友好 2 4.2. JSON也适合与任何数据,复杂struts难以阅读 2 4.3. json难以手工维护 3 5. 基于YAML的开源项目解析YAML文件最常用的Java库是JvY

京东前端:PhantomJS 和NodeJS在网站前端监控平台的最佳实践

1. 为什么需要一个前端监控系统 通常在一个大型的 Web 项目中有很多监控系统,比如后端的服务 API 监控,接口存活.调用.延迟等监控,这些一般都用来监控后台接口数据层面的信息.而且对于大型网站系统来说,从后端服务到前台展示会有很多层:内网 VIP.CDN 等. 但是这些监控并不能准确地反应用户看到的前端页面状态,比如:页面第三方系统数据调用失败,模块加载异常,数据不正确,空白开天窗等. 相关厂商内容 Native动态化最新技术解析 不可错过的智能时代的大前端 性能优化最佳实践经验谈 百度技

[转] React 最佳实践——那些 React 没告诉你但很重要的事

前言:对很多 react 新手来说,网上能找到的资源大都是些简单的 tutorial ,它们能教会你如何使用 react ,但并不会告诉你怎么在实际项目中优雅的组织和编写 react 代码.用谷歌搜中文“ React 最佳实践”发现前两页几乎全都是同一篇国外文章的译文...所以我总结了下自己过去那个项目使用 React 踩过的一些坑,也整理了一些别人的观点,希望对部分 react 使用者有帮助. React 与 AJAX React只负责处理View这一层,它本身不涉及网络请求/AJAX,所以这

SQL Server集成服务最佳实践:语句优化

SQL Server集成服务(SQL Server Integration Services,SSIS)在其前辈DTS(Data Transformation Services,数据转换服务)的根基上进步了不少,从可用性.性能和并行等方面来说,它已经成长为一个企业级ETL(Extraction, Transformation and Loading,抽取.转换和加载)产品,除了是一个ETL产品外,它也供给了各种内置任务来管理SQL Server实例.虽然SSIS的内部架构已经被设计为供给极好的性

C# 性能优化最佳实践

1.显式注册的EvenHandler要显式注销以避免内存泄漏 将一个成员方法注册到某个对象的事件会造成后者持有前者的引用.在事件注销之前,前者不会被垃圾回收. private void Form1_Load() { -- //注册事件 CommandRemotingContext.CmdChanged += new ReciverCmdStateChangedEventHandler(this.CommandRemotingContext_CmdChanged); -- } private vo

腾讯优测优分享 | 探索react native首屏渲染最佳实践

腾讯优测是专业的移动云测试平台,旗下的优分享不定时提供大量移动研发及测试相关的干货~此文主要与以下内容相关,希望对大家有帮助. react native给了我们使用javascript开发原生app的能力,在使用react native完成兴趣部落安卓端发现tab改造后,我们开始对由react native实现的界面进行持续优化.目标只有一个,在享受react native带来的新特性的同时,在体验上无限逼近原生实现.作为一名前端开发,本文会从前端角度,探索react native首屏渲染最佳实