SEO là gì?

<h3 style="background-color: white; border-bottom-color: rgb(247, 247, 247); border-bottom-style: solid; border-bottom-width: 1px; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; line-height: 48px; margin: 12px 0px; text-rendering: optimizelegibility;"></h3><div>Với thời đại CNTT hiện nay, xu hướng phát triển trên website nói chung cũng như đặc biệt là các loại thương mại điện tử trên internet thì việc phát triển website là hết sức quan trọng.</div><div>Đi kèm với đó là công cụ tìm kiếm <a href="http://google.com.vn/">google.com</a>, Vậy làm sao để website của bạn tối ưu cho việc tìm kiếm của công cụ tìm kiếm? Đó chính là định nghĩa của <a href="http://studycoding.blogspot.com/">SEO</a>.</div><div><br /></div><h3 style="background-color: white; border-bottom-color: rgb(247, 247, 247); border-bottom-style: solid; border-bottom-width: 1px; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; font-size: 28px; line-height: 48px; margin: 12px 0px; text-rendering: optimizelegibility;">SEO là gì?</h3><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Tất nhiên là chúng ta không ăn trực tiếp được rồi, nhưng nó sẽ giúp chúng ta đạt được những “miếng ăn” theo cả nghĩa đen và nghĩa bóng. Trước tiên, bạn hãy nhìn tấm ảnh dưới đây:</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;"><a href="http://i1199.photobucket.com/albums/aa474/thachheo/tpb/seo-la-gi.jpg" rel="lightbox nofollow" style="-webkit-transition: all 0.3s; color: #5e5b5b; font-weight: bold; text-decoration: none; transition: all 0.3s;" target="_blank" title=""><img alt="Giải thích về SEO" class="aligncenter" height="518" pagespeed_url_hash="1252486823" src="http://i1199.photobucket.com/albums/aa474/thachheo/tpb/seo-la-gi.jpg" style="border: 0px; display: block; height: auto; margin: 0px auto; max-width: 100%; vertical-align: middle;" title="Định nghĩa về SEO" width="837" /></a></div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Nhìn thì ai cũng biết đó là những kết quả khi ta tìm kiếm với từ khóa “<em>nghe nhac</em>“, những kết đầu tiên của trang tìm kiếm hầu như toàn những website nghe nhạc hàng đầu Việt Nam. Nhưng các bạn có bao giờ tự hỏi rằng tại sao những trang đó được đưa đầu? Vì đó là những website nổi tiếng và nhiều người truy cập ư? Cũng đúng thôi, nhưng bạn thấy đó, NhacCuaTui cũng nhiều người truy cập và thậm chí còn tốt hơn trang nhac.vui.vn mà tại sao nó chỉ nằm hạng 3? Sự khác biệt ở đây đó chính là những phương pháp tăng thứ hạng trên máy tìm kiếm, hay còn gọi theo đúng cụm từ chuyên môn của nó là <strong>SEO</strong>.</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;"><span style="color: #3366ff;"><strong>SEO</strong></span> là chữ viết tắt của cụm từ <strong>Search Engine Optimization</strong> (dịch theo nghĩa tiếng Việt là <strong>Tối ưu hóa máy tìm kiếm</strong>). Công việc SEO nghĩa là phân tích phương thức hoạt động và các thuật toán của máy tìm kiếm và sử dụng một số thủ thuật đơn giản hoặc phức tạp để cải thiện thứ hạng của website trên một số từ khóa nhất định. Ngắn gọn và dễ hiểu đúng không nào.</div><h3 style="background-color: white; border-bottom-color: rgb(247, 247, 247); border-bottom-style: solid; border-bottom-width: 1px; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; font-size: 28px; line-height: 48px; margin: 12px 0px; text-rendering: optimizelegibility;">Các máy tìm kiếm hoạt động như thế nào?</h3><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Trước khi nghiên cứu về SEO thì tất cả chúng ta đều phải biết sơ qua phương thức hoạt động của các máy tìm kiếm để thu thập nội dung trên các website, từ đó giai đoạn học SEO của bạn sẽ nhanh hơn và áp dụng chính xác hơn.</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Các máy tìm kiếm sẽ có những “robot” (hay còn gọi là bot, spider..v.v..)  tìm kiếm có nhiệm vụ là đi “lùng sục” các website mà nó biết rồi tiến hành thu thập dữ liệu. Bạn phải nhớ rằng, bot tìm kiếm không giống như một con người thực thụ mặc dù bot tìm kiếm hiện nay khá thông minh so với các phiên bản vài năm trước nhưng sự thật thì nó vẫn là một cỗ máy và làm việc theo một trình tự nhất định.<br /><a href="http://thachpham.com/wp-content/uploads/2012/09/search_engines.jpg" rel="lightbox" style="-webkit-transition: all 0.3s; color: #5e5b5b; font-weight: bold; text-decoration: none; transition: all 0.3s;"><img alt="" class="alignright size-medium wp-image-2051" height="300" pagespeed_url_hash="2155886023" src="http://thachpham.com/wp-content/uploads/2012/09/263x300xsearch_engines-263x300.jpg.pagespeed.ic.w1J7Dm8Sc-.jpg" style="border: 0px; float: right; height: auto; margin-left: 20px; max-width: 100%; vertical-align: middle;" title="Cách thức hoạt động của bot tìm kiếm" width="263" /></a>Các trình tự đó bao gồm thu thập dữ liệu (<strong>crawling</strong>) thông qua nội dung HTML của website theo thứ tự từ trên xuống dưới để xem tất cả những nội dung gì mà website đang có. Các bot tìm kiếm có thể tiếp tục crawl từ trang này đến trang khác thông qua các liên kết (có thể gọi là Sơ đồ liên kết). Nghĩa là nếu như website của bạn được liên kết chặt chẽ với nhau thì bot tìm kiếm sẽ crawl được nhiều trang hơn vì   chúng có mặt trên website chỉ trong một thời gian nhất định. Ngược lại, vì bot không phải là người thật nên chúng chỉ đọc dược các nội dung thông qua văn bản thông thường, hoàn toàn không thể xem flash hay javascript hoặc các thư mục được <a href="http://thachpham.com/tag/bao-mat" style="-webkit-transition: all 0.3s; color: #5e5b5b; font-weight: bold; text-decoration: none; transition: all 0.3s;" title="bảo mật">bảo mật</a>. Điều này có nghĩa là nếu bot tìm kiếm không thể crawl những trang nào thì các trang đó sẽ không thể xuất hiện trên trang tìm kiếm của nó (Google, Yahoo, Bing…v.v..).</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Sau khi các bot tìm kiếm thu thập được những dữ liệu cần thiết, bước kế tiếp của nó là tiến hành lập chỉ mục (<strong>indexing</strong>) các trang của website. Các trang được lập chỉ mục sẽ được lưu trữ vào một kho dữ liệu khổng lồ trên máy tìm kiếm, sau này các trang được lưu ở đó sẽ được lấy ra để hiển thị trên các kết quả tìm kiếm sau khi đã tiến hành phân tích và áp dụng một số thuật toán. Các bot tìm kiếm sẽ dựa vào một vài yếu tố nhất định để xem có nên đưa một liên kết nào đó lên trang kết quả của máy tìm kiếm (<em>Search Engine Results Page</em> - <strong>SERP</strong>) hay không. Chính vì lẽ thế, công việc của những người làm SEO sẽ tiến hành tối ưu hóa các liên kết để nó đạt thứ hạng cao hơn trong kết quả tìm kiếm (xuất hiện ở 10 kết quả đầu tiên).</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Mỗi khi có một yêu cầu tìm kiếm nào từ người dùng, máy tìm kiếm sẽ bắt đầu xử lý các truy vấn đó. Nghĩa là so sánh các truy vấn tìm kiếm (<strong>search query</strong>) với các trang đã được đánh chỉ mục trong cơ sở dữ liệu của nó. Khi có bất kỳ truy vấn tìm kiếm nào được thực thi, thực tế là có hàng triệu hoặc hàng tỷ trang có chứa những nội dung liên quan, lúc đó máy tìm kiếm sẽ bắt đầu áp dụng một số thuật toán để tính toán giá trị nội dung phù hợp với các truy vấn tìm kiếm nhất để có thể được hiển thị.</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Mỗi máy tìm kiếm đều có những thuật toán khác nhau để tính toán các nội dung phù hợp. Mỗi thuật toán đều có những vai trò khác nhau để phân tích các nội dung phù hợp dựa vào mật độ từ khóa (<strong>Keyword Density</strong>), liên kết (<strong>Links</strong>) hoặc các thẻ meta trong nội dung HTML (<strong>Metatags</strong>). Đó là lý do tại sao mà các cỗ máy tìm kiếm Google, Yahoo hay Bing đều đưa ra những kết quả khác nhau mặc dù chúng ta chỉ tìm kiếm trên tất cả chỉ với một từ khóa duy nhất. Ngoài ra, có một thực tế quan trọng mà bạn cần phải biết đó là <strong>các thuật toán của nó luôn được thay đổi liên tục</strong>, vì vậy nếu muốn trang của bạn luôn luôn được hiển thị ở những trang đầu tiên thì cần phải áp dụng một số thủ thuật để thay đổi website sao cho thích ứng với các thuật toán mới. Đây là một trong những yếu tố mấu chốt đối với những người làm nghề SEO nhằm cạnh tranh khách hàng.</div><h3 style="background-color: white; border-bottom-color: rgb(247, 247, 247); border-bottom-style: solid; border-bottom-width: 1px; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; font-size: 28px; line-height: 48px; margin: 12px 0px; text-rendering: optimizelegibility;">Lợi ích của SEO</h3><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">SEO bao gồm rất nhiều lợi ích mà nếu bạn đang là một nhà phát triển website hay đầu tư thì không nên bỏ qua nó. Nếu như bạn vẫn còn hoài nghi về các lợi ích của SEO mang lại thì hãy cùng mình điểm qua một vài ví dụ dưới đây.</div><h4 style="background-color: white; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; font-size: 20px; line-height: 24px; margin: 12px 0px; text-rendering: optimizelegibility;">Tiết kiệm chi phí</h4><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;"><a href="http://thachpham.com/wp-content/uploads/2012/09/tiet-kiem.jpg" rel="lightbox" style="-webkit-transition: all 0.3s; color: #5e5b5b; font-weight: bold; text-decoration: none; transition: all 0.3s;"><img alt="" class="alignleft size-medium wp-image-2048" height="207" pagespeed_url_hash="1708726260" src="http://thachpham.com/wp-content/uploads/2012/09/300x207xtiet-kiem-300x207.jpg.pagespeed.ic.0R62HZd2Yc.jpg" style="border: 0px; float: left; height: auto; margin-right: 20px; max-width: 100%; vertical-align: middle;" title="SEO là giải pháp tiết kiệm chi phí" width="300" /></a>Như các bạn đều biết thì Google có một dịch vụ hiển thị quảng cáo ở trang đầu trong kết quả tìm kiếm mà chúng ta phải trả tiền cho mỗi lượt click vào (<strong>Pay Per Click</strong> – <em><strong>PPC</strong></em>) có tên là <a href="https://adwords.google.com/" rel="nofollow" style="-webkit-transition: all 0.3s; color: #5e5b5b; font-weight: bold; text-decoration: none; transition: all 0.3s;" target="_blank" title="Quảng cáo trên Google">Google Adword</a>. Đây có thể là một dịch vụ rất tốt để tìm kiếm những khách hàng tiềm năng cho website nhưng hãy làm phép tính đơn giản sau đây:</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Bạn đặt 1$ cho mỗi lượt nhấp chuột vào quảng cáo, trong một ngày bạn có được 200 lượt nhấp chuột vào quảng cáo thì bạn phải trả với số tiền 200$. Tức là mỗi tháng bạn sẽ phải mất 6.000$ và 72.000$ mỗi năm cho chi phí quảng cáo bằng công cụ này. Khủng chưa!!!!</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Sự thật là chi phí trả quảng cáo như thế này có thể là khoảng vài cent cho một lượt nhấp chuột, nhưng giá trung bình của nó thông thường là 1$ và nếu bạn mua các từ khóa có sự cạnh tranh cao hơn thì bạn phải trả thêm tiền. Đó chưa kể là nếu mỗi ngày có 200 lượt nhấp chuột vào website thì chắc gì bạn đã thu lợi được 250$ hay 300$?</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Vì vậy, nếu như bạn muốn hiển thị website ở trên đầu trong trang kết quả tìm kiếm mà không mất quá nhiều chi phí đó là sử dụng các dịch vụ SEO hoặc bạn tự SEO nếu có khả năng. Đó được hiểu là một cách đầu tư dài hạn và bạn sẽ không phải mất tiền mỗi ngày như sử dụng hình thức quảng cáo PPC của Google Adword.</div><h4 style="background-color: white; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; font-size: 20px; line-height: 24px; margin: 12px 0px; text-rendering: optimizelegibility;">Nhắm đến đối tượng người dùng cụ thể</h4><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">So với các hình thức quảng cáo trên mạng thông thường như đăng quảng cáo ở các website khác. Bạn sẽ không thể kiểm soát được đối tượng người dùng tiềm năng của mình. Bằng cách lựa chọn từ khóa phù hợp, mỗi khi có ai lên Google tìm kiếm một thông tin về một dịch vụ nào đó mà họ chắc chắn muốn sử dụng thì bạn sẽ vô cùng may mắn khi hiển thị ngay trang đầu của kết quả tìm kiếm. Từ đó họ sẽ nhấp vào liên kết của bạn và cơ hội người đó trở thành khách hàng của bạn là 70% nếu như bạn có những thông tin tốt về một loại hình dịch vụ mà họ cần.</div><h4 style="background-color: white; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; font-size: 20px; line-height: 24px; margin: 12px 0px; text-rendering: optimizelegibility;">Nhận một lượng truy cập lớn</h4><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Bạn hãy tưởng tượng xem mỗi ngày có bao nhiêu người tìm kiếm với từ khóa “<em>nghe nhạc hay</em>“, “<em>mua laptop rẻ</em>” hoặc “<em>hình ảnh đẹp</em>“? và nếu bạn xuất hiện trên trang đầu của những từ khóa đó thì chắc chắn 99,99% bạn nhận được một lượt truy cập mỗi khi có một người tìm kiếm. Lấy một ví dụ gần nhất, mỗi ngày Thach Pham Blog cũng nhận được khoảng gần 300 lượt truy cập từ máy tìm kiếm, chưa kể các lượt truy thông qua các hình thức khác. Và tất nhiên, mình không hề đăng quảng cáo ở đâu cả mà chỉ lo mỗi việc viết bài và tối ưu hóa bài viết cho thân thiện với các truy vấn tìm kiếm mà thôi.</div><h4 style="background-color: white; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; font-size: 20px; line-height: 24px; margin: 12px 0px; text-rendering: optimizelegibility;"> Lợi ích lâu dài</h4><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Như mình đã nhắc ở trên, nếu bạn sử dụng các chương trình quảng cáo PPC để quảng bá website trên máy tìm kiếm thì bạn phải trả tiền mỗi ngày. Liệu bạn có thể trả chi phí đó suốt 5 năm, 10 năm hay cả cuộc đời bạn? Nhưng một khi bạn đã áp dụng SEO vào website một cách có hiệu quả, website của bạn sẽ luôn nằm trên top tìm kiếm mà bạn không cần phải trả chi phí nào để duy trì nó. Trừ khi có một đối thủ khác SEO tốt hơn bạn.</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Bạn hiểu chúng ta học SEO để làm gì rồi chứ? Nếu như bạn muốn tìm hiểu sơ qua về nghề SEO thì coi như là bạn đã nắm được kiến thức mình cần, nhưng nếu như bạn muốn học SEO thì nhiêu đây chưa thấm thía gì đâu, vì còn một số thuật ngữ và các kiến thức cơ bản khác mà bạn cần phải biết.</div><h3 style="background-color: white; border-bottom-color: rgb(247, 247, 247); border-bottom-style: solid; border-bottom-width: 1px; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; font-size: 28px; line-height: 48px; margin: 12px 0px; text-rendering: optimizelegibility;">SEO Mũ Trắng và SEO Mũ Đen là gì?</h3><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Cũng giống như hacker, giới làm SEO được chia ra làm 2 loại được gọi là <strong>White Hat SEO</strong> và<strong>Black Hat SEO</strong>. Nếu như bạn hiểu các hacker mũ đen và hacker mũ trắng khác nhau về mục đích sử dụng kỹ năng của mình thì trong SEO không phải là như vậy. SEO mũ trắng và SEO mũ đen đều có một mục đích duy nhất: Đưa các liên kết của một website nào đó lên trang đầu. Nhưng sự khác nhau của nó ở đây là cách thức để họ đạt được kết quả đó.</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;"><a href="http://thachpham.com/wp-content/uploads/2012/09/white-hat-seo-vs-black-hat-seo.jpg" rel="lightbox" style="-webkit-transition: all 0.3s; color: #5e5b5b; font-weight: bold; text-decoration: none; transition: all 0.3s;"><img alt="" class="aligncenter size-full wp-image-2046" height="365" pagespeed_url_hash="3061978539" src="http://thachpham.com/wp-content/uploads/2012/09/595x365xwhite-hat-seo-vs-black-hat-seo.jpg.pagespeed.ic.EUDrnZmpFg.jpg" style="border: 0px; display: block; height: auto; margin: 0px auto; max-width: 100%; vertical-align: middle;" title="white-hat-seo-vs-black-hat-seo" width="595" /></a></div><h4 style="background-color: white; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; font-size: 20px; line-height: 24px; margin: 12px 0px; text-rendering: optimizelegibility;">Thế nào là SEO Mũ Trắng?</h4><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Nghe cái tên là đã thấy sự “trong trắng” và minh bạch rồi. SEO mũ trắng nghĩa là những người tối ưu hóa các liên kết để chúng có thứ hạng cao trên các kết quả tìm kiếm một cách hợp pháp và lành mạnh về cả đạo đức lẫn kỹ thuật. Phương pháp SEO mũ trắng không chỉ tăng thứ hạng các liên kết một cách hợp pháp mà nó còn có thể giữ vững thứ hạng của mình một cách lâu dài. Cũng giống như kinh doanh, nếu bạn làm mọi thứ đều minh bạch và hợp pháp thì sẽ mất khá nhiều thời gian để chăm sóc quá trình SEO của mình, nhưng bù lại bạn sẽ yên tâm hơn khi không phải lo sự trừng phạt của các máy tìm kiếm vì các vấn đề gian lận. Nói tóm gọn lại, các chiến thuật và <a href="http://thachpham.com/category/seo" style="-webkit-transition: all 0.3s; color: #5e5b5b; font-weight: bold; text-decoration: none; transition: all 0.3s;" title="thủ thuật SEO">thủ thuật SEO</a> mũ trắng nghĩa là tuân thủ các quy định và nguyên tắc của máy tìm kiếm. Các phương pháp này đơn thuần là trình bày và tối ưu hóa nội dung website cho thân thiện với các bot tìm kiếm trong quá trình crawl và index nội dung. Đồng thời các nội dung cũng được tối ưu hóa rõ ràng để truyền tải những thông tin có giá trị đến người dùng.</div><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Nhưng….nếu website bạn có nội dung kém chất lượng. Thì các phương pháp SEO mũ trắng hầu như không có tác dụng, đơn giản vì nội dung đó không có giá trị cho người dùng. Còn nếu anh đã kém rồi mà vẫn muốn leo lên đầu người khác ngồi thì bắt buộc anh phải gian lận thôi, đó được gọi là SEO mũ đen.</div><h4 style="background-color: white; color: #333333; font-family: Cambria, 'Times New Roman', Times, serif; font-size: 20px; line-height: 24px; margin: 12px 0px; text-rendering: optimizelegibility;">Thế nào là SEO Mũ Đen?</h4><div style="background-color: white; color: #555555; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; margin-bottom: 1.5em;">Nếu như bạn đã đọc qua định nghĩa SEO mũ trắng thì cũng có thể đoán ra SEO mũ đen là gì. SEO mũ đen nghĩa là sử dụng các phương pháp gian lận, thủ đoạn để phá vỡ các rào cản quy định của các máy tìm kiếm nhằm đưa mình lên những trang đầu của các kết quả tìm kiếm. Thông thường giai đoạn SEO mũ đen sẽ đưa website lên top 10 ở trang tìm kiếm nhanh hơn rất nhiều (thậm chí chỉ cần vài ba ngày cho một từ khóa quan trọng) so với SEO mũ trắng. Tuy nhiên không bao lâu sau, các website áp dụng phương thức SEO gian lận này sẽ bị các công cụ tìm kiếm trừng phạt, và đó là cái giá mà họ phải trả. Các website đó có thể bị đánh giảm thứ hạng, bị kiểm soát chặt chẽ trong quá trình SEO hoặc tệ hại hơn nữa là tên miền của website đó mãi mãi không thể nào xuất hiện trên các kết quả tìm kiếm.<br /><b>St: phamthach.com</b></div>

