• Giới thiệu
    • Multimedia
    • Arena Multimedia
    • Tại sao chọn Arena Multimedia?
    • Cơ sở vật chất
    • Cộng đồng nói về Arena
    • Nhân vật truyền cảm hứng
    • Hỏi & đáp
  • Đào tạo tuyển sinh
    • Đào tạo
    • Chương trình đào tạo
    • Phương pháp đào tạo
    • Học phí
    • Tuyển sinh
    • Kết quả thi tuyển
    • Thông tin tuyển sinh
    • Lịch tuyển sinh
    • Tài liệu tuyển sinh
    • Đề thi mẫu
  • Gallery
    • Đội ngũ giảng viên
    • Đồ án nổi bật
    • Hoạt động học viên
    • Arena Face
    • Học viên tiêu biểu
    • Câu chuyện học viên
    • Portfolio học viên
  • Tin tức – sự kiện
    • Tin tức
    • Tin Arena
    • Tin Multimedia
    • Tin Báo chí
    • Sự kiện
  • Liên thông – Việc làm
    • Đối tác liên thông
    • Hỗ trợ tuyển dụng
    • Nghề nghiệp
    • Tin tuyển dụng
  • Liên hệ
  • Giới thiệu
    • Multimedia
    • Arena Multimedia
    • Tại sao chọn Arena Multimedia?
    • Cơ sở vật chất
    • Cộng đồng nói về Arena
    • Nhân vật truyền cảm hứng
    • Hỏi & đáp
  • Đào tạo tuyển sinh
    • Đào tạo
    • Chương trình đào tạo
    • Phương pháp đào tạo
    • Học phí
    • Tuyển sinh
    • Kết quả thi tuyển
    • Thông tin tuyển sinh
    • Lịch tuyển sinh
    • Tài liệu tuyển sinh
    • Đề thi mẫu
  • Gallery
    • Đội ngũ giảng viên
    • Đồ án nổi bật
    • Hoạt động học viên
    • Arena Face
    • Học viên tiêu biểu
    • Câu chuyện học viên
    • Portfolio học viên
  • Tin tức – sự kiện
    • Tin tức
    • Tin Arena
    • Tin Multimedia
    • Tin Báo chí
    • Sự kiện
  • Liên thông – Việc làm
    • Đối tác liên thông
    • Hỗ trợ tuyển dụng
    • Nghề nghiệp
    • Tin tuyển dụng
  • Liên hệ
Đăng ký
Trang chủTin tức - sự kiệnTin Multimedia5 nguyên tắc thiết kế Website hiệu quả

5 nguyên tắc thiết kế Website hiệu quả

Post on Thứ Hai, 31-03-2014 -
Lượt xem: 408
  • Facebook
  • Twitter
  • LinkedIn
  • Copy Link

Làm thế nào để có thiết kế web hiệu quả? Arena Multimedia xin đưa ra 5 nguyên tắc mà chắc chắn bạn phải nghía qua trước khi bắt tay vào công việc thiết kế web của mình!

Thiết kế web đã có nhiều cải thiện đáng kể trong nhiều năm qua và ngày càng thân thiện với người dùng và hấp dẫn hơn. Trong rất nhiều năm qua, có thể thấy rằng để có được một thiết kế web hiệu quả thì thiết kế cần tập trung vào các ứng dụng và tương tác với người dùng. Thiết kế độc đáo hiện đại không cho phép trò chuyện với khách truy cập và các quảng cáo chớp nhoáng. Chúng tôi đã học được cách trò chuyện với khách truy cập, kéo họ vào các cuộc thảo luận và lấy được lòng tin của họ bằng cách giải quyết nhu cầu của họ và đưa ra những giải pháp trung thực và thẳng thắng cho khách hàng.

Bài viết này nhấn mạnh 5 nguyên tắc, phương pháp và cách tiếp cận để Thiết kế web hiệu quả- những phương pháp tiếp cận, sử dụng hiệu quả, giúp bạn có những thiết kế tinh tế hơn và đơn giản hóa việc trình bày thông tin.

Bạn có thể xem thêm các bài viết liên quan:

– 10 Usability Nightmares giới thiệu các hình thức thiết kế bạn nên tránh khi thiết kế các website chức năng.

