Sưu tập các banner cho web đẹp

Business Banners - Banners & Ads Web Elements
Nguồn: http://graphicriver.net/item/business-banners/10636514


Business Banners - Banners & Ads Web Elements

Mega Sale Banners - Banners & Ads Web Elements

Beauty & Spa Banners Bundle - 3 Sets - 63 banners - Banners & Ads Web Elements

Các mẫu Standee cực đẹp và chuẩn





Nguồn: https://www.behance.net/gallery/16897919/Banner-Du-Hc-Nht
https://www.behance.net/loantrang
----------------------



10 thủ thuật thiết kế chữ trên ảnh

Một trong những kỹ thuật tốt nhất để hoàn thiện tác phẩm design của bạn là thiết kế chữ trên bất kỳ một hình ảnh nào, nó cũng là một trong những vấn đề có thể làm giảm bớt đi sự thành công của tác phẩm nếu bạn không biết cách sử dụng một cách khéo léo.
Bạn phải có một hình ảnh phù hợp, một con mắt nghệ thuật về các kiểu chữ, và bạn phải xác định rõ mục đích bạn muốn đạt được cho việc thiết kế này là gì, sau đó mới bắt tay vào thực hiện việc design. Sau đây là 10 thủ thuật dành có bạn, hy vọng nó hữu ích và mang lại cho bạn những thiết kế đẹp mắt

1. Tạo tương phản

force
pack
Chữ bắt buộc phải đáp ứng điều kiện quan trọng nhất là dễ dàng cho việc đọc, điều này góp phần không nhỏ trong sự thành công của thiết kế. Bạn hãy chắc chắn rằng màu chữ của bạn đủ tương phản để có thể dễ dàng đọc trên bất kỳ một hình ảnh nào. Nếu bạn sử dụng hình ảnh tối, lựa chọn tốt nhất cho bạn là chữ màu trắng hoặc những màu tươi sáng. Ngược lại, nếu bạn có một hình ảnh sáng, hãy sử dụng những màu chữ tối để tạo sự tương phản rõ ràng giữa các yếu tố.
Ngoài ra, sự tương phản không chỉ dừng lại ở việc màu sắc của chữ và hình ảnh, nó còn thể hiện ở kích thước, kiểu chữ, v.v… Ví dụ trong hình minh họa ở trên, ta có thể dễ dàng thấy được, hình ảnh đầu tiên có sự tương phản giữa các chữ, chữ in hoa – chữ thường, chữ có chân – chữ không chân. Còn trong hình ảnh thứ hai, ta nhận thấy background là một hình rất lớn và đận, ngược lại họ sử dụng chữ rất mỏng và cao. Những điều đó tạo nên sự tương phản trên tổng thể thiết kế và đóng vai trò rất quan trọng trong tác phẩm của bạn.

2. Đặt chữ như một phần của hình ảnh

mmd
toast
Đôi khi những nội dung chữ ta có thể biến hóa nó thành một phần của hình ảnh mà ta đang sử dụng. Điều này có thể rất khó thực hiện, hoặc cũng chỉ giới hạn trong một số trường hợp đặc biệt, nhưng nó sẽ mang đến hiệu quả rất cao. Bạn có thể sẽ chỉ cần một hình ảnh và chữ đơn giản rồi lồng ghép nó lại, hoặc một bức ảnh chụp có sẵn chữ ở trong đó như ví dụ bên trên.

3. Theo hướng đọc của mắt

hogan
schmid
Làm việc với hướng đọc của mắt trong một hình ảnh có thể nói là một bước rất quan trọng để tạo nên tương tác giữa hình ảnh và chữ. Điều bạn cần là đặt văn bản vào một vị trí hợp lý, ko đè lên hay che khuất phần quan trọng của bức ảnh như là hành động chính trong bức ảnh hoặc bộ mặt của sản phẩm mà bạn muốn trưng bày.
Trong trường hợp hai thiết kế ở trên, nhà thiết kế đã đặt chữ ở một vị trí vô cùng hợp lý và đẹp mắt, chúng ta có thể thấy ánh mắt của hai chủ thể (2 thanh niên) đều đang hướng vào phần nội dung chữ, điều đó khiến cho mắt nhìn của chúng ta cũng bị cuốn theo và dễ dàng tập trung vào đoạn văn bản đó. Các bạn hãy nhớ điều quan trọng này :)

4. Làm nhòe hình ảnh

