HTML head 头标签

HTML head 头部分的标签、元素有很多,涉及到浏览器对网页的渲染,SEO 等等,而各个浏览器内核以及各个国内浏览器厂商都有些自己的标签元素,这就造成了很多差异性。移动互联网时代,head 头部结构,移动端的 meta 元素,显得更为重要。了解每个标签的意义,写出满足自己需求的 head 头标签,是本文的目的。本篇以一丝的文章为基础,进行扩展总结介绍常用的 head 中各个标签、元素的意义以及使用场景。 DOCTYPE DOCTYPE(Document Type),该声明位于文档中最前面的位置,处于 html 标签之前,此标签告知浏览器文档使用哪种 HTML 或者 XHTML 规范。   DTD(Document Type… Read More

用JavaScript探测页面上的广告是否被AdBlock屏蔽了的方法

每个人都讨厌广告。看电视、看电影、看优酷、看网页时,对满天飞的广告也是深恶痛绝。广告是一个不招人喜欢的东西。但是,对一个中小网站站长/ 博客主来说,广告几乎是唯一的能成支持网站/博客正常运转的资金来源。如果一个博客主,只是无私发布稿件,能坚持几年的,很少。大多数慢慢失去了热情。 火狐浏览器和谷歌浏览器里都有能够屏蔽页面给广告的插件,最有名的是AdBlock和AdBlock Plus。前几天,我做一个统计,看看浏览网站的用户中有多少人使用了AdBlock插件,发现这个数目竟然有总浏览人数的1/5。 1/5是一个不小的数目。如何能让广告位在这1/5的使用了AdBlock插件的用户的页面上用其它图片代替呢?… Read More

Magento:Service Temporarily Unavailable ?

如果出现错误: Service Temporarily Unavailable The server is temporarily unable to service your request due to maintenance downtime or capacity problems. Please try again later.   Check if there is a file called maintenance.flag in your magento root. If so Delete it.   When Magento is performing certain tasks it temporarily creates this file. Magen… Read More

【必备】史上最全的浏览器 CSS & JS Hack 手册

浏览器渲染页面的方式各不相同,甚至同一浏览器的不同版本(“杰出代表”是 IE)也有差异。因此,浏览器兼容成为前端开发人员的必备技能。如果有一份浏览器 Hack 手册,那查询起来就方便多了。这篇文章就向大家分享 Browserhacks 帮我们从网络上收集的各个浏览器特定的 CSS & JavaScript Hack,记得推荐和分享啊! IE 选择器 Hack /* IE 6 and below */ * html .selector {} .suckyie6.selector {} /* .suckyie6 can be any unused class */ /* IE 7 and below */ .selector, {} /* IE 7 */ *:first-ch… Read More

深入理解JavaScript系列:《你真懂JavaScript吗?》答案详解

介绍 昨天发的《大叔手记(19):你真懂JavaScript吗?》里面的5个题目,有很多回答,发现强人还是很多的,很多人都全部答对了。 今天我们来对这5个题目详细分析一下,希望对大家有所帮助。 注: 问题来自大名鼎鼎的前端架构师Baranovskiy的帖子《So, you think you know JavaScript?》。 答案也是来自大名鼎鼎的JS牛人Nicholas C. Zakas的帖子《Answering Baranovskiy’s JavaScript quiz》——《JavaScript高级程序设计》一书的原作者 (但题目2的解释貌似有点问题) OK,我们先看第一题 题目1 if (!("a" in window)) {… Read More

初步认识 LESS

LESS 是一个流行的样式表语言,它提供了 CSS3 也未曾实现的多种功能,让您编写 CSS 更加方便,更加直观。LESS 已经被广泛使用在多种框架中 ( 例如:BootStrap)。本文将介绍 LESS 产生的背景、优势、演化与 CSS 之间的转化,及其典型的应用场景,并将其与其他样式表语言进行比较。相信前端开发工程师会喜欢 LESS,灵活运用 LESS 以提高开发效率。   LESS 背景介绍 LESS 提供了多种方式能平滑的将写好的代码转化成标准 CSS 代码,在很多流行的框架和工具盒中已经能经常看到 LESS 的身影了(例如 Twitter 提供的 bootstrap 库就使用了 LESS)。那么,LESS 是从何而来呢?它和 SASS… Read More

php程序员应具有的7种能力

php程序员应具有什么样的能力,才能更好的完成工作,才会有更好的发展方向呢?在中国我想您不会写一辈子代码的,那样不可能,过了黄金期,您又怎么办呢?看了本文后,希望对您有所帮助。   一,php能力   1,了解阶段,您能写一些代码,因为那是在手册和google的帮助下,您才完成的。变量乱定义,N多函数不知道,做起事来很慢,想到什么写什么,代码写的比较乱,后期维护很麻烦。   2,熟悉阶段,经常查函数,手册估计也看过一,二遍了,常用的函数基本上您都了解了。后 期维护给您带来了不少痛苦,您开始发现自己的代码有很多不足,开始思考如果改进自己的代码,如何站在项目的角度来规划自己的代码,… Read More

[JavaScript] 判断网页能不能被IFrame 嵌入

IFrame是一个分享资讯非常方便的的方式 只要输入 <iframe src="http://example.com/"></iframe> 就可以嵌入一个网页了! 然而,事实上并不是这么的完美,并不是所有的网页都允许嵌入… 譬如说Google,如果妳直接就输入Google 的网址,如下面 <iframe src="http://google.com"></iframe> 那么将只会得到一个空白的IFrame而已… 如果有打开Console 的话,就会看到一些安全性上的错误,不过很可惜的JavaScript 很难去handle 这个错误… 针对IFrame监听onerror是… Read More

解决URL出现%E2%80%8E(Zero-Width Space)

当URL出现%E2%80%8E就代表你的URL里面有包含一个ZERO-WIDTH SPACE (ZWSP) 这个是肉眼无法发现的空白,有时候你会觉得明明已经按下→了,却怎么游标还在原地,没有移动到下一个字元去   这种时候就代表这两个字元中间有一个ZWSP的存在 ZWSP一般情况是打不出来的,但是如果你是透过WORD等等的文件编辑器复制贴上的 就很有可能含有ZWSP,一般情况下ZWSP并不影响阅读 但是当它变成URL的一部分,就会变成%E2%80%8E ,使你的URL错误 这都还算是好发现且好解决的 要是当他要拿来当hash的值做验证,如同下面这样 if(sha1($password)!== sha1($_P… Read More

真正的响应式图片

不知不觉,现在国外网页已经到了“优先为移动平台创建”的时候了,优点是可以优化CSS结构与代码量,还可以使得移动端用户体验更优质的性能。我目前使用的这个Medium写作平台就是基于“移动先行”策略而开发的,使用起来不论什么方式,它的体验都很棒。   为 小屏幕的移动设备减少数据传输量可以大幅提高移动设备对web的加载性能,而性能对你的用户满意都有着重要的影响。Guy Podjarny做过调查,86%的响应式网站在最小的手机屏幕上浏览时的页面大小与大屏幕是相同的。也就是说虽然采用响应式设计的网站看起来像个移动站 点,实际上它们大多数加载了大屏幕端所有内容,造成的原因无外乎这三种: 1.下载并隐藏 2.… Read More

Adaptive Images : 为不同的屏幕尺寸提供不同的图片

为其提供不同的图片。接下来我们就看一看如何利用该技术实现图片自适应。 设置自适应图片 实现 Adaptive Images 解决方案需要 Apache 2、PHP 5.x 和 GD 库,也就是说需要 Web 服务器端编程。首先,在其网站上下载.zip 文件开始配置:   解 压文件,然后将其中的adaptive-images.php和.htaccess文件拷贝到网站的根目录。如果你网站的根目录下已经有一 个.htaccess文件了,不要覆盖它。参考下载包中的instructions.htm文件看看怎么做合适。接着在网站根目录下创建一个名为 ai-cache 的文件夹。   用你最喜欢的 FTP 客户端软件设置该文件夹的权… Read More