– 30 Usability Issues giải thích các quy tắc khái niệm, vấn đề khả năng sử dụng quan trọng thường bị lãng quên, lờ đi hoặc hiểu sai.

Nội dung bài viết

  • 1. Dùng nguyên tắc Marketing hiệu quả
    • 2. Trải nghiệm với một chút màu sắc
  • 3. Sự cân bằng
  • 4. Sự rõ ràng
  • 5. Quan tâm đến nhu cầu người sử dụng
  • Kết luận
      • CÓ THỂ BẠN QUAN TÂM

1. Dùng nguyên tắc Marketing hiệu quả

Để bán một sản phẩm hoặc dịch vụ bạn cần tương tác hiệu quả với khách truy cập ngẫu nhiên của trang web. Khi khách truy cập dùng trang web của bạn, họ sẽ muốn nghe bạn và tìm hiểu những gì bạn cung cấp. Vậy, làm thế nào để bạn có thể tiếp cận những khách hàng tiềm năng nhằm tối đa hóa lợi nhuận?

Theo gợi ý của Strong năm 1925, AIDA là một mô hình marketing hiệu quả, nó mô tả một loạt các bước mà một người bán sản phẩm hay dịch vụ cần có:

A – Attention (Awareness): thu hút sự chú ý của khách hàng.

I- Interest: thu hút sự quan tâm của khách hàng bằng các tính năng, lợi thế và lợi ích.

D – Desire: thuyết phục khách hàng rằng bất cứ sản phẩm hoặc dịch vụ nào mà họ muốn thì công ty đều có thể đáp ứng nhu cầu.

A – Action: hướng khách hàng đến việc xem và mua hàng.

Ngày nay, chúng ta còn thêm một số ký tự vào hình thức này –  AIDA(S): S-Satisfaction- làm hài lòng khách hàng để họ trở thành khách hàng thân thiết và giới thiệu sản phẩm của bạn đến người khác.

Đối với mô hình AIDA, những khách hàng tiềm năng đang mua sản phẩm hoặc dịch vụ mà họ không thật sự cần thiết. Vì vậy, để có được lòng tin từ khách hàng, các nhà thiết kế web cần chắc chắc rằng website cung cấp thông tin trung thực để nội dung không bị hiểu sai lệch theo một hướng khác.

Mô hình này cũng sẽ hiệu quả hơn nếu bạn có thể cung cấp cho khách truy cập các tham số, tình trạng và ý tưởng cụ thể về việc làm thế nào một sản phẩm hay dịch vụ có thể được sử dụng để thay thế các slogan quảng cáo lớn mà vô nghĩa.

Arena Multimedia, học thiết kế, học đồ họa,

Cân nhắc cách trình bày ở ví dụ trên traffik theo nguyên tắc AIDA. Nếu khách truy cập mong đợi một thông tin về Hệ thống quản lý nội dung, thì sự mong đợi của họ sẽ ngay lập tức được đáp ứng bằng phản hồi với lời giới thiệu ngắn gọn ở đầu trang web. Như vậy, website sẽ thu hút khách hàng tiềm năng và duy trì trên trang web (Attraction, a). Sự quan tâm sau đó sẽ tăng lên bằng cách chỉ ra các tính năng và lợi ích của sản phẩm (Interest, i).

Để biết dịch vụ làm hài lòng nhu cầu của người sử dụng ở mức độ nào, thì có thể dựa vào bản điều tra thông tin ở dưới cuối trang (Desire, d). Cuối cùng người sử dụng được hướng dẫn đến nút bấm “Take the tour” và “Free 30 day trial” sẽ dẫn khách hàng đến mua sản phẩm (Action, a).

Ngoài ra còn có rất nhiều mô hình để bán hàng khác được biết như công thức BOSCH (được phát triển bởi Peter Hubert):

Be inquisitive: đưa ra các câu hỏi mở.

Offer solutions: đưa ra những lợi ích kết quả cuối cùng cho khách hàng.

Stimulate the senses, để khách hàng dùng thử sản phẩm.

Cross your sales, suy nghĩ các sản phẩm cần thiết có liên quan.

Hit the closing point, bán sản phẩm khi khách hàng đã sẵn sàng mua.

