CSS Sprites rất hay được sử dụng, và càng phổ biến hơn trong HTML5 để diễn hoạt các hành động dựa trên các frame hình trong Sprites. Sprites có nghĩa là có nhiều khung hình trong 1 ảnh.

Để hiểu CSS Image Sprites là gì? chúng ta cùng xem xét cách thiết kế Navigation như hình bên dưới, nếu theo cách thông thường bạn phải cần ít nhất ít nhất 8 hình ảnh để làm ảnh nền (Nếu tính cả 4 ảnh cho hiệu ứng Rollover).

CSS Image Sprites là cách gộp nhiều ảnh nền cần sử dụng vào một file hình duy nhất và sử dụng thuộc tính background()-position trong CSS với 2 vị trí Left, Top để  xác định vị trí thành phần ảnh cần làm nền, nhằm giảm tải Request (yêu cầu) đến Server, và giảm dung lượng file hình, tăng tốc độ tải trang, tiết kiệm tài nguyên hệ thống. 

Cách sử dụng CSS Image Sprites 
Trước tiên bạn phải sử dụng một chương trình đồ họa như Photoshop…, và gộp các file ảnh cần sử dụng lại thành một file duy nhất. Mình gộp 8 file hình cần sử dụng tại ví dụ trên thành một file duy nhất với tên icon.gif như sau: 


  
Bạn nên sắp xếp cho thuận lợi trong việc tính toán vị trí của các ảnh. 

Tôi sắp xếp các  ảnh liền kề nhau từ trái sang phải, phần đối xứng bên dưới là các hình ảnh sử dụng cho hiệu ứng Rollover. 
Tiếp theo là mã HTML 
<div id="wrapper"> 
<ul id="icon"> 
     <li class="user"><a href="#">User</a></li> 
     <li class="rss"><a href="#">Rss</a></li> 
     <li class="comment"><a href="#">Comment</a></li> 
     <li class="global"><a href="#">Global</a></li> 
</ul> 
</div>

Mã CSS 
{margin: 0; padding: 0} 
#wrapper{margin: 30px auto; width: 500px} 
#icon li{float: left; margin-right: 50px; list-style: none} 
#icon li a{height: 85px; display: block; background():url(imgs/icon.gif); text-indent: -999999px} 

