logo在网页设计中 第1篇
重点来了，依据参考线作图的目的就是为了做出极具美感便于应用的图标。黄金分割比正是做参考线的依据之一。但一定切记，参考线仅是参考，被神化的 “黄金分割”也是一样，就是可以方便设计师较为容易的找到成熟合适的比例，虽不一定适合所有的Logo设计，但确实它非常通用。任何事物的美感都没有绝对 的，切莫迷信于此。
黄金分割为什么美?
在视觉上，黄金分割本质上带来的是和谐——相似、重复、联系，以及变化——运动、活力。
《黄金分割：设计师的设计利器》
在摄影构图中，常常用到的构图法则 “三分法”。即是用到了黄金分割，下图中的四条线就叫黄金分割线，四条线的四个交点就叫黄金分割点。在拍摄时，把画面的主体放在黄金分割点或是黄金分割线上，这样更符合人的审美习惯，以达到突出主体并让画面更协调的目的。
在AV封面中，三分法也用得尤其多。例如题图，主体人物在右侧三分线上，而胸部和膝盖都大致在三分点上。这样就能表现女优良好的身体比例，并凸显其”重要部位”。
下图，抠菊花的造型也如此完美地契合了斐波纳契黄金螺旋这一神秘的美的规律，专业，紧密，浑然天成。
虽然看似调侃，但是专业的摄影师有丰富的经验，更懂得把握构图比例，哪怕是几秒的抓拍。
logo在网页设计中 第2篇
或者说是图标制图，一个原理。平面及工业设计领域里很基础的东西。常见的有两种：
1、坐标制图法
画很多方格子，界定出标志在每个格子里的图形的样子，依此为标准样本。大多应用在VI设计、工业，民间的十字绣，还有唐卡的绘制。
2、几何制图法
通过不同的圆相切，获得标志的各处曲线、弧度和转折数据，并证明这些数据的必要性和合理性。比如苹果logo，缺口、叶子、上端凸起和下端凹进，相应圆形直径是一致的。
logo在网页设计中 第3篇
第一步：首先是做好黄金比例的圆，如果你是完美主义者中的偏执狂，想要得到一个比更精确的数字，那么可以按照如下方法找到黄金分割点。
1、分别以直角边AB=1,AC=2(1代表1个单位，在途中可以自行定义)画一个三角形，连接BC。
2、以B为圆心BA为边境画圆交BC于点D,以C为圆心CD为半径画圆交AC于点E。
3、则E为AC的黄金分割线。
当然，这个精度的偏差在以像素ps里，完全可以忽略不计。所以在这里推荐用工具来计算。
此网站有关于黄金比的详细介绍及计算工具：
由上数据，画出一个边长为500px *309px的矩形(尽量用路径来画，ps cc里随便画一形状，在属性面板里输入数值)在矩形中画一内切圆1，选中后设置参考线，再画与圆1和矩形相切的圆2，以此类推。关于参考线推荐下图中的插 件：GuideGuide 做页面的时候，无时不刻不在用它。
第二步：以圆6为中心，选中后利用Guide设置参考线。将圆1拖入，与圆6为同心圆(可以ctrl+t，将中心点对准参考线交界)
注：因为我们要画带参考线的展示图，所以把每个圆置于单独图层，以便形状图层和参考线图层区分。
第三步：首先将圆2相切于圆1底部端点，然后将圆3切于圆2与从圆6延伸的参考线，最后将圆4中心交于圆1，边缘与圆3相切。注意，图中红点为圆的相切点示意
第四步：首先复制圆6，拖动圆心与圆1相交位置，然后复制圆1，使其内切与新圆6位置，最后，将圆2置入与新圆1、圆4相切位置。
第五步：新画一个圆，使其内切于圆2，3，4边缘，复制到左侧后，我们依稀可以看到轮廓中苹果的形状了(绿色轮廓是为了示意大家补脑的)。
心急的话，我们可以在此步后，就可以把苹果的形状图层画出来了。由于我要画牛逼闪闪的参考线，所以先不着急，一口气把参考线绘制完。
第六步：首先，将圆2置入与右下圆3为同心圆，以右上圆2边缘顶端为圆心，复制圆2，与两个圆边缘相切，在拖入圆2，此圆既为苹果的缺口。
其实，我们在一个图层里通过路径形状组合来完成，即是如下操作：
logo在网页设计中 第4篇
如上文中所述，此类logo的变形适用于外形可爱的logo。网页可以添加的地方，像用于分类侧边栏、分段控件、公告栏，这是很好的可以添加logo的地方，logo可以出现在控件的顶部、侧部或者是对角上，这也可以同时起到一个标识的作用。
其次，每个文字标题前，也是可以添加logo的地方，起到入口的提示。不仅如此，logo的图像也可以用到用户头像上，用户未登录的状态以及默认头像的状态都可以是logo图案。
三、Logo变形
第三种方法，可以将logo进行变形，提取logo的外形结构做成相应的icon或者是加载动画、提示动画等等，也是一种很好的与logo呼应的方式。其实刚刚上文中所说的天猫超市和天猫国际的入口，也是一种logo的变形。将logo的形状与按钮相结合，也是一种logo元素的体现。
案例：哔哩哔哩
体现logo元素怎么能不提可爱的b站呢！在一些标题栏前，可以看见b站标志性的小电视机。b站的设计师们将logo与b站经典的Q版人物结合在了一起，做为标题的分区提示，是整个网页看起来活泼又年轻。
在b站网页中国中手机app端下载通知，也是由他的logo变形而来的，鼠标悬停还有电视机变形为手机的动画，动画整体与手机app下载入口的设计十分贴合。当然，一定要提的还有加载视频时可爱的电视，b站的这个设计使得枯燥的加载过程也变得可爱了起来。
小结：
此类logo变形的难度较大，这种方法需要设计者可以很好地提取logo的中的部分结构或着造型转变为含此元素的动画、icon，也可以在控件上加上logo图案的动画。虽然这类方案实现的成本很高，但是logo在网页中的融入感是非常可观的。
logo的图案在网页中随处可见，使得网页非常具有设计感和个性化，而这样的个性化是一个网页非常好的标签。
虽然接到这个修改建议的时候，我也是有点迷茫的，但是在参考了各大互联网的门户网站，也算有了一些思路。我也是通过这次的调查，才发现logo元素在网页设计中的体现也是大有文章。不要小看任何一个网页中的标题颜色、icon或者是控件的设计，这些都是设计师们的思考与表达。