2. Trải nghiệm với một chút màu sắc

Phần nội dung màu sẫm trên background màu trắng và nội dung màu sáng trên background màu đen rất nhàm chán. Màu sắc của Vibrant đã giúp nổi bật một số yếu tố cụ thể của trang web mà bạn muốn nhấn để thu hút sự chú ý của người dùng.

Tuy nhiên bạn không cần dùng bảng màu Virbrant để tạo hiệu ứng Thiết kế web. Đôi khi sẽ rất hữu ích nếu bạn chọn số lượng màu sắc vừa phải và sử dụng chúng hiệu quả thay vì chọn thật nhiều màu và làm thiết kế của mình trở nên “lóa mắt”. Vì vậy khách truy cập sẽ ngay lập tức nhận thấy cái gì là quan trọng. Nó cũng giúp bạn có thể tập trung sự chú ý của người sử dụng vào khu vực quan trọng nhất của trang web một cách dễ dàng hơn.

Arena Multimedia, học thiết kế, học đồ họa,

Sidebarecreative.com chỉ dùng duy nhất bản màu Vibrant- màu xanh cho các đường link, các nút bấm và những chỗ cần click chuột. Màu trắng dùng để tóm tắt các nội dung quan trọng của trang. Phần nội dung còn lại của trang web đều sử dụng hiệu ứng di chuột có ánh sáng xanh. Cách sử dụng màu sắc tuyệt vời, hiện đại và hữu dụng đã tạo nên hiệu quả sử dụng.

Arena Multimedia, học thiết kế, học đồ họa,

Wilson Miner sử dụng màu xanh lá, xanh dương và màu hồng. Màu xanh lá chiếm ưu thế giúp cấu trúc web trông tươi mới và thoải mái. Màu xanh dương được dùng để đặt ở các đường link, màu hồng cho hiệu ứng di chuột. Lưu ý cấu trúc của trang web. Mặc dù chỉ có một vài màu sắc được sử dụng, nhưng bạn có thể ngay lập tức nhận ra đâu là khu vực cho những cú lick chuột và đâu là các phần khác nhau của trang web.

3. Sự cân bằng

Sự cân bằng trong thiết kế trang web rất quan trọng bởi nó cung cấp cho người sử dụng một cảm giác ổn định và lâu dài. Thiết kế cân bằng sẽ giúp việc sử dụng dễ dàng hơn và cũng dễ hiểu hơn bởi nó tạo ra hệ thống hiển thị phân cấp hình ảnh rõ ràng giữa những điều quan trọng và ít quan trọng trên trang web.

Arena Multimedia, học thiết kế, học đồ họa,

Thiết kế của Apple là một trong những ví dụ tuyệt vời nhất của sự cân bằng đối xứng (hay còn gọi là formal). Sắp xếp theo cách các yếu tố thiết kế duy nhất có chất lượng riêng biệt (ở trên) hoặc các thiết kế tương tự nhau (ở dưới). Chúng được thiết kế cân bằng hai bên đường thẳng tưởng tượng ở giữa màn hình. Thiết kế tĩnh và thuận tiện này làm khách truy cập dễ dàng tìm hiểu các thông tin. Kết quả: thiết kế đối xứng tạo nên cách bố trí hình ảnh đơn giản.

Tại sao thiết kế của Apple lại hiệu quả? Bởi nó đặt sản phẩm và người sử dụng làm trung tâm. Trang web thiết kế của Apple trông giống sân khấu nhà hát, nơi khách truy cập là khán giả và sản phẩm là các nghệ sỹ. Hãy nhớ rằng trang web trình bày các sản phẩm chứ không phải trưng bày các thứ khác. Apple đã sắp xếp theo những lựa chọn quan trọng nhất.

Signalfeuer.info lại dùng thiết kế web cân bằng không đối xứng (informal) cho phép sử dụng không gian trống linh động hơn (có lẽ đó là lợi thế của sự cân bằng không đối xứng). Các khối bên trái nhỏ hơn bên phải, tuy nhiên trang web cũng tạo ra sự cân bằng bằng cách sử dụng lưới cân bằng đầy ấn tượng. Ngoài ra việc lựa chọn màu sắc của website này cũng khá ấn tượng.

