如何运用文字和几何进行公司网站设计？

如果你在创作时没有灵感，不妨停止努力思考，可以一张纸和一支笔乱涂乱画，并勾画出一些布局。或者倾斜的线条，或者不规则的图形，改变一下角度，也许你会找到一些灵感的突破。或者一遍又一遍地看一些好作品。在连续的幻灯片式的预览过程中，可能会有瞬间的视觉冲击戳到你的灵感。

为了使自己网站设计的页面具有鲜明的艺术特色，在众多的页面中脱颖而出，着重介绍以下两点。

一、文字设计的巧妙运用

在成都网页设计中，文字在整个界面中起着主要作用，是传达信息的主要元素。字体大小、颜色、字体样式甚至间距都会直接影响页面的视觉传达效果。

整个页面要趋于简洁，但是文本和图形的巧妙结合使得整个页面简单而不空洞。同时，整个文本大小的比较也使页面更有层次感。

合理分散字体，进行灵活的艺术处理，使它们图形化，不仅呈现信息，而且使整体看起来更适合设计主题，更具美感和艺术性。

尽管页面上的信息量很大，但由于在间距和大小比较上的合理处理，整个页面看起来是满的而不是凌乱的，并且很容易一目了然地找到信息点。

二、使用几何图形进行设计

网页通常由不同大小的列和表格组成。它们基本上是非常方正的表达式。恰当地使用一些几何图形，如三角形、菱形或圆形，会使整个画面更加生动，起到打破规则的作用。

提取LOGO颜色，用不同的几何图形形成固定的背景图案，使整个页面更加形象化。

LOGO是用几何图形来表示的，而导航巧妙地使用了轮盘的表示方式，使得原来只有很少信息的正方形页面看起来生动而完整。

几何形状直接用作列，内容以悬停状态直接呈现，从而丰富了简单的图片。

以人为本，周围大面积空白，突出中心内容区，虽然信息量不大，但简单明了，直观的表达了网站的主要内容。

原本电子产品页面信息量大，通过精简内容和空白设计，内容不多，但突出了主要功能点，使产品看起来更简洁，更有质量。

以图形为中心的个人网站由于信息量少，大胆采用大面积空白设计。巧妙之处在于在空白空间的基础上，将图形作为网站的主要特征和主题，透明、生动、严谨。

尽管中国的搜索引擎技术还不是很成熟，百度建议移动站和pc网站应该分开。然而，随着技术的发展，响应性网站在未来将会像谷歌一样被认可。毕竟，它更方便，节省了资源和时间成本。以下是我的一些经验：

1.使用em和rem来控制大小

习惯于pc页面的前端开发人员可能更喜欢使用pc来控制页面大小，但是em和rem在响应页面中出现的频率更高。使用它们来控制字体大小，甚至是框架大小，总体上有非常明显的效果。可以大大减少工作量，同时保证字体比例的统一。

em和rem的解释可以被每个人找到。有无数的在线教程。事实上，它们和px一样简单。在我开始使用它们之后，我只花了几分钟就熟悉了它们。如前所述，您也可以使用它们来控制框架的大小，然后在响应页面下均匀缩放。当然，这需要足够的计算。值得一提的是，字体图标也可以由它们控制。

2.关于比例问题

有几种方法可以解决缩放问题。最适合初学者的布局无疑是百分比布局。在关键点宽度设置下，百分比可能会产生意想不到的效果：

box1{ width:100%;}

ul{ margin:0 2%;}

有时这可能会大大减少工作量。将box1的宽度设置为100%后，它将自动用宽度填充整个浏览器。无论您在pc上的分辨率是多少，它总是表现良好。当您在第1栏中为ul设定约2%的利率时，情况也是如此。ul的实际边距大小也会随着浏览器窗口大小的变化而变化。

当然，有时它并没有想象中的效果，特别是在小分辨率下，原来看起来不错的百分比设置看起来很奇怪，因为大多数时候响应类型只指定宽度，长度由文档和浏览器决定。此时，如果你想在所有的终端上有一个好的体验，你需要Media Query来解决这个问题。

3.Media Query

通俗的解释是CSS的媒体查询功能，它不仅可以准确识别设备，还可以设置分辨率或宽度。w3cshoolMedia Query有媒体查询参考文档。如果你认为文件太多，我可以大致解释一下它是如何工作的。

必要时，你可以为一个box设定一个高度。当box的高度为500像素时，在个人电脑上看起来可能不错，但是当用手机打开时，就有点吓人了。整个box充斥着页面，内容排列混乱，严重影响用户体验。此时，您可以使用“媒体查询”为不同的尺寸设置不同的高度。例如，当640/320打开时，box的高度分别为300/200像素，这看起来就不错了。

你可以考虑import。事实上，媒体查询可以这样理解。它为不同的宽度或设备设置类似于导入的css规则，以确保实际呈现完成页面的效果。

4.响应网站布局中的框架

如果你想设计一个类似谷歌的搜索框，这是非常困难的。google  类型的搜索框实际上在框中包含一个输入，然后在框中添加左右图标。如果你用bootstrap来做这件事，可能会有许多令人困惑的冲突，但是你实际上得到了什么呢？一个圆角和一行高？还是他的百分比宽度？这些只是用css编写的几行代码。

还有一些框架过于依赖AJAX。它们也许想法很好，大量的AJAX在前端看起来很酷，对用户足够友好，但是大量的请求对服务器不友好，这可能会大大降低服务器的实际负载。总之，要根据实际需要解决问题，框架不是万能的。如果您对制作响应性网站有任何要求，请联系我们。

文章题目：如何运用文字和几何进行公司网站设计？
标题URL：https://www.cdcxhl.com/news40/326590.html

成都网站建设公司_创新互联，为您提供移动网站建设、全网营销推广、网站设计、品牌网站建设、网站内链、品牌网站制作

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联