Ở đoạn mã CSS trên chúng ta sử dụng file hình icon.gif  duy nhất làm nền cho các thành phần liên kết (#icon li a)

Tiếp theo  chúng ta sẽ Sử dụng thuộc tính background()-position để xác định vị trí thành phần ảnh cho các thành phần trong Navigation. 

Từ  Photoshop bạn có thể xác định được kích thước các thành phần ảnh như sau: 



+  Thành phần icon user (#icon li.user a) sử dụng phần trên cùng bên trái của file ảnh icon.gif, nên có vị trí : left: 0px, top: 0px và có độ rộng 54px. 

#icon li.user a{width: 54px; background()-position: 0 0}

+ Thành phần icon rss(#icon li.rss a) 
Thành phẩn ảnh chứa icon RSS có vị trí cách bên trái 54px (Bằng độ lớn của thành phần (#icon li.user a), do đó chúng ta phải di chuyển thành phần ảnh này sang trái -54px để trở về đúng vị trí 0 0, và có độ rộng 51px. 

#icon li.rss a{width: 51px; background()-position: -54px 0}

Tương tự thành phần icon Comment chúng ta phải dịch chuyển về bên trái 54px (độ lớn icon User) + 51px (Độ lớn icon RSS) = 105px 

#icon li.comment a{width: 61px; background()-position: -105px 0}

Và icon Global dịch chuyển 105 + 61 = 166px 

#icon li.global a{width: 54px; background()-position: -166px 0}

Các thành phần ảnh tạo hiệu ứng Rollover có vị trị left giống như trên, chỉ thay đổi vị trí top được dịch chuyển xuống phía dưới 85px (Bằng chiều cao của các Icon), nên ta có mã CSS như sau: 

#icon li.user a:hover{background()-position: 0 85px} 
#icon li.rss a:hover{background()-position: -54px 85px} 
#icon li.comment a:hover{background()-position: -105px 85px} 
#icon li.global a:hover{background()-position: -166px 85px}

Kết Luận
Vị trị left của thành phần ảnh chính là giá trị âm độ lớn khoảng cách của nó so với bên trái. Ví dụ Icon Comment cách bên trái 105px nên vị trí left của nó là: -105px. Vị trí top chính là khoảng cách độ lớn khoảng cách giữa nó so với bên trên. 

Responsive web design là một khái niệm dành cho các nhà thiết kế và phát triển ứng dụng web nhằm đáp ứng và thích nghi được với môi trường (hay thiết bị) của người dùng về kích thước màn hình, platform, trạng thái xoay hay đứng như: giao diện trang web phải thích nghi được trên từng loại thiết bị dù cho người đó dùng Iphone, iPad, netbook, BlackBerry, Kindle hay những chiếc điện thoại di động có màn hình nhỏ.

Khái niệm về Responsive web design
Responsive web design không phải là ý tưởng hoàn toàn mới, nó kế thừa và tương tự như responsive architecture, trang web khi được thiết kế phải có khả năng tự động điều chỉnh để thích nghi với nhiều nhóm người sử dụng khác nhau. Responsive web design không chỉ là việc tùy chỉnh cho phù hợp với kích thước màn hình và resize lại hình ảnh, mà nó mở ra một cách nghĩ hoàn toàn mới về thiết kế. 

Độ phân giải màn hình
Càng nhiều thiết bị, càng nhiều độ phân giải khác nhau, sự phổ biến của những thiết bị như iPhone, iPad và các smartphone có thể chuyển từ dạng xem ngang và đứng một cách nhanh chóng.

 

Hơn nữa khi thiết kế cho cả màn hình nằm ngang và màn hình đứng, chúng ta phải tính đến hàng trăm kích thước màn hình khác nhau. Ta có thể nhóm một số kích thước lại với nhau và thiết kế cho từng nhóm một, và thiết kế riêng cho từng nhóm này nếu cần thiết. 

Flexible layout



Hình ảnh cần phải được tự động điều chỉnh và không được phép làm vỡ cấu trúc website, vì ta không làm một sản phẩm in ấn. Khi kích thước ảnh không bị fix ở một giá trị nào đó, nó mang lại nhiều lợi ích hơn mong đợi, ý tưởng tuyệt vời cho những những thiết bị có thể xoay ngang và đứng.

Filament Group’s Responsive Images

 

Kỹ thuật này được giới thiệu bởi Filement Group, theo đó thay vì resize lại hình ảnh, sẽ load hẳn một ảnh khác khi cần, cách này có thể tiết kiệm được việc load ảnh lớn không cần thiết với các thiết bị nhỏ.

Media Queries
CSS 3 vẫn hỗ trợ đầy đủ media type từ CSS2.1 như screen, print, handheld, và đã bổ sung khá nhiều khai báo mới như max-width, device-width, orientation, color. May mắn thay những thiết bị chạy android, ipad đều không sử dụng trình duyệt IE, nên bạn an tâm khi sử dụng những thuộc tính css 3.

Ẩn hoặc hiển thị nội dung
Rõ ràng việc chỉ hiển thị những nội dung thật sự cần thiết trên những thiết bị có kích thước nhỏ là cần thiết, kinh nghiệm cho thấy trên các thiết bị di động bạn chỉ nên có một thanh navigation đơn giản, nhấn mạnh nội dung, xem dạng list nhiều dòng tốt hơn là chia thành nhiều cột

Touchescreen vs Cursors

 

Màn hình cảm ứng ngày càng phổ biến. Những thiết bị có màn hình cảm ứng thường có kích thước nhỏ, rõ ràng bạn phải thấy được rằng việc tương tác qua ngón tay cần một khoản không gian lớn hơn như khi dùng chuột, màn hình cảm ứng cũng không có trạng thái hover.

Tổng Kết
Web design không đơn thuần là tạo ra sản phẩm đẹp trong mắt người dùng mà còn là công việc tạo ra trải nghiệm mới cho người dùng. Responsive web design nếu được ứng dụng tốt sẽ tăng trải nghiệm người dùng không những thế còn giải quyết vấn đề hiển thị trên nhiều loại thiết bị, mọi nền tảng, nó sẽ còn được tiếp tục cải thiện trong nhiều năm tới.

Lazyload là plugin của jQuery cải thiện việc tải hình ảnh ở những trang web dài. Ảnh bên ngoài khung hình sẽ chỉ thể hiện khi người dùng kéo chuột tới. Sử dụng Lazyload ở những trang web dài với nhiều hình ảnh sẽ giúp cho trang được tải nhanh hơn, trong một số trường hợp nó còn giúp giảm tải cho máy chủ web.

Description:
Như cái tên gọi của nó: “Lazy”. Hình ảnh trên web của bạn sẽ được delay để tải sau, do đó thay vì tải hình, trình duyệt sẽ lo phần nội dung text trước. Tốc độ được cải thiện đáng kể.
Hình ảnh chỉ được tải khi nó lọt vào tầm nhìn của người dùng

Cách sử dụng 
Trước tiên, bạn cần download jQuery và Lazyload plugin. Sau đó thêm vào trong thẻ <head> của trang web. Bạn có thể dowload lazy load plugin tại:
https://raw.githubusercontent.com/tuupola/jquery_lazyload/master/jquery.lazyload.js
Sau đó để sử dụng lazy load bạn chỉ cần một câu lệnh đơn giản:
Tùy biến theo yêu cầu cá nhân 
Lazyload cung cấp một số lựa chọn như load 1 phần của ảnh, dùng ảnh thay thế, gọi sự kiện, hiệu ứng khi xuất hiện ảnh, đặt thời gian tải ảnh... Bạn có thể xem thêm tại trang chủ của lazyload: http://www.appelsiini.net/projects/lazyload
Đoạn mã dưới đây sẽ tải trước 200px của ảnh trước khi ảnh xuất hiện 
Dùng ảnh thay thế 
Ảnh thay thế đi cùng plugin ảnh gif 1x1px, bạn có thể thay bằng đường dẫn ảnh riêng của mình 

Sử dụng hiệu ứng mờ khi xuất hiện 
Demo tại đây: http://www.appelsiini.net/projects/lazyload/enabled.html

Corner plugin giúp bo tròn các thẻ HTML mà không cần dùng đến ảnh background. Plugin cung cấp cho bạn rất nhiều lựa chọn về bo góc.



Cách sử dụng
Trước tiên, bạn cần download jQuery và Corner plugin. Sau đó thêm vào trong thẻ <head> của trang web. Bạn có thể dowload corner plugin tại: http://malsup.github.io/jquery.corner.js

Các mẫu góc bo
Mặc định là góc bo tròn

Tuỳ chọn góc bo
Sử dụng top, bottom, left, right, tl, tr, bl, br để tuỳ chọn vị trí góc bo


Xác định kích thước góc bo
Thêm giá trị px để xác định kích thước góc bo


Lồng hiệu ứng


Chọn màu

Bạn có thể xem thêm các cách tuỳ biến của plugin corner trên trang: http://jquery.malsup.com/corner/

Công nghệ ngày nay đã và đang ngày càng đẩy lùi những cách làm việc truyền thống để đem lại sự tiện lợi và hiệu quả dành cho giới thiết kế.

 

 

(Nhấp chuột vào hình để tới liên kết tải ứng dụng).

Paper by FiftyThree

 

 

Đây là một ứng dụng giải quyết rất tốt việc phác hoạ. Nó có giao diện đơn giản, không menu và nút khiến nó sử dụng dễ dàng. Hãy mang theo iPad và bỏ hết giấy bút ở nhà.

 

Adobe ideas

 

 

Ứng dụng này sẽ thay thế bút và giấy của bạn với khung làm việc kỹ thuật số đi kèm với nhiều loại bút có thẻ tuỳ chỉnh. Nó còn có ở định dạng vector để bạn sử dụng.

 

SketchBook Pro for iPad

 

 

Một trong những ứng dụng phổ biến nhất cho việc vẽ. Nó có rất nhiều bút, bút chì, airbrush để lựa chọn. Ứng dụng này nhẹ và dễ sử dụng, nó cho phép bạn làm việc với layer, lựa chọn làm mờ, và các chế độ blend cao cấp.

 

Adobe Photoshop Touch

 

 

Với ứng dụng này bạn có thể áp dụng các hiệu ứng chuyên nghiệp, hoạt động với nhiều layer và các chế độ blend, kết hợp hình ảnh. Nó còn liên kết với iClound Photo Stream và hình ảnh độ phân giải cao.

 

Tayasui Sketches

 

 

Ứng dụng này hoàn hảo cho bất cứ việc gì mà chúng ta có thể sáng tạo. Có nó bạn có thể phác thảo, tô màu nước và minh hoạ.

 

Inspire Pro

 

 

Đem tới một bản phác tuyệt hảo bằng cách sử App này. Ứng dụng sẽ hữu ích cho cả dân tập sự và hoạ sĩ chuyên nghiệp. Nó có tới 60 loại bút chất lượng cao để lựa chọn, được chia thành 6 bộ; Sơn dầu, airbrush, hình cơ bản, bút sắt, phấn màu.

 

Auryn Ink

 

 

Bạn đang có trong tay một ứng dụng có thể vẽ màu nước vô cùng dễ dàng. Nó có những tính năng giới hạn có thể so sánh với những ứng dụng có trong danh sách.

 

ArtRage

 

 

Ứng dụng có rất nhiều lựa chọn về giấy, đi kèm với nhiều loại bút: bút chì, phấn, bút lông…

 

Zen Brush

​

 

 

Với 64 mẫu giấy và 3 loại bút có sẵ. bạn có thể thử sức với bút mực, rất dễ sử dụng.

 

 

 

Theo WDL

Koodoo là thương hiệu bán bánh pizza nhanh tại Nga. Qua tay những nhà thiết kế chuyên nghiệp Koodoo có một hình ẳn thân thiện và dễ thương.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Trong năm 1910, nhà tâm lý học Max Wertheimer đã phát hiện ra điều thú vị khi ông quan sát thấy một loạt các ánh đèn bật tắt khi đoàn tàu lửa đi qua một ngã tư. Điều tương tự với các bóng đèn nhấp nháy được bố trí xung quanh rạp chiếu phim.

 

 

Khi quan sát, chúng ta có cảm giác một bóng đèn đang di chuyển vòng vòng, trong khi thực tế việc các bóng đèn cố định nhấp nháy có thứ tự khiến chúng ta cảm giác nó đang chạy.

 

Phát hiện này dẫn tới một loạt các nguyên tắc mô tả về cách chúng ta nhận biết vật thể. Các nguyên tắc này chiếm vị trí quan trọng trong mọi vấn đề khi chúng ta làm thiết kế.

 

Chúng ta nên bắt đầu với nguyên tắc Gestalt (từ tiếng Đức, nghĩa là hình dạng, hình dáng), bởi vì các nguyên tắc thiết kế đều phát sinh từ lý thuyết gestalt. Trong bài này, tôi sẽ cùng bạn ôn lại một chút về lý thuyết và đưa ra một vài định nghĩa cơ bản của nguyên tắc Gestalt.

 

Những bài tới chúng ta sẽ xem xét các vấn đề như không gian, cân bằng, phân cấp thị giác. Chúng ta sẽ chỉ ra những ảnh hưởng của nguyên tắc Gestalt lên khía cạnh của thiết kế và một vài ví dụ thực tế để chỉ ra những nguyên tắc gestalt đang được sử dụng.

 

Ý tưởng chính đằng sau của nguyên tắc Gestalt 

"Tổng thể không phải là sự tổng hợp của từng bộ phận"

 

- Kurt Koffka

 

Câu trên là một nguyên tắc Gestalt thu gọn. Khi con người chúng ta nhìn thấy một nhóm vật thể, chúng ta nhận ra toàn bộ chúng trước khi nhìn các vật thể riêng biệt. Chúng ta thấy tổng thể nhiều hơn là thấy tất cả vật thể, và thậm chí khi những phần được chia ra riêng rẽ, chúng ta vẫn nhìn theo cách tập hợp chúng như tổng thể.

 

Có rất nhiều ý tưởng chính đằng sau Gestalt:

 

Sự xuất hiện (Tổng thể được xác định trước từng phần)

 

Sự xuất hiện là quá trình tạo hình các mẫu phức tạp theo các quy luật đơn giản. Khi chuẩn bị xác định một đối tượng, đầu tiên chúng ta sẽ xác định nét bên ngoài (outline). Chúng ta sau đó định hình các nét bên ngoài tương ứng với các hình dạng và vật thể chúng ta đã biết trước đó để tìm hình quen thuộc. Chỉ sau khi nhận ra mẫu phù hợp thông qua sự tổng hợp các nét bên ngoài, chúng ta mới bắt đầu xác định những phần đã tạo nên tổng thể đó. 

 

Khi thiết kế, chúng ta cần nhớ rằng con người sẽ nhận ra các vật thể bởi hình dáng chung của chúng. Một cách đơn giản để nhận biết vật thể sẽ giúp chúng ta xử lý nhanh hơn là đi sâu vào các chi tiết.

 

Sự vật hoá (bộ óc sẽ hoàn thành phần còn trống)

 

Sự vật hoá (reification) là một khía cạnh của nhận thức trong đó các đối tượng được nhận thức có chứa các thông tin không gian nhiều hơn nó thật sự có.

 

Như cách chúng ta cố gắng để khiến thứ chúng ta thấy quen thuộc với thứ nào đó chúng ta đã lưu trong bộ nhớ, mà thường thì nó chính không hoàn toàn chính xác. Thay vào đó chúng ta tìm thấy một kết quả gần đúng và tự tạo ra các phần còn trống mà chúng ta nghĩ chúng ta sẽ thấy.

 

Sự vật hoá giúp chúng ta không cần phải trình bày một hình dạng bên ngoài hoàn hảo để người xem có thể thấy nó. Chúng ta có thể bỏ đi một vài phần bên ngoài miễn là chúng đủ gần gũi với mẫu ban đầu. Bạn có thể xem các vị dụ bên dưới đối với quy tắc của sự gắn kết.

 

Liên kết ổn định (bộ não tìm cách tránh sự không chắc chắn)

Liên kết ổn định là xu hướng của trải nghiệm cảm nhận mơ hồ nhằm đem lại sự ổn định và qua lại giữa các cách diễn giải khác nhau. Một số đối tượng có thể được nhận ra theo hơn một cách. Một ví dụ trong các sắp đặt ở dưới. Hình ảnh có thể nhìn thấy như là hai khuôn mặt hoặc là một chiếc bình.

 

Bạn không thể nhìn thấy cả hai cùng một lúc. Thay vào đó bạn chuyển đổi qua lại nhanh chóng giữa hai lựa chọn này. Một có vẻ là nhận thức chủ yếu và sau đó bạn bắt đầu có thể nhìn thấy cái kia.

 

Từ góc độ người thiết kế nếu bạn muốn thay đổi nhận thức một số người, đừng có cố gắng thay đổi thất cả cùng một lúc. Tìm một cách nào đó để khiến họ thấy một sự thay thế bên cạnh yếu tố mà họ hình dung ban đầu. Sau đó tạo thêm sức mạnh cho phương pháp thay thế đó và làm yếu đi cách ban đầu.

 

Bất biến (chúng ta giỏi trong việc nhận ra những gì tương tự và khác biệt)

 

Bất biến là bản chất của nhận thức trong những đối tượng đơn giản được nhận biết độc lập với những đảo ngược, biến dạng và thu phóng. Vì chúng ta thường xuyên gặp phải những đối tượng từ các góc độ khác nhau, chúng ta đã phát triển khả năng nhận thức chúng cho dù chúng xuất hiện khác đi.

 

Hình dung nếu bạn chỉ có thể nhận ra ai đó bạn biết nếu họ phải đứng chính diện, và bạn không biết nếu họ xoay mặt ngang hoặc quay lưng. Ngoài những góc độ nhận biết đặc biệt thì chúng ta vẫn có thể nhận ra ai đó.

 

Bạn có thể thấy những ý tưởng này trong các nguyên tắc dưới. Ý tưởng chính là nguyên tắc Gestalt là về nhận thức và những gì được mang tới bởi các đối tượng. Các nguyên tắc nói ra phần cốt lõi của ngôn ngữ thị giác trong các môi trường làm việc.

 

Nguyên tắc Gestalt

Hầu hết các nguyên tắc đều tương đối dễ hiểu. Chúng có những nhận biết chung xuất hiện trong đó.

 

"Tất cả đều tương đương, các yếu tố đều có liên quan tới dự định X được nhận thức nhóm lại thành các đơn vị cấp bậc cao hơn".

 

- Stephen Palmer

 

Rất nhiều các nguyên tắc dưới đây tuân theo mẫu này. Các nguyên tắc khác xác định X hoặc các cấp bậc cao hơn được nhận thấy.

 

Quy luật của PRÄGNANZ (Tạo hình tốt, quy luật của sự đơn giản)

 

"Con người sẽ cảm nhận và giải thích hình ảnh mơ hồ hoặc hình ảnh phức tạp trong một/nhiều hình dạng đơn giản nhất có thể".

 

Đây là nguyên tắc cơ bản của Gestalt. Chúng ta thích những thứ đơn giản, rõ ràng và được phân cấp. Bản chất của những điều này là chúng an toàn hơn. Chúng lấy ít thời gian của chúng ta để nhận biết và hiển thị ít bất ngờ hơn.

 

Khi phải đối mặt với những hình dạng phức tạp, chúng ta có xu hướng sắp xếp chúng lại thành các đối tượng đơn giản hoặc một tổng thể đơn giản. 

 

 

 

 

Bạn thích nhìn hình bên trái phía trên được tạo bởi các vòng tròn, hình vuông và tam giác đơn giản hơn là bạn nhìn thấy hình bên phải với sự phức tạp màu sắc và một hình dạng tổng thể mơ hồ.

 

Trong trường hợp này, nhìn ba vật thể khác khá đơn giản hơn là nhìn một đối tượng phức tạp. Trong trường hợp khác, đơn giản là thấy một đối tượng riêng biệt, điều mang tới chúng ta … sự gần gũi.

 

Sự liên kết

 

"Khi nhìn một sự sắp xếp các yếu tố phức tạp, chúng ta muốn nhìn một mẫu đơn và có thể nhận biết được.

 

Như với quy luật Prägnanz, sự liên kết nhìn đơn giản. Sự liên kết là trái ngược với những gì ta nhìn thấy trong bức hình quy luật Prägnanz phía trên nơi ba đối tượng đơn giản hơn là một. Với sự liên kết, chúng ta thay thế sự kết hợp từng phần vào một hình dạng tổng thể đơn giản. Mắt chúng ta tự điền các thông tin còn thiếu để tạo thành những hình hài hoàn hảo.

 

 

Trong tấm hình bên trái phía trên, bạn sẽ thấy một tam giác trắng cho dù trên hình chỉ thực sự gồm ba hình giống như trò chơi Pac-Man màu đen.

 

Với hình phía bên phải, bạn thấy một chú gấu trúc cho dù hình hiện hữu là tập hợp các hình dạng ngẫu nhiên. Nhìn ra hình tam giác và con gấu dễ hơn là cố gắng nhìn những đối tượng riêng biệt. Sự liên kết có thể coi như là một chất keo giữ các yếu tố lại với nhau. Đó là việc con người có xu hướng tìm kiếm một mẫu quen thuộc.

 

Chìa khoá để gắn kết là cung cấp đầy đủ thông tin để mắt (bộ não) có thể tự tìm ra những phần còn lại. Nếu thiếu hụt quá nhiều, các yếu tố sẽ sự chia ra các phần nhỏ thay vì tạo nên một tập hợp. Nếu quá nhiều thông tin đựơc cung cấp, thì sự gắn kết không xảy ra.

 

Tính đối xứng và thứ tự (order)

 

"Mọi người có xu hướng nhận thức các vật thể với các hình dạng đối xứng từ trung tâm".

 

Sự đối xứng cho phép chúng ta một cảm giác của sự vững chắc và trật tự, thứ mà chúng ta mong muốn thấy.

 

Chúng ta thường áp đặt trật tự từ hỗn loạn một cách tự nhiên.

 

Nguyên tắc này dẫn ta tới mong muốn cân bằng trong các sắp xếp thành phần, mặc dù các sắp xếp không hoàn toàn đối xứng để tạo cân bằng.

 

 

Trong hình ảnh phía trên, bạn sẽ thấy 3 cặp dấu ngoặc mở và đóng. Nguyên tắc đối xứng khi chúng ta đọc bài viết này, có thể gợi ý chúng ta thấy cái gì khác. Điều đó cho thấy sự đối xứng được ưu tiên hơn là gần nhau.