Vài mẹo để trang trí bài viết đẹp hơn

Lưu trong Thủ thuật bởi vào ngày 13/10/2013 - Comments

Trong thời gian qua mình có nhận được một số câu hỏi liên quan đến việc trang trí bài viết, thậm chí là hỏi “Bạn sử dụng plugin nào để trang trí bài viết vậy?“. Thực ra mình chẳng cần dùng plugin gì cả vì chỉ cần công cụ soạn thảo bài viết mặc định của WordPress thôi là chúng ta đã có thể trang trí một bài viết vừa chuyên nghiệp lại dễ đọc. Trong bài viết này mình sẽ gợi ý cho các bạn một số cách trang trí bài viết đẹp hơn chỉ với một số cách đơn giản.

1. Tính toán size chữ và chiều cao chữ phù hợp.

Size chữ và khoảng cách giữa các con chữ rất quan trọng trong việc trang trí bài viết trở nên đẹp và dễ đọc hơn nhiều, thậm chí chỉ cần bạn biết cách tính toán size chữ thì website của bạn đã trở nên đẹp hơn rất là nhiều.

Trước khi nói đến cách làm như thế nào thì mình sẽ cần nói qua 2 thuộc tính trong CSS mà trong bài này bạn sẽ sử dụng:

  • font-size: Độ lớn của chữ.
  • line-height: Khoảng cách của chữ theo chiều thẳng đứng, tức là nếu bạn có 2 hàng chữ thì line-height càng cao thì 2 hàng sẽ càng cách xa ra.

Theo như kinh nghiệm của mình, thì mắt của chúng ta sẽ phù hợp với font-size từ 14px đến 16px, ở blog mình hiện tại đang dùng là 14px. Như vậy, mình sẽ đề nghị cho bạn 3 thông số chữ như sau:

Dành cho font chữ không chân (Arial, Helvetica,….)

Size: 14px

body {

font-size: 14px;

line-height: 1.3em;

}

Size: 15px;

body {

font-family: Helvetica,Arial,sans-serif;

font-size: 15px;

line-height: 1.455em;

}

Size: 16px

body {

font-family: Helvetica,Arial,sans-serif;

font-size: 16px;

line-height: 1.555em;

}

Dành cho font Time New Roman (có chân)

body {

font-family: Time New Roman,serif;

font-size: 17px;

line-height: 1.3em;

}

2. In đậm đúng chỗ, không in đậm cả đoạn

Có một số người nghĩ rằng khi in đậm thì bài viết sẽ nổi bật hơn, đó là một sai lầm. Nếu một văn bản trơn không in đậm gì cả thì đọc rất dễ mỏi mắt, vì vậy giải pháp của mình là nên in đậm đúng chỗ các ý quan trọng và không bao giờ in đậm một đoạn quá dài.

In đậm bài viết

3. Sử dụng Info Box

Info Box như là một kiểu hộp văn bản được trang trí để làm nổi bật một đoạn nào đó, ví dụ như đoạn khuyến mãi kết thúc như bài này.

Để làm được như vậy, bạn có thể sử dụng các plugin sau:

4. Trang trí hình ảnh

Để hình ảnh trong bài đẹp hơn, bạn có thể chèn đoạn này vào file style.css nhé.

.post_content a img {
padding: 25px 35px;
box-sizing: border-box;
border: 1px solid #E6E6E6;
background: #F9F9F9;
text-align: center;
margin: auto 15px;
max-width: 80%;
}

Bạn dùng Firebug thay .post_content thành class khung bài viết của bạn lại nhé.

5. Sử dụng Heading để chia đoạn

Một bài viết nếu thẳng tuột từ trên xuống dưới sẽ mất đẹp đi, bạn có thể dùng tính năng Heading trong khung soạn thảo để chia bài viết ra thành nhiều phân đoạn để nhìn có khoa học và quan trọng là dễ đọc hơn.

Cách sử dụng Heading

Bạn có thể tham khảo bài viết Cách tạo blog WordPress của mình để xem cách trình bày các thẻ Heading nhé.

Cách này không chỉ giúp bài trên blog đẹp và chuyên nghiệp hơn mà còn rất hợp chuẩn SEO nữa nên mình nghĩ bạn có thể áp dụng trong bất cứ hoàn cảnh nào.

Bạn nên nhớ các chữ trên thẻ heading nên ngắn gọn và không nên viết thành 2 dòng.

Một vài lưu ý khi viết bài:

  • Không nên sử dụng màu chữ trong bài viết, trường hợp cần thiết lắm thì mới nên bôi 1 đoạn màu thôi (coupon, khuyến mãi,…).
  • Không nên gạch dưới chữ, vì như thế sẽ mất đi dấu nặng của tiếng Việt.
  • Không chèn quá nhiều liên kết trong một bài vì nó rất rối mắt.
  • Mỗi bài nên có ít nhất 1 tấm ảnh nhưng không quá 10 tấm ngoại trừ các bài có liên quan tới hình ảnh.

Đó là một số kinh nghiệm mình muốn chia sẻ để cho những ai cần trang trí bài viết thêm chuyên nghiệp và dễ đọc hơn, chỉ đơn giản thế thôi chứ không có gì phức tạp phải không nào.  😡

Tags:

About the Author ()

Thích viết lách về mảng kỹ thuật (WordPress, Front End Developer) và công nghệ. Hiện đang blogging toàn thời gian tại Thachpham.com và Thichviet.com.