今天对博客进行了下 W3C 标准验证,发现一种无关紧要的错误提示、两种警告提示,强迫症犯起来连我自己都怕,遂将博客所有页面全部进行标准验证,历经九九八十一难总算全部搞定,至此博客所有页面均全部通过 W3C 标准验证,对于 W3C 的错误提示就一种,就是自己在写文章插入图片后没有加 alt 属性,这个由于博客插入图片的文章很少,直接手动加上解决。


还有两种警告浪费不少时间,第一种是 wordpress 调用 javascript 时会自动添加 type 属性,而 W3C 认为这是不必要的,也就是 HTML5 不再需要为 JavaScript 标签和样式,声明类型属性,即需要将<script type = “text/javascript” >中的type = “text/javascript” 删除掉,样式标签同理。 wordpress 一般都是通过wp_enqueue_scriptwp_enqueue_style函数调用文件的,它自动给添加上了 type 属性,同时主题还用到了wp_localize_script(脚本本地化函数)同样存在上述问题。网上找了好长时间都没有找到比较好的办法,无奈下自己只好通过修改 wordpress 原文件的方法来删除 type 属性的声明。


不过倒是发现个去除wp_enqueue_scriptwp_enqueue_style调用脚本时添加 type 属性的方法,由于wp_localize_script函数的问题不能通过此方法解决,我并没有采用。有需要的可以用用看。将如下记录的代码添加到 function.php 文件中即可:

add_filter('style_loader_tag', 'codeless_remove_type_attr', 10, 2);
add_filter('script_loader_tag', 'codeless_remove_type_attr', 10, 2);
function codeless_remove_type_attr($tag, $handle) {
    return preg_replace( "/type=['\"]text\/(javascript|css)['\"]/", '', $tag );
}

第二种警告就比较蛋疼了,就是我在主题头部添加了如下声明:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

其作用就是防止在手机端点击文本框时网页自动放大的问题。而 W3C 警告考虑避免设置阻止用户调整文档大小的值......为此费了九牛二虎之力始终找不到其它合适的办法,网上找不到办法于是就去看别的博客有没有没用上述办法,也能保证手机端点击文本框不放大的。然后审查其代码看看是怎么实现的,倒是发现一个博客确实做到了,可审查好长时间,经过各种调试也不知道人家是怎么做到的,遂打算放弃,不过过了一会儿觉得输入框字体偏小,就试着调整字体大小,没想到歪打正着。原来在这里,只要将文本框内的字体设置为不小于 16px 即可解决上述问题,娘西皮啊! 莫非是手机浏览器认为如果文本框文字小于 16px 就会看不清楚?W3C

  1. sys
    sys 2018-01-21 07:45 pm回复

    手机上看网页能缩放啊,这是你搞定好的效果?

    1. 沉沦
      沉沦 2018-01-21 07:55 pm回复

      不是,就是手机下点击评论框时页面不放大,同时还要完全符合 W3C 要求。你评论时没发现输入的文字大?

  2. sys
    sys 2018-01-22 08:54 am回复

    看到了,这个大文字就是 W3C 的要求吗?为啥要这样

    1. 沉沦
      沉沦 2018-01-22 09:19 am回复

      不知道啊,我猜测是怕看不清楚......

      1. sys
        sys 2018-01-22 09:23 am回复

        有点莫名其妙,不过用你的方法把 enqueue 的 type= 那个属性去掉了,哈

  3. 明月清风
    明月清风 2018-01-24 09:44 pm回复

    博主是不是应该来一发友链

    1. 沉沦
      沉沦 2018-01-24 09:54 pm回复

      好的,好的,已经添加内页链接。

      1. 明月清风
        明月清风 2018-01-24 09:57 pm回复

        难道还有首页吗

© 2018 Socode