Tạo điểm tiêu cự trong thiết kế web của bạn

0143 01 focal point webdesign thumbnail Tạo điểm tiêu cự trong thiết kế web của bạn

Thiết kế web không có nhiều thời gian để gây ấn tượng với khách truy cập trang web và thuyết phục họ ở lại trên các trang web chúng tôi thủ công. Họ muốn tìm thấy những điều một cách nhanh chóng, và chúng ta nên thiết kế các trang web để hỗ trợ họ làm việc đó. Một trong những cách quan trọng nhất để làm điều này với các điểm đầu mối.

Một đầu mối là một phần nổi bật trên một trang web mà chúng tôi muốn hướng dẫn sự chú ý của người dùng. Điểm đầu mối là trung tâm bắt mắt của trang, nó nổi bật và khác biệt hơn so với các thành phần khác.

 

Dưới đây là các lý do: thiết kế như một khu vực quan tâm, chúng tôi có thể nhấn mạnh các khía cạnh quan trọng nhất (s) của trang web và truyền đạt mục đích chính của trang web.

Khái niệm cơ bản

Tốt nhất để có một điểm duy nhất đầu mối. Tìm điều quan trọng nhất trên trang web, và sau đó nhấn mạnh nó. Các đầu mối liên quan trực tiếp đến các mục tiêu và ưu tiên của trang web và mong đợi của các chủ sở hữu trang web.

Có thể có nhiều hơn một đầu mối, nhưng tôi khuyên bạn nên tập trung vào một trong những chính gọi hành động. Có nhiều điểm trọng tâm trên một trang giống như không có gì cả bởi vì, sau đó, người dùng sẽ không có khả năng phân biệt của một người quan trọng nhất.

Nếu bạn có nhiều hơn so với đầu mối, họ nên có sự phân biệt. Tạo một hệ thống phân cấp trực quan để biểu thị những đầu mối quan trọng hơn . Phân biệt với nhau với nhiều loại kích thước, vị trí, màu sắc, trọng lượng hình ảnh và các kỹ thuật phân biệt.

Đặt điểm tiêu cự

Hầu hết người dùng nhìn thấy trang đầu tiên, vì vậy đó là có lẽ là trang tốt nhất cho tâm điểm của bạn. Tuy nhiên, việc tạo ra một đầu mối duy nhất trên trang chủ là một sai lầm phổ biến. Tất cả các trang web cần phải có một đầu mối cung cấp cho người dùng truy cập nhanh vào phần quan trọng nhất của thông tin trên trang.

Trên một trang cuộn, ví dụ, đặt cơ quan đầu mối ở trên gấp (các tiêu đề là một vị trí ứng cử viên tốt).

Trên một trang không cuộn được (tức là một trang có thể nhìn thấy tất cả cùng một lúc), bạn có tự do hơn. Sử dụng các yếu tố đã tồn tại, nhưng sử dụng chúng tốt. Làm cho một cái gì đó đơn giản xây dựng, làm cho một cái gì đó bình thường ấn tượng.

Nếu bạn có thể, bao hàm một câu chuyện. Thông báo cho công việc thiết kế của bạn với một câu chuyện.

Làm thế nào để tạo điểm nhấn

Dưới đây là những yếu tố thiết kế bạn có thể tinh chỉnh thiết lập các đầu mối của bạn.Tôi đã bao gồm một số ví dụ thực tế thế giới và phản ví dụ của mỗi phần tử.

Typography

Các yếu tố văn bản có tiềm năng mạnh mẽ để trở thành grabbers sự chú ý, nhưng các trang web điển hình là chen chúc với số lượng lớn các văn bản, vì vậy các bộ phận đặc biệt phải được nhấn mạnh.

Kích thước, màu sắc, khoảng cách (giữa các nhân vật và đường dây) và kiểu chữ là những yếu tố có thể được chế tác để nhấn mạnh các yếu tố văn bản.

Eduardo de la Rocque sử dụng kiểu chữ và kích cỡ khác nhau để làm cho ba cấp độ của tầm nhìn.

0143 02 de la rocque Tạo điểm tiêu cự trong thiết kế web của bạn

Các kiểu chữ lớn trên trang web của Fajne Chlopaki bắt mắt.

0143 03 fajne chlopaki Tạo điểm tiêu cự trong thiết kế web của bạn

Ban nhạc phim mùa thu thông báo một đề nghị đặc biệt với các loại táo bạo, tạo ra một điểm đầu mối thực sự.

0143 04 the autumn film Tạo điểm tiêu cự trong thiết kế web của bạn

Sandstone cho thấy lý do tại sao nhãn hiệu hàng hoá cung cấp một điểm quyến rũ đầu mối.

0143 11 sandstone Tạo điểm tiêu cự trong thiết kế web của bạn

Sự đa dạng trong kích cỡ phông chữ có thể làm rất nhiều, nhưng màu sắc là những gì thực sự thu hút mắt. Các tiêu đề trên trang web cho Hội nghị thượng đỉnh Gaming Flash 2011 là một ví dụ tốt.

