成功的网站顶层设计可以提高用户体验。 当用户浏览到顶部时，可以成功引导用户进入其他页面继续浏览。 除了延长网站停留时间外，还可以有效提高网站各个页面的性能。 权重，提高网站整体权重。 明天小编主要讲一下如何在凡客中使用网站模板搭建网站来设计网站的顶部：
1. 进入顶部设置页面有两种方式：
① 打开网站模板第一屏，点击左侧“样式”按钮，弹出页面“样式设置-顶部”页面为顶部设置页面。 如图1和图2所示：
②或者打开选定的网站模板，进入网站建设页面，下拉到网站顶部区域，点击顶部空白区域，会出现“编辑顶部”按钮，直接点击会跳出顶部区域设置页面。 如图3所示：
2、设计网站顶部：
①版权信息：选择“显示”可以更改相应的版权信息，下方会出现一个输入框，只需输入即可，结果会显示在相应区域。 如图4所示：
②底部背景
设置顶部背景，一是为了区分顶部和其他区域，让用户很容易识别出自己已经滑到了顶部，二来个性化的顶部背景也能加深用户的印象或者激发用户继续“探索”的欲望”。 网站模板的顶层设计有以下三种选择：
A。 选择“默认”，即红色条纹背景。 这是很多网站采用的设计，用白色的“暗”情感来表达结束的意思。
b. 选择“隐藏”，顶部的颜色会与网站的背景颜色相同，通常是红色，但不建议选择这个，正如我们在其中提到的，顶部设计最好与其他有明显区别模板的部分内容如果使用网站的背景色，界限就会模糊，很容易欺骗用户，认为网站加载有问题，会给用户留下不好的印象。 这也是很多网站都会出现“置顶”提醒的原因。
C。 选择“自定义”网站底部模板，可以使用黑色背景设计或图片背景设计，网站所有者可以自由选择。
③边距：设计顶部的尺寸，站长可以根据设计理念自由调整，关注输入数据同步观察疗效，调整到满意为止。 如图6所示：
④边框：站长有时会忽略这个设计网站底部模板，如果这个设计运用得好，可以打造出与众不同的顶部设计。 如果您没有更多的设计想法，请选择“默认”和“隐藏”。 如果你想尝试更多的图案设计，选择“自定义”，然后依次调整长度、样式和颜色，就会出现如图7所示的效果。
⑤链接文字：在顶部设置链接是更有效的引导用户的方式。 网站模板的链接文字不一定符合网站的实际设计，因此必须进行必要的修改和设计。 在设计这种链接时，配合顶部设置页的设置工具和内部链接区域的设置工具共同完成设计，顶部关键文字设计就会越来越成立。 如图8所示：
一侧的设置可以对链接文字、文字大小、样式、颜色、所选颜色进行基本设置； 一侧的设计按钮可以在动画中插入文字，添加相应的文字来设置链接。
以上操作是网站模板搭建时进行网站顶部设计的基本操作和关键操作。 站长可以利用工具进行更多的尝试，设计出符合用户审美的网站顶部，并为网站的子页面提供更好的引流。
在《老外的个人网站原来是这样设计的：17个给你灵感的最佳例子》一文中，我给大家分享了17个优秀的个人网站例子。 相信看过的同学都会被那些精美独特的网站深深吸引。 您是否也想建立一个专属于自己的个人网站？ 人类看到美丽的东西并想要创造同样美丽的东西。 但你可能会说，如果你不会编程，不会UI，而且你时间又紧，那你怎么建立自己的网站呢？ 一些学生似乎对此不知所措。 那将是一个真正的遗憾。
别害怕，我在本文中整理了25个优秀的个人网站设计模板。 您会发现您不需要编程或设计自己的界面。 取之不尽用之不竭的主题是您的网站用户界面。 完善您的个人网站就可以这么简单。
同样，在本文中，我将根据个人网站常用的类别进行扩展：
1、作品展示型个人网站——类似于Dribbble、Behance等平台，设计师展示个人作品，但个人网站更加活跃、功能性更强；
2.博客式个人网站——设计师分享自己的设计理念和观点，交流信息，吸引粉丝和关注；
3.网店型个人网站——此类个人网站将用于商业目的；
4、简历型个人网站——优化传统简历，更好地展示自己的工作和技能，找到更好的工作；
5、个人摄影网站——展示平面设计师、摄影师等的作品，属于作品集网站的一种；
6.通用型个人网站模板——可适用于多种类型。
据悉，个人网站有不同的制作工具和主题，比如基于HTML编辑器、基于Flash的交互式网页制作工具、用WebsiteBuilder直接设计、Wordpress主题等，我也会在每次推荐中展示并提供选择。
1.作品展示型个人网站模板
1）JohnDoe-基于HTML5的单页免费作品集个人网站模板
特征：
使用最新的 CSSFramework-Bootstrap 创建
流畅的 CSS3 动画效果和 jQuery 插件。
完全可定制的编辑
响应式界面设计
谷歌字体
也适合博客类型的个人网站设计
JohnDoe特别适合自由设计师的作品集个人网站制作，可以充分展示他们擅长什么和想要做什么，以及他们以前的作品或项目。 界面设计颇具创意且柔和。 只需一分钟，您就可以了解如何使用模板jquery网站模板，简单方便。
下面是一些使用该模板制作个人网站的真实例子：
Link1：MARKDAVIES – IT 顾问
链接2：
在这里下载。
2) 组装专属作品集设计模板
特征：
18 个漂亮的主页、单个项目模板和无数的作品集设计布局。
炫酷的菜单风格和出色的悬停效果。
可编辑的外部页面和响应式设计。
与电子商务广泛使用的免费 WooCommerce 插件完全兼容。
也适合个人博客网站设计。
Assemble是一个免费的在线作品集设计网站，可以完美的形式展示您的设计作品。 包含18个精美主页供您自由选择，随心设计，打造属于您自己的个人作品集网站。
在这里下载
3) Instant - 免费响应式作品集个人网站模板
特征：
包含 3 页 WordPress 主题模板。
使用 Bootstrap3 构建。
全屏和视差背景。
适用于多种浏览器。
精致的字体。
Instance 是这些才华横溢的专业设计师建立个人网站的明显选择。 设计精美，界面干净，很有创意。 包含一个精心设计的 HTML5 Bootstrap 模板。 它专为个人作品集网站建设而设计。 最重要的是，这个模板是完全免费的！
用户反馈：“干得漂亮。Acureto 设计糟糕，令人眼花缭乱。感谢您的工作！！” - 丹尼尔·埃卡尔。
在这里下载。
4) Template.net-作品集展示模板
特征：
基于 HTML5 构建。
100% 自定义可编辑。
紧跟最新的设计趋势并且非常时尚。
包含用于作品集、简历、商业用途等的网站模板。
Template.net 提供丰富的个人网站模板，包括可用于展示您的产品的设计、作品集或插图。 尤其是创意主题的作品集模板被广泛使用。 这个基于 HTML5 的作品集模板为设计增添了异想天开的感觉，可以帮助您丰富您的网站创造力。
在这里下载。
5）Erika-轻量级个人作品集网站模板
特征：
基于Bootstrap3.x创建。
完全响应式设计。
包含页面模板。
包含 HTML & CSS & JS 文件以及有效的 HTML5/CSS3。
8 种主页模板、3 种标题样式、24 种作品集设计选择和 55 种页面模板。
包含 Ajax 的动态 PHP 联系表单。
这是一个多页个人网站模板，有 8 个主页变体。 编码良好，您可以轻松将其转换为 WordPress 格式。 在干净的蓝色背景上，文本和其他网络元素清晰可见，您可以清楚地展示您的作品。 用户可以轻松地在页面选项卡之间切换来查看您的作品集。 悬停效果和其他动画效果特别酷。
在这里下载。
6) Martin - 非常有创意的一页网站模板
特征：
基于最新版本的Bootstrap创建。
包含 HTML5、CSS3、jQuery。
完全响应式设计。
更新是免费的。
SEO优化是好的。
Martinis 是一个简单、富有创意且完全响应式的 HTML 模板，用于展示您的作品集和个人信息。 该模板使用了 HTML5、CSS3、bootstrap 和 jQuery 等所有现代技术。 该模板可以给您一个个人空间，无论您是设计师、开发人员还是摄影师，您都可以在这里进行创意设计。
在这里下载。
2.个人博客网站模板
1）Pofo-创意Html5/Css3博客网站模板
特征：
快速页面加载。
更新是免费的。
优秀的创意和交互性，灵活强大的HTML5/CSS3模板。
超过25个主页演示，包括一页主页、超过210个HTML页面、超过150个不同风格的花式元素。
您可以在Pofo中使用不同的列表样式来构建专业的博客界面，也可以制作自己的博客和图库，或者使用SliderRevolution设置图片中的任何内容。 使用 Pofo 创建博客的优点之一是一切都很简单。 它易于浏览（简单、干净的图像框架和文本框架），易于阅读（直观的博客页面风格）。 页面加载速度快，并且针对搜索引擎进行了优化。
在这里下载。
2）FreeCSS-多元化博客模板
特征：
各种博客模板主题。
基于 HTML5 构建。
响应式设计。
也可用于摄影作品集和商业博客。
FreeCSS 是不同主题的博客模板的大型集合。 每个主题都有其特殊的功能和特点，是分享您的想法和写作的好地方。 只需选择您最喜欢的主题之一即可立即创建个人博客网站。 所有主题都是免费的！
在这里下载。
3）Ablogia-个人博客网站模板
特征：
基于Bootstrap4.0.0-beta创建。
基于 HTML5 & CSS3 重构。
现代且非常有创意的设计。
W3C 有效 HTML。
像素完美。
800 多种 Google 字体。
Ablogia是一个简单、干净、女性化的博客模板，使用最新的bootstrap、html5、css3、jquery等现代技术完善。界面非常干净。
在这里下载。
4) Creativemarket-WordPress博客主题
特征：
超过 960 个 WordPress 博客主题。
基于Bootstrap4.0.0-beta创建。
使用 HTML5 和 CSS3 重构。
搜索引擎优化。
该模板包含近千个WordPress主题。 您可以体验流畅的博客站点加载和页面切换。 博客主题与黄色和浅棕色形成了很好的对比，你想要显示的信息会清晰地呈现出来。 该模板基于最新的HTML5和CSS3技术构建，并具有SEO优化。 您可以选择将主题翻译成多种语言，并且适用于所有浏览器。
在这里下载。
5) 阅读个人博客模板
特征：
用引导程序构建。
响应式设计。
干净的布局。
完整的文档。
Read是最轻量级的个人博客设计模板。 具有干净的界面和响应式主题。 它适用于任何类型的个人博客网站设计，例如旅行日记或教程博客。
在这里下载。
3.个人电商/淘宝网站模板
1.前言-免费响应式网站模板
特征：
响应式设计。
基于 Bootstrap 和 jQuery 创建。
W3C 有效的 HTML5 和 CSS3。
Preface是一款优质的免费个人网站模板。 全响应式设计，中间有纹理的UI界面设计。 这个免费的个人 Bootstrap 模板具有高质量的设计和代码。 它具有完全响应能力，可用于商业和个人促销目的。 免费下载！
在这里下载。
2）杰夫林
特征：
一键网站安装。
将元素拖放到页面构建器中。
社交分享功能。
搜索引擎优化。
多语言和 RTL 支持。
终身更新和用户支持。
Jevelin 是一个响应式 WordPress 主题模板。 无需专业背景，最适合非程序员或忙碌的人。 它有大量的页面元素可供选择。 请提供视频教程来指导您。 它使用拖放页面构建器和 MegaMenu 来简化许多面板任务。 Jevelin 本质上是多用途的，适用于多种浏览器或各种设备。 Jevelin 还优化了 SEO 导航。
在这里下载。
3) Kards - 免费个人网站模板
特征：
完全响应式 HTML5 和 CSS3 模板。
非常现代和干净的设计。
时间线项目。
易于定制。
与所有主要浏览器兼容。
Kards 基于 Bootstrap 框架设计，是个人作品集、博客或商业用途的最佳模板。 组织良好的代码使定制设计和使用变得容易。 其创意设计可以吸引客户访问您的网站，并使他们成为您的业务合作伙伴。 该模板跨浏览器兼容并且完全免费。
在这里下载。
4.个人简历网站模板
1) CVstrap - 免费个人网站模板
特征：
响应式设计。
基于 Bootstrap3 构建。
CVSTrap 在众多模板类别中是独一无二的。 这是一个免费的简历风格 HTML5 模板，只需不到一个小时即可创建令人满意的简历和个人网站。
在这里下载。
2）Juleha - 一页简历模板
特征：
使用 Bootstrap 构建。
多种字体选择。
动漫标题。
基于 HTML5 和 CSS3 创建。
完美的配色方案。
Ajax 联系表。
易于定制。
Juleha 是一款简约、干净的单页简历模板。 支持的浏览器包括IE10+、最新的Firefox、最新的Chrome、最新的Safari、最新的Opera等。
在这里下载。
3) EasyResume – 免费响应式模板
特征：
使用 Bootstrap3 构建。
包含 HTML5 和 CSS3。
包含 Java 和 jQuery。
单页多层布局设计。
Google的中国联通设备测试。
跨浏览器兼容。
EASYRESUME 是一个 Bootstrap 响应式网站模板。 设计精良，带有令人印象深刻的视频横幅。 这个完全响应式模板是使用 HTML5、CSS3 和 Bootstrap 框架设计的。 设计功能包括：颜色、图像、悬停动画、平面网格图案、视频背景等等。 该模板是完全免费的。
在这里下载。
五。 个人摄影网站模板。
1）免点击响应式个人作品集网站模板
功能：
全屏标题背景。
跨浏览器兼容。
流畅的 CSS3 动画。
100% SEO 优化。
100% 完全可定制的设计。
使用 HTML5 和 CSS3 进行重构。
Bootstrap后端框架。
Click 是一个干净且免费的 HTML5 Bootstrap 模板，专为个人摄影作品集和专业摄影演示而设计。 该模板由提供商精心设计，指出了排版和整体用户体验。 不同年龄段的设计师或摄影师都可以在这里展示他们的作品。 所有服务完全免费！
在这里下载。
2) LizaPhotography - 令人惊奇的摄影网站模板
特征：
9 种令人惊讶的画廊布局。
全屏画廊支持。
多种菜单布局。
使用 HTML5 和 CSS3 进行重构。
指出排版和可用性。
具有 650 多种 Google 字体的中间版本。
终身免费更新。
该模板是一个优秀的 HTML 网站模板，您可以创建专业的作品集网站，但可以创建博客。 该模板有各种图库，例如网格等，非常适合展示您的摄影作品。
在这里下载。
3) SELFIE - 个人摄影师 HTML 模板
特征：
响应式布局。
滑块介绍形式。
Instagram 新闻简介。
Html5 和 CSS3。
包括页面布局。
包括博客单页和博客详细信息页。
SELFIE是一个非常现代的摄影师网站模板。 专为摄影师展示您的照片库而设计。 该模板具有精美和现代的页面布局，提供了一系列多设计和多布局选项。 该模板完全响应并针对平板电脑、笔记本电脑和智能手机进行了优化。
在这里下载。
4) Opta - 最轻的作品集和摄影 HTML 模板
特征：
响应式布局适合任何屏幕尺寸。
简单的图像滑块和文本滑块。
谷歌网络字体。
PHP 联系表。
随时直接从模板开发人员那里获得一流的支持。
Opta 是一个简洁的作品集和摄影 HTML 模板。 使用此模板，您只需几个步骤即可创建一个令人惊叹的网站。 该模板灵活且可定制jquery网站模板，并具有响应式布局。
在这里下载。
六.其他通用个人网站模板
1) 太棒了 - 免费响应式个人模板
在这里下载。
2) Wix-强大的个人网站构建器和模板提供商
在这里下载。
3）通用——轻量级智能html5模板
在这里下载。
4）Unibody-多功能多页面HTML5模板
在这里下载。
使用这个模板，你往往不需要花费太多的精力，甚至不需要一行代码，就可以创建一个个人网站，甚至UI都有付费和免费的主题，一键即可完成。 希望这些优秀的个人网站模板可以帮助您设计您的网站。 而如果还想拥有一个独特的个人网站，设计师就只能真正去创作和设计了。 你需要好的设计灵感，一点一滴的构建，这里推荐你使用国外最好的原型工具Mockplus进行初步构思，整合界面和元素，构建相应的交互。 最大的好处是可以在网页上进行HTML演示，并在线检查自己的想法是否合理，设计是否美观，这对于后期的设计和开发有很大的好处。