niche
wallmob
Một cách đơn giản nhất bạn có thể làm khi kết hợp chữ với hình đó là làm nhòe (blur) một phần của hình ảnh. Làm nhòe một phần của hình ảnh background có thể làm cho chữ của bạn nổi bật hơn, hoặc như trong trường hợp thiết kế Wallmob ở trên, phần background mờ đã làm nổi bật rất rõ hình ảnh sản phẩm cũng như nội dung chữ, giúp cho chúng ta dễ bị thu hút vào những điều mà họ muốn truyền đạt.

5. Đặt chữ trong một nền mờ

tradestone
fall
Khi phải làm việc với những hình ảnh quá sặc sỡ hay hình ảnh quá nhiều sự tương phản, giải pháp tốt nhất cho trường hợp này là chúng ta nên đặt chữ vào một khung hiển thị.
Chúng ta có thể chọn một shape bất kỳ, hình vuông, hình tròn, hình chữ nhật, v.v… Tiếp theo là chọn màu sắc cho shape đó đủ để có thể hiển thị rõ chữ bên trên, giúp chúng ta đọc chữ một cách dễ dàng. Ngoài ra, cũng đừng quên giảm opacity để phần background đó không che khuất đi một phần hình ảnh bên dưới nhé, chúng ta nên chọn mức độ vừa phải đủ để đọc chữ và nhìn được cả hình ảnh background bên dưới.

6. Đặt chữ vào trong background

square
wicker
Một trong những thủ thuật tốt nhất là đưa văn bản vào trong một phần của hình ảnh, chứ không phải đặt lên trên bức hình. Thông thường những hình ảnh gốc, background đơn giản thì dễ dàng cho việc đặt chữ hơn, những hình ảnh đó thường được sử dụng bởi một màu, do đó ta dễ dàng tìm ra được vị trí thích hợp để đặt chữ sao cho dễ nhìn thấy và dễ đọc.
Kết quả cuối cùng là một vị trí trông tự nhiên mà không đòi hỏi phải can thiệp quá nhiều vào chỉnh sửa hình ảnh. Chúng ta cũng có thể kết hợp vài hiệu ứng nhè nhẹ, giúp cho tác phẩm có chiều sâu hơn.

7. Sử dụng kích thước lớn

plain
coffee
Khi bạn không chắc chẳn những gì phải làm, hãy chọn giải pháp sử dụng kích thước lớn. Điều này có thể áp dụng được cho cả hình ảnh. Các yếu tố được sử dụng với kích thước lớn sẽ gây chú ý với người dùng, ví dụ như những tác phẩm ở trên, họ đều sử dụng cả hình ảnh và chữ lớn, giúp tạo nên sự tương phản rất rõ, và nó hầu như có thể được sử dụng cho tất cả các loại hình ảnh.

8. Màu sắc

moving
knuckles
Thêm một chút màu sắc cũng có thể tạo thêm chút thú vị cho hình ảnh. Như 2 trang web ở trên có các cách sử dụng khác nhau : một sử dụng màu sắc tương phản có thể không nhìn thấy một vài từ, nhưng giúp làm nổi bật một vài từ họ cho là quan trọng cần nhất mạnh, còn tác phẩm kia sử dụng một tông màu có thể làm nổi bật hình ảnh và chữ. Cả 2 đều cho kết quả tốt như nhau.

9. Sử dụng thêm một lớp màu

winshape
brandv
Một hiệu ứng đang ngày càng phổ biến là sử dụng thêm một lớp màu che phủ lên hình ảnh gốc để làm nổi bật phần văn bản. Điều này sẽ rất khó khăn để thực hiện nhưng cũng mang lại cho ta hiệu quả tuyệt vời.
Điều quan trọng nhất là lựa chọn màu sắc phù hợp. Sự cân bằng ở đây là màu sắc đó được sử dụng là một lớp trong suốt đủ để nhìn thấy hình ảnh bên dưới, và cũng đủ tương phản để dễ dàng đọc chữ bên trên. Bạn có thể phải thử nghiệm với thật nhiều màu sắc và hình ảnh trước khi sử dụng thủ thuật này. Theo mình nghĩ, bạn có thể bắt đầu với một màu chủ đạo trong tác phẩm hay sản phẩm của bạn.

10. Làm thật đơn giản

