100diemcom

Ap dung ti le chuan khi lam website

Thiết kế web hiệu quả không nhất thiết phải đẹp và nhiều màu sắc - nó phải rõ ràng và trực quan; trong thực tế, chúng tôi đã phân tích các nguyên tắc thiết kế hiệu quả trong các bài viết trước của chúng tôi. Tuy nhiên, làm thế nào bạn có thể đạt được một giải pháp thiết kế rõ ràng và trực quan? Vâng, có một số tùy chọn - ví dụ: bạn có thể sử dụng lưới, bạn có thể thích các giải pháp đơn giản nhất hoặc bạn có thể tập trung vào khả năng sử dụng. Tuy nhiên, trong mỗi trường hợp này, bạn cần đảm bảo khách truy cập của bạn có một số cảm giác tự nhiên về trật tự, hài hòa, cân bằng và thoải mái. Và đây chính xác là nơi mà cái gọi là tỷ lệ Thần thánh trở nên quan trọng.


Bài viết này giải thích tỷ lệ thiêng liêng là gì và Quy tắc phần ba là gì và mô tả cách bạn có thể áp dụng hiệu quả cả hai cho thiết kế của mình. Tất nhiên, có nhiều khả năng. Hy vọng, bài đăng này sẽ giúp bạn tìm ra các thiết kế web đẹp và hiệu quả hơn hoặc ít nhất cung cấp một số điểm khởi đầu tốt mà bạn có thể xây dựng hoặc phát triển hơn nữa.

Tỷ Lệ Thiêng Liêng

Kể từ thời Phục hưng, nhiều nghệ sĩ và kiến ​​trúc sư đã cân đối các tác phẩm của họ để xấp xỉ tỷ lệ vàng - đặc biệt là ở dạng hình chữ nhật vàng, trong đó tỷ lệ của mặt dài hơn ngắn hơn là tỷ lệ vàng. Lý do đằng sau nó là niềm tin rằng tỷ lệ này là hữu cơ, phổ quát, hài hòa và thẩm mỹ. Thật vậy, hiển nhiên ở khắp mọi nơi trong vũ trụ (trên thực tế, nhiều thứ xung quanh chúng ta có thể được biểu thị theo tỷ lệ này), tỷ lệ thiêng liêng (còn được gọi là tỷ lệ vàng, phần thần thánh, cắt vàng và ý nghĩa của Phidias) có lẽ là luật được biết đến nhiều nhất tỷ lệ có thể cải thiện đáng kể giao tiếp của thiết kế của bạn .

Như Mark Boulton đã nói trong bài viết của mình về Thiết kế và Tỷ lệ thiêng liêng , một trong những thành phần quan trọng trong phương tiện truyền thông là sáng tác, và trong trường học thiết kế, đó là thứ được dạy như một thứ gì đó bạn nên cảm nhận hơn là tạo ra một cách logic. Do đó, để làm hài lòng khách truy cập của bạn với một bố cục dễ chịu và trực quan, thường đáng để xem xét tỷ lệ Vàng. Vậy chính xác tỷ lệ vàng là gì? Về cơ bản, nó là một tỷ lệ 1.618033988749895 ≈ 1.618 giữ giữa các đối tượng được đặt trong một số bối cảnh.

Tỷ lệ thiêng liêng