Theo bài viết Principles of Design, “cân bằng không đối xứng có thể không tương đồng nhau ở vị trí và chức năng. Để tạo sự cân bằng không đối xứng, thì cần phải gia tăng chức năng. Chức năng có thể tăng lên bằng cách thay đổi kích thước, hình dạng hoặc tone màu. Với một thiết kế cụ thể, các nhà thiết kế có thể chọn vị trí các yếu tố cho một bên bức tranh web. Không gian trống đối lập phải trở thành lực cân bằng của thiết kế”

Đó là chính xác những gì được thực hiện trên trang web Avalonstar.com. Hãy chú ý sự khác nhau giữa hình thù của các khối cũng như việc “treo” tiêu đề của các khối . Những không gian trống có chức năng cân bằng khối nội dung được trình bày phía bên phải.

Grid-based approach (Cách tiếp cận dựa trên thiết kế dạng lưới) có thể hữu ích và thậm chí là cần thiết để có một bố cục web cân bằng.

4. Sự rõ ràng

Hoàn toàn độc lập với phương pháp thiết kế, sự rõ ràng của tất cả layout và thông tin trình bày được xem là ưu tiên cao nhất trong quá trình thiết kế. Nếu như các tiêu đề có thể bị hiểu sai hoặc chưa rõ ràng cần chắc chắn loại bỏ chúng hoặc phải giải thích một cách cụ thể, càng chi tiết càng tốt.

Để tạo sự rõ ràng, bạn không cần thiết kế phải sử dụng các layout tiêu chuẩn hay các mẫu cơ bản. Hãy mạo hiểm thử nghiệm các mẫu thiết kế nếu bạn muốn nhưng hãy giữ cho hệ thống phân cấp hình ảnh và cấu trúc nội dung được rõ ràng. Bạn càng sắp xếp rõ ràng, khách truy cập càng dễ dàng tìm hiểu thông tin trang web của bạn.

Hovie.com là một trang web đã đưa ra một phương pháp thiết kế khác thường nhưng lại rất rõ ràng. Trang web gồm 5 khối, khối đầu tiên là menu chính hiển thị khi trang web đang load. Menu phụ xuất hiện khi menu chính được chọn. Vị trí hiện tại mà bạn đang ở được hiển thị bằng những mũi tên cạnh chức năng chọn trên menu chuyển hướng. Ở khu vực nội dung là một bản mô tả ngắn gọn với các hình ảnh có chú thích. Thiết kế đồng nhất ở tất cả các trang. Bạn có thể hiểu sai thiết kế? Không, nó đơn giản, rõ ràng và hiệu quả.

Một ví dụ khác là Astheria.com, nó tập trung vào không gian màu trắng và có bố cục dạng lưới. Mặc dù thiết kế khá tinh tế và sử dụng màu sắc hấp dẫn, bạn có thể thấy ngay lập tức mình đang ở đâu và những mục tùy chọn nào có sẵn. Sức mạnh của typography luôn là tốt nhất. Nhưng đáng tiếc là website này không hiển thị các đường link mà bạn vừa ghé thăm.

5. Quan tâm đến nhu cầu người sử dụng

Là một web-developer, nhiệm vụ chính của bạn là tạo sự thoải mái cho khách truy cập, giải quyết nhu cầu của họ và cung cấp đủ các chức năng để có thể chuyển hướng liên tục. Tuy nhiên, để đạt được những điều này bạn cần phải cần làm nhiều hơn là chỉ dùng một cấu trúc bình thường cho người sử dụng để làm hài lòng họ.

Để tối đa hóa việc truy cập trang web, bạn cần xem xét đến các profile và các kiểu khách truy cập khác nhau. Từ đó bạn cần xác định các nhóm chính và đưa ra được các chức năng mà những thành viên của mỗi nhóm đều cảm thấy hài lòng. Điều đó không có nghĩa là bạn cần tạo nhiều phiên bản khác nhau cho trang web, đơn giản là bạn có thể tích hợp nhiều tương tác với người dùng trong một layout duy nhất

Ví dụ, theo nguyên tắc Shneiderman trong thiết kế giao diện người dùng, quan trọng là bạn có thể cho phép người dùng có thể thường xuyên sử dụng shortcut để tăng tốc độ của chữ viết tắt, sử dụng các phím đặc biệt và lệnh ẩn.