SEO là gì?

Với thời đại CNTT hiện nay, xu hướng phát triển trên website nói chung cũng như đặc biệt là các loại thương mại điện tử trên internet thì vi...

Read more »

Quy tắc dùng để thiết kế nên các giao diện cho phần mềm

<div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Để có 1 phần mềm được gọi là "có khoa học" nhiều <a href="http://www.studycoding.net/" style="background-color: transparent; background-position: initial initial; background-repeat: initial initial; color: rgb(180, 69, 59) !important; cursor: text; margin: 0px -3px !important; padding: 0px 3px !important; text-decoration: none !important;">developer </a>đã phải bỏ ra không ít thời gian cũng như trí não cho nó.<br />Nếu trong team bạn có hẳn 1 người thiết kế thì mọi chuyện cũng đỡ hơn nhiều. Nhưng khi để cho phần mềm được thân thiện với người dùng thì cần phải tuân thủ 1 số quy tắc cho việc <a href="http://www.studycoding.net/" style="background-color: transparent; background-position: initial initial; background-repeat: initial initial; color: rgb(180, 69, 59) !important; cursor: text; margin: 0px -3px !important; padding: 0px 3px !important; text-decoration: none !important;">thiết kế phần mềm thân thiện</a>.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Quy tắc dùng để thiết kế nên các giao diện cho phần mềm</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><a href="http://02dhth.net/" style="background-color: transparent; background-position: initial initial; background-repeat: initial initial; color: rgb(180, 69, 59) !important; cursor: text; margin: 0px -3px !important; padding: 0px 3px !important; text-decoration: none !important;">Giao diện</a> người dùng là thứ mà chúng ta sử dụng hằng ngày để giao tiếp với máy tính cũng như trên các thiết bị di động. Đó có thể là phần mềm, các nút nhấn, thanh trượt, lẫy,... Để làm ra được "giao diện", các lập trình viên phải tuân thủ theo một số quy tắc nhất định trước khi làm các phần mềm. Mới đây mình có nghiên cứu về vấn đề thiết kế giao diện người dùng và hôm nay mình xin chia sẻ với các bạn 2 bộ nguyên lý thường sử dụng trong lĩnh vực này, đó là bộ nguyên lý DOET và nguyên lý Nielsen. Sau khi đọc xong, bạn có thể thử áp dụng các nguyên lý đó với những giao diện mà bạn gặp thường ngày và sẽ biết được liệu thứ mình đang dùng có thật sự được thiết kế một cách hiệu quả hay không.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Nếu quan tâm, bạn cũng có thể xem thêm bài viết về Lịch sử tiến hóa của giao diện máy tính hiện đại trong 40 năm qua.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">I. Sự quan trọng của giao diện người dùng</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Từ trước đến nay chúng ta thường nghĩ giao diện tức là những gì có mặt trên phần mềm của máy tính, điện thoại, máy tính bảng. Điều này không sai, nhưng nó chỉ là một phần nhỏ của khái niệm "giao diện người dùng" (user interface) mà thôi. Cách bố trí nút trên chiếc remote, cách bố trí đèn và cần gạt trên lò vi sóng,… đều là giao diện người dùng, miễn là chúng tạo ra được một phương thức nào đó mà con người có thể tương tác với máy móc. Còn giao diện của phần mềm mà chúng ta hay nói đến có tên gọi là "giao diện đồ họa người dùng" (graphical user interface - GUI).</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Vậy vì sao giao diện người dùng lại quan trọng? Với một hệ thống có giao diện quá tệ, trong phần lớn các trường hợp thì người ta sẽ xem nó là một sự thất bại dù cho bạn có thiết kế những tính năng khác hay và tuyệt vời đến mức nào đi chăng nữa. Lý do là vì bạn không tạo được phương thức đủ tốt để người dùng tương tác, điều khiển với hệ thống của bạn, vậy thì làm sao họ có thể dùng nó một cách hiệu quả? Hoặc nếu giao diện bạn không thể tự đủ sự tin tưởng, liệu người dùng có giao dịch với bạn không? Do đó, giao diện là thứ được nhà thiết kế/lập trình viên rất quan tâm và họ luôn tìm cách giúp người dùng cảm thấy hài lòng nhất có thể.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Bạn có đủ can đảm để mua chứng khoán từ một trang web như thế này?​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">​<img alt="bad-web-design." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/bad-web-design-gif.1269809/" style="border: none; cursor: pointer; max-width: 100%;" />​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Trong lúc nói về 2 nguyên lý bên dưới, mình chủ yếu lấy ví dụ về phần mềm để các bạn dễ hình dung vì nó quen thuộc với chúng ta, và cũng bởi lĩnh vực mà mình đang nghiên cứu để áp dụng DOET chủ yếu là về phần mềm.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">II. Bộ nguyên lý DOET</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Đây là bộ nguyên lý được tạo ra bởi nhà khoa học Donald A. Norman trong lúc ông nghiên cứu về vấn đề tương tác giữa con người với máy tính trong dự án gọi là "Design of Everyday Thigns" - DOET (tạm dịch: thiết kế cho những thứ được dùng hằng ngày). Nó được sử dụng để các nhà thiết kế tích hợp và đánh giá xem giao diện của mình có thực sự hữu ích và giúp cho việc tương tác giữa người với máy tính dễ dàng hơn hay không. Nó bao gồm những nhân tố như sau:</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">1. Hoàn tất những yêu cầu từ phía người dùng</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Khi thiết kế một phần mềm nào đó, người ta sẽ tìm hiểu xem người dùng cần sử dụng gì. Ví dụ khi bạn chạy ứng dụng máy tính trong windows, các trường hợp sử dụng có thể diễn ra sẽ là: cộng 2 số, trừ 2 số, nhân 2 hoặc nhiều số, rút căn, tính lũy thừa. Để được xem là hiệu quả thì giao diện của app máy tính này phải đáp ứng được tất cả những tình huống nói trên. Đây cũng là nhân tố quan trọng hàng đầu trong nguyên lý DOET. Hãy thử tưởng tượng xem nếu một phần mềm không thể thực hiện những gì bạn muốn thì xem như bỏ đi rồi.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">2. Sử dụng cả "Knowledge in the Head" và "Knowledge in the World"</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Trước hết chúng ta hãy xem thử hai khái niệm là lạ này là gì nhé. "Knowledge in the Head" là những kiến thức mà người dùng đã biết, đã có sẵn khái niệm trong đầu của mình mà không cần người thiết kế phải nói ra hoặc đề cập đến trong giao diện phần mềm. Chẳng hạn, khi thấy một chiếc máy tính, bạn sẽ biết phải gõ bàn phím ra sao, phải xài chuột như thế nào.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Trong khi đó, "Knowledge in the World" thì ngược lại: nó là những kiến thức mà người dùng chưa biết đến, và sẽ cần phải được ghi chú rõ trên giao diện để người dùng học cách xài. Ví dụ, khi bạn lần đầu chạy game, người thiết kế/lập trình viên sẽ trình diễn cho bạn xem cách sử dụng app, cách điều khiển nhận vật, bắn thì nhấn nút nào, chạy thì điều khiển phím nào, xoay góc nhìn thì phải làm gì. Tương tự,Apple tích hợp hướng dẫn sử dụng touchpad đa điểm cho OS X bởi nó không giống với những gì người ta từng biết về cách xài chuột.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Touchpad_OSX." src="http://cdn.tinhte.vn/attachments/touchpad_osx-jpg.1269821/" style="border: none; cursor: pointer; max-width: 90%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">"Knowledge in the Head" không đòi hỏi người dùng phải học, trong khi "Knowledge in the World" thì có . Chính vì thế mà ở lần đầu tiếp xúc, những thứ thuộc về "Knowledge in the Head" sẽ tạo cảm giác thân quen hơn, nhưng bù lại có thể chúng ta sẽ mất thời để nhớ ra xem cách dùng thông thường là thế nào rồi mới có thể áp dụng.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Với "Knowledge in the World" thì sẽ mất thời gian học, nhưng việc học sẽ trở nên đơn giản khi chúng ta có hướng dẫn cụ thể. Và một khi đã quen tay thì những thứ thuộc về "Knowledge in the World" sẽ giúp mang lại hiệu quả sử dụng cao hơn. Cũng với ví dụ về touchpad đa điểm trên Apple, lúc mới đầu bạn sẽ mất thời gian học cách xài, nhưng khi đã quen rồi thì nó giúp mọi việc trở nên dễ dàng và nhanh chóng hơn rất nhiều, thậm chí trở thành một trong những thao tác chính mỗi ngày dùng đến cả trăm lần.Một giao diện ứng dụng tốt sẽ tìm được cách kết hợp tối ưu giữa hai loại kiến thức nói trên. để hoàn thành công việc một cách nhanh chóng và đơn giản, không đòi hỏi người dùng phải học quá nhiều nhưng vẫn đảm bảo được hiệu suất tương tác.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">3. Đơn giản hóa tác vụ của người dùng</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Ai ai cũng thích sự đơn giản, chẳng ai lại đi thích cái gì dài dòng cho mệt cả. Ngay cả khi xái máy tính, smartphone, tablet cũng thế, nếu nhìn vào một ứng dụng mà có hàng đống nút thì thôi, chúng ta có thể nghĩ ngay đến chuyện từ bỏ và đi kiếm app khác. Dù cho ứng dụng của bạn viết ra có hay, có "thần thánh" và có chạy nhanh tới cỡ nào đi nữa thì nếu các bước để thực thi một tác vụ nào đó quá phức tạp, người dùng sẽ chia tay ngay lập tức. Chính vì thế lập trình viên/nhà thiết kế cần phải đơn giản hóa chúng. Theo Norman thì có một số cách đơn giản hóa như sau:</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Tinhte_Combobox." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/tinhte_combobox-jpg.1269820/" style="border: none; cursor: pointer; max-width: 100%;" />​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">1. Hỗ trợ về mặt tâm lý: giúp người dùng cảm thấy bớt "hoảng sợ" khi nhìn vào giao diện. Một ví dụ dễ thấy đó là combobox - tức một nút mà bạn nhấn vào nó sẽ xuất hiện một số tùy chọn trong đó cho bạn. Lập trình viên có thể xài combobox để cho bạn chọn mã vùng nếu cần nhập số điện thoại chẳng hạn, còn trên Tinh tế thì xài combobox để di chuyển bài viết giữa các subforum với nhau, hoặc để chọn tiền tố cho bài viết.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">2. Giảm tải những gì mà người dùng phải nhớ. Ví dụ: trong môi trường DOS, để copy thì bạn phải nhớ lệnh cp, nhớ cú pháp của nó, còn ở Windows, chúng ta chỉ việc nhấn phím phải chuột, chọn Copy là xong. Ví dụ khác, khi bạn cần nhập liệu về thời gian, một ô nhỏ với ngày tháng năm, nói chung là cả bộ lịch, sẽ xuất hiện cho bạn chọn ngày. Bạn không cần phải nhớ cụ thể ngày đó là thứ mấy, tuần nào, tháng nào nữa.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Date_Time_Picker." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/date_time_picker-jpg.1269813/" style="border: none; cursor: pointer; max-width: 100%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">3. Tự động hóa: đây là thứ mà chúng ta rất hay gặp. Chẳng hạn như khi bạn đăng kí tài khoản mới trên Yahoo hay Google, hai trang web này sẽ tự xác định vị trí, quốc gia của bạn dựa vào địa chỉ IP. Hoặc như các máy Android, lúc bạn mới mua máy mà có bỏ SIM hoặc kết nối Wi-Fi, thiết bị sẽ tự nhận diện múi giờ và chỉnh sẵn, bạn không cần phải làm nữa. Hoặc nếu bạn nhập mã vùng là 08, chữ "Thành phố Hồ Chí Minh" sẽ tự xuất hiện.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">4. Thay đổi bản chất của tác vụ: trên các trình duyệt cũ, ô tìm kiếm sẽ nằm tách biệt với ô địa chỉ. Sau này, Chrome, Firefox, Safari, IE đều xài chung một ô cho cả hai tác vụ, dễ dàng hơn và bạn sẽ không cần phải suy nghĩ nên nhập liệu vào đâu.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">4. Làm mọi thứ rõ ràng nhất có thể</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Với những tính năng chính, hãy đem nó ra giao diện chính, nơi người dùng dễ thấy nhất. Đừng cố "tỏ ra nguy hiểm" và giấu nó vào những menu ẩn sâu trong ứng dụng, điều đó không giúp gì cho người dùng cả. Nó còn làm người dùng rối và cảm thấy bực mình nữa. Việc làm mọi thứ trở nên rõ ràng cũng là một cách nhắc cho người dùng biết những tính năng nào hệ thống của chúng ta có hỗ trợ, và cách dùng chúng như thế nào.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">5. Thu hẹp khoảng cách thực thi và khoảng cách đánh giá</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Lúc mới tiếp cận với một hệ thống, phần mềm nào đó, người dùng sẽ đối mặt với hai "khoảng cách" (Gulf) khiến họ chưa thể dùng hệ thống một cách thành công, đó là:</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Khoảng cách thực thi (Gulf of Execution): Người dùng cần làm gì để một tính năng có thể chạy được?</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Để giảm khoảng cách giữa sự thắc mắc của người dùng với giao diện, nhà thiết kế có thể dùng một thứ gọi là "Affordance". Ví dụ, khi bạn thấy một cái nút, bạn sẽ biết là bạn cần phải nhấn vào đó. Hoặc với một thanh trượt (slider), bạn sẽ biết là bạn cần kéo con chạy để thay đổi giá trị, và kéo sang phải là tăng giá trị lên, còn kéo sang trái là giảm đi.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Word." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/word-jpg.1269823/" style="border: none; cursor: pointer; max-width: 100%;" />​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Nhìn vào đây chúng ta có thể dễ dàng biết được nút nào để nhấn, cái nào để trượt​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Khoảng cách đánh giá (Gulf of Evaluation): Làm sao người dùng biết rằng tính năng đó đã chạy theo đúng những gì nó được thiết kế?</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Trong trường hợp, chúng ta có thể lấy sự phản hồi xúc giác trên các smartphone làm ví dụ. Khi bạn gõ bàn phím hoặc nhấn nút nào đó, smartphone sẽ rung nhẹ lên để báo hiệu rằng bạn đã thành công trong chạm vào nút đó. Âm thanh phát ra cũng là một sự phản hồi được xài rộng rãi.Nhiệm vụ của nhà thiết kế/lập trình viên sẽ là giúp người dùng trả lời hai câu hỏi nói trên một cách rõ ràng, dễ dàng nhất có thể.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">6. Sắp xếp một cách đúng đắn</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Trong đầu người dùng sẽ có sẵn một mô hình về cách hoạt động của một thứ gì đó. Ví dụ, khi bạn mua đồ trong siêu thị, các bước bạn sẽ làm đó là xem hàng > xem giá > chọn hàng > tính tiền. Áp dụng nó vào giao diện của một trang web bán hàng online, bạn không thể bắt người dùng xem giá rồi mới xem hàng được. Bạn phải theo đúng trình tự và mô hình mà người dùng suy nghĩ đến, khi đó thì việc sử dụng giao diện mới đạt hiệu quả cao.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">7. Khai thác sức mạnh từ các biện pháp hạn chế</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Biện pháp hạn chế (constrain), từ này nghe có vẻ ghê gớm nhưng thực chất nó không phải là thứ gì đó nghiêm trọng quá đây. "Hạn chế" ở đây là một sự tinh chỉnh nào đó vào giao diện để một thứ gì đó không còn sử dụng được nữa, tạm thời hoặc trong thời gian dài. Vì sau chúng ta lại muốn đưa hạn chế vào trong ứng dụng, sao không để người dùng muốn làm gì thì làm? Đó là vì chúng ta muốn người dùng chọn được một lựa chọn chính xác nhất, giảm lỗi về sau.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Design_Aid." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/design_aid-jpg.1269814/" style="border: none; cursor: pointer; max-width: 100%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Có 3 loại biện pháp hạn chế thường xài ngày nay:</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Hạn chế vật lý: Ví dụ, nhiều phần mềm hiện xài các ô chọn radiobutton để lựa chọn một thứ gì đó, như giới tính chẳng hạn. Bạn chỉ có thể chọn một trong hai, hoặc "Nam" hoặc "Nữ" chứ bạn không thể gõ bàn phím để nhập được. Như vậy sẽ tránh tình huống gõ nhầm, gõ không đúng ý muốn của lập trình viên.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Hạn chế về suy nghĩ: ở một giao diện cho phép nhập thông tin cá nhân, nếu ô đầu tiên có nhãn là "Họ", ô thứ hai ghi chữ "Tên", bạn sẽ biết cần gõ gì vào. Còn nếu hai ô đó không có nhãn thì bạn có thể nhập tên vào ô Họ, họ và ô Tên, sai quy tắc yêu cầu của phần mềm.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Hạn chế về văn hóa: cái này hơi phức tạp, nhưng ví dụ đơn giản nhất là màu sắc. Nếu bạn thấy một nút tô màu đỏ, bạn sẽ nghĩ ngay đến chuyện nhấn vào nút đó có thể gây ra nguy hiểm gì đó. Còn nếu thấy nút màu xanh, bạn biết nút đó là để chấp thuận và tiếp tục. Cách chọn màu cũng phải tùy vào văn hóa, chẳng hạn như ở Nga, người ta xem màu đỏ là "tích cực", khi đó bạn không nên tô nút "Xóa" với màu này.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">8. Thiết kế phải tính đến lỗi</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Cứ con người là phải mắc lỗi. Đó là chuyện quá hiển nhiên, và phần mềm phải được thiết kế để đảm đương lỗi từ phía người dùng, và cả lỗi phát sinh do bản thân ứng dụng nữa. Thực chất điều cốt lõi ở đây đó là phải loại bỏ lỗi từ gốc và không cho nó xảy ra. Nhưng không thứ gì là hoàn hảo, do đó, khi gặp lỗi thì lập trình viên sẽ phải cung cấp cho người dùng một thông báo hợp lý, ít nhất cũng phải chỉ dẫn cho người dùng nên làm gì để khắc phục lỗi, hoặc thông báo rằng lỗi đó là gì. Nếu được, nên kèm theo là một cách phục hồi hiệu quả để người dùng thoát khỏi lỗi đó.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Ví dụ 1: bạn vừa soạn xong bài báo cáo 50 trang trong Word, bỗng nhiên máy tính bị điên, Word bị đóng, thế là bạn mất hết bài viết dài vì chưa kịp lưu. May mắn là Microsoft có tích hợp tính năng AutoSave và khả năng tự khôi phục nên bạn có thể cứu được nội dung của mình.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Ví dụ 2: người dùng nhập liệu sai, ô số điện thoại thì chỉ được nhập số nhưng họ nhập vào cả chữ cái nữa. Lúc đó thông báo hiện ra nên là "Bạn chỉ được nhập số, hãy thực hiện lại nhé!". Nếu chỉ có thông báo "Sai rồi!" thì người dùng chẳng thể biết họ sai cái gì và nên làm thế nào cho đúng.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Thong_bao_loi." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/thong_bao_loi-jpg.1269819/" style="border: none; cursor: pointer; max-width: 100%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Ví dụ 3: khi bạn đang download một tập tin 50GB, khi tải được 99% thì bạn lỡ nhấn nút đóng cửa sổ trình duyệt. Nếu đóng luôn, bạn sẽ mất hết dữ liệu đã tải. Nhưng may mắn là các hãng trình duyệt đều tích hợp một hộp thoại thông báo rằng "bạn đang download file, đóng trình duyệt là sẽ mất đi đó. Có đồng ý hay không". Lúc này, nếu bạn chỉ nhấn nhầm vào nút đóng thì có nhấn nút Hủy để quay lại.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">9. Chuẩn hóa khi cần thiết</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Có những thứ mà người ta thường làm rất lộn xộn và không theo quy tác nào cả. Nếu cứ mỗi một phần mềm, một giao diện ứng dụng một kiểu thì người dùng sẽ rất rối. Đây là lúc chúng ta cần một chuẩn chung để tạo ra sự thống nhất cao đó. Chẳng hạn như với Windows, ở thanh menu của bất kì một ứng dụng nào đó thì nút đầu tiên sẽ là File, cuối cùng là Help. Trên máy Mac của Apple cũng y như thế. Hay như trên Android, Google đưa ra một chủ đề gọi là "Holo" với hai màu đen và xanh dương đặc trưng để lập trình viên áp dụng thiết kế này cho app của mình.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">III. Bộ nguyên lý Nielsen</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Jakob Nielsen năm 1995 ra mắt một tập các nguyên lý mà ông đã nghiên cứu và chứng minh rằng sẽ tốt cho một giao diện khi thiết kế theo các quy chuẩn này. Về cơ bản thì 10 điều do Nielsen đưa ra cũng khá giống với bộ DOET nói trên, chỉ khác một chút về cách diễn đạt và cách người ta đánh giá nó.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">1. Luôn hiện rõ trạng thái của hệ thống</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Giao diện phải thông báo cho người dùng biết hệ thống đang làm gì, trạng thái như thế nào, công việc đang diễn tiến đến đâu, và thông báo đó phải xuất hiện trong một thời gian hợp lý. Một ví dụ mà chúng ta rất hay thấy đó là thanh tiến trình (progress bar) xuất hiện khi copy file dù cho bạn đang OS X hay Windows, Linux. Lúc bạn mở trang web có thanh màu chạy để biểu thị % trang web đã tải xong cũng là một ví dụ khác. Thời gian hợp lý ở đây có nghĩa là sau khi bạn copy và ra lệnh paste thì thanh tiến trình sẽ hiện ra ngay, chứ không phải 5 hay 10 phút sau mới hiện diện.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Copy_Windows." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/copy_windows-jpg.1269812/" style="border: none; cursor: pointer; max-width: 100%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">2. Làm giao diện giống với hiện thực đời sống</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Giao diện cần nói phải "nói cùng loại ngôn ngữ" với người dùng, từ cách dùng từ, đặt câu, cách thông báo, nhãn, ghi chú đều phải dễ hiểu với đối tượng người dùng mà giao diện nhắm đến. Chẳng hạn, với một phần mềm chỉnh sửa ảnh chuyên nghiệp như Lightroom hay Photoshop, bạn có thể dùng những từ như "phơi sáng", "khẩu độ", "tốc độ", "cân bằng trắng". Nhưng với phần mềm xem ảnh đơn giản cho người dùng phổ thông, thì chúng ta sẽ dùng các từ như "độ sáng", "màu sắc", nếu không thì người dùng sẽ không thể hiểu chức năng đó là gì và hoạt động ra sao.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Speak_the_user_language." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/speak_the_user_language-jpg.1269818/" style="border: none; cursor: pointer; max-width: 100%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Giao diện của Photoshop với các từ ngữ phức tạp và chuyên sâu về nhiếp ảnh, nhưng người dùng nhìn vào vẫn hiểu ngay vì họ đã quen với các thuật ngữ này rồi​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Speak_the_user_language_1." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/speak_the_user_language_1-jpg.1269817/" style="border: none; cursor: pointer; max-width: 100%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Còn đây là ứng dụng iPhoto - một ứng dụng dành cho người dùng phổ thông - nên những thuật ngữ đơn giản và dễ hiểu hơn, mặc dù cả hai đều phục vụ cùng mục đích chỉnh sửa ảnh​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Tương tự, tác vụ phải được thực hiện theo đúng trình tự mà người dùng kì vọng trong đời sống. Ví dụ nhé, nếu bạn đăng kí vé máy bay thì ở ngoài đời bạn sẽ cần phải đến phòng vé, nói tên, nói nước muốn bay đến, nói ngày tháng năm và giờ giấc. Khi lên website đặt hàng thì trình tự này cũng cần phải được giữ lại (có thể tinh chỉnh một hai điểm) để giúp việc sử dụng được dễ dàng và trực quan hơn.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">3. Cho người dùng sự kiểm soát và sự tự do</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Người dùng thường hay nhầm lẫn lắm, và người thiết kế giao diện phải cung cấp một "lối thoát" trong trường hợp người dùng lỡ làm sai một thứ gì đó. Ví dụ cực dễ thấy: nút Undo và Redotrong hàng loạt ứng dụng, từ trình duyệt, Word, Excel cho đến Notepad và các app trên di động.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">4. Đề cao sự thống nhất</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Trong một hệ thống, những thứ có tính năng tương tự nhau cần phải thống nhất với nhau về màu sắc, vị trí, cách hiển thị, chữ viết,… Chẳng hạn như trên Windows, toàn bộ nút đóng cửa sổ đều màu đỏ với dấu chéo trắng và nằm ở góc trên bên phải của các cửa sổ. Hoặc trong Microsoft Office, toàn bộ những công cụ định dạng văn bản như Bold, Italic, chỉnh font chữ, cỡ chữ đầu nằm ở thẻ Home, bất kể bạn đang dùng Word, Excel, PowerPoint, Visio hay gì đi nữa. Bằng cách thống nhất, chúng ta giúp người dùng tương tác với giao diện một cách nhanh chóng hơn, đỡ phải nhớ nhiều tình huống khác nhau.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="HTC_Design." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/htc_design-jpg.1269816/" style="border: none; cursor: pointer; max-width: 100%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Với HTC, tất cả app của họ đều có nút tìm kiếm, add và menu ở cạnh trên​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">5. Hạn chế lỗi</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Cũng như DOET, hệ thống và giao diện cần phải được thiết kế với tâm niệm rằng người dùng luôn mắc lỗi, và điều quan trọng giao diện là phải bao quát được hầu hết các lỗi thông dụng. Người thiết kế/lập trình viên cũng cần phải hạn chế tối đa nguồn phát sinh lỗi.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Ví dụ:</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Combobox, radio button, checkbox: chỉ phép người dùng chọn một số thứ do lập trình viên hoặc nhà thiết kế định trước, không thể tự mình nhập cái mới (ví có khả năng phát sinh lỗi)</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Vô hiệu hóa một thành phần giao diện nào đó khi không cần thiết.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">6. Cung cấp sự linh hoạt cho người dùng</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Lúc mới xài máy tính, để copy một thứ gì bạn thường làm gì? Chọn nội dung hoặc file đó, nhấp phím phải chuột, chọn copy, qua chỗ khác, lại nhấn phím phải chuột, chọn paste. Về sau, khi chúng ta có kinh nghiệm hơn, thao tác đó được đơn giản hóa đi rất nhiều bằng cách sử dụng phím tắt Control + C, Control + V. Đây chính là ví dụ cho nguyên lí thứ 6 của Nielsen. Ngoài ra, khi hệ thống cần phải thay đổi giao diện, việc giữ lại sự linh hoạt như bản cũ là điều cần thiết, nếu không người dùng sẽ cảm thấy rất thất vọng vì mất đi một thứ mà họ đang dùng quen tay.Một số ví dụ khác ngoài phím tắt có khả năng cung cấp sự linh hoạt cho người dùng:</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Dùng bàn phím để di chuyển giữa các phần giao diện</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Breadcrumbs: cho người dùng biết họ đang ở đâu, đồng thời cho phép họ di chuyển đến những nơi khác trong hệ thống.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Menu chuột phải</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Cho phép người dùng cá nhân hóa giao diện: di chuyển và sắp xếp icon, tự chọn cách đặt widget trên Android,…</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Breadcrumb." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/breadcrumb-jpg.1269810/" style="border: none; cursor: pointer; max-width: 100%;" />​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Breadcrumb của Tinh tế​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">7. Giảm tải những gì người dùng cần phải nhớ</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Để làm được điều này, nhà thiết kế và lập trình viên cần đảm bảo rằng người dùng có thể thấy hết các tính năng chính một cách dễ dàng. Người dùng không cần phải nhớ những thứ phức tạp khi sử dụng các thành phần trong hệ thống. Lập trình viên và nhà thiết kế cần lưu ý rằng việc nhìn và nhận diện (recognition) sẽ luôn tốt hơn là bắt người dùng nhớ lại những gì đã từng diễn ra (recall). Việc ứng dụng biểu tượng đồ họa, gợi ý về password, sử dụng màu sắc để thông báo một thứ gì đó đã được hoàn tất… là những ví dụ cho nguyên lý thứ 7 bởi nó giúp người dùng biết ngay rằng tính năng đó là gì và để làm gì. Cũng như khi giao diện đồ họa ra mắt, nó đã giúp mở ra cả một kỉ nguyên máy tính mới và ai cũng có thể xài PC, chứ lúc còn chạy bằng giao diện dòng lệnh (CLI) thì không mấy người có thể tiếp cận với máy tính vì nó quá khó và phải nhớ quá nhiều thứ.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="GUI_vs_CLI." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/gui_vs_cli-jpg.1269815/" style="border: none; cursor: pointer; max-width: 100%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Bạn thích dùng cái nào hơn? Giao diện người dùng đẹp mắt hay là giao diện dòng lệnh đen thui và phải gõ gõ tùm lum?​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Một ví dụ khác: để tìm một sinh viên nào đó thì nên dùng tên chứ đừng bắt buộc người dùng phải nhớ mã sinh viên, mặc dù chúng ta có thể cung cấp thêm tùy chọn tìm kiếm bằng mã.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">8. Giao diện phải có tính thẩm mỹ, đẹp và có liên quan</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Đẹp, đó là chuyện mà ai cũng muốn, và giao diện đẹp thì luôn được đánh giá cao. Hãy nhìn vào cách mà Apple thiết kế iOS hay những gì Google làm với Android, tất cả đều xoay quanh một chữ đẹp. Khi sử dụng một thứ gì đó có tính thẩm mỹ cao thì người dùng sẽ cảm thấy hài lòng hơn và có hứng hơn. Ngoài ra, thông tin cung cấp cho người dùng cũng phải liên quan, nếu không thì cũng bằng thừa. Ví dụ, trong một thông báo hiện ra trước khi lưu tập tin, thứ mà chúng ta nên đưa vào đó là câu hỏi "bạn có muốn lưu đè tập tin hay không" hoặc "bạn có muốn lưu nó vào đây hay không", không phải là một bài viết dài về cách lưu tập tin, tác hại khi không xài phần mềm đúng cách (!?).</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">9. Giúp người dùng xác định và cách khắc phục sau khi lỗi xảy ra</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Thông báo khi có lỗi phải dễ hiểu và cho người dùng biết lỗi đó là gì, chứ đừng hiện một đống mã lỗi lên. Điều đó sẽ làm người dùng nản chí. Ngoài ra, giao diện cũng cần nói cho người dùng biết những biện pháp khả thi để khắc phục lỗi, chứ không nên để mặc người dùng muốn làm gì thì làm.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Bsod_nt." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/bsod_nt-jpg.1269811/" style="border: none; cursor: pointer; max-width: 100%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Thông báo lỗi "màn hình xanh chết chóc" của Windows 7 quá rồi, làm người ta hoảng và không biết phải làm gì hoặc chuyện gì sẽ xảy ra. Còn lên Windows 8, Microsoft thay đổi nó để nói cho chúng ta rằng "hệ điều hành đang thu thập lỗi và sẽ tự khởi động máy lại cho bạn".​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">10. Cung cấp sự trợ giúp, tài liệu hướng dẫn sử dụng</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Bạn có thể thấy rằng bất kỳ phần mềm nào, dù đơn giản đến đâu thì cũng đều có mục trợ giúp (Help) hoặc tài liệu hướng dẫn sử dụng (documentation), hoạt ít nhất cũng có một dòng nói rằng cần sử dụng phần mềm như thế nào. Đây là cách cuối cùng mà người dùng sẽ tìm đến khi họ không thể thực hiện một thao tác nào đó. Hãy thử tưởng tượng xem nếu như bạn sử dụng phần mềm mà khi gặp lỗi, bạn không thể tìm được bất kỳ sự trợ giúp nào thì điều đó thật là tệ. Tùy theo độ phức tạp của giao diện và phần mềm mà người ta sẽ soạn thảo các tài liệu hướng dẫn sử dụng và phần trợ giúp tương ứng. Tooltip box - dòng thông báo nhỏ hiện ra khi chúng ta rê chuột lên một nút, một ô, một hộp thoại,… - cũng chính là một sự trợ giúp chứ không phải cứ vào Help mới là trợ giúp.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><br /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;"><img alt="Tro_giup_su_dung_iPad." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/tro_giup_su_dung_ipad-jpg.1269822/" style="border: none; cursor: pointer; max-width: 100%;" /></div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Trợ giúp sử dụng giao diện trên iPad​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">​</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Đây là hai trong số các bộ nguyên lý thường được xài. Hi vọng nó sẽ giúp các bạn hiểu thêm về cách người ta làm ra những giao diện mà ta sử dụng hằng ngày.</div><div data-redactor="1" style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 28px; margin: 0px; padding: 0px;">Tổng hợp: tinhte.vn</div><div style="background-color: #fcfcfc; color: #141414; font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; height: 1px; left: -1000px; line-height: 28px; margin: 0px; overflow: hidden; padding: 0px; position: absolute; top: 36px; width: 1px;"><h1 style="border: none; color: #333333; font-family: 'PT Sans', sans-serif; font-size: 24px; font-weight: normal; line-height: 24px; list-style: none; margin: 0px 0px 15px; outline: none; padding: 0px;">Quy tắc dùng để thiết kế nên các giao diện cho phần mềm</h1><div class="post-body" style="color: #555555; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 20px; margin: 0px; padding: 0px;"><a href="http://studycoding.blogspot.com/" style="background-color: transparent; background-position: initial initial; background-repeat: initial initial; border: none; color: #d46300; cursor: text; list-style: none; margin-bottom: 0px !important; margin-left: 0px; margin-right: 0px; margin-top: 0px !important; outline: none; padding-bottom: 0px !important; padding-left: 0px; padding-right: 0px; padding-top: 0px !important; text-decoration: none !important;" target="_blank">Giao diện người dùng</a><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"> là thứ mà chúng ta sử dụng hằng ngày để giao tiếp với máy tính cũng như trên các thiết bị di động. Đó có thể là phần mềm, các nút nhấn, thanh trượt, lẫy,... Để làm ra được "</span><a class="Tinhte_XenTag_TagLink" href="http://www.tinhte.vn/tags/giao+di%E1%BB%87n/" style="background-color: #fcfcff; background-position: initial initial; background-repeat: initial initial; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border: none; color: #003c5a; cursor: text; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px -3px !important; outline: none; padding: 0px 3px !important; text-align: justify; text-decoration: none !important;" target="_blank">giao diện</a><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">", các lập trình viên phải tuân thủ theo một số quy tắc nhất định trước khi làm các phần mềm. Mới đây mình có nghiên cứu về vấn đề </span><a class="Tinhte_XenTag_TagLink" href="http://02dhth.net/" style="background-color: #fcfcff; background-position: initial initial; background-repeat: initial initial; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border: none; color: #003c5a; cursor: text; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px -3px !important; outline: none; padding: 0px 3px !important; text-align: justify; text-decoration: none !important;" target="_blank">thiết kế giao diện</a><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"> người dùng và hôm nay mình xin chia sẻ với các bạn 2 bộ nguyên lý thường sử dụng trong lĩnh vực này, đó là bộ nguyên lý </span><a class="Tinhte_XenTag_TagLink" href="http://www.tinhte.vn/tags/doet/" style="background-color: #fcfcff; background-position: initial initial; background-repeat: initial initial; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border: none; color: #003c5a; cursor: text; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px -3px !important; outline: none; padding: 0px 3px !important; text-align: justify; text-decoration: none !important;" target="_blank">DOET</a><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"> và nguyên lý Nielsen. Sau khi đọc xong, bạn có thể thử áp dụng các nguyên lý đó với những giao diện mà bạn gặp thường ngày và sẽ biết được liệu thứ mình đang dùng có thật sự được thiết kế một cách hiệu quả hay không.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">Nếu quan tâm, bạn cũng có thể xem thêm bài viết về Lịch sử tiến hóa của giao diện máy tính hiện đại trong 40 năm qua.</b><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 18px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><span style="border: none; color: green; list-style: none; margin: 0px; outline: none; padding: 0px;"><b>I. Sự quan trọng của giao diện người dùng</b></span></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Từ trước đến nay chúng ta thường nghĩ giao diện tức là những gì có mặt trên phần mềm của máy tính, điện thoại, máy tính bảng. Điều này không sai, nhưng nó chỉ là một phần nhỏ của khái niệm "giao diện người dùng" (</span>user interface<span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">) mà thôi. Cách bố trí nút trên chiếc remote, cách bố trí đèn và cần gạt trên lò vi sóng,… đều là giao diện người dùng, miễn là chúng tạo ra được một phương thức nào đó mà con người có thể tương tác với máy móc. Còn giao diện của phần mềm mà chúng ta hay nói đến có tên gọi là "giao diện đồ họa người dùng" (</span><a class="Tinhte_XenTag_TagLink" href="http://studycoding.blogspot.com/search/label/C%23" style="background-color: #fcfcff; background-position: initial initial; background-repeat: initial initial; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border: none; color: #003c5a; cursor: text; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px -3px !important; outline: none; padding: 0px 3px !important; text-align: justify; text-decoration: none !important;" target="_blank">graphical user interface</a><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"> - </span><a class="Tinhte_XenTag_TagLink" href="http://www.tinhte.vn/tags/gui/" style="background-color: #fcfcff; background-position: initial initial; background-repeat: initial initial; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border: none; color: #003c5a; cursor: text; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px -3px !important; outline: none; padding: 0px 3px !important; text-align: justify; text-decoration: none !important;" target="_blank">GUI</a><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">).</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Vậy vì sao giao diện người dùng lại quan trọng? Với một hệ thống có giao diện quá tệ, trong phần lớn các trường hợp thì người ta sẽ xem nó là một sự thất bại dù cho bạn có thiết kế những tính năng khác hay và tuyệt vời đến mức nào đi chăng nữa. Lý do là vì bạn không tạo được phương thức đủ tốt để người dùng tương tác, điều khiển với hệ thống của bạn, vậy thì làm sao họ có thể dùng nó một cách hiệu quả? Hoặc nếu giao diện bạn không thể tự đủ sự tin tưởng, liệu người dùng có giao dịch với bạn không? Do đó, giao diện là thứ được nhà thiết kế/lập trình viên rất quan tâm và họ luôn tìm cách giúp người dùng cảm thấy hài lòng nhất có thể.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;"><img alt="bad-web-design." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/bad-web-design-gif.1269809/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" /></span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;">Bạn có đủ can đảm để mua chứng khoán từ một trang web như thế này?</span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;">​</div><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Trong lúc nói về 2 nguyên lý bên dưới, mình chủ yếu lấy ví dụ về phần mềm để các bạn dễ hình dung vì nó quen thuộc với chúng ta, và cũng bởi lĩnh vực mà mình đang nghiên cứu để áp dụng DOET chủ yếu là về phần mềm.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 18px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><span style="border: none; color: green; list-style: none; margin: 0px; outline: none; padding: 0px;"><b>II. Bộ nguyên lý DOET</b></span></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Đây là bộ nguyên lý được tạo ra bởi nhà khoa học Donald A. Norman trong lúc ông nghiên cứu về vấn đề tương tác giữa con người với máy tính trong dự án gọi là "</span><span style="border: none; color: red; list-style: none; margin: 0px; outline: none; padding: 0px;">Design of Everyday Thigns</span><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">" - DOET (tạm dịch: thiết kế cho những thứ được dùng hằng ngày). Nó được sử dụng để các nhà thiết kế tích hợp và đánh giá xem giao diện của mình có thực sự hữu ích và giúp cho việc tương tác giữa người với máy tính dễ dàng hơn hay không. Nó bao gồm những nhân tố như sau:</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>1. Hoàn tất những yêu cầu từ phía người dùng</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Khi thiết kế một phần mềm nào đó, người ta sẽ tìm hiểu xem người dùng cần sử dụng gì. Ví dụ khi bạn chạy ứng dụng máy tính trong windows, các trường hợp sử dụng có thể diễn ra sẽ là: cộng 2 số, trừ 2 số, nhân 2 hoặc nhiều số, rút căn, tính lũy thừa. Để được xem là hiệu quả thì giao diện của app máy tính này phải đáp ứng được tất cả những tình huống nói trên. Đây cũng là nhân tố quan trọng hàng đầu trong nguyên lý DOET. Hãy thử tưởng tượng xem nếu một phần mềm không thể thực hiện những gì bạn muốn thì xem như bỏ đi rồi.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>2. Sử dụng cả "Knowledge in the Head" và "Knowledge in the World"</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Trước hết chúng ta hãy xem thử hai khái niệm là lạ này là gì nhé. "</span><span style="background-color: #fcfcff; border: none; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><span style="border: none; color: red; list-style: none; margin: 0px; outline: none; padding: 0px;">Knowledge in the Head</span></span><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">" là những kiến thức mà người dùng đã biết, đã có sẵn khái niệm trong đầu của mình mà không cần người thiết kế phải nói ra hoặc đề cập đến trong giao diện phần mềm. Chẳng hạn, khi thấy một chiếc máy tính, bạn sẽ biết phải gõ bàn phím ra sao, phải xài chuột như thế nào.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Trong khi đó, "</span><span style="background-color: #fcfcff; border: none; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><span style="border: none; color: red; list-style: none; margin: 0px; outline: none; padding: 0px;">Knowledge in the World</span></span><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">" thì ngược lại: nó là những kiến thức mà người dùng chưa biết đến, và sẽ cần phải được ghi chú rõ trên giao diện để người dùng học cách xài. Ví dụ, khi bạn lần đầu chạy game, người thiết kế/lập trình viên sẽ trình diễn cho bạn xem cách sử dụng app, cách điều khiển nhận vật, bắn thì nhấn nút nào, chạy thì điều khiển phím nào, xoay góc nhìn thì phải làm gì. Tương tự,</span>Apple<span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"> tích hợp hướng dẫn sử dụng touchpad đa điểm cho OS X bởi nó không giống với những gì người ta từng biết về cách xài chuột.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><img alt="Touchpad_OSX." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/touchpad_osx-jpg.1269821/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" />​</div><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">"</span><span style="background-color: #fcfcff; border: none; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><span style="border: none; color: red; list-style: none; margin: 0px; outline: none; padding: 0px;">Knowledge in the Head</span></span><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">" không đòi hỏi người dùng phải học, trong khi "Knowledge in the World" thì có . Chính vì thế mà ở lần đầu tiếp xúc, những thứ thuộc về "Knowledge in the Head" sẽ tạo cảm giác thân quen hơn, nhưng bù lại có thể chúng ta sẽ mất thời để nhớ ra xem cách dùng thông thường là thế nào rồi mới có thể áp dụng.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Với "<b>Knowledge in the World</b>" thì sẽ mất thời gian học, nhưng việc học sẽ trở nên đơn giản khi chúng ta có hướng dẫn cụ thể. Và một khi đã quen tay thì những thứ thuộc về "Knowledge in the World" sẽ giúp mang lại hiệu quả sử dụng cao hơn. Cũng với ví dụ về touchpad đa điểm trên Apple, lúc mới đầu bạn sẽ mất thời gian học cách xài, nhưng khi đã quen rồi thì nó giúp mọi việc trở nên dễ dàng và nhanh chóng hơn rất nhiều, thậm chí trở thành một trong những thao tác chính mỗi ngày dùng đến cả trăm lần.Một giao diện ứng dụng tốt sẽ tìm được cách kết hợp tối ưu giữa hai loại kiến thức nói trên. để hoàn thành công việc một cách nhanh chóng và đơn giản, không đòi hỏi người dùng phải học quá nhiều nhưng vẫn đảm bảo được hiệu suất tương tác.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>3. Đơn giản hóa tác vụ của người dùng</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Ai ai cũng thích sự đơn giản, chẳng ai lại đi thích cái gì dài dòng cho mệt cả. Ngay cả khi xái máy tính, smartphone, tablet cũng thế, nếu nhìn vào một ứng dụng mà có hàng đống nút thì thôi, chúng ta có thể nghĩ ngay đến chuyện từ bỏ và đi kiếm app khác. Dù cho ứng dụng của bạn viết ra có hay, có "thần thánh" và có chạy nhanh tới cỡ nào đi nữa thì nếu các bước để thực thi một tác vụ nào đó quá phức tạp, người dùng sẽ chia tay ngay lập tức. Chính vì thế lập trình viên/nhà thiết kế cần phải đơn giản hóa chúng. Theo Norman thì có một số cách đơn giản hóa như sau:</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><img alt="Tinhte_Combobox." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/tinhte_combobox-jpg.1269820/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" />​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;">​</div><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">1. </span><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">Hỗ trợ về mặt tâm lý</b><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">: giúp người dùng cảm thấy bớt "hoảng sợ" khi nhìn vào giao diện. Một ví dụ dễ thấy đó là combobox - tức một nút mà bạn nhấn vào nó sẽ xuất hiện một số tùy chọn trong đó cho bạn. Lập trình viên có thể xài combobox để cho bạn chọn mã vùng nếu cần nhập số điện thoại chẳng hạn, còn trên Tinh tế thì xài combobox để di chuyển bài viết giữa các subforum với nhau, hoặc để chọn tiền tố cho bài viết.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">2. </span><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">Giảm tải những gì mà người dùng phải nhớ</b><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">. Ví dụ: trong môi trường DOS, để copy thì bạn phải nhớ lệnh cp, nhớ cú pháp của nó, còn ở Windows, chúng ta chỉ việc nhấn phím phải chuột, chọn Copy là xong. Ví dụ khác, khi bạn cần nhập liệu về thời gian, một ô nhỏ với ngày tháng năm, nói chung là cả bộ lịch, sẽ xuất hiện cho bạn chọn ngày. Bạn không cần phải nhớ cụ thể ngày đó là thứ mấy, tuần nào, tháng nào nữa.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><img alt="Date_Time_Picker." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/date_time_picker-jpg.1269813/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" />​</div><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">3. </span><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">Tự động hóa</b><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">: đây là thứ mà chúng ta rất hay gặp. Chẳng hạn như khi bạn đăng kí tài khoản mới trên Yahoo hay </span>Google<span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">, hai trang web này sẽ tự xác định vị trí, quốc gia của bạn dựa vào địa chỉ IP. Hoặc như các máy </span><a class="Tinhte_XenTag_TagLink" href="http://studycoding.blogspot.com/search/label/Android" style="background-color: #fcfcff; background-position: initial initial; background-repeat: initial initial; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border: none; color: #003c5a; cursor: text; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px -3px !important; outline: none; padding: 0px 3px !important; text-align: justify; text-decoration: none !important;" target="_blank">Android</a><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">, lúc bạn mới mua máy mà có bỏ SIM hoặc kết nối Wi-Fi, thiết bị sẽ tự nhận diện múi giờ và chỉnh sẵn, bạn không cần phải làm nữa. Hoặc nếu bạn nhập mã vùng là 08, chữ "Thành phố Hồ Chí Minh" sẽ tự xuất hiện.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">4. </span><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">Thay đổi bản chất của tác vụ</b><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">: trên các trình duyệt cũ, ô tìm kiếm sẽ nằm tách biệt với ô địa chỉ. Sau này, Chrome, Firefox, Safari, IE đều xài chung một ô cho cả hai tác vụ, dễ dàng hơn và bạn sẽ không cần phải suy nghĩ nên nhập liệu vào đâu.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>4. Làm mọi thứ rõ ràng nhất có thể</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Với những tính năng chính, hãy đem nó ra giao diện chính, nơi người dùng dễ thấy nhất. Đừng cố "tỏ ra nguy hiểm" và giấu nó vào những menu ẩn sâu trong ứng dụng, điều đó không giúp gì cho người dùng cả. Nó còn làm người dùng rối và cảm thấy bực mình nữa. Việc làm mọi thứ trở nên rõ ràng cũng là một cách nhắc cho người dùng biết những tính năng nào hệ thống của chúng ta có hỗ trợ, và cách dùng chúng như thế nào.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>5. Thu hẹp khoảng cách thực thi và khoảng cách đánh giá</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Lúc mới tiếp cận với một hệ thống, phần mềm nào đó, người dùng sẽ đối mặt với hai "khoảng cách" (Gulf) khiến họ chưa thể dùng hệ thống một cách thành công, đó là:</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><i style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;"><b>Khoảng cách thực thi (Gulf of Execution): Người dùng cần làm gì để một tính năng có thể chạy được?</b></i><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Để giảm khoảng cách giữa sự thắc mắc của người dùng với giao diện, nhà thiết kế có thể dùng một thứ gọi là "Affordance". Ví dụ, khi bạn thấy một cái nút, bạn sẽ biết là bạn cần phải nhấn vào đó. Hoặc với một thanh trượt (slider), bạn sẽ biết là bạn cần kéo con chạy để thay đổi giá trị, và kéo sang phải là tăng giá trị lên, còn kéo sang trái là giảm đi.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;"><img alt="Word." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/word-jpg.1269823/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" /></span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;">Nhìn vào đây chúng ta có thể dễ dàng biết được nút nào để nhấn, cái nào để trượt</span>​</div><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><i style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;"><b>Khoảng cách đánh giá (Gulf of Evaluation): Làm sao người dùng biết rằng tính năng đó đã chạy theo đúng những gì nó được thiết kế?</b></i><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Trong trường hợp, chúng ta có thể lấy sự phản hồi xúc giác trên các smartphone làm ví dụ. Khi bạn gõ bàn phím hoặc nhấn nút nào đó, smartphone sẽ rung nhẹ lên để báo hiệu rằng bạn đã thành công trong chạm vào nút đó. Âm thanh phát ra cũng là một sự phản hồi được xài rộng rãi.Nhiệm vụ của nhà thiết kế/lập trình viên sẽ là giúp người dùng trả lời hai câu hỏi nói trên một cách rõ ràng, dễ dàng nhất có thể.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>6. Sắp xếp một cách đúng đắn</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Trong đầu người dùng sẽ có sẵn một mô hình về cách hoạt động của một thứ gì đó. Ví dụ, khi bạn mua đồ trong siêu thị, các bước bạn sẽ làm đó là xem hàng > xem giá > chọn hàng > tính tiền. Áp dụng nó vào giao diện của một trang web bán hàng online, bạn không thể bắt người dùng xem giá rồi mới xem hàng được. Bạn phải theo đúng trình tự và mô hình mà người dùng suy nghĩ đến, khi đó thì việc sử dụng giao diện mới đạt hiệu quả cao.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>7. Khai thác sức mạnh từ các biện pháp hạn chế</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Biện pháp hạn chế (constrain), từ này nghe có vẻ ghê gớm nhưng thực chất nó không phải là thứ gì đó nghiêm trọng quá đây. "Hạn chế" ở đây là một sự tinh chỉnh nào đó vào giao diện để một thứ gì đó không còn sử dụng được nữa, tạm thời hoặc trong thời gian dài. Vì sau chúng ta lại muốn đưa hạn chế vào trong ứng dụng, sao không để người dùng muốn làm gì thì làm? Đó là vì chúng ta muốn người dùng chọn được một lựa chọn chính xác nhất, giảm lỗi về sau.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><img alt="Design_Aid." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/design_aid-jpg.1269814/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" />​</div><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><i style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;"><b>Có 3 loại biện pháp hạn chế thường xài ngày nay:</b></i><br /><ul style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 1em 0px 1em 3em; outline: none; padding: 0px; text-align: justify;"><li style="border: none; list-style: disc outside; margin: 0px; outline: none; padding: 0px;"><b>Hạn chế vật lý</b>: Ví dụ, nhiều phần mềm hiện xài các ô chọn radiobutton để lựa chọn một thứ gì đó, như giới tính chẳng hạn. Bạn chỉ có thể chọn một trong hai, hoặc "Nam" hoặc "Nữ" chứ bạn không thể gõ bàn phím để nhập được. Như vậy sẽ tránh tình huống gõ nhầm, gõ không đúng ý muốn của lập trình viên.</li><li style="border: none; list-style: disc outside; margin: 0px; outline: none; padding: 0px;"><b>Hạn chế về suy nghĩ</b>: ở một giao diện cho phép nhập thông tin cá nhân, nếu ô đầu tiên có nhãn là "Họ", ô thứ hai ghi chữ "Tên", bạn sẽ biết cần gõ gì vào. Còn nếu hai ô đó không có nhãn thì bạn có thể nhập tên vào ô Họ, họ và ô Tên, sai quy tắc yêu cầu của phần mềm.</li><li style="border: none; list-style: disc outside; margin: 0px; outline: none; padding: 0px;"><b>Hạn chế về văn hóa</b>: cái này hơi phức tạp, nhưng ví dụ đơn giản nhất là màu sắc. Nếu bạn thấy một nút tô màu đỏ, bạn sẽ nghĩ ngay đến chuyện nhấn vào nút đó có thể gây ra nguy hiểm gì đó. Còn nếu thấy nút màu xanh, bạn biết nút đó là để chấp thuận và tiếp tục. Cách chọn màu cũng phải tùy vào văn hóa, chẳng hạn như ở Nga, người ta xem màu đỏ là "tích cực", khi đó bạn không nên tô nút "Xóa" với màu này.</li></ul><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>8. Thiết kế phải tính đến lỗi</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Cứ con người là phải mắc lỗi. Đó là chuyện quá hiển nhiên, và phần mềm phải được thiết kế để đảm đương lỗi từ phía người dùng, và cả lỗi phát sinh do bản thân ứng dụng nữa. Thực chất điều cốt lõi ở đây đó là phải loại bỏ lỗi từ gốc và không cho nó xảy ra. Nhưng không thứ gì là hoàn hảo, do đó, khi gặp lỗi thì lập trình viên sẽ phải cung cấp cho người dùng một thông báo hợp lý, ít nhất cũng phải chỉ dẫn cho người dùng nên làm gì để khắc phục lỗi, hoặc thông báo rằng lỗi đó là gì. Nếu được, nên kèm theo là một cách phục hồi hiệu quả để người dùng thoát khỏi lỗi đó.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">Ví dụ 1</b><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">: bạn vừa soạn xong bài báo cáo 50 trang trong Word, bỗng nhiên máy tính bị điên, Word bị đóng, thế là bạn mất hết bài viết dài vì chưa kịp lưu. May mắn là Microsoft có tích hợp tính năng AutoSave và khả năng tự khôi phục nên bạn có thể cứu được nội dung của mình.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">Ví dụ 2</b><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">: người dùng nhập liệu sai, ô số điện thoại thì chỉ được nhập số nhưng họ nhập vào cả chữ cái nữa. Lúc đó thông báo hiện ra nên là "Bạn chỉ được nhập số, hãy thực hiện lại nhé!". Nếu chỉ có thông báo "Sai rồi!" thì người dùng chẳng thể biết họ sai cái gì và nên làm thế nào cho đúng.</span><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><img alt="Thong_bao_loi." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/thong_bao_loi-jpg.1269819/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" />​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;">​</div><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">Ví dụ 3</b><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">: khi bạn đang download một tập tin 50GB, khi tải được 99% thì bạn lỡ nhấn nút đóng cửa sổ trình duyệt. Nếu đóng luôn, bạn sẽ mất hết dữ liệu đã tải. Nhưng may mắn là các hãng trình duyệt đều tích hợp một hộp thoại thông báo rằng "bạn đang download file, đóng trình duyệt là sẽ mất đi đó. Có đồng ý hay không". Lúc này, nếu bạn chỉ nhấn nhầm vào nút đóng thì có nhấn nút Hủy để quay lại.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>9. Chuẩn hóa khi cần thiết</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Có những thứ mà người ta thường làm rất lộn xộn và không theo quy tác nào cả. Nếu cứ mỗi một phần mềm, một giao diện ứng dụng một kiểu thì người dùng sẽ rất rối. Đây là lúc chúng ta cần một chuẩn chung để tạo ra sự thống nhất cao đó. Chẳng hạn như với Windows, ở thanh menu của bất kì một ứng dụng nào đó thì nút đầu tiên sẽ là File, cuối cùng là Help. Trên máy Mac của Apple cũng y như thế. Hay như trên Android, Google đưa ra một chủ đề gọi là "Holo" với hai màu đen và xanh dương đặc trưng để lập trình viên áp dụng thiết kế này cho app của mình.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 18px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><span style="border: none; color: green; list-style: none; margin: 0px; outline: none; padding: 0px;"><b>III. Bộ nguyên lý Nielsen</b></span></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Jakob Nielsen năm 1995 ra mắt một tập các nguyên lý mà ông đã nghiên cứu và chứng minh rằng sẽ tốt cho một giao diện khi thiết kế theo các quy chuẩn này. Về cơ bản thì </span><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">10 điều do Nielsen đưa ra </b><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">cũng khá giống với bộ DOET nói trên, chỉ khác một chút về cách diễn đạt và cách người ta đánh giá nó.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>1. Luôn hiện rõ trạng thái của hệ thống</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Giao diện phải thông báo cho người dùng biết hệ thống đang làm gì, trạng thái như thế nào, công việc đang diễn tiến đến đâu, và thông báo đó phải xuất hiện trong một thời gian hợp lý. Một ví dụ mà chúng ta rất hay thấy đó là thanh tiến trình (progress bar) xuất hiện khi copy file dù cho bạn đang OS X hay Windows, Linux. Lúc bạn mở trang web có thanh màu chạy để biểu thị % trang web đã tải xong cũng là một ví dụ khác. Thời gian hợp lý ở đây có nghĩa là sau khi bạn copy và ra lệnh paste thì thanh tiến trình sẽ hiện ra ngay, chứ không phải 5 hay 10 phút sau mới hiện diện.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><img alt="Copy_Windows." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/copy_windows-jpg.1269812/" style="background-color: #fcfcff; border: 0px none; color: #141414; cursor: pointer; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>2. Làm giao diện giống với hiện thực đời sống</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Giao diện cần nói phải "nói cùng loại ngôn ngữ" với người dùng, từ cách dùng từ, đặt câu, cách thông báo, nhãn, ghi chú đều phải dễ hiểu với đối tượng người dùng mà giao diện nhắm đến. Chẳng hạn, với một phần mềm chỉnh sửa ảnh chuyên nghiệp như Lightroom hay Photoshop, bạn có thể dùng những từ như "phơi sáng", "khẩu độ", "tốc độ", "cân bằng trắng". Nhưng với phần mềm xem ảnh đơn giản cho người dùng phổ thông, thì chúng ta sẽ dùng các từ như "độ sáng", "màu sắc", nếu không thì người dùng sẽ không thể hiểu chức năng đó là gì và hoạt động ra sao.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;"><img alt="Speak_the_user_language." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/speak_the_user_language-jpg.1269818/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" /></span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;">Giao diện của Photoshop với các từ ngữ phức tạp và chuyên sâu về nhiếp ảnh, nhưng người dùng nhìn vào vẫn hiểu ngay vì họ đã quen với các thuật ngữ này rồi</span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;">​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;"><img alt="Speak_the_user_language_1." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/speak_the_user_language_1-jpg.1269817/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" /></span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;">Còn đây là ứng dụng iPhoto - một ứng dụng dành cho người dùng phổ thông - nên những thuật ngữ đơn giản và dễ hiểu hơn, mặc dù cả hai đều phục vụ cùng mục đích chỉnh sửa ảnh</span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;">​</div><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Tương tự, tác vụ phải được thực hiện theo đúng trình tự mà người dùng kì vọng trong đời sống. Ví dụ nhé, nếu bạn đăng kí vé máy bay thì ở ngoài đời bạn sẽ cần phải đến phòng vé, nói tên, nói nước muốn bay đến, nói ngày tháng năm và giờ giấc. Khi lên website đặt hàng thì trình tự này cũng cần phải được giữ lại (có thể tinh chỉnh một hai điểm) để giúp việc sử dụng được dễ dàng và trực quan hơn.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>3. Cho người dùng sự kiểm soát và sự tự do</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Người dùng thường hay nhầm lẫn lắm, và người thiết kế giao diện phải cung cấp một "lối thoát" trong trường hợp người dùng lỡ làm sai một thứ gì đó. Ví dụ cực dễ thấy: </span><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">nút Undo và Redo</b><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">trong hàng loạt ứng dụng, từ trình duyệt, Word, Excel cho đến Notepad và các app trên di động.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>4. Đề cao sự thống nhất</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Trong một hệ thống, những thứ có tính năng tương tự nhau cần phải thống nhất với nhau về màu sắc, vị trí, cách hiển thị, chữ viết,… Chẳng hạn như trên Windows, toàn bộ nút đóng cửa sổ đều màu đỏ với dấu chéo trắng và nằm ở góc trên bên phải của các cửa sổ. Hoặc trong Microsoft Office, toàn bộ những công cụ định dạng văn bản như Bold, Italic, chỉnh font chữ, cỡ chữ đầu nằm ở thẻ Home, bất kể bạn đang dùng Word, Excel, PowerPoint, Visio hay gì đi nữa. Bằng cách thống nhất, chúng ta giúp người dùng tương tác với giao diện một cách nhanh chóng hơn, đỡ phải nhớ nhiều tình huống khác nhau.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;"><img alt="HTC_Design." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/htc_design-jpg.1269816/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" /></span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;">Với HTC, tất cả app của họ đều có nút tìm kiếm, add và menu ở cạnh trên</span>​</div><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>5. Hạn chế lỗi</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Cũng như DOET, hệ thống và giao diện cần phải được thiết kế với tâm niệm rằng người dùng luôn mắc lỗi, và điều quan trọng giao diện là phải bao quát được hầu hết các lỗi thông dụng. Người thiết kế/lập trình viên cũng cần phải hạn chế tối đa nguồn phát sinh lỗi.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Ví dụ:</span><br /><ul style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 1em 0px 1em 3em; outline: none; padding: 0px; text-align: justify;"><li style="border: none; list-style: disc outside; margin: 0px; outline: none; padding: 0px;">Combobox, radio button, checkbox: chỉ phép người dùng chọn một số thứ do lập trình viên hoặc nhà thiết kế định trước, không thể tự mình nhập cái mới (ví có khả năng phát sinh lỗi)</li><li style="border: none; list-style: disc outside; margin: 0px; outline: none; padding: 0px;">Vô hiệu hóa một thành phần giao diện nào đó khi không cần thiết.</li></ul><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>6. Cung cấp sự linh hoạt cho người dùng</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Lúc mới xài máy tính, để copy một thứ gì bạn thường làm gì? Chọn nội dung hoặc file đó, nhấp phím phải chuột, chọn copy, qua chỗ khác, lại nhấn phím phải chuột, chọn paste. Về sau, khi chúng ta có kinh nghiệm hơn, thao tác đó được đơn giản hóa đi rất nhiều bằng cách sử dụng phím tắt Control + C, Control + V. Đây chính là ví dụ cho nguyên lí thứ 6 của Nielsen. Ngoài ra, khi hệ thống cần phải thay đổi giao diện, việc giữ lại sự linh hoạt như bản cũ là điều cần thiết, nếu không người dùng sẽ cảm thấy rất thất vọng vì mất đi một thứ mà họ đang dùng quen tay.</span><i style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;"><b>Một số ví dụ khác ngoài phím tắt có khả năng cung cấp sự linh hoạt cho người dùng:</b></i><br /><ul style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 1em 0px 1em 3em; outline: none; padding: 0px; text-align: justify;"><li style="border: none; list-style: disc outside; margin: 0px; outline: none; padding: 0px;">Dùng bàn phím để di chuyển giữa các phần giao diện</li><li style="border: none; list-style: disc outside; margin: 0px; outline: none; padding: 0px;">Breadcrumbs: cho người dùng biết họ đang ở đâu, đồng thời cho phép họ di chuyển đến những nơi khác trong hệ thống.</li><li style="border: none; list-style: disc outside; margin: 0px; outline: none; padding: 0px;">Menu chuột phải</li><li style="border: none; list-style: disc outside; margin: 0px; outline: none; padding: 0px;">Cho phép người dùng cá nhân hóa giao diện: di chuyển và sắp xếp icon, tự chọn cách đặt widget trên Android,…</li></ul><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: #888888; list-style: none; margin: 0px; outline: none; padding: 0px;"><img alt="Breadcrumb." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/breadcrumb-jpg.1269810/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" /></span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: #888888; list-style: none; margin: 0px; outline: none; padding: 0px;">Breadcrumb của Tinh tế</span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;">​</div><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>7. Giảm tải những gì người dùng cần phải nhớ</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Để làm được điều này, nhà thiết kế và lập trình viên cần đảm bảo rằng người dùng có thể thấy hết các tính năng chính một cách dễ dàng. Người dùng không cần phải nhớ những thứ phức tạp khi sử dụng các thành phần trong hệ thống. Lập trình viên và nhà thiết kế cần lưu ý rằng việc nhìn và nhận diện (recognition) sẽ luôn tốt hơn là bắt người dùng nhớ lại những gì đã từng diễn ra (recall). Việc ứng dụng biểu tượng đồ họa, gợi ý về password, sử dụng màu sắc để thông báo một thứ gì đó đã được hoàn tất… là những ví dụ cho nguyên lý thứ 7 bởi nó giúp người dùng biết ngay rằng tính năng đó là gì và để làm gì. Cũng như khi giao diện đồ họa ra mắt, nó đã giúp mở ra cả một kỉ nguyên máy tính mới và ai cũng có thể xài PC, chứ lúc còn chạy bằng giao diện dòng lệnh (CLI) thì không mấy người có thể tiếp cận với máy tính vì nó quá khó và phải nhớ quá nhiều thứ.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;"><img alt="GUI_vs_CLI." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/gui_vs_cli-jpg.1269815/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" /></span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;">Bạn thích dùng cái nào hơn? Giao diện người dùng đẹp mắt hay là giao diện dòng lệnh đen thui và phải gõ gõ tùm lum?</span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;">​</div><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Một ví dụ khác: để tìm một sinh viên nào đó thì nên dùng tên chứ đừng bắt buộc người dùng phải nhớ mã sinh viên, mặc dù chúng ta có thể cung cấp thêm tùy chọn tìm kiếm bằng mã.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>8. Giao diện phải có tính thẩm mỹ, đẹp và có liên quan</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Đẹp, đó là chuyện mà ai cũng muốn, và giao diện đẹp thì luôn được đánh giá cao. Hãy nhìn vào cách mà Apple thiết kế iOS hay những gì Google làm với Android, tất cả đều xoay quanh một chữ đẹp. Khi sử dụng một thứ gì đó có tính thẩm mỹ cao thì người dùng sẽ cảm thấy hài lòng hơn và có hứng hơn. Ngoài ra, thông tin cung cấp cho người dùng cũng phải liên quan, nếu không thì cũng bằng thừa. Ví dụ, trong một thông báo hiện ra trước khi lưu tập tin, thứ mà chúng ta nên đưa vào đó là câu hỏi "bạn có muốn lưu đè tập tin hay không" hoặc "bạn có muốn lưu nó vào đây hay không", không phải là một bài viết dài về cách lưu tập tin, tác hại khi không xài phần mềm đúng cách (!?).</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>9. Giúp người dùng xác định và cách khắc phục sau khi lỗi xảy ra</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Thông báo khi có lỗi phải dễ hiểu và cho người dùng biết lỗi đó là gì, chứ đừng hiện một đống mã lỗi lên. Điều đó sẽ làm người dùng nản chí. Ngoài ra, giao diện cũng cần nói cho người dùng biết những biện pháp khả thi để khắc phục lỗi, chứ không nên để mặc người dùng muốn làm gì thì làm.</span><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;"><img alt="Bsod_nt." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/bsod_nt-jpg.1269811/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" /></span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;">Thông báo lỗi "màn hình xanh chết chóc" của Windows 7 quá rồi, làm người ta hoảng và không biết phải làm gì hoặc chuyện gì sẽ xảy ra. Còn lên Windows 8, Microsoft thay đổi nó để nói cho chúng ta rằng "hệ điều hành đang thu thập lỗi và sẽ tự khởi động máy lại cho bạn".</span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;">​</div><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #2978d5; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;"><b>10. Cung cấp sự trợ giúp, tài liệu hướng dẫn sử dụng</b></span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><span style="background-color: #fcfcff; border: none; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; list-style: none; margin: 0px; outline: none; padding: 0px; text-align: justify;">Bạn có thể thấy rằng bất kỳ phần mềm nào, dù đơn giản đến đâu thì cũng đều có mục trợ giúp (Help) hoặc tài liệu hướng dẫn sử dụng (documentation), hoạt ít nhất cũng có một dòng nói rằng cần sử dụng phần mềm như thế nào. Đây là cách cuối cùng mà người dùng sẽ tìm đến khi họ không thể thực hiện một thao tác nào đó. Hãy thử tưởng tượng xem nếu như bạn sử dụng phần mềm mà khi gặp lỗi, bạn không thể tìm được bất kỳ sự trợ giúp nào thì điều đó thật là tệ. Tùy theo độ phức tạp của giao diện và phần mềm mà người ta sẽ soạn thảo các tài liệu hướng dẫn sử dụng và phần trợ giúp tương ứng. Tooltip box - dòng thông báo nhỏ hiện ra khi chúng ta rê chuột lên một nút, một ô, một hộp thoại,… - cũng chính là một sự trợ giúp chứ không phải cứ vào Help mới là trợ giúp.</span><br style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;" /><br /><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;"><img alt="Tro_giup_su_dung_iPad." class="bbCodeImage LbImage" src="http://cdn.tinhte.vn/attachments/tro_giup_su_dung_ipad-jpg.1269822/" style="border: 0px none; cursor: pointer; list-style: none; margin: 0px; max-width: 100%; outline: none; padding: 0px;" /></span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;"><span style="border: none; color: grey; list-style: none; margin: 0px; outline: none; padding: 0px;">Trợ giúp sử dụng giao diện trên iPad</span>​</div><div style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; margin: 0px; padding: 0px; text-align: center;">​</div><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">Đây là hai trong số các bộ nguyên lý thường được xài. Hi vọng nó sẽ giúp các bạn hiểu thêm về cách người ta làm ra những giao diện mà ta sử dụng hằng ngày.</b><br /><b style="background-color: #fcfcff; color: #141414; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 20.53333282470703px; text-align: justify;">Tổng hợp: tinhte.vn</b></div></div>

Quy tắc dùng để thiết kế nên các giao diện cho phần mềm

Để có 1 phần mềm được gọi là "có khoa học" nhiều  developer  đã phải bỏ ra không ít thời gian cũng như trí não cho nó. Nếu trong t...

Read more »