HTML & CSS

Tối ưu preload / prefetch tài nguyên trong giao diện UIkit

01/04/2025 0 16 6 phút đọc

Trong quá trình xây dựng giao diện web, việc tối ưu hóa tải tài nguyên là một trong những yếu tố quan trọng để cải thiện hiệu suất và trải nghiệm người dùng. UIkit, với...

Thêm “Tính năng đọc tiếp” như Medium bằng vài dòng code

17/03/2025 0 9 3 phút đọc

Nếu bạn từng đọc bài viết trên Medium, bạn sẽ thấy sau vài đoạn đầu, bài viết bị làm mờ và hiển thị nút “Đọc tiếp”. Đây là một cách thông minh để thu hút...

Thêm biểu tượng tùy chỉnh vào UIkit

16/03/2025 0 43 8 phút đọc

Tìm hiểu cách mở rộng hệ thống biểu tượng của UIkit bằng cách thêm các biểu tượng SVG tùy chỉnh bằng JavaScript. Hướng dẫn chi tiết cách tối ưu mã SVG, sử dụng UIkit.icon.add() để...

Nén SVG để tối ưu hóa dung lượng mã SVG

16/03/2025 0 102 14 phút đọc

Dù SVG vốn nhẹ, bạn vẫn có thể giảm thêm dung lượng bằng cách loại bỏ các thông tin không cần thiết như comment, metadata… Điều này đặc biệt hữu ích nếu bạn sử dụng...

Hiển thị hình ảnh theo đúng tỉ lệ với CSS3

14/03/2025 0 80 2 phút đọc

Demo

Khi hiển thị ảnh với nhiều kích thước khác nhau, trang web dễ bị mất cân đối hoặc bố cục xô lệch. May mắn là CSS3 hỗ trợ thuộc tính aspect-ratio giúp bạn giữ tỉ...

Sử dụng mã SVG làm ảnh nền trực tiếp trong CSS

11/03/2025 1 89 5 phút đọc

Demo

Nếu bạn muốn sử dụng SVG làm ảnh nền, ví dụ như nền tiêu đề, bài viết này sẽ giúp bạn.

Hướng dẫn sử dụng User Cache của WP Rocket để tạo bộ nhớ đệm cho người dùng đăng nhập

11/03/2025 0 36 2 phút đọc

Nếu website WordPress của bạn có nhiều thành viên thường xuyên đăng nhập, User Cache của WP Rocket sẽ giúp cải thiện tốc độ tải trang và trải nghiệm người dùng rõ rệt. Tuy nhiên,...

Chèn biểu tượng chuyển động siêu mượt vào trang web của bạn với LottieFiles

10/03/2025 0 30 3 phút đọc

Demo

Muốn trang web của bạn thêm sinh động vào các dịp như Giáng Sinh, Tết, hay đơn giản là tạo trải nghiệm người dùng tốt hơn? Hãy thử LottieFiles – kho biểu tượng hoạt ảnh...

Tiêu đề bài viết phối trộn nhiều màu sắc với CSS3

09/03/2025 1 61 2 phút đọc

Demo

Bạn đang muốn làm nổi bật tiêu đề bài viết để thu hút ánh nhìn? Với CSS3, bạn hoàn toàn có thể tạo một tiêu đề với hiệu ứng màu chuyển sắc đầy ấn tượng...

So sánh hiệu năng giữa UIkit và Bootstrap 5 – Nên chọn gì năm 2025?

06/03/2025 0 10 4 phút đọc

Khi xây dựng giao diện web hiện đại, việc chọn framework CSS phù hợp có thể ảnh hưởng lớn đến hiệu năng và trải nghiệm người dùng. Hai trong số những framework phổ biến nhất...

Cách viết class CSS tái sử dụng cao: Utility-first, BEM hay Hybrid?

19/02/2025 0 8 3 phút đọc

Khi một dự án web phát triển lớn dần, việc tổ chức class CSS một cách rõ ràng, tái sử dụng cao và dễ bảo trì trở nên cực kỳ quan trọng. Ba phong cách...

Responsive Breakpoints nên dùng năm 2025

03/02/2025 0 8 6 phút đọc

Trong thời đại đa dạng thiết bị như hiện nay, việc chọn đúng breakpoints cho responsive design không chỉ ảnh hưởng đến trải nghiệm người dùng mà còn quyết định hiệu suất và khả năng...

So sánh Cloudflare Pages vs Netlify vs Vercel (cho blog tĩnh)

01/02/2025 0 56 3 phút đọc

Nếu bạn đang xây dựng blog tĩnh bằng HTML/CSS hoặc generator như Hugo, Astro, Eleventy, thì 3 cái tên phổ biến nhất hiện nay là: Cloudflare Pages, Netlify, và Vercel. Dưới đây là so sánh...

11ty (Eleventy) là gì? Hướng dẫn cơ bản cho người mới bắt đầu

06/01/2025 0 3 4 phút đọc

11ty (Eleventy) là một Static Site Generator hiện đại, tập trung vào sự đơn giản, tốc độ và khả năng kiểm soát code. Thay vì phụ thuộc vào hệ sinh thái phức tạp, 11ty cho...

Jekyll là gì? Static Site Generator đơn giản, ổn định và thân thiện với GitHub Pages

03/01/2025 0 5 3 phút đọc

Jekyll là một trong những Static Site Generator lâu đời và phổ biến nhất, đặc biệt trong cộng đồng developer và blogger kỹ thuật. Với triết lý đơn giản, dễ hiểu và tích hợp chặt...

Hugo là gì? Static Site Generator siêu nhanh dành cho Developer hiện đại

01/01/2025 0 6 4 phút đọc

Trong bối cảnh tốc độ và trải nghiệm người dùng ngày càng quan trọng, việc lựa chọn nền tảng xây dựng website phù hợp là yếu tố then chốt. Hugo là một Static Site Generator...

CSS Container Queries: Giải pháp cho giao diện linh hoạt thực sự

31/12/2024 0 18 3 phút đọc

Container Queries đang thay đổi cách chúng ta viết responsive layout. Không còn phụ thuộc vào kích thước trình duyệt, giờ đây bạn có thể áp dụng style dựa trên kích thước của chính phần...

Static Site Generator là gì? Nền tảng xây dựng website hiện đại, nhanh và bền vững

30/12/2024 0 3 5 phút đọc

Static Site Generator là một cách tiếp cận xây dựng website tập trung vào hiệu suất, tính ổn định và khả năng mở rộng lâu dài. Thay vì xử lý nội dung động mỗi khi...

Tích hợp tự động hoàn thành địa chỉ với Goong

08/12/2024 0 17 3 phút đọc

Bạn đang cần tính năng gợi ý địa chỉ khi người dùng nhập thông tin như khi đặt hàng, đăng ký tài khoản, cập nhật hồ sơ? Goong Autocomplete là một giải pháp đáng tin...

Hiệu ứng Button Press 3D đẹp ná thở với CSS

29/11/2024 0 40 4 phút đọc

Demo

Muốn nút bấm trên giao diện trông "đã tay" hơn khi click? Với hiệu ứng Button Press 3D bằng CSS thuần, bạn có thể biến một nút bình thường thành một button có chiều sâu,...