sa
cohen
Lời khuyên tốt nhất ở đây là bạn hãy làm thiết kế của bạn càng đơn giản càng tốt, nó được áp dụng bao gồm cho cả hình ảnh và chữ. Khi bạn muốn mọi người nhìn thấy cả hình ảnh và chữ, đôi khi làm nhiều hiệu ứng quá sẽ cho ra kết quả ngược lại.
Khi làm việc với hình ảnh, sử dụng một kiểu chữ đơn giản, và một hình ảnh đơn giản, sẽ cho ra kết quả tốt nhất. Hãy nhớ giữ cho các phần quan trọng nhất của hình ảnh được hiển thị một cách rõ ràng nhất, sau đó đặt chữ vào một vị trí không làm ảnh hướng đến hình ảnh và cũng tạo cảm giác dễ dàng cho người đọc có thể hiểu nội dung câu chữ nhanh nhất.

7 mẹo thiết kế quảng cáo hiệu quả


7 mẹo thiết kế quảng cáo hiệu quả
1. Chọn màu sắc và font chữ thích hợp
chon-mau-font

Có hàng trăm font chữ hỗ trợ tiếng Việt có thể dùng trong thiết kế. Có hàng nghìn màu bạn có thể dùng. Đừng gây khó chịu cho người dùng bằng các màu sắc quá sặc sỡ hoặc font chữ khó đọc
Tham khảo: —————————-


2. Font chữ đậm thu hút sự chú ý hơn
chu-dam
Các từ quan trọng như “SALE” hoặc “50%” cần được bôi đậm


3. Thông điệp, hình ảnh rõ ràng
copy-images
Người dùng có rất ít thời gian. Hãy thiết kế sao để họ có thể xem lướt qua, chứ không phải đọc quảng cáo của bạn.


4. Sử dụng Call-to-action
call-to-action
Ai cũng biết rồi, khỏi cần giải thích nhiều :D


5. Đơn giản hóa tối đa
don-gian-hoa
- Đơn giản hóa thông điệp: một banner chỉ cần và chỉ nên thể hiện 1 thông điệp. Đừng quá tham lam truyền tải nhiều thông điệp, người dùng sẽ ngay lập tức bỏ qua
- Đơn giản hóa chi tiết: banner có chi tiết, hình ảnh, text nào thừa không? Có thể bỏ phần nào mà nội dung thông điệp không bị ảnh hưởng?


6. Giới hạn thời gian/số lượng trên banner
gioi-han-so-luong
Bạn chỉ có thể mua mấy sản phẩm trên trong 2 ngày nữa!
Black Friday, Giờ vàng giá sốc, Thứ năm may mắn…Đi một vòng các siêu thị gia dụng, siêu thị điện máy, bạn sẽ thấy nhan nhản các chương trình giảm giá trong khoảng thời gian cố định…Nó được gọi bằng thuật ngữ “Hunger Marketing”.
Nếu nó đúng với cả kế hoạch Marketing, nó cũng đúng với banner.


7. Khuôn mặt thu hút ánh nhìn
khuon-mat


Với một ngân sách quảng cáo hạn chế, việc tăng hiệu quả của mỗi quảng cáo luôn là bài toàn khó đối với các Marketer. Bài viết 7 cách tăng CTR cho banner hy vọng sẽ giúp bạn cải thiện được chỉ số CTR cho các banner quảng cáo.

1. Ánh mắt hướng tới người xem

Một thiết kế bắt mắt (eye-catching) nghĩa là nó có khả năng thu hút ánh mắt của khách hàng. Không có gì thu hút ánh mắt của mình bằng một ánh mắt khác nhìn chằm chằm vào mình. Phản xạ tự nhiên của con người lúc này là nhìn lại vào ánh mắt đó.
unclesam
Quy luật này được sử dụng rộng rãi trong hội họa, điện ảnh, nhiếp ảnh… Với thiết kế banner quảng cáo, việc đưa một nhân vật có ánh mắt nhìn chằm chằm hướng tới người xem là khá phổ biến, và luôn đem lại hiệu quả tốt.
anh-mat-cham-cham

Hai mẫu quảng cáo trên có CTR khá cao, bằng 300% so với các banner thường

2. Màu của banner

