网页设计制作草图（网站草图设计）

网站怎么设计_网页设计怎么做

在设计网页时要多灵活运用模板，这样可以大大提高设计效率。上传测试 网页设计完毕，最后要发布到web服务器上，才能够让全世界的朋友观看，现在上传的工具有很多，有些网页设计工具本身就带有ftp功能，利用这些FTP工具，你可以很方便地把网站发布到自己申请的主页存放服务器上。

网页设计师（主要是用PS）先将网页设计出来。进行网页制作，就是切片，div+CSS布局，将图片变成网页。后台制作。可以自己开发，也可以套用cms，如dedecms，PHPcms。等 具体步骤就是这样。详细的牵扯到一些技术，就是html，div+css，js，（jquery，js框架）。后台目前流行PHP语言。

网页设计需要考虑实际的浏览效果 最怕刚从其他设计行业转行过来的设计师，一味地使用背景、图片、不支持的字体，不会充分利用好网页本身的线条、边框、背景功能。导致网页设计出来了，效果很好看，但实际制作成网站后，因为背景或图片使用过多，页面打开太慢，浏览效果大打折扣，这样的设计也是非常失败的。

设计的任务是要实现设计者的意图，而并非创造美。 网页设计的任务，是指设计者要表现的主题和要实现的功能。站点的性质不同，设计的任务也不同。从形式上，可以将站点分为以下三类。 第一类是资讯类站点，像新浪、网易、搜狐等门户网站。这类站点将为访问者提供大量的信息，而且访问量较大。

确定网页的主体色调风格。我们制作自己的网页首先应该对自己的网页有一个整体的规划，是建一个什么类型的网站，网站主色调使用哪种颜色、设计布局采用什么样的方式等这些都需要有一个很好的规划。规划网站的整体布局——导航、按钮、图片、文字的排版方式。

确定网站主题 网站主题就是你建立的网站所要包含的主要内容，一个网站必须要有一个明确的主题。特别是对于个人网站，你不可能像综合网站那样做得内容大而全，包罗万象。搜集材料 明确了网站的主题以后，你就要围绕主题开始搜集材料了。常言道：“巧妇难为无米之炊”。

如何设计网站

设计首页的第一步是设计版面布局。我们可以将网页看作传统的报刊杂志来编辑，这里面有文字、图像乃至动画，我们要做的工作就是以最适合的方式将图片和文字排放在页面的不同位置。除了要有一台配置不错的计算机外，软件也是必需的。

色彩搭配 网站的配色要有一整套科学的方案。不能是随便的随心所欲的进行，要了解网站做什么的，目标受众是哪些，他们对色彩偏好是什么样的。板式氛围设计 网站有时候的整体氛围很重要，比如有的需要做成机械感觉的，有些需要是扁平化的，有些需要有点立体感觉。

网站设计要让外观更加漂亮，文字更加引人入胜，不仅仅要生硬的推广产品，还要让顾客有预览网站的欲望。同时，要主动出击，不能等顾客上门，要24小时准备客服，随时解答顾客疑问，还要主动咨询来访顾客，主动推荐自己和了解顾客需求。

这时要注意两点：一是要突出主题，突出重点，让浏览者能够迅速明白这个网站是干什么的；二是要考虑用户如何访问网站，怎样能够提高浏览者的效率，让他们更方便、更舒服地访问你的网站。形象设计网站的形象设计包括网站的标志、色彩及图形方案、标准字体、宣传标语等。

简单设计不少人都喜欢干净、清爽的面孔，我们的顾客也是如此，都喜欢整洁的网站，花样繁多反倒很易用力过猛的，网站的文字排版要整洁，能让人看到后，有想看下去的欲望。如排版很难看又杂乱无章的话，会让人觉得浏览你的网站，不过是在浪费自己的时间。

用lllustrator怎么做网页设?

规划设计：在设计之前，需要对网页的整体布局、色彩、字体、样式等进行规划。可以使用Illustrator创建设计草图，帮助你更清晰地规划网页的结构与元素。 创建矢量图形：Illustrator擅长创建高质量的矢量图形。设计网页元素时，尽量使用矢量图形而非位图，这样可以确保在不同屏幕分辨率下保持清晰度不变。

将所有单位设置为像素 Illustrator使用公制单位的尺寸和点。打开编辑菜单 从首选项子菜单中选择单位 设置所有单位为“像素”新建文档配置文件类型选择 Web 打开对齐像素网络 在photoshop模糊边缘形状。调整垂直和水平的对象完全匹配像素网格，保持弯曲和倾斜段的锯齿。

创建单个像素图 - 打开AI并新建文档，大小自定。- 启用“像素预览”和“对齐像素”功能，以便在放大时自动对齐像素格。- 绘制一个1x1像素的正方形，填充为浅灰色。- 旁边绘制一个1x2像素的长方形，并将两者合并。- 使用“路径查找器”合并图形，快捷键为`Ctrl+Shift+F9`。

单个像素图 首先打开AI软件，新建一个文档，文档大小任意。在视图栏目下勾选“像素预览”，勾选这一选项后，当你将自己的图片缩放到足够大时，会出现像素格子，然后再勾选“对齐像素”，这样图案就会自动对齐像素，无需你再自己手动控制对齐了。

在这篇文章中我们将通过使用AdobeIllustrator中的3D效果来创建一组网页按钮。为什么要用这种方法？原因是这种方法替代了使用不同的笔刷和其他工具来创建高光和阴影，只需一步就能实现，充分利用了现成的光线设置和斜角形状。让我们开始！ 第一步：按钮形状 我们从创建基本的网页按钮形状开始。

如何做界面UI设计的展示图

图标创意阶段；草图绘制阶段；草图渲染阶段。补充：在PS中新建一个所需尺寸的画布并保存，将其命名为UI设计效果图模板。再新建一个画布，命名为界面UI设计效果图展现。尺寸随意。将刚才保存的界面UI设计效果图模板.psd拖到画布中。Ctrl加T变换到合适的尺寸，倾斜到合适的透视效果。

在PS中新建一个所需尺寸的画布并保存，将其命名为UI设计效果图模板。再新建一个画布，命名为界面UI设计效果图展现。尺寸随意。将刚才保存的界面UI设计效果图模板.psd拖到画布中。Ctrl加T变换到合适的尺寸，倾斜到合适的透视效果。然后双击界面UI设计效果图模板这个图层即可。

在PS中新建所需尺寸的画布并保存，命名为“UI设计效果图模板”。 再新建一个画布，命名为“界面UI设计效果图展现”。 将“UI设计效果图模板.psd”文件拖到画布中，Ctrl+T变换到合适尺寸，倾斜到合适的透视效果。 双击“UI设计效果图模板”图层。

线形图标 线形图标比较轻量化，减少视觉干扰，让用户集中在产品核心功能上。在iOS11以前，iOS原生应用的导航栏，标签栏，工具栏全部采用了2px线框的图标设计。线形图标的使用也有两种：正形和反白。不建议线形图标的反白使用，因为从设计逻辑上讲，背板结合线形图标是互相矛盾的。

大体的轮廓可以参考左图，但颜色和细节参考第二个，最后得到自己的原创作品：UI设计 如果你只盯着一个作品来借鉴，做着做着基本就一样了，然后就没有然后了，所以多找参考，取每个参考的精华之处，最后融合成自己的作品，这也是原创的另一个途径。