网页设计怎样做置顶 第1篇
首选我们需要让置顶文章显示在最前面，大家可以先看看你的主题是不是已经有这样的效果了，如果已经有的，那就这一步就不用看了。如果没有那就接着下面的操作。
要让置顶文章显示在最前面，主要有两种方法，一种是插件，另一种是代码。
这里给大家分享两个插件，第一个是Sticky Posts – Switch，插件安装之后可以设置置顶文章的显示位置，可以控制首页、分类页标签页、自定义文章类型页面的置顶文章显示。不过这个插件默认是把所有的置顶文章都显示到最前面，比如B分类有置顶，那么在A分类也会显示B分类的这个置顶文章，如果你觉得这样OK的话，那么这个插件效果是最稳定的，也重简单。
Sticky Posts – Switch
Category Sticky Post
大家可以直接把下面的代码添加到当前wordpress建站主题的文件中保存，它会自动在当前分类显示本分类的置顶文章。【代码来自露兜即刻博客】
网页设计怎样做置顶 第2篇
相当一部分的网页首屏是使用图片作为视觉传达的主体。
而无论是选择图片、视频、动画还是其他的视觉化的元素，每个Banner或者说带有标题的内容区块最好是带有漂亮、惊艳的视觉化元素作为支撑。当然，最常用的还是图片。
首图在首屏中的重要性无疑是巨大的，它不仅要漂亮，还要同网站内容深入地结合搭配起来。所以，它的设计还可以更加深入一些。
单独的图片表现力是有限的，通过排版设计，将它同其他的元素结合起来使用会有不错的效果：
在进行排版设计的时候，应该注意几点：
锐利搞分辨率的图片和标题文本之间应该保持良好的对比度；人们希望看到脸和表情，这会更容易传递情绪和感情；注意引导用户和网站首屏进行互动。
在首屏当中，元素与元素之间是相互配合构成整体设计的。
而导航是首屏当中无法忽略的一个重要组成部分，无论你喜欢的是完整展开的导航，还是为了干净的布局而将导航隐藏在汉堡菜单中，导航的设计应该和首屏的整体设计合而唯一的。
导航的目的是将用户引导到他们想去的不同页面，所以，推荐使用置顶悬浮式导航，这样用户不论浏览到页面哪个地方都能够轻松跳转。
导航元素在首屏当中，和其他的元素组合使用的时候，它们会和其他的元素构成对比，还能形成层次感，而这种层次感的构建和整个设计方案息息相关，应该根据具体情况具体安排。
视觉传达是一项系统工程，单靠一张图片是不够的。所以，你需要系统的考虑整个首屏的信息传达：
这些问题能够帮你梳理出整个首屏的细节设计思路。
想要让首屏更加醒目，超大的字体总是最有效的办法。
即使文字内容很简单，当用户打开首屏的时候也会一眼就注意到它们，在阅读其他内容之前，只会注意这些内容。
尽管字体和排版千变万化，但是在字体的选取和首屏设计上尽量遵循下面的的两个规则来进行：
用户研究领域的先驱 Nielsen Norman Group 曾经针对这一用户行为进行了深入的研究，为设计师和可用性设计专家们提供了更好的素材和设计依据。
简而言之，当人们访问某个网站的时候，尤其是初次访问网站的时候，他们通常不会特别仔细的查看所有的内容，而是快速的扫视，找到能够吸引他们注意力的信息，这些内容就是他们继续停留在这个网站上的理由。
通过眼动测试和不同实验，他们发现访问者的视觉浏览模式，可以归结为几种典型的模式。
设计师 Steven Bradley 在自己的文章中，总结了这三种常见的模式：古腾堡式，Z图模式和F图模式。
古腾堡式：对于信息结构层次并不那么分明的网页，用户常常会使用古腾堡式的浏览模式，用户大范围扫视页面内容，整个视线路径是一个大号的Z，其中最开始的两个视觉驻留点就在页头上。
Z图模式也不难理解，用户从上到下，视线沿着Z字形来回扫视，用户会左右快速扫视，视线的起点首先是左上角，行跨顶部一栏到右上角，然后向下延伸。
F图模式，或者说是F式布局，我们就更加熟悉了。Nielsen Norman Group 的研究当中，这种阅读模式最为典型：
所以，将最关键的元素置于用户的浏览路径上，让用户可以更轻松地消化信息，也能最高效地执行交互。
想要引导用户，首屏几乎是完美的存在。
网页设计怎样做置顶 第3篇
设置好了置顶，接下来我们就需要给置顶文章添加一个比较显示的标记，比如上图2那种样式，就是一个置顶的文字+一个背景色。接下来开始操作。
然后把下面的代码添加到【the_title】这段的前面或后面即可（文字内容可以修改）。不同的主题可能添加的位置不同，所以你可能需要多试试，直到标题前后能够显示【置顶】为止。
现在光显示一个置顶的文字还不是太明显，所以接下来我们再使用CSS给置顶文字添加一个背景，代码参考如下：
最后的效果如上图所示。
以上就是今天分享的内容。文章置顶一般在博客资源类型的网站中使用比较多，不过这类网站都是专门的主题，所以大家也可以直接用这类主题来建站，一般置顶功能都是开发好的，就不需要我们再折腾了。