Thử nghiệm cho thấy những màu đỏ sẫm, booc đô, sẫm…thường có hiệu quả khá tốt. Lý giải cho việc này là vì hầu hết các website hiện nay đều sử dụng background trắng. Các màu sẫm của bạn tạo nên sự tương phản rõ rệt. Thu hút ánh mắt người dùng vào banner
Tất nhiên đây là một kết luận quy chụp. Yếu tố màu sắc tùy thuộc cảm quan, sở thích của mỗi nguời. Hơn nữa, việc sử dụng màu nào còn tùy thuộc việc xây dựng nhận diện thương hiệu của từng đơn vị.
Trong quá trình chạy quảng cáo, mong các bạn tiếp tục thử nghiệm và phản hồi.
mau-sac
Mẫu bên trái có CTR cao gấp 180% banner thường.
Mẫu bên phải mới chạy. Nhưng dự đoán sẽ có CTR cao.
Để rút ra kết quả tốt nhất. Các bạn sử dụng phương pháp test A/B như sau:
  • Thiết kế 1 banner với hình nền trong suốt
  • Copy làm 2 hoặc nhiều bản
  • Phối cho mỗi bản một màu background riêng
  • Chạy thử và kiểm tra

3. Con trỏ chuột

Đây thực ra là một chiêu trò đánh lừa thị giác người dùng. Cần rất hạn chế khi sử dụng. Phương pháp này dựa trên yếu tố tâm lý: người dùng máy tính luôn theo dõi vị trí của con trỏ chuột. Ánh mắt của họ sẽ di chuyển theo con trỏ chuột để định vị nơi cần đọc. Vì vậy việc tạo một con trỏ chuột trên banner có thể ngay lập tức thu hút ánh mắt người dùng
con-tro-chuot

Banner bên trái có CRT bằng 400% banner thường.
Banner bên phải có CTR 350% banner thường.

4. Những mũi tên

Giữa hàng loạt banner và content trên website, rất khó để người xem có thể tập trung vào điều gì đó quan trọng. Việc đưa mũi tên vào banner có tác dụng hút ánh mắt khách hàng vào nội dung mình muốn.
2015-01-27_234440
Ánh mắt đi theo hướng mũi tên chỉ gần như một phản xạ. Hãy xem banner sau:
mui-ten

Chỉ với một khoảng màu xanh đậm và viền frame hình mũi tên, banner này đã có ctr bằng 300% các banner khác.

5. Thay đổi Call to Action

Các Call to Action hiện nay đều gặp 3 vấn đề chính:
  • Người dùng gặp quá nhiều Call to Action, dẫn đến nhàm chán, không chú ý
  • Call to Action diện tích quá nhỏ, chỉ như trang điểm cho banner, chứ không phải là thành phần chính
  • Ngôn ngữ của Call to Action quá nghèo nàn, quanh quẩn chỉ có: Mua ngay, xem ngay, click ngay
Khắc phục với từng vấn đề, ta có
  • Thêm các điều hướng cho Call to Action để người dùng dễ thấy, dễ nhận biết
arrow-cta

  • Tăng diện tích Call to Action, dùng diện tích lớn, background tương phản, font chữ to
  • Đổi text của Call to Action bằng từ ngữ sinh động hơn: Mua ngay => Tôi muốn mua; Xem ngay =>  Mua và làm đẹp hôm nay (với Mỹ Phẩm)…

6. Đơn giản và tập trung

Sự tối giản của banner giúp người xem tập trung vào object cần quảng cáo. Trào lưu chụp teen xóa phông cũng dựa trên nguyên tắc tương tự. Hình nền càng đơn giản, đối tượng càng nổi bật và thu hút
don-gian


7. Sun Effects

Những banner có background như thế này rất thu hút ánh mắt người xem. Mọi ánh mắt sẽ được hướng dần về tâm banner
sun-effects


Trên đây là một số cách để tăng CTR cho banner. Những cách này có ứng dụng khá rộng rãi trong quảng cáo: Admicro, Facebook Ads, Google Display, hoặc các quảng cáo bạn muốn đặt trên web

Màu sắc và tỉ lệ chuyển đổi

Với sản phẩm: Màu sắc đóng vai trò rất quan trọng trong quyết định mua hàng của khách hàng.
Với banner: Màu sắc đóng vai trò rất quan trọng tới việc khách hàng click hay không vào banner.
Cùng tìm hiểu một số kiến thức về màu sắc và cách sử dụng màu.

mau-sac-va-cr

 



Nguồn: http://fang.badao.vn/tong-hop-7-meo-thiet-ke-quang-cao-hieu-qua-cao/