{"_ck":{},"data":{"gid":"6774190834146345475","group_source":2,"play_auth_token_v2":"","play_url_list":null,"diversion_control_v2":{"disable_diversion":false,"single_risk_control":false},"long_image_short_share_url":"","is_toutiao_top_pick":false,"is_toutiao_hot":false,"biz_tag":"图文","publish_time":"1577239231","title":"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些","content":"\u003cp\u003e\u003cstrong\u003e吉萨金字塔、蒙娜丽莎、Twitter和百事可乐有什么共同点？\u003c/strong\u003e\u003c/p\u003e\u003cblockquote\u003e\u003cp\u003e答案很简单，它们的设计都遵循了黄金比例。作为一个常见的数学比例，黄金比例实际上是从自然界中总结并发现的，用于设计中的时候能赋予作品更多的设计美感，赏心悦目。\u003c/p\u003e\u003c/blockquote\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003ch1 class=\"pgc-h-arrow-right\"\u003e什么是黄金比例？\u003c/h1\u003e\u003cp\u003eWhat is the golden ratio?\u003c/p\u003e\u003cp\u003e黄金比例是一个比较特殊的数学比例，自古希腊以来，黄金比例就被当做美的比例，在大自然中，无论是树叶的生长方式，还是贝壳螺旋的生长方向，甚至人体的各处平衡点的存在，都是接近1：（1+√5）/2的比例，近似值为1:1.618。\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p3-sign.toutiaoimg.com/pgc-image/356fc7dd2f5046e0a55f9645e5fde83f~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=SuSVv0OVwqRtVH8C4gTK3%2BuoFAg%3D\" img_width=\"640\" img_height=\"427\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p26-sign.toutiaoimg.com/pgc-image/b2266006f998405fa2c337595bde6a79~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=j0QRfjUme8FixzOgOFPJl5YqF6k%3D\" img_width=\"640\" img_height=\"328\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p26-sign.toutiaoimg.com/pgc-image/bb7d5cddbe6f43cabec1ca17b917f7ed~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=AMBjRc5pIVVJDxnRreXvslMXQYc%3D\" img_width=\"520\" img_height=\"527\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p26-sign.toutiaoimg.com/pgc-image/da41c1118ebd46979cf19444490d7ecb~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=pUW%2BcdGEx2BTjMi25Jj%2FjXrGJwY%3D\" img_width=\"500\" img_height=\"707\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003cp\u003e\u003cstrong\u003e在设计中灵活运用比例\u003c/strong\u003e\u003c/p\u003e\u003cp\u003e正如同它的名字，“黄金比例”常常给人渝中恰到好处，自然的感觉，所以在设计中被广泛运用，无论是LOGO设计，还是排版设计，灵活的运用黄金比例，能够带来不错的效果。\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p3-sign.toutiaoimg.com/pgc-image/096f90d3f75b4c978be030e4a97810ef~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=rtoqFZt8%2FlEGjweJfOPbuQ05pm4%3D\" img_width=\"517\" img_height=\"526\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e\u003cstrong\u003e在布局中使用黄金比例的方法并不难，关键是控制比例和尺寸。重点很简单，把握好1:1.618的黄金比例。\u003c/strong\u003e\u003c/p\u003e\u003cp\u003e举个例子，使用960px的宽度布局的时候，除以1.618可以得到594px，这个可以用作你的布局的高度，然后将整个布局划分为两栏，一栏方形，一栏矩形，一个协调的布局就出来了。\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p26-sign.toutiaoimg.com/pgc-image/38c61337fbc44eb5a674306e411c2537~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=8iWoIsqT%2B%2FPnrighDgYdYyfDlug%3D\" img_width=\"640\" img_height=\"396\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003ch1 class=\"pgc-h-arrow-right\"\u003e白银比例\u003c/h1\u003e\u003cp\u003eThe proportion of silver\u003c/p\u003e\u003cp\u003e同样源于希腊的白银比例，白银比例1:√2是正方形的变长和对角线的比例，近似值为1:1.414，诸如我们常用的国际标准纸尺寸也是采用的白银比例，比如A3纸对折裁切之后就是A4纸的尺寸了，这一特征使得它也常见于建筑和平面设计。\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p26-sign.toutiaoimg.com/pgc-image/1b97f39ae35f46d684c3b0065c7b5809~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=QsnLm4tS3Fr6sOLWCQCciq1WIU4%3D\" img_width=\"400\" img_height=\"300\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p3-sign.toutiaoimg.com/pgc-image/02e7fb3508e34b7995503d84d5f598ab~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=pVdNWK%2FmWVRg0N1aTx2D7QhfY1U%3D\" img_width=\"514\" img_height=\"523\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003cp\u003e\u003cstrong\u003e稳妥扎实的白银比例\u003c/strong\u003e\u003c/p\u003e\u003cp\u003e相比略为修长的黄金比例，白银比例给人的感觉更加安稳恬静，在排版设计的时候，尤其是在平面排版的时候，能和标准的A系版型构成协调安定的浏览体验。\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p26-sign.toutiaoimg.com/pgc-image/fa25da871ec64540b8fb113ee0db8584~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=RSqS2laGHwOSW88PzfSuntsnhL4%3D\" img_width=\"515\" img_height=\"525\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003ch1 class=\"pgc-h-arrow-right\"\u003e三等分法则\u003c/h1\u003e\u003cp\u003eRule of thirds\u003c/p\u003e\u003cp\u003e突出重点的三等分法则，将版面等分为三份，然后按照1:2的比例有侧重的凸显整个排版，三等分法则这种比例排布能让排版稳定而有层次，重点突出；这种法则在 摄影和图片切割处理上有着广泛的应用。\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p26-sign.toutiaoimg.com/pgc-image/699e0f82b48d45f7a050d95e0669eb85~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=uEQUDpfhOj%2Fs1NqH2xvkXNboE1o%3D\" img_width=\"519\" img_height=\"525\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003cp\u003e\u003cstrong\u003e三等分线的灵活运用\u003c/strong\u003e\u003c/p\u003e\u003cp\u003e三等分法则中，四条参考线的交汇点适合用来放置视觉主体和焦点，能使版面均衡稳固，用来排版设计的时候，参考线可以有机的用作边界，灵活自然的创造匀称而难忘的布局。\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p3-sign.toutiaoimg.com/pgc-image/2909cd7aa58a4bb3a7e9380230e8abeb~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=j0abZ2NxQ7LyoZz6OKokiq5ME%2B0%3D\" img_width=\"514\" img_height=\"526\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003cp\u003e\u003cstrong\u003e黄金比例|白银比例\u003c/strong\u003e\u003c/p\u003e\u003cp\u003e这两种比例的调性差异，使它们可以混合使用，创造不同的体验。最常见的在白银比例版面下，内容区块使用黄金比例，通过比例差异，创造出突出的优雅感。\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p3-sign.toutiaoimg.com/pgc-image/1e8680ad23e24a7cb064a359f5e89073~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=p2%2F9MpmUwAI%2FBTGhzKat2pbuUak%3D\" img_width=\"300\" img_height=\"128\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p3-sign.toutiaoimg.com/pgc-image/e08b365d45fd4d37a96007402be22402~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=kP2NGKmFjDh7DoXCl%2FZVDHke2xU%3D\" img_width=\"518\" img_height=\"526\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003cp\u003e\u003cstrong\u003e黄金比例|三等分法则\u003c/strong\u003e\u003c/p\u003e\u003cp\u003e当参考线不再按照1:1:1来等分的时候，而是结合黄金比例以1.618:1:1.618来切割布局的时候，四个交汇点会更加居中，借助参考线来控制元素的位置，能够创造出更加聚焦、更加富有凝聚力的布局。\u003c/p\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003cp\u003e参考下方的图片，借助将页面进行黄金比例分割的四条线，线条两两交汇的地方是最吸引用户的地方。当然，我们常见的三分法是让同一个方向上的两条线将布局按照1：1: 1的比例分割开来。\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p3-sign.toutiaoimg.com/pgc-image/89eeb0badc294765a8f64bc40dc7128b~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=3gvVEdSy5CFxkNltByZW%2FCSBa%2F0%3D\" img_width=\"640\" img_height=\"227\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e这个案例是Complex杂志的封面，整体布局符合黄金比例，而黄金比例三分法下的两个交点上则正好和女性的鼻子与眼睛上。\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p3-sign.toutiaoimg.com/pgc-image/7cd55a1ecd8b4dad973a3e5eee1ea4d3~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=70tfgF4eWwFXKFwf0HK5yYxiTBQ%3D\" img_width=\"640\" img_height=\"435\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003cp\u003e\u003cstrong\u003e黄金比例建筑\u003c/strong\u003e\u003c/p\u003e\u003cp\u003e1、巴特农神庙\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p26-sign.toutiaoimg.com/pgc-image/96d32a1deaf748d1afed6a70fecb1206~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=%2Bc3bayuIuHNcV6D%2BLNR8uglDJzE%3D\" img_width=\"640\" img_height=\"426\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e2、埃及金字塔\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p3-sign.toutiaoimg.com/pgc-image/4d0c251546dc48748c5e167d3d89c7bf~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=EYeZX3ikLux2wnmKnJcIulmL7zw%3D\" img_width=\"640\" img_height=\"388\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e3、印度泰姬陵\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p3-sign.toutiaoimg.com/pgc-image/7a19a7a9ea7f4f9abb0e2f01485d8775~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=ABM%2BskRte32jbYxOBIeCVgZGAP8%3D\" img_width=\"640\" img_height=\"427\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e4、埃菲尔铁塔\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p26-sign.toutiaoimg.com/pgc-image/f729cc8bce4444a8a6ecc926961ec8e1~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=DoClMnKvJE0JFYgPELxubBPl9%2FM%3D\" img_width=\"640\" img_height=\"427\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e5、巴黎圣母院\u003c/p\u003e\u003cdiv class=\"pgc-img\"\u003e\u003cimg src=\"https://p26-sign.toutiaoimg.com/pgc-image/c5bac9c0465746c993d42315c8bb6ceb~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=JjLflt5syNH7YTFjLS7AJzlQ6Lw%3D\" img_width=\"640\" img_height=\"632\" inline=\"0\" alt=\"怎样更好的运用黄金比例进行排版？常见的黄金比例建筑居然有这些\" onerror=\"javascript:errorimg.call(this);\"\u003e\u003cp class=\"pgc-img-caption\"\u003e\u003c/p\u003e\u003c/div\u003e\u003cp\u003e\u003cbr/\u003e\u003c/p\u003e\u003cp\u003e来源：优秀网页设计 Rebecca Gross\u003c/p\u003e\u003cp\u003ehttps://www.canva.com/learn/what-is-the-golden-ratio/\u003c/p\u003e","creator_uid":101245066190,"media_id":"1605317345171470","detail_source":"不凡奶茶E9q","media_user":{"screen_name":"不凡奶茶E9q","no_display_pgc_icon":false,"avatar_url":"https://sf3-cdn-tos.toutiaostatic.com/img/user-avatar/5a7facbfaeb00c48fcd247e2153920ec~300x300.image","id":1605317345171470,"follower_count":"716"},"url":"https://toutiao.com/group/6774190834146345475/","high_quality_flag":"0","impression_count":"135","is_original":false,"is_pgc_article":true,"is_rumor":false,"source":"不凡奶茶E9q","comment_count":0,"digg_count":1,"repost_count":0,"repin_count":3,"logo_show_strategy":"normal","follower_count":"716","poster_url":"https://p9-sign.toutiaoimg.com/pgc-image/b2266006f998405fa2c337595bde6a79~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=%2FrOzvQuZ9GM4w%2FBC%2FPwEZZyziRY%3D","in_process":false,"is_live_end":false,"share_info":{"share_icon":"https://p3-sign.toutiaoimg.com/tos-cn-i-0000/56f34ecc-26ba-11ea-be32-fa163e5f6395~tplv-tt-large.image?_iz=30575\u0026lk3s=06827d14\u0026x-expires=1775898890\u0026x-signature=Vits0NUIIIcwmkKmEnAd%2FIC%2BN2c%3D"}},"success":true}