Hãy xem xét ví dụ trên. Bạn muốn tạo một bố cục chiều rộng cố định. Chiều rộng của bố cục của bạn là 960px. Bạn sẽ có một khối lớn cho nội dung của bạn ( #content) và một khối nhỏ hơn cho thanh bên ( #sidebar) của bạn . Làm thế nào bạn sẽ tính toán độ rộng của các cột của bạn?


Đầu tiên, tính chiều rộng của #content-block của bạn . Bạn cần đảm bảo rằng tỷ lệ giữa khối này và chiều rộng bố cục tổng thể là 1,62. Do đó, bạn chia 960px cho 1,62, kết quả là khoảng 593px.

Trừ 593px từ chiều rộng bố cục tổng thể (là 960px) và nhận được 960px - 593px = 367px.

Bây giờ nếu bạn tính tỷ lệ giữa #content-block và #sidebar-block (593px: 367px ≈ 1.615) và tỷ lệ giữa chiều rộng vùng chứa và chiều rộng của khối nội dung (960px: 593px 1.618), bạn đã đạt được gần như nhau tỉ lệ.

Đây là toàn bộ ý tưởng đằng sau tỷ lệ Golden Golden. Điều tương tự giữ cho bố trí chất lỏng và đàn hồi, quá.


Tất nhiên, một thiết kế web không cần phải được tổ chức theo tỷ lệ Thần. Tuy nhiên, trong một số trường hợp, nó có thể cải thiện không chỉ giao tiếp của thiết kế mà còn cải thiện thêm chi tiết về bố cục của bạn . Như một ví dụ xem xét Blog 404. Bản thân thiết kế này rất hấp dẫn, cung cấp màu sắc bình tĩnh và hỗ trợ và có bố cục đẹp.

Tuy nhiên, thiết kế không tương ứng với tỷ lệ Divine như bạn có thể thấy từ hình ảnh bên dưới. Trên thực tế, người dùng không nhất thiết phải cảm nhận nó, bởi vì họ phân chia bố cục theo hai cách riêng biệt có chiều rộng 583px (630px - 31px - 31px) và 299px (330px - 31px). Lý do đằng sau đó là không gian màu trắng của khu vực chính bị động (ba cột, mỗi cột rộng 31px), rõ ràng nó hỗ trợ nội dung bên cạnh nó chứ không phải là chính nội dung.


Tỷ lệ giữa các khối bố cục là 630: 330 px 1,91 1,62 và tỷ lệ giữa các khối nội dung là 583: 299px 1,92 1,62. Lý do tại sao bố cục trông gần như hoàn hảo mặc dù nó không tuân theo tỷ lệ Thần thánh là vì thực tế đơn giản là nó được cân bằng - cả khối bố cục và khối nội dung có cùng tỷ lệ. Do đó thiết kế cung cấp một số cảm giác đóng cửa và hài hòa cấu trúc.


Tuy nhiên, điều thú vị là do độ dài bố cục dưới mức tối ưu, khách truy cập được cung cấp độ dài văn bản dưới tối ưu trên 90 ký hiệu trên mỗi dòng. Tuy nhiên, một con số tối ưu để đọc thoải mái nằm trong khoảng từ 60 đến 80 ký hiệu trên mỗi dòng. Do đó, việc cải thiện bố cục cũng sẽ dẫn đến khả năng đọc nội dung được cải thiện. Đó là một tác dụng phụ hữu ích của việc hoàn thành công việc theo quy luật tự nhiên.

Đối với một số bản nháp nhanh, bạn có thể sử dụng tỷ lệ 5: 3 không chính xác là tỷ lệ Thần thánh, nhưng có thể trở thành quy tắc hữu ích trong trường hợp bạn không có máy tính ở gần. Tỷ lệ thiêng liêng thường cung cấp các giá trị chống đạn mà người ta có thể kết hợp hoàn hảo trong hầu hết mọi thiết kế. Khi làm việc với dự án tiếp theo của bạn, bạn có thể muốn xem xét sử dụng các công cụ sau đây để tính toán độ rộng LỚP trên đường bay:


Phiculator Phiculator là một công cụ đơn giản, với bất kỳ số nào, sẽ tính toán số tương ứng theo tỷ lệ vàng. Công cụ miễn phí có sẵn cho cả Win và Mac.

Công cụ thiết kế tỷ lệ phần vàng Atawn Phần vàng là một chương trình, cho phép tránh các hoạt động thường ngày, biên dịch máy tính, lập kế hoạch nhóm và biểu mẫu. Bạn có thể thấy và thay đổi các hình thức và kích thước hài hòa, trong khi đang trực tiếp làm việc trong dự án của bạn.

Nguyên Tắc Thứ Ba

Về cơ bản, Rule of thirds là một phiên bản đơn giản hóa của tỷ lệ Vàng và do đó đặt ra một quy tắc cấu thành của ngón tay cái. Chia một tác phẩm thành một phần ba là một cách dễ dàng để áp dụng tỷ lệ thiêng liêng mà không cần lấy ra máy tính của bạn.

Nó nói rằng mọi thành phần có thể được chia thành chín phần bằng nhau bởi hai đường ngang cách đều nhau và hai đường thẳng đứng cách đều nhau. Bốn điểm được hình thành bởi các giao điểm của các đường này có thể được sử dụng để đặt các yếu tố quan trọng nhất - các yếu tố bạn muốn đưa ra một vị trí nổi bật hoặc chiếm ưu thế trong các thiết kế của bạn. Căn chỉnh một tác phẩm theo Quy tắc một phần ba tạo ra nhiều căng thẳng, năng lượng và hứng thú với bố cục hơn là chỉ tập trung vào tính năng.

Trong hầu hết các trường hợp, không thể sử dụng cả bốn điểm để làm nổi bật các chức năng hoặc tùy chọn điều hướng quan trọng nhất trong thiết kế. Tuy nhiên, bạn chắc chắn có thể sử dụng một số trong số chúng (thường là một hoặc hai) để đặt đúng thông điệp hoặc chức năng quan trọng nhất của trang web. Các góc trên bên trái thường là một trong những mạnh nhất , kể từ khi người dùng quét các trang web theo “F” viết tháu.


Vậy làm thế nào để bạn chia một bố cục thành 9 phần bằng nhau? Jason Beiard nêu phương pháp sau đây để áp dụng Quy tắc phần ba cho bố cục của bạn:


Để bắt đầu phiên bản bút chì và giấy của bố cục của bạn, hãy vẽ một hình chữ nhật. Kích thước dọc và ngang không thực sự quan trọng, nhưng hãy cố gắng giữ các đường thẳng và góc 90 độ.

Chia hình chữ nhật của bạn theo chiều ngang và chiều dọc cho một phần ba.

Chia thứ ba trên cùng của bố cục của bạn thành một phần ba một lần nữa.

Chia mỗi cột của bạn thành một nửa để tạo thêm một chút lưới.

Bạn nên có một hình vuông trên giấy của bạn trông tương tự như quy tắc lưới thứ ba.

Xem thêm: https://taowebsite.com.vn/lam-website/

Hãy xem xét thiết kế của requestware.com được trình bày dưới đây. Mặc dù thiết kế sử dụng một số màu sắc rực rỡ, nhưng nó không ồn ào và dường như vừa đơn giản vừa rõ ràng. Các tùy chọn điều hướng được hiển thị rõ ràng và cấu trúc của trang web có vẻ dễ quét.

Quy tắc một phần ba

Tuy nhiên, nếu bạn xem xét tính hiệu quả của thiết kế này, bạn có thể tìm thấy sự cân bằng hoàn hảo mà thiết kế thực sự có. Thật vậy, nó gần như sử dụng hoàn hảo Quy tắc phần ba như hai trong bốn giao điểm của các dòng (khối màu hồng trong hình bên dưới) chứa chính xác thông tin mà công ty muốn người dùng nhìn thấy - cụ thể là trang web nói về điều gì và một ví dụ công việc của họ. Cũng lưu ý cách hoàn hảo các phần chính được đặt trên trục ngang thứ hai. Đó là hiệu quả.

Quy tắc một phần ba

Tóm Lược

Trong một số trường hợp, áp dụng tỷ lệ Thần và Quy tắc phần ba có thể cải thiện đáng kể việc truyền đạt thiết kế của bạn tới khách truy cập. Cung cấp cho người dùng của bạn một sự cân bằng gần như tự nhiên theo tỷ lệ 1: 1.62 bạn thực sự áp đặt trật tự tự nhiên cho nó và buộc bố cục thiết kế của bạn trở nên dễ quét và có cấu trúc tốt hơn.


100diemcom

Powered by GroupSpaces · Terms · Privacy Policy · Cookie Use · Create Your Own Group