Khi phát triển một trang web, bạn phải lập một danh sách kiểm tra nhiều yêu cầu phức tạp. Cho dù xử lý màu sắc hoặc lược đồ phông chữ, các vấn đề về bố cục CSS hay khả năng phản hồi của trang web trên các thiết bị khác nhau, điều quan trọng là phải luôn cập nhật mọi vấn đề mới nổi. Sau đây là một số tiện ích mở rộng phát triển web tốt nhất cho Google Chrome (và các trình duyệt dựa trên Chromium khác).
1. Kẻ mắt chọn màu
Bạn có thích cách phối màu của một trang web ngẫu nhiên và muốn sử dụng nó trong dự án của riêng mình? Tiện ích mở rộng của Chrome có tên Color Pick “Eyedropper” cho phép bạn trích xuất màu sắc với độ chính xác chính xác và tính năng thu phóng có thể điều chỉnh.
Các tiện ích mở rộng như thế này yêu cầu sự cho phép trên tất cả các trang web để thực hiện việc tách màu. Nếu bạn muốn các tính năng nâng cao hơn một chút, có một công cụ tương tự có tên là ColorZilla đi kèm với trình tạo Gradient, trình xem bảng màu và lịch sử màu.
2. Ảnh chụp màn hình toàn trang bằng một cú nhấp chuột
Chụp ảnh màn hình toàn trang web là nhu cầu cần thiết của công việc hàng ngày. Đôi khi cách tốt nhất để truyền đạt những thay đổi trong thiết kế của bạn là nắm bắt toàn bộ trang web. Với tiện ích mở rộng có tên “Ảnh chụp màn hình toàn trang bằng một cú nhấp chuột”, bạn có thể đạt được điều đó một cách chính xác.
Trong khi đang trong quá trình Chụp màn hình, hình ảnh cuộn xong của bạn sẽ mở ra trong một cửa sổ mới sau khi hoàn tất.
Toàn bộ màn hình trang web hiện có sẵn để tải xuống ở định dạng PNG. Bạn cũng có thể áp dụng một số hiệu ứng cho màn hình hình ảnh bao gồm bộ lọc, vẽ trên trang web, thêm văn bản, v.v.
3. EditThisCookie
Các nhà phát triển web cần quyền truy cập vào trình quản lý cookie để thêm, xóa, chỉnh sửa, bảo vệ và chặn cookie. EditThisCookie là một tiện ích mở rộng hữu ích cho phép bạn làm việc với cookie theo ý muốn và xuất hoặc nhập chúng ở định dạng JSON. Điều này giúp bạn giữ cho trang web hoạt động tốt bằng cách xóa các cookie cũ và giới hạn ngày trích xuất tối đa của bất kỳ cookie nào.
4. ModHeader
ModHeader là một trong những tiện ích mở rộng Chrome phổ biến nhất để sửa đổi tiêu đề HTTP của trang web. Chỉ bằng một hoặc hai lần nhấp, bạn có thể bật sửa đổi tiêu đề dựa trên URL hoặc loại tài nguyên. Phần tốt nhất là bạn có thể tạo nhiều cấu hình và thêm các giá trị khác nhau vào các tiêu đề đã sửa đổi. Tất cả các sửa đổi có thể bị giới hạn ở chỉ một tab hoặc toàn bộ trang web.
5. Kiểm tra trải nghiệm người dùng
Tất cả chúng ta đều cần đánh giá theo kinh nghiệm của trang web đang chạy theo thời gian. Điều này được thực hiện dễ dàng với Kiểm tra UX, một tiện ích mở rộng hiển thị tất cả các phản hồi liên quan đến UX trong một ngăn bên. Sau khi bạn nhấp vào một phần tử không khớp với kinh nghiệm do bạn đánh giá, bạn có thể thêm ghi chú và chụp ảnh màn hình. Cuối cùng, tất cả các thay đổi có thể được xuất ở định dạng .docx.
6. Trình chỉnh sửa cửa sổ
Các nhà phát triển web cần mô phỏng các trang web của họ cho các kích thước màn hình khác nhau. Với Window Resizer, bạn có thể dễ dàng thực hiện các đánh giá này cho máy tính xách tay, máy tính bảng, điện thoại thông minh và bất kỳ kích thước màn hình nào bạn chọn.
Công cụ này có một số tính năng thú vị như “Xoay” và “Đo trực tiếp”, cùng với một loạt các chức năng tùy chỉnh trực quan. Nếu bạn muốn xây dựng một trang web đáp ứng thực sự, hãy đảm bảo rằng bạn đã kiểm tra kỹ giao diện của nó cho tất cả các kích thước màn hình.
7. Máy phát điện Lorem Ipsum
Để nhanh chóng hoàn thành công việc trên một trang web, bạn cần có văn bản mặc định. Một tiện ích mở rộng có tên Lorem Ipsum Generator cung cấp nhiều tùy chọn văn bản mặc định gồm các đoạn văn và câu khác nhau trên mỗi đoạn văn. Bạn có thể chọn các đoạn văn bản hoặc toàn bộ văn bản bằng cách sử dụng tùy chọn “Tự động chọn”. Mẫu cuối cùng mang lại một cái nhìn thanh lịch vì các khả năng biến thể trong văn bản.
8. Hồ sơ công nghệ tích hợp
BuildWith là một phần mở rộng cổ điển để tìm hiểu về tất cả các công nghệ cơ bản hỗ trợ một trang web. Chỉ với một cú nhấp chuột, nó sẽ tạo ra một hồ sơ giúp bạn tìm hiểu về các tiện ích bổ sung và công cụ mới nhất giúp trang web trở nên nổi bật hơn. Điều này giúp bạn tái tạo các chức năng của nó để sử dụng cho riêng bạn.
9. WhatFont
WhatFont là một trong những cách nhanh nhất và dễ nhất để xác định các loại phông chữ khác nhau trên trang web. Bạn chỉ cần di chuột đến gần văn bản để xem chi tiết đầy đủ của nó. Nó hỗ trợ các mẫu nâng cao như TypeKit và Google FontAPI.
10. CheckMyLinks
Đôi khi chúng ta cần một bản tóm tắt khách quan về tất cả các liên kết đến một trang web. CheckMyLinks là một phần mở rộng phổ biến để tóm tắt các liên kết hợp lệ, không hợp lệ và bị hỏng. Kết quả liên kết cho bất kỳ trang web đang chạy nào được xem ngay lập tức trên một ngăn bên. Công cụ này cực kỳ tiện dụng để kiểm tra điểm cuối cùng trước khi trang web của bạn hoặc các thay đổi đã xuất bản đi vào hoạt động.
11. Thuốc trừ sâu
Bạn có lường trước được các vấn đề về bố cục CSS trong trang web của mình không? Pesticide cho phép bạn gỡ lỗi những vấn đề này bằng cách cung cấp một dàn ý cho mọi phần tử của trang. Bằng cách giữ Ctrl quan trọng, bạn có thể xem thông tin phần tử và phân tích vị trí của phần tử trên trang.
Có nhiều phần mở rộng web phổ biến khác quản lý các chi tiết quan trọng trong các ứng dụng trang web. Ví dụ, JSON Viewer giúp những người làm việc với các tệp JSON. Có một Trình tạo cây HTML cung cấp một cây gồm tất cả các phần tử trong một trang web.
Ngoài những tiện ích trên, cũng có rất nhiều tiện ích mở rộng của Chrome để cải thiện tốc độ duyệt web của bạn. Kiểm tra chúng!