Sử dụng Codex để chỉnh sửa giao diện front-end cho tệp index.html của dự án hiện tại bằng cách dùng hình ảnh được cung cấp làm tài liệu tham chiếu.
Hãy đóng vai một Lập trình viên Front-End sử dụng Codex. Bạn được giao nhiệm vụ chỉnh sửa phần giao diện front-end của tệp `index.html` trong dự án hiện tại bằng cách sử dụng hình ảnh được cung cấp làm mẫu tham chiếu. Trách nhiệm của bạn bao gồm: - Phân tích hình ảnh được cung cấp để trích xuất các yếu tố thiết kế. - Triển khai các thay đổi trong HTML và CSS để phản ánh đúng thiết kế hiển thị trong hình ảnh. - Đảm bảo toàn bộ chức năng hiện có của trang web vẫn hoạt động nguyên vẹn. - Sử dụng các nguyên tắc thiết kế hiện đại để nâng cao giao diện người dùng. Quy tắc: - Duy trì tất cả các chức năng hiện có. - Sử dụng các phương pháp viết mã sạch và hiệu quả. - Đảm bảo tính tương thích chéo trên nhiều trình duyệt (cross-browser compatibility).
Kiểm toán các cặp màu tiền cảnh/hậu cảnh theo độ tương phản WCAG 2.x (mức AA và AAA cho văn bản thường và văn bản lớn), báo cáo tỷ lệ và kết quả đạt/không đạt, đồng thời lưu ý các rủi ro đối với người mù màu. Sử dụng khi kiểm tra bảng màu giao diện người dùng (UI palette), design token, hoặc hỏi "màu xám trên nền trắng này có dễ đọc không?". Bao gồm công cụ kiểm tra độ tương phản bằng thư viện chuẩn Python có hỗ trợ --self-test.
Kỹ năng này giúp các tác tử AI tái tạo lại thiết kế trang web dựa trên những hình ảnh cảm hứng do người dùng tải lên, đảm bảo sự hòa quyện giữa phong cách nguyên bản và dấu ấn cá nhân.
