前端开发者需要知道的Web 标准 & W3C 规范

菜园前端
• 阅读 192

原文链接:https://note.noxussj.top/?source=helloworld


Web 标准

web 标准主要分为结构、表现、行为 3 部分。

  • 结构:指我们平时在 body 里面写的标签,主要是由 html 标签组成
  • 表现:指更加丰富 html 标签样式,主要由 css 样式组成
  • 行为:指页面和用户的交互,主要由 javascript 部分组成

W3C 规范

w3c 对 web 标准提出了规范化的要求,即代码规范。

对结构的要求

标签字母要小写

正确示范

<div></div>

错误示范

<DIV></DIV>

标签要闭合

正确示范

<div></div>
<img src="" alt="" />

错误示范

<div>
<img src="" alt="">

标签不允许随意嵌套

正确示范

<div>
    <i></i>
</div>

错误示范

<div>
    <i>
</div>
    </i>

对表现和行为的要求

建议使用外链 css 和 javascript 脚本,实现结构与表现分离、结构与行为分离,能提高页面的渲染效率,更快地显示网页内容。


最全面的前端笔记来啦,包含了入门到入行的笔记,还支持实时效果预览。小伙伴们不需要再花时间去写笔记,或者是去网上找笔记了。面试高频提问和你想要的笔记都帮你写好了。支持移动端和 PC 端阅读,深色和浅色模式。 原文链接:https://note.noxussj.top/?source=helloworld

点赞
收藏
评论区
推荐文章
Wesley13 Wesley13
2年前
SEO和标签的语义化
做网站,我们都是需要考虑到标签语义化来提高SEO搜索排名的,那么我们就先来了解一下:w3c标准:html结构css样式js行为遵循的原则:先确定语义的HTML,再选合适的CSS。语义是否良好:当我们去掉CSS之后,网页结构依然组织有序,并且有良好的可读性。作用:语义化的网页的好处,最主要的就是对搜索引擎友好,有了
菜园前端 菜园前端
1年前
推荐你学学HTML5考核标准和我的学习方法
原文链接:考核标准很多同学都知道笔记、教程视频网上都有很多,并且自己也去学习了。但是却不知道学到什么样的程度才算真的掌握了呢?所以老师将会以自己的想法作为一个标准,进行考核。怎么样才算掌握了HTML5技术?1.必须知道Web标准和W3C规范是什么?2.必须
菜园前端 菜园前端
1年前
什么是HTML语义化?
原文链接:什么是语义化?简单了来说就是,当网页去掉CSS样式时,页面能呈现出来清晰的结构。语义化的核心作用:提升代码可读性,便于团队开发和维护。以下是语义化的HTML标签结构(部分语义化标签):假设我要编写一个这样的布局不使用语义化是这样的使用语义化是这样
Stella981 Stella981
2年前
JavaScript
Javascript简介web前端有三层:HTML:从语义的角度,描述页面的结构CSS:从审美的角度,描述样式(美化页面)Javascript:从交互的角度,描述行为(提升用户体验)JavaScript的组成ECMAScript5.0:定义了js的语法标准:包含变量、表达式、元素符、函数、i
Wesley13 Wesley13
2年前
CSS3的基础知识学习(二)
前言:CSS主要是用来修饰标签的样式、使得网页更加美观,其实css的引用有三种方式,但主要是使用链接引用,意思就是我们写一个.css的文件,将样式修饰的控制代码写在这里面,这样控制起来方便快捷。对于CSS的学习,知识点中最重要的部分就是属性和选择器,其次还有页面布局和盒子模型,下面进行学习以及代码效果演示。一、CSS的三种引入
Stella981 Stella981
2年前
JavaScript DOM编程艺术(第2版)学习笔记1(1~4章)
第一章一些基本概念HTML(超文本标记语言),构建网页的静态结构,由一系列的DOM组成;CSS(层叠样式表),给网页各部分结构添加样式;JavaScript,通过获取DOM给静态结构加上动作,使用户能够与静态网页进行交互;DOM,一种API(应用程序接口),通过这个接口动态的访问和修改结构或样式。浏
Stella981 Stella981
2年前
GitHub标星13.1k,JavaScript基础知识必知(一)!前端入门必看!
JavaScript背景Web前端有三层:HTML:从语义的角度,描述页面结构CSS:从审美的角度,描述样式(美化页面)JavaScript:从交互的角度,描述行为(实现业务逻辑和页面控制)发展历史JavaScript诞生于
Wesley13 Wesley13
2年前
3D轮播切换特效 源码+注释
这个3D轮播切换特效是我2017年2月份写的当初我刚接触HTML不久,现在把源码分享给大家 源码的注释超级清楚。<!声明文档类型:html作用:符合w3c统一标准规范每个浏览器对htmlcssjs都有自己的编码模式(兼容模式)\ 无序列表标签  盒子模型标签 img图片标签四要素 1<
Wesley13 Wesley13
2年前
HTML5网页文档结构
2.1    Web标准Web标准,使得Web开发更加容易。Web标准由万维网联盟(W3C)制定。2.1.1         Web标准概述Web标准的最终目的就是保证每个人都有权力访问相同的信息,同时,Web标准也可以使用站点开发更快捷与更令人愉快。如果web开发人员遵循了Web标准,开发人员可以更容易理解彼此的编码,Web开发团队的协作也
韦康 韦康
1星期前
WEB前端线上系统课(20k+标准)
WEB前端线上系统课(20k标准)download》quangneng.com/255/WEB前端线上系统的介绍WEB前端线上系统是指一个基于Web技术的在线应用程序,主要用于前端开发和展示网页界面。它包括一系列前端技术和工具,用于开发、测试和部署Web