0143 05 flash gaming summit Tạo điểm tiêu cự trong thiết kế web của bạn

Minh họa

Các thành phần đồ họa chuyển tải thông điệp một cách nhanh chóng và không cần mô tả nhiều. Họ cũng làm việc như các móc hình ảnh để thu hút sự chú ý của người dùng.Nó cũng có thể được sử dụng để hiển thị các bước trong một quá trình, để mô tả một cách sinh động và đáng nhớ. Hầu hết thời gian, các yếu tố đồ họa là những viên đạn bạc: tiết kiệm cho họ đúng thời điểm và không lạm dụng chúng.

WPCoder có một điểm tiêu cự thích hợp và mô tả. Đó là một vẻ đẹp.

0143 06 wp coder Tạo điểm tiêu cự trong thiết kế web của bạn

Trang chủ cho Bet your followers có một vài tiêu điểm, nhưng hình minh họa chính (khỉ đột) là chủ yếu và hướng dẫn mắt đến các điểm khác. Chú ý cánh tay của nó và không gian chỉ dưới đây chúng – một ví dụ tốt về làm thế nào để xử lý một số điểm tiêu cự.

0143 07 bet your followers Tạo điểm tiêu cự trong thiết kế web của bạn

Acid Aka có một thiết kế đẹp, nhưng việc thiếu một đầu mối cụ thể là một hạn chế .

0143 08 aka acid Tạo điểm tiêu cự trong thiết kế web của bạn

Buttons

Một trong những yếu tố phổ biến nhất trong thiết kế web trong những năm gần đây là các nút gọi hành động. Các nút bấm lớn trên trang web của hầu hết các. Chúng có hiệu quả cao tầm nhìn của họ (do kích thước của chúng), quen thuộc và ghi nhãn mô tả. Buttons là những yếu tố hấp dẫn, nhưng sử dụng quá nhiều hoặc lạm dụng sẽ làm giảm hiệu quả của họ.

Trên Fatburgr , hai nút đơn giản, gây sự chú ý của người dùng. Kích thước và màu sắc của họ có hiệu quả.

0143 09 fatburgr Tạo điểm tiêu cự trong thiết kế web của bạn

SolidShops sử dụng các nút rõ ràng và rõ ràng để tạo điểm nhấn ở trên và dưới nếp gấp.

0143 10 solidshops Tạo điểm tiêu cự trong thiết kế web của bạn

Khoảng trắng

Sử dụng khoảng trắng là một trong những cách đơn giản để vẽ mắt đến các khu vực cụ thể của trang mà không cần đến các yếu tố có thể nhìn thấy.

Apple sử dụng khoảng trắng hoàn hảo để làm cho sản phẩm tính năng rõ ràng.

0143 12 apple Tạo điểm tiêu cự trong thiết kế web của bạn

Hỏi lượt truy cập tại chỗ bằng cách để lại đủ khoảng trắng xung quanh hộp tìm kiếm.

0143 13 ask Tạo điểm tiêu cự trong thiết kế web của bạn

Trang trí nội thất

Một cách để phân biệt một cái gì đó từ môi trường xung quanh của nó là sử dụng trang trí đơn giản. Màu sắc và định vị đi một chặng đường dài hướng tới việc tạo ra các hiệu ứng tuyệt vời, và hiệu quả của các yếu tố khác phụ thuộc rất nhiều vào những yếu tố cơ bản được sử dụng.

3rdM , điều duy nhất mà ngay lập tức thu hút sự chú ý là màu xanh. Sau đó, mắt mục lớn nhất giữa các biểu tượng màu xanh. Đơn giản nhưng hiệu quả.

0143 14 3rdm Tạo điểm tiêu cự trong thiết kế web của bạn

Phần của trang là lớn nhất và có độ tương phản cao nhất trong màu sắc nổi bật nhất.

UXMagazine có một vài tiêu điểm trên các cấp độ khác nhau .

0143 15 ux magazine Tạo điểm tiêu cự trong thiết kế web của bạn

Như minh chứng bởi Train-ee , những đám mây từ khóa là một cách tốt để bố trí các điểm tiêu cự kích thước .

0143 16 trainee Tạo điểm tiêu cự trong thiết kế web của bạn

Cơ bản trang trí có thể đưa ra một số yếu tố trong văn bản. Dan Viveiros ‘trang web được tối giản và cơ bản, nhưng nó hoạt động.

0143 17 dan viveiros Tạo điểm tiêu cự trong thiết kế web của bạn

Các trang như thế này Typography Bài viết phân tâm người sử dụng; mắt không còn chỗ để nghỉ ngơi, và thẳng thắn, đó là khó hiểu.

0143 18 post typography Tạo điểm tiêu cự trong thiết kế web của bạn

Kết luận

Mỗi trang web đã trình bày một cái gì đó hữu ích và hấp dẫn người sử dụng. Một loạt các phương pháp có thể được sử dụng để nhấn mạnh các phần nhất định của một trang web, và tôi đã đi qua một số trong số họ với bạn.

(GMD sưu tầm)