杰拉斯的博客

标签：前端

[前端]浅析外边距折叠（Collapsing Margins）

杰拉斯 杰拉斯 | 时间：2013-01-26, Sat | 11,585 views
前端开发　

我们在学习前端的过程中，有时候会出现一些奇怪的现象，Collapsing Margins便是其中之一，有时候我们想要某个元素离的第一个子元素能够下移一些，于是给它设置了margin-top，但奇怪的是这个margin-top属性却传递给了父元素，导致父元素的位置下移：

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
	<style type="text/css">
		body {
			margin: 0;
		}
		.parent {
			height: 200px;
			background: #0099ff;
		}
		.child {
			width: 230px;
			margin-top: 50px;
		}
	</style>
</head>
<body>
	<div class="parent">
		<div class="child">Child</div>
	</div>
</body>
</html>

这是个BUG吗？为什么各种浏览器都会有这样的“BUG”呢？其实，W3C规范认为margin折叠会使页面布局更加合理，比如两个段落（<p>）之间，段前间距跟段后间距应该只保留最大的一个，而不应该两者相加而导致段落之间间隙过大。下面，我们就来探究一下这个奇怪的Collapsing Margins。

(阅读全文…)

[转载]高性能网站需避免的7个错误

杰拉斯 杰拉斯 | 时间：2012-12-14, Fri | 6,705 views
前端开发　

翻译是门体力活，最后一点内容实在没嚼头，有些捣糨糊，省了不少废话。

原文地址：http://www.sitepoint.com/seven-mistakes-that-make-websites-slow/

原文作者：Coach Wei

翻译编辑：zhangxinxu

假期临近（应该指感恩节和圣诞节），公司增加了SEM方面的花费，关注SEO，修改页面。然而，为了最大的销售额，这些时间、财力上的付出可能就是打水漂——如果假期增加了访问量让网站速度变慢甚至下去的话。

性能影响用户是毫无疑问的。网站速度直接影响反弹率、转化率、收入、用户满意度、搜索引擎优化（已知的如反映网站流行度的Page Rank）以及几乎所有值得追踪的业务。用户离开速度慢的网站，而且往往不会再回来。

还在不久前，用户离开一个网站的时间点是8秒。然而，很快就是6秒，然后4秒，然后现在是2秒。门槛一直在提高。

小小性能改变，大大影响发生

用户的耐心不是线性的。第1秒的时候基本上没有人会放弃这个站点。但是，1秒开外之后，如果没有适当的反馈的话（例如浏览器标头显示页面标题），用户开始以一个加速的比率离开。到3~4秒的时候，一般的站点会一半的潜在用户。当然，具体的阈值根据网站、用户行为和意图以及其他因素不同而有所不同……但万变不离其宗。

瓶颈

快速测试：当HTML载入浏览器之后，用户等待你页面加载的时间百分比是多少？如果你不是做web开发的，或是经常混迹于性能社区的话答案可能会让你大跌眼镜。一般超过90%，用户花在等待上的时间的90%实在页面HTML载入到浏览器之后。为什么会这样呢？

(阅读全文…)

HTML文档与盒子模型

杰拉斯 杰拉斯 | 时间：2012-10-15, Mon | 14,415 views
前端开发　

关于HTML

百度百科里是这么说的：超文本标记语言，即HTML（Hypertext Markup Language），是用于描述网页文档的一种标记语言。

为什么叫用于“描述”网页文档的“标记”语言呢？

简单地说，它不像Java，C++等程式语言，而是通过

标记

（也称标签）来表示一个网页的结构与内容，它的语法非常简单，只是由各种不同的标记组合而成，因此这类语言的学习方式主要靠积累，而非程式语言般靠理解来学习。

(阅读全文…)

导航是Web网站重要的元素：置顶菜单的设计研究

杰拉斯 杰拉斯 | 时间：2012-10-06, Sat | 9,460 views
前端开发　

SirsiDynix公司UX/UI设计师Hyrum Denney在Smashing Magazine上发表了一篇文章《Sticky Menus Are Quicker To Navigate》，分享了自己对“置顶菜单”进行的可用性研究成果，及实现技术和相关挑战。CSDN对该文进行了编译，内容如下：

导航是Web网站中最重要的元素之一，大部分设计师都同意这一点。尽管如此，现在的导航并不总是容易使用。通常，用户必须滚动到网站的顶部才能访问导航菜单。最近，我在研究“置顶菜单”是否可以加速网站的导航。对此我进行了可用性研究。下面将展示本次研究的成果，以及一些实现的技术及相关的挑战。

(阅读全文…)