To give you Photoshop software users to detailed analysis of the golden ratio in the application of Web design experience.
What is the golden ratio?
The gold ratio is a mathematical ratio, usually found in nature, and combines the classical design theory to establish a balanced composition. It is about 1.6180, also known as the "golden mean", "golden section", which is usually represented by the Greek alphabet Ф.
The "Golden rectangle" refers to the width of a rectangle that is 1.618 times times its height. For example, one side of the PX is divided into 300 * 1.6180≈485 px on the other side, which can be called the Golden rectangle.
If you slice a perfect rectangle from this golden rectangle, you will be left with another golden rectangle.
You can continue to do the same thing with smaller rectangles, and then continue to split, infinite loops, and you'll get this familiar image:
The Fibonacci sequence is similar to the gold ratio, but not quite so. This is a series of numbers, and the next number in the sequence is the sum of the first two. For example: 0,1,1,2,3,5,8,13,21,34,55,89,144,233,377 ... This rule formula is xn = xn-1 + xn-2.
Let's say we start with a square and then add another one, and we get a rectangle we need:
Keep the maximum length of the added square extended
Then we add another rectangle that equals the maximum number of lengths:
And then again and again:
This can be extended indefinitely, and will result in the same golden rectangle effect, but this time it is new rather than Shard. Both the gold ratio and the Fibonacci sequence make us attractive proportions.
Now let's analyze some of the sites where we can see their usage.
What is this website about?
"Your local Studio" is a website based on design and development, studio in Copenhagen, Denmark. They are good at using any form of visual concepts and are used to create experiences that optimize Web pages.
What is this website about?
This site has two or three pages that are useful to the golden ratio. The home page is a conceptual annotation of key information. However, when you visit the Studio page, you will find that it blends a little traditional web layout with a golden rectangle, such as the following pages:
Want to stand out from the crowd? As Yourlocalstudio (YL) did, by using the golden ratio to design the site. The design has a progressive, well-organized, structured grid system on the surface, which, you might say, looks like a guide ... Note that more and more Web sites are structured to attract users ' attention to more dynamic layouts
What is this website about?
Mashable is a news website that gets the source of information, the "Connecting generation" of knowledge and resources.
How does it use the golden ratio?
I used the Golden ratio test UX (user experience) trigger to demonstrate how Mashable uses the Fibonacci sequence layout, the content layout is flexible, the left title and links to more news, separated by a trellis.
The gold ratio here is very effective because it allows a content-driven website to give information to typesetting breathing space. Similar sites use traditional grid layouts to look dense, but Mashable shows that the gold ratio is very effective, even if it is intangible.
Example # 3:jackson & Kent
What is this website about?
Jackson & Kent is a Web production agent from France website. They specialize in digital services such as Html5,css3,drupal,wordpress,php/mysql,flash.
How does it use the golden ratio?
The screenshot above shows how the layout is mainly comprised of previous customer work items, and there is a piece of information about the organization itself as well as a navigation bar in the center of the screen, the contact button, as shown in the following figure, also using the gold split grid system and organize the layout in a unique way.
The examples here encourage you to pan the site and explore the inner level, making the content more intuitive and interesting in the grid view and in different sizes of block shapes. Because the user is likely to be watching the content on the screen (as well as on the plate), on the horizontal axis of the navigation also has a paging number. This is a novel way to view each piece of content, and a user interface as a whole.
The golden ratio naturally attracts the user's eyes to a particular point in the user interface. As a concept, it can help you to think about the layout of the content and effectively use the hierarchy, combination of layout, typography, color and general principles, will help to upgrade your design level to a new stage.
Well, the above information is small compiled to you photoshop this software users of the detailed gold ratio in the web Design application experience sharing all the content, you see the users here are very clear now, I hope that the contents of the small series to share the content can bring useful help.
