1、怎么提高网站的设计感
一、 色调
到这几乎差不多已经完成调整了,但如果你够细心的话会发现按钮以及导航菜单的颜色还是 Bootstrap 默认的蓝色系。在有着设计师存在网站,设计师都会负责进行网站色调的调整,为了保证网站的一致性,所有按钮和导航一般是三到四种颜色。
在这里,虽然不可能像大公司网站那样取色严谨,但还是有一些快速的方法使网站看起来很搭配的。
使用 GIMP 的取色器读取背景图片的主题颜色,确认其 GBR 十六进制值;
使用 Color Scheme Designer 确认与差异大但同时又互补的颜色;
最后根据确定的颜色来制定按钮,可以用[Bootstrap Buttons][]等在线直接生成。
这样首页上那个大大的注册按钮就搞定了,接下来是修改导航菜单的颜色,这个比较简单,写入代码 .nav-pills > .active > a, .nav-pills > .active > a:hover {background-color: #FF9473;} 即可。
二、 字体
修改网页字体是让网站看起来更有特色、有现代感的捷径,我们可以去谷歌的字体服务(免费正版)中随意挑选自己喜欢的字体,但是要注意字体间的搭配,在这里我们选择由 DesignShack 推荐的谷歌字体搭配中的一种:Cardo(用于标题) 和 Nobile(用于主体内文)。
在网页头部中加入此代码:
在 CSS 样式表 custom.css 中加入以下代码:h1, h2, h3, h4, h5, h6 {font-family: 'Corben', Georgia, Times, serif;} p, div {font-family: 'Nobile', Helvetica, Arial, sans-serif;}
添加完后刷新即可查看效果了,现在我们的网站样式已经变成下面这样了,看起来比默认好多了。
此外,除了谷歌的字体服务外还可以使用像 Fontdeck 或 Typekit 字体服务,它们的字体更多,更多的字体搭配方案可以参考 Type Connection。
三、 CSS3
将上面都搞定后接下来要做的就是再加点 CSS3 特效了,如果时间不够的话简单的添加上盒阴影 box-shadow 和字体阴影 text-shadow 就可以让网站增色不少,CSS 代码如下。
h1 { text-shadow: 1px 1px 1px #ccc; } .div-that-you want-to-stand-out { box-shadow: 0 0 1em 1em #ccc; }
如果时间足够的话还可以添加一个放射渐变填充效果,可以让标题的显示效果更重一些,如下面对比图所示。(如果想要更多 CSS 效果的话可以去学习一下 CodeSchool 的在线教程)
四、jQuery
其实到这里了话网站看起来已经很不错了,但为了让它更加个性化,还需要再添加上一张背景图片。对很多程序员来说这一步是比较难以进行的,那么应该如何选择一张设计师可能会使用的图片呢?答案就是去 iStockPhoto 或类似的付费图库中去寻找。
这里我们将使用 Winter Sun 这张照片,为了让网站保持自适应布局,还需要使用 Backstretch 这个 jQuery 插件让背景图可以随时自动调整大小。
首先需要付费下载背景图片,然后放到 /img/ 文件目录中去。
将此图片设置为的背景图(background-image): $.backstretch ("/img/winter.jpg");
加入背景图后网页主题部分会产生遮挡,所以可以让其透明,这样网站效果看起来会更加现代、有设计感。这里可以使用这个技巧将网站变得透明,代码见右边,.container-narrow {background: url (/img/cream_st_transparent.png) repeat 0 0;}
五、 纹理
知道如何让一个网站看起来更加高雅优雅一些吗?是的,纹理。就像 24WAY 的背景纹理一样。
但是这些纹理效果应该去哪里寻找呢?设计师 Atle Mo 的 Subtle Patterns 网站是个不错的去处,我们接下来就使用这个网站上的 Cream Dust 纹理。点击下载,将纹理图片保存到本地,然后放到根目录下的 /img/ 目录文件夹中,最后到 CSS 样式表中加入代码 body { background: url (/img/cream_st.png) repeat 0 0;} 即可。
六、 图标
这里的图标并不是指那些透明的 PNG 图片图标,而是图标字体,其加载方式和字体一样,由 CSS 样式控制,比起图片图标来说这种图标字体加载速度更加,对资源的消耗也更低。在去年 24WAY 曾经有一篇如何在网站中使用图标字体的文章。
对于 Bootstrap 框架来说,整合的图标字体是 Font Awesome (Shifticons 也是一个不错的选择),和谷歌的字体服务一样也是免费开源的。要使用它只需将其下载下来,然后在根目录下创建 /fonts/ 文件夹,将其放进去。然后再将 font-awesome.css 文件放到 /css/ 目录文件夹。
接着将引用写入网页头部中,代码为 ,这时候我们可以随时在网站上任意地方自由使用这些图标字体了,如要想将一个卡车图标添加到注册按钮的话只需声明一下就可以,Sign up today。同时为了防止加入图标字体后引起按钮拉伸变形,还需要一点点额外的工作,将按钮宽度加大一点(.jumbotron .btn i { margin-right: 8px; })。
2、怎么优化网站????
准确的说是要多在一些平台发一些资料,,然后都超链接到要优化的网站上,优化是上时间的累积,不是一天俩天就能做好的
3、如何提高网站的设计美观
这个不是用几句话能说明白的。建议可以找一些类似风格的网站做参考。
给你点建议:
1、整体风格要统一,这样看上去就不会太难看
2、一般美观的网站都比较简洁大方,不要弄的乱七八糟
3、要用大众的审美观去看,不能自己喜欢就可以。
4、怎么优化网站的结构布局设计
网站的合理化布局对于网站的优化是十分重要的,如果你的网站布局比较好,布局一目了然,那么搜索引擎在爬行的时候,就很顺利,爬行的效率提高了,你的网站自然就能收录的快一些,自然排名就高一些。文汇小编就跟大家分享一下,我们怎么给客户布局网站。
一、网站的导航。
客户或者搜索引擎制药进入我们的网站就可以看到网站导航,常见的网站导航有顶部主导航、左侧产品导航、底部导航等。这些导航最好设置的醒目一些,比如说在背景、字体上突出一些,这样有利于引导客户或搜索引擎往下进行,另外,网站导航中的链接文字应该准确、自然的描述所指向页面的内容,这样方便搜索引擎通过链接文字了解这些栏目的具体内容,不要过分的堆砌关键词。
二、网站的相关性
试想一下,假设一个用户通过搜索某个关键词找到你的网站,进入浏览,并没有发现自己想要的内容,那么用户肯定会很失望并且马上离开,很少人还会继续再在网站中寻找。所以要增强网站的相关性就要从以下方面入手。
1.网站title。
网站title是一个页面的重点,搜索引擎分析一个页面相关性就是从title出发来识别这个页面是关于什么的内容;而用户浏览同样也是如此,在搜索中展现出来的就是网站的标题。现在在《怎样对自己的网站进行关键词的优化?》中详细介绍了关于网站title、keywords等的介绍,有兴趣可以了解一下。
2.网站产品的合理安排。
在做网站的时候,建站公司一般都会问你是做哪个行业的,为什么都会这样问呢?因为他必须要了解你的产品并且给你做好规划,这个时候不要怕麻烦,要将你们公司的主推产品、辅助产品给他说明,更要做好合理的安排,比如说我要怎么安排这些产品的位置,是否需要将主推产品放在轮播图上等问题,只有你安排好了这些产品,当客户进来的时候,才能一眼知道你是做什么的,进行深入的了解,一点一点的引导客户,同样搜索引擎也是一样的。
5、怎样提高网页设计创意能力
一、浏览网站,拓宽视野
·网站
1.pinterest
https://www.pinterest.com/
Pinterest通过用户挖掘有趣内容,收藏并分享的模式,将全球优秀设计素材分享给大家,Pinterest采用的是瀑布流的形式展现图片内图片内容,无需用户翻页,新的图片不断自动加载在页面底端,让用户不断发现新的内容。
2.Behance
https://www.behance.net/
Behance是全球领先的创意设计类聚合平台,推荐和分享优秀设计作品。在这里,可以第一时间欣赏到最优秀的作品,找到最优秀的艺术家。找寻更多的创作灵感。
3.Yanko Design
http://www.yankodesign.com/
Yanko Design几乎包含了全部最新的产品设计、新技术、设计思维,是非常值得推荐收藏的产品设计网站,喜欢的小伙伴快快收下。
4.Core 77
http://www.core77.com/
Core 77是老牌设计网站,站内瀑布式排列,像看杂志一样的内容排版,包含科技感设计,适合设计类及理工类专业。
5.Designboom
https://www.designboom.com/
Designboom平台自从1999年起便成为艺术设计领域的大本营,独立报道一系列产品设计、建筑、艺术、摄影以及平面设计方面的先锋作品。
6.Css winner
http://www.csswinner.com/
Css winner是一个独特的全球性平台,专门展示和奖励最佳网站,推广创新设计师网站、开发者和机构。顶部有导航栏,可以根据自己感兴趣的分类查看。
二、多读书,巩固基础
·书籍
1.《设计中的设计》 原研哉
与艺术相比,“设计基本上没有自我表现的动机,其落脚点更侧重于社会。”以原研哉为代表的一些日本设计师,设计的出发点并非是自我风格的表现或是个人情绪的张扬,而是从揣摩大众的感受出发——无论是视觉还是触觉。先将日常的事物陌生化,再重新进行设计——这种贴近生活、以生活的文化积累为素材的创新在这个纷乱的信息时代显然是十分可贵的,也必将有利于大众的审美意识提高。
2.《现代设计史》
这部涉猎广泛、富有洞察力的著作,纵览了18世纪至今的实用艺术和工业设计,不仅从纵向阐述了各个设计流派、各种设计风格的演变过程及其代表作品,而且从横向探讨了设计和生产、消费、科技、商业之间盘根错节又变动不居的关系。这是一本几乎每个设计师都要拥有的一本书,地位很高,专业性极强,涉及和设计相关的各行各业,材料,科技,政策,物质资源,权力,需求…
3.《The Graphic Design Idea Book: Inspiration from 50 Masters》
这本书是针对优秀设计关键要素的介绍,介绍了广受好评的设计师的主要作品,涵盖的主题包括叙述、颜色、图形和装饰等。
4.《大设计》Penny Sparke
在《大设计:BBC写给大众的设计史》一书中,设计史学者彭妮•斯帕克给我们展示的,远远超过了一段经典设计作品的历史。本书的五个章节,引导读者穿越时空,依照时间顺序游历现代设计:从十九世纪的工业化生产;到现代设计运动,包括包豪斯及其他相关设计活动;经历简朴生活和战争时期;再到战后繁荣及对新材料、新技术的探索;最后在二十一世纪以设计参与到各种最新的活动与事件中结尾。
5.《写给大家看的设计书》
这本书出自世界级设计师之手-Robin Williams,世界著名的设计师、技术专家和畅销书作家。大家经常用到的“亲密性、对齐、重复、对比”4 个设计基本原则,就是出自《给大家看的设计书》。这本书将复杂的设计原理凝练为了简单易懂的、可操作性强的设计技巧,并以简洁明快的风格,展示了大量的示例,让你了解怎样才能按照自己的方式设计出美观且内容丰富的产品。
三、参观展览,提高审美,寻找灵感
不要仅仅局限于以上方式,你需要走出去,多看是需要灵感的工作者需要做的事情,看的越多,脑子里面东西就越多,那也就越有灵感。对于设计师来说,看设计方面的展是必须的,但也不能只看设计方面的展子,艺术创作,涂鸦,摄影展……都要去看,为什么呢?因为美感,设计感,创意感是共通的,不论是在艺术还是设计领域,从不同方面看并吸取经验和知识会让你的设计更加富有创意,与众不同。可以随身携带小本子,这样当灵感来的时候可以迅速画下来,日积月累就会成为你自己的素材库了。
四、研究优秀作品,解读设计思路
当你的知识储备量够了以后,可以尝试对优秀设计进行解读,理解它的设计思路、思维逻辑。选择几个你最喜欢的设计师,仔细研究他们的作品。喜欢哪种设计师的设计风格、设计理念,可以从模仿他的作品开始,要注意的是模仿并不是一件坏事,不是指抄袭,它是探索你自己风格的一个过程。那些设计大师之所以能够成为的大师,就是因为他们的作品足够独特,有创意,有自己的风格。我有个“鬼才设计师”专栏,专门介绍全球著名的设计师,感兴趣的话可以去看一看。
五、善于观察、发现问题
设计师还要善于观察生活,发现生活中的问题,因为设计本身就是从实际问题出发,发现问题,解决问题的一个过程。很多设计都是为了优化人们的生活而存在的,所以设计师们尤其需要擅长发现问题。在产品本身具有设计感创意感的同时也不能忘记它是为解决问题而存在的。
就比如公交车的扶手设计,由于都是统一高度,这就对比较矮的人很不友好。
但按照上图显示的设计,利用三角形作为把手,就可以照顾到不同身高的人。这个问题就是来自于我们生活中经常看到的。
分享一个慢镜头动作分析的方法,比如坐在沙发上看书,天暗了需要开灯,一般正常人的思维就是站起来,去开灯。那作为一个设计师,就需要仔细将这一串的动作进行分解,如果是需要开顶灯,就得站起来,走过去,按开关。如果沙发旁正好有个落地灯,岂不是会方便很多,那打开灯的方式是触摸开关、拉绳开关还是声音开关,调节方式是需要手势控制、遥控控制还是声音控制。这样就会发现很多需要优化的地方使其更加便利。所以想要发现设计点就需要把整个动作慢下来去分析。
最后还可以针对特殊人群去发现问题,像老人、小孩、上班族、家庭主妇等等。他们会面临什么样的问题,这样就会很快找准设计痛点。市场上目前有没有解决这些问题的产品,有的话,就再思考还有哪些需要优化、完善的地方。这就需要你用挑剔的眼光来看待周围的人和事物。
六、注重交流
在追求设计感与创意感的同时,也要考虑到所设计的作品的实用性,因为设计本身就是一个关于人,解决人的问题的行业,只有沟通交流才能了解彼此所需。这里不单单是指和用户的交流,有的设计需要团队协作完成,这时候,和同学、同事、合作伙伴的交流同样非常重要。而且经常与优秀的人沟通交流比起自己一个人闷头干效率会高跟多。
七、参加比赛,将理论应用于实践
此外还需要实践,执行力是身为设计师的很重要的一点,执行力的强弱是影响一个设计师的效率的重要因素之一,比起犹犹豫豫的去想怎么做该不该做,先让自己的手动起来,在行动中找到灵感,可以去参加一些设计类的比赛,比如IF、红点、idea奖以及日本G-Mark设计奖等等,方便参观到全球更多的优秀设计,理论加实践的结合,才能做出有设计感、创意的优秀设计。
刚开始从事各种创意工作的新手设计师,可能最初做的东西并没有那么好,是因为相比一些老设计师,你没有足够的经验和知识储备,只有熬过积累的这个阶段,最终,你的想法、创意,就会更加出彩。现在所能做的最重要的事,就是不断学习、不断创作。
6、怎样才能更好的做到网站结构优化?
网站的结构优化工作是网站优化人员日常工作中必不可少的组成部分,它跟网站的收录与权重或多或少都有些关系。其优化的好处在于:
1、网站结构优化可给用户带来更贴心的体验
2、网站结构优化能增加网站的收录机会
3、可帮助站长合理分配和提高网站权重
4、可让建站者自己的网站关键字排名靠前
因此,要做好网站优化,首先要明确用户需求,有创意有想法。
7、文字排版如何优化网站页面设计
一个网站是否美观关系到用户是否喜欢该网站,决定网站是否美观的因素就是网站页面设计。
从网站的角度出发,网站内容的核心就是文字,文字排版就是将文字进行合理的排列组合。从搜索引擎的角度出发,搜索引擎可以识别并采集的主要内容是文字。基于这两点,文字内容在网页中的重要性显而易见,企业网站设计时需要着重对这文字部分的内容进行合理优化,让其与网站的设计风格和表现需求相符合,从页让网站设计发挥出更大的价值。文字排版优化的实用方法如下:
1、文字格式应前后一致、风格统一
企业网站中运用文字时不会只集中在一个区域,所以在进行文字排版时应做到前后一致、风格统一,这样才能保证网站页面的整齐统一。影响文字格式的因素有文字颜色和大小,在网页设计中这两点应做到一前后一致,整齐美观。另外,在做到统一的同时还应注意动态性,让网上页面即整章有具有不失乏味。
2、文字的间距和行距应做到适当、科学
文字的间距和行距指的是两个文字之间和两行文字之间的距离,企业网站页面设计时应做到科学适当的设置网站页面文字的间距和行距,让整个页面的内容即紧凑又合理,只有合理的文字排列才能让用户顺便利的阅读网站内容。
避免出现的情况:①文字间距相对较小或过大,②文字行距过大或过小。无论是文字的间距过大还是过小都是不对的,过小会给人一种密密麻麻的感觉,让用户没有想要阅读下去的俗欲望;而过大就会导致网站页面的内容量过少,能够为用户提供的信息量降低。
分形科技建议:网站页面文字排版时上下文的间距控制在1.5倍相对合适,这符合大部分人的审美观念。
3、文字的颜色选择应合理
网页中的文字也是可以设计颜色的,这个颜色的选择应与网站的背景色有明显的差异,让人可以很容易的将二者区分开来,这样做有利于增强网页中文字内容的辨识度。另外,还需要从整个页面出发,注意整体的层次感,如文章的标题和正文中需要重点突出的内容可以设置一些不一样的颜色,让网站页面丰富起来,吸引用户阅读。
望采纳!谢谢!
8、大型网站架构该怎么优化设计
你得把你的网站拿出来看了才知道怎么优化改进。并不是说每个网站的优化思路都一样。比如,你优化结构之前你得考虑你的长尾关键词要怎么扩展,长尾词是不是有规律可循。如果有规律,你可以直接利用程序生成标题,生成内容。要根据你的设计思路去设计网站结构。要是每个网站优化思路都一样,那为什么不直接程式化,还拿优化运营来做什么?自动化多好。但是,这是不现实的。所以,你的提问没人能帮得到你。
9、一个新网站怎么做优化?
第一、关键词分析
SEO优化的第一步,也是最重要的一步,就是将关键词需要关注的量进行分析、关键词与网站的相关性进行分析、关键词的布置和排名预测等相关知识进行分析,
将各个部分联系在一起,不是每一个部分都独立于彼此,而是环环相扣,标题和内容等都与关键词密切相关,进行搜索引擎时也会容易被收录和接纳。
第二、网站架构分析
主要包括剔除网站架构设计中不符合人性化设计的部分、实现目录结构的简洁清晰、网站导航的创意性独特,突出性明显和外部链接的优质广泛等内容。
第三、网站目录和页面优化
这也是SEO优化的基本操作了,将网站的基本信息进行优化处理,保证用户对于网站能够在浏览之后有一定的了解和熟悉。
页面的字体大小要合适,不能因为过小而失去一大批视力不好的消费者,也不能因为过大没有多少信息而失去有强迫症或者发散能力不强的用户等。
第四、内容发布和链接布置
SEO优化的重要步骤之一就是内容的定期发布和更新,要合理安排网站内容的更新日程和相关讯息。
而且发布的内容要保证原创性,链接的质量也要得到保障,不要发一些复制来的文章或者添加一些低质量的链接,这样反而对优化效果并不好。
10、如何优化好一个网站
1、页面关键字与关键字密度优化
很多搜索引擎都是通过页面的关键词密度来决定该页面对关键字的关联度,关联度越高,该页面的相关性就越高,所以应确保关键字在整个网页中的充分利用和合理分布。具体做法有:充分利用所有可以利用的因素,但不要过分重复或简单排列关键字;应遵循必要的语法规则,形成自然流畅的语句,使网页不失吸引力;从页面因素的优化角度出发,可考虑将关键字分布在网页标题元、网页描述/关键字元、正文标题、正文内容、文本链接、ALT标志当中。
2、框架优化
所谓框架型网页就是一个网页的某一边导航菜单是固定的,而页面另一边的信息可以上下移动。框架中的内容是无法在后台代码中体现的,而对于那些主要为搜索引掌的搜索程序来说,其设计思路都是完全忽略某些HTML代码,转而直接锁定网页上的实际内容进行索引。这样,搜索引擎在那些一般性的框架网页上根本找不到要搜索的内容。
3、动态页面优化
所谓动态网页指的是采用ASP、PHP、JSP、CGI等程序动态生成的页面。此类网页中的大部分内容来自于网站相连的数据库,在网络空间中并不存在实际的页面,只有在接到用户的访问要求,即当用户在变量区中输入相应值以后,才自动生成。而搜索引擎只是一个搜索程序,它无法像真实的用户一样选择变量并输入数值。
4、建立网站地图
网站地图包括主要网页的内容链接或者栏目链接。根据网站的大小、页面数量的多少,它可以链接部分主要的或者所有的栏目页面。这样,搜索引擎程序得到了网站地图页面,就可以迅速地访问整个站点上的所有网页及栏目。为了使网站地图吸引搜索引擎与真实访问者,一定要在链接后写上一定的描述性短句,对与此链接相关的关键词进行简单描述,但是不能过度使用关键词。作为网站地图,不仅是为搜索引擎设计的,也是为真实的访问者设计的,如果访问者能感觉到地图好用,搜索引擎也同样能正确地理解地图的意义。
以上就是西安文菲科技优化的流程。