Ffffound.com cung cấp cả chuyển hướng thông thường và chuyển hướng bằng bàn phím trên Javascript. Những người mới sử dụng không thể trực tiếp nhìn thấy chức năng này bằng các trình duyệt bình thường. Tuy nhiên, những người dùng nâng cao có thể chuyển hướng hiệu quả hơn. Tất nhiên, bạn cần chỉ cho người dùng biết cách sử dụng bất kỳ chức năng nâng cao nào và lợi ích của chúng một cách rõ ràng.

Một số công cụ khác như Bookmarklets, các toolbar và một số công cụ đặc biệt như Flickr. Những công cụ này giúp bạn cung cấp cho người sử dụng cách tiếp cận dịch vụ của bạn dễ dàng hơn và họ sẽ không cần phải tìm kiếm giải pháp thay thế.

Kết luận

Thiết kế web hiệu quả không chỉ là màu sắc và đẹp mà còn cần rõ ràng và trực quan. Hãy chắc chắn rằng bạn có thể giúp khách truy cập hiểu được lợi ích và cách sử dụng của trang web.

Thiết kế web cân bằng đối xứng hay cân bằng không đối xứng có thể là một giải pháp thiết kế hữu ích trong việc tạo ra một giải pháp thiết kế chắc chắn và rõ ràng từ đó cung cấp nền tảng giúp  tương tác người dùng trở nên phong phú. Để tối đa hóa tương tác, hãy xem xét những kiểu người dùng khác khau và mức độ tương tác tương ứng để họ có thể truy cập trang web của bạn một cách dễ dàng và thuận tiện nhất.

Nguồn: designs.vn

CÓ THỂ BẠN QUAN TÂM

Hoc-thiet-ke-top-10-ly-do-chon-nghe-thiet-ke-do-hoa Học thiết kế: Top 10 lý do chọn nghề thiết kế đồ họa Tin tức Arena Multimedia Học thiết kế không chỉ làm thiết kế arena-multimedia-hai-dao-dien-viet-duoc-vhon-vao-cho-du-an-o-lien-hoan-phim-busan Phim của thầy Đỗ Quốc Trung nổi bật tại LHP Busan arena-multimedia-thay-tran-quoc-loi Thầy Trần Quốc Lợi – Người thầy “bảo hành trọn đời”  arena_multimedia_ban_da_biet_ve_quy_trinh_thiet_ke_ux Bạn đã biết về quy trình thiết kế UX? Arena Multimedia: Thông báo tuyển sinh tháng 02/2015 Arena-multimedia-chao-don-thanh-vien-moi-tran-day-nang-luong-va-dam-me Arena Multimedia chào đón thành viên mới tràn đầy năng lượng và đam mê Tìm hiểu về hội họa Sắp diễn ra hội nghị Aptech Việt Nam năm 2015  arena-multimedia-do-an-hoc-vien Đồ án cuối Kỳ: Sản phẩm được đầu tư kỹ lưỡng, tính ứng dụng cao


Bài viết nổi bật

“Vũ khí” giúp sinh viên thiết kế chinh phục nhà tuyển dụng ngay sau khi tốt nghiệp

Tin Arena Post on Thứ Ba, 30-05-2023
Chính là portfolio “khủng” cho thấy tay nghề vững vàng và tính linh hoạt được trui rèn trong quá trình học tập và thực hiện đồ án tại Arena Multimedia. 

Multimedia Design và 5 lầm tưởng khiến bạn băn khoăn trước khi học

Tin Báo chí Post on Thứ Hai, 29-05-2023
Mỹ thuật Đa phương tiện (MTĐPT) đã được xuất hiện từ khá lâu tại Việt Nam, trở thành ngành nghề xu hướng và là lựa chọn “top of mind” của thế hệ trẻ đang đứng trước ngưỡng cửa chọn ngành, chọn nghề. Tuy nhiên, có rất nhiều bạn chưa thực sự tìm hiểu chuyên sâu...

Arena Multimedia tuyển sinh 2.000 học viên ngành Thiết kế Mỹ thuật Đa phương tiện

Tin Arena Post on Thứ Ba, 18-04-2023
Arena Multimedia tuyển sinh chỉ tiêu 2.000 học viên chuyên ngành Thiết kế Mỹ thuật Đa phương tiện (MTĐPT) trên toàn quốc trong năm 2023. Tiếp nối gần 2 thập kỷ đào tạo chuyên sâu và toàn diện ngành MTĐPT, Arena Multimedia khởi động mùa tuyển sinh mới, sẵn sàng chào đón 2.000 sinh viên...

Xem thêm
Post on Thứ Ba, 30-05-2023

Top 6 bí quyết giúp Designer “bán” thiết kế thành công

Bất kỳ Designer nào cũng mong muốn sản phẩm của bản thân sẽ được khách hàng lựa chọn. Tuy nhiên, sự “bất đồng ngôn ngữ” trong quá trình thể hiện...
Tin Multimedia
Post on Thứ Hai, 29-05-2023

Top 5 quy tắc phối màu cho các thiết kế ứng dụng di động

Sự đơn giản từ màu sắc gợi nên vô vàn cảm xúc nơi người xem. Khả năng kích thích tuyệt vời từ các sắc độ đã trở thành yếu tố...
Tin Multimedia
Post on Thứ Hai, 29-05-2023

Logo Redesign: Những yếu tố cần xem xét trước khi thực hiện

Logo Redesign (thiết kế lại logo) là vấn đề quan trọng đối với mỗi thương hiệu. Sự thân thuộc, dễ ghi nhớ của phiên bản trước đó trở thành thử...
Tin Multimedia
Post on Thứ Sáu, 12-05-2023

Thiết kế Brand Guideline online và 5 lợi ích nhất định bạn phải biết

Bạn đã bao giờ thử thiết kế Brand Guideline online? Nếu chưa, chắc chắn bạn nên thử một lần đấy. Và trước khi thử, bạn cần xem ngay 5 lợi...
Tin Multimedia
Post on Thứ Tư, 10-05-2023

Xây dựng trang web Portfolio đầu tiên của bạn: 5 nguyên tắc thiết kế nhất định phải biết

Có những nguyên tắc thiết kế bạn nên lưu tâm để có được một trang web portfolio ấn tượng.
Tin Multimedia
Post on Thứ Bảy, 06-05-2023

7 kỹ thuật storytelling giúp Portfolio sống động hơn bao giờ hết

Liệt kê một cách nhàm chán vô vàn dự án thiết kế trong Portfolio có khiến bạn đánh mất cơ hội trước nhà tuyển dụng hay khách hàng? Đối tượng...
Tin Multimedia
Nhập thông tin tại form. Bạn cho phép chúng tôi sử dụng thông tin cá nhân vào mục đích tư vấn hướng nghiệp, thông báo về học bổng.

TP.HCM

Nguyễn Đình Chiểu

212-214 Nguyễn Đình Chiểu, P. Võ Thị Sáu, Q. 3

Tel: 1800 1525

Email: [email protected]

Hồ Văn Huê

43R/12 Hồ Văn Huê, P. 9, Q. Phú Nhuận

Tel: 1800 6325

Email: [email protected]

Tân Bình

Số 6 Tân Kỳ Tân Quý (gần Etown), P.15, Q.Tân Bình

Tel: 1800 2074

Email: [email protected]

Lê Tuấn Mậu

136 Lê Tuấn Mậu, P.13, Q.6

Tel: 1800 2046

Email: [email protected]

HÀ NỘI

Trúc Khê

80 Trúc Khê, P. Láng Hạ, Q. Đống Đa

Tel: 1800 1542

Email: [email protected]

Phạm Văn Bạch

D29 Phạm Văn Bạch, P. Yên Hòa, Q. Cầu Giấy

Tel: 1800 1542

Email: [email protected]

Trần Phú

110 Trần Phú, P. Mộ Lao, Q. Hà Đông

Tel: 1800 1542

Email: [email protected]

NHẬN ARENA YEARBOOK

DMCA.com Protection Status
© 2020, ARENA MULTIMEDIA
  • Arena Multimedia
  • Đăng ký học
  • Liên hệ
  • Sitemap
  • Arena Multimedia
  • Đăng ký học
  • Liên hệ
  • Sitemap