标签：java 混合 w3c viewport asc 地方 variable before dream
因为曾经在高中买来《C Primer Plus》和大学买来的《Clean Code》（挑战自己买的英文版的结果就啃了一点）给我一种经典的书都特别厚的一本就够读大半年的感觉。加上刚上大学图便宜买的有关做网站的旧书（应该是Table布局和Dreamweaver比较火的时代的书，这些书倒是很薄）让我一度认为做网页不就是table然后tr、td什么的套呗，高大上点不就是div+CSS嘛有什么大不了，给我设计好什么网页不都ok能做出来么？这种感觉。然后看网络课程，在网上找资料学习后才发现以前的自己太逗了，之后就一直靠网络课程、MDN、博客、百科这些渠道学习，但一想到网上大牛们评价特别高的书还没看过就总感觉少了点什么。最近将这些书看了看，发现以前只知道要这么做比较好的地方现在也更加明白这样做的意义，也纠正了以前理解的一些错误。
我这里我只总结一些我以前掌握不扎实的和我认为比较重要的。
键盘访问（提高可访问性）
onclick已经帮我们处理了，eg：下面这个绑定了onclick的按钮鼠标左键点击和tab然后回车一样弹出"clicked"
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="alert(‘clecked‘)">"click" me</button>
</body>
</html>DOM core和HTML-DOM
由于HTML与XML的相似性及差异，JavaScript不仅实现了标准的DOM方法和属性（即由W3C制定的），而且还实现了HTML特有的DOM方法和属性。
DOM Core：标准的DOM方法和属性
HTML-DOM：HTML特有的DOM方法和属性
一开始以Ajax为起点设计网站很难做到平稳退化，但一开始用老式的页面刷新机制设计网站，在此基础上用拦截请求用Ajax技术处理就可以实现平稳退化。（渐进增强：HTML全部完成->CSS全部完成->JS全部完成->网站完成）
==这样得后端也得做一套页面展示（点开链接和平稳退化用），前端不应再页面加载时使Ajax（应该由后端生成）==
现在主流的MVVM框架全是使用JS生成DOM。。
很多大网站都没见用，FF里要Alt+Shift+c才能使用下面设置的快捷键
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>文件名全部使用小写字母，用短横线分隔单词，用 .html 作为扩展名。混合使用大小写字
母会增加访问者输入正确地址以及找到页面的难度
文件夹的名称也应全部用小写字母。关键是保持一致。如果使用小写字母，访问者和创建者就
不必在大写字母和小写字母之间转换浪费时间了
万维网的发明者 Tim BernersLee 曾说过一句著名的话：“万维网的力量在于其普适性。让包括残障人士在内的每个人都能访问万维网，是极为重要的一点。”
small元素表示的含义是法律声明等条文细则。默认情况下，它比其他的文字显示得小一些，但是==显示小字号并不是使用这个元素的理由==
（以前一直当small是小号字体=_=）
曾经使用Bootstrap4的时候没找到中文翻译，准备自己翻译一下翻译了两页有点感觉有点多，就往下翻了翻看看到底有多少工作量，然后看见有Translations，点进去一看发现大家基本都知道但很容易忘的一项翻译的人给强调出来了：
HTML5标准的 doctype 头部定义是首要的，否则会导致样式失真（中国码农往往直接抄国外站点将lang写成en的小细节也要注意以免贻笑大方)。
注：以前搜过lang相关的里面的规则很复杂的（网页头部的声明应该是用 lang="zh" 还是 lang="zh-cn"？ - 知乎），但一般国内的页面现在一般还都是zh-CN。
Emmet设置默认生成的lang为zh-CN：
下面代码添加到Emmet的Settings-User
{
"snippets": {
"variables": {
"lang": "zh-CN"
}
}
}main元素是 HTML5 新添加的元素。记住，在一个页面里仅使用一次。
在 HTML 中，应该将附注栏(aside)内容放在 main 的内容之后。出于 SEO和可访问性的目的，最好将重要的内容放在前面。可以通过 CSS 改变它们在浏览器中的显示顺序。
WAI-ARIA（Web Accessibility Initiative’s Accessible Rich Internet Applications，无障碍
网页倡议 – 无障碍的富互联网应用，也简称ARIA）是一种技术规范，自称“有桥梁作用的技术” 。
role="xxx"title="xxx"@import 指令会影响页面的下载速度和呈现速度，在 Internet Explorer 中影响更为明显。
@media 规则只有screen 和 print（或许还应加上 all）浏览器支持的很好。
:first-line的语法为::first-line。:first-letter的语法为::firstletter。注意，它们用两个冒号代替了单个冒号。这样修改的目的是将伪元素（有四个，包括::first-line、::first-letter、::before和::after）与伪类（如:first-child、:link、:hover等）区分开。
未来，::first-line和::first-letter这样的双冒号语法是推荐的方式，现代浏览器也支持它们。原始的单冒号语法则被废弃了，但浏览器出于向后兼容的目的，仍然支持它们。不过，IE9之前的InternetExplorer版本均不支持双冒号。因此，你可以选择继续使用单冒号语法，除非你为IE8及以下版本设置了单独的CSS。
<meta name="viewport" content="width=device-width, initial-scale=1" />
使用Respond.js
HTML5 并没有提供任何保护媒体内容的方法。因此，如果你很在意对媒体文件的保护，那么暂时不要使用 HTML5 原生多媒体。
标签：java 混合 w3c viewport asc 地方 variable before dream
原文地址：https://www.cnblogs.com/jffun-blog/p/9065066.html
