Thiết kế Web

Tổng quan về thiết kế trang Web

Thiết kế trang web, hoặc thiết kế web, có nghĩa là lập kế hoạch, khái niệm hóa và sắp xếp nội dung trực tuyến. Thiết kế trang web xem xét cả tính thẩm mỹ và chức năng trực quan, đồng thời bao gồm các trang web, ứng dụng dành cho thiết bị di động và giao diện người dùng.

Một số vấn đề cơ bản liên quan đến thiết kế Web

Internet là một liên mạng máy tính toàn cầu được hình thành từ các mạng nhỏ hơn, liên kết hàng triệu máy tính trên thế giới thông qua cơ sở hạ tầng viễn thông. Internet là mạng của các mạng máy tính.

Thành phần chính của một trang Web

Có một số thành phần chính của bất kỳ trang web tốt nào, bất kể nó có bao nhiêu trang. Các thành phần này cho phép trang web của bạn phát triển và mở rộng quy mô hiệu quả.

Qui trình thiết kế trang Web

Nhiều người cho rằng quá trình thiết kế web khó khăn và chủ yếu được thực hiện bởi các chuyên gia.

BÀI 1: TỔNG QUAN VỀ WEBSITE VÀ CÔNG CỤ HIỆN ĐẠI

Trình bày được khái niệm cơ bản về Internet, WWW, HTTP, URL, Web Browser, Web Server, Hosting, Domain và nguyên lý hoạt động Client–Server. Đồng thời, phân tích được cấu trúc chuẩn HTML5, sử dụng công cụ hiện đại như VS Code, Chrome DevTools để tạo và chạy trang web đầu tiên. Người học còn rèn kỹ năng tổ chức dự án khoa học và tuân thủ quy tắc đặt tên file/thư mục.

BÀI 2: CÁC THẺ VĂN BẢN VÀ CẤU TRÚC NỘI DUNG

Bài học giúp người học phân biệt thẻ tiêu đề, thẻ hiển thị và thẻ ngữ nghĩa, cùng vai trò các thẻ cấu trúc HTML5. Đồng thời rèn kỹ năng trình bày văn bản web hoàn chỉnh và thói quen viết code có cấu trúc rõ ràng.

BÀI 3: BẢNG BIỂU (TABLE) VÀ BỐ CỤC KHỐI (BOX MODEL)

Bài học giúp người học nắm vững cách tạo bảng, phân biệt thẻ div và span, cùng nguyên lý Box Model trong CSS. Đồng thời rèn kỹ năng xây dựng bố cục web hiện đại, trình bày dữ liệu phức tạp và tư duy bố cục khoa học, chính xác.

BÀI 4: MULTIMEDIA (ĐA PHƯƠNG TIỆN) VÀ NHÚNG NỘI DUNG

Bài học giúp người học hiểu các định dạng hình ảnh, đường dẫn, thẻ audio/video và cách nhúng nội dung đa phương tiện. Đồng thời rèn kỹ năng chèn hình, tích hợp nhạc, video, bản đồ và ý thức bản quyền, tối ưu dung lượng web.

BÀI 5: HIỆU ỨNG GIAO DIỆN VỚI CSS3

Người học nắm vững các thuộc tính CSS3 (border-radius, box-shadow, gradient), phân biệt transform và transition, hiểu trạng thái :hover để tạo hiệu ứng trực quan.  Ứng dụng kỹ năng thiết kế nút bấm, thẻ sản phẩm, hình khối thẩm mỹ với hiệu ứng vừa phải, tránh lòe loẹt.

BÀI 6: XÂY DỰNG FORM (BIỂU MẪU) HIỆN ĐẠI

Người học nắm vững vai trò thẻ <form>, các loại ô nhập liệu và dữ liệu mới HTML5 để xây dựng biểu mẫu. Ứng dụng kỹ năng tạo form đăng nhập/đăng ký/liên hệ với kiểm tra dữ liệu, thiết kế thân thiện dễ dùng.

BÀI 7: LIÊN KẾT VÀ ĐIỀU HƯỚNG (NAVIGATION)

Người học nắm vững thẻ liên kết <a>, phân biệt các loại liên kết, sử dụng Font Awesome và CSS để tạo menu, liên kết đặc biệt. Ứng dụng kỹ năng xây dựng website nhiều trang với cấu trúc logic, thân thiện, nâng cao trải nghiệm người dùng.

BÀI 8: TỔNG QUAN VỀ PHP VÀ CÀI ĐẶT MÔI TRƯỜNG (XAMPP)

Người học phân biệt Web tĩnh và Web động, hiểu mô hình Server-side, vai trò XAMPP và thư mục htdocs. Thực hành cài đặt XAMPP, xử lý lỗi cổng, viết và chạy chương trình PHP đầu tiên, quản lý file đúng quy trình.

BÀI 9: KIỂM TRA ĐỊNH KỲ (LẦN 1)

Học viên cần nắm vững cấu trúc dự án, HTML chuẩn và Box Model; thực hành dựng layout bằng div + CSS, tạo menu điều hướng, form đăng ký/liên hệ, chèn đa phương tiện đúng chuẩn.
Đảm bảo code sạch, đặt tên khoa học và tuân thủ thời gian nộp bài.

Ngôn ngữ HTML

HTML là viết tắt của Hyper Text Markup Language, là ngôn ngữ được sử dụng rộng rãi nhất trên Web để phát triển các trang web.

Bài kiểm tra HS2

Link nộp bài tập thực hành