Tin học 12 · Định hướng Tin học ứng dụng

Bài 23. Chuẩn bị xây dựng trang web

Ứng dụng tin học

SAU BÀI HỌC NÀY EM SẼ:

Từ kiến thức đã học, em đã biết khái niệm về trang web. Trong cuộc sống, học tập hằng ngày, em đã từng thấy nhiều trang web và sự phổ biến của chúng, chẳng hạn khi xem tin tức trên các báo điện tử, mạng xã hội,... Các trang web này có những đặc điểm chung gì? Cần chuẩn bị những gì khi muốn xây dựng một trang web?

1. NHỮNG ĐẶC ĐIỂM CHUNG CỦA TRANG WEB

Hoạt động 1

Dễ nhận thấy mỗi trang web đầy đủ nhất đều có cấu trúc gồm ba phần chính:

a) Phần đầu trang

Phần đầu trang có vai trò như trang bìa thu gọn của một cuốn sách hay phần trình bày đầu mỗi chương sách: Có hình nền và những thông tin nổi bật trên đó như logo, tên trang, thanh điều hướng (thanh này gồm bảng chọn các chức năng riêng; chức năng tìm kiếm có thể được tách ra khỏi bảng chọn), tiêu đề và thông tin tóm tắt của trang hay tin mới cập nhật.

Lưu ý:

Hình 23.1. Đầu trang của trang web HARVARD UNIVERSITY
Hình 23.1. Đầu trang của trang web HARVARD UNIVERSITY

1. Logo; 2. Tên trang; 3. Biểu tượng của bảng chọn.

b) Phần thân trang

Thân trang là phần chứa nội dung của trang web, thường được bố cục thành các khối hình chữ nhật (Hình 23.2), mỗi khối trình bày một nội dung riêng.

Hình 23.2. Cấu trúc phần thân trang
Hình 23.2. Cấu trúc phần thân trang

Mỗi khối nội dung có thể chứa các thông tin dạng văn bản, hình ảnh, âm thanh, biểu mẫu nhập dữ liệu hay các ứng dụng nhúng khác nhau (ví dụ: ứng dụng bản đồ, ứng dụng dự báo thời tiết,...).

5. Tiêu đề; 6. Tóm tắt tin nổi bật.

Hình 23.3. Ví dụ phần thân trang web Đại học Quốc gia TP Hồ Chí Minh
Hình 23.3. Ví dụ phần thân trang web Đại học Quốc gia TP Hồ Chí Minh

c) Phần chân trang

Phần này có thể bao gồm những thông tin về thương hiệu, bản quyền, bảo mật, tóm tắt những tin cần nhấn mạnh thêm, thông tin liên hệ và những liên kết tới các trang mạng xã hội liên quan.

Hình 23.4. Phần chân trang web Báo Lao Động (laodong.vn)
Hình 23.4. Phần chân trang web Báo Lao Động (laodong.vn)

2. CÁC BƯỚC CHUẨN BỊ ĐỂ XÂY DỰNG TRANG WEB

Hoạt động 2: Cần làm gì khi bắt đầu xây dựng một trang web?

Hãy thảo luận và trả lời câu hỏi: Để xây dựng một trang web chúng ta nên bắt đầu từ đâu?

Gợi ý:

Việc xây dựng trang web cần bắt đầu với việc phân tích, xác lập định hướng về mục đích của trang web và đối tượng người dùng. Mỗi trang web phải bắt đầu từ một nhu cầu cụ thể. Trang web được xây dựng cho những người đọc nó, vì vậy cần xác định được đối tượng người đọc (người dùng), khả năng và mong muốn của họ. Từ đó xác định được mục đích, đối tượng, các yêu cầu về trang web trước khi đi vào các chi tiết thiết kế nội dung và hình thức. Trình tự các bước chuẩn bị cần thực hiện có thể tóm tắt như sau:

Xây dựng thiết kế

Chuẩn bị tư liệu

Lưu ý: Cần phân biệt việc xây dựng trang web đơn giản với xây dựng website. Việc chuẩn bị xây dựng website có thể đòi hỏi thêm một số bước khác, đặc biệt là cách tổ chức vận hành và quản trị website.

a) Định hình ý tưởng

Nội dung chính của bước này là xác định mục đích, đối tượng và các yêu cầu cần đạt được; nói cách khác là tìm được câu trả lời tường minh cho các câu hỏi:

Để có thể xác định được rõ mục đích và các yêu cầu cần đặt ra với trang web, cần khảo sát, phân tích các nhu cầu cũng như những đặc điểm của người dùng một cách cẩn thận kĩ lưỡng. Càng hiểu được nhu cầu của người dùng thì sẽ càng xác định được rõ hơn mục đích cũng như các yêu cầu cần đặt ra về nội dung và hình thức của trang web.

Ví dụ: Dự án xây dựng trang web với chủ đề "Việt Nam Vẻ đẹp tiềm ẩn" của một nhóm thiện nguyện tâm huyết mong muốn quảng bá những nét đẹp của thiên nhiên, văn hoá, con người Việt Nam.

Để biết được rõ nhu cầu người dùng, cần phải đặt ra và trả lời câu hỏi như: Người dùng mong muốn biết những thông tin gì? Những gì sẽ làm nên sự thu hút và gây hứng thú đối với họ? Những gì là đặc điểm văn hoá và thị hiếu của người dùng?

Bước này cần phải được bắt đầu với việc xây dựng dàn ý tổng thể, từ đó xây dựng bố cục của trang và đưa ra những chỉ định về thiết kế mĩ thuật.

b) Thiết kế

Hình 23.5. Bố cục trang web "Việt Nam Vẻ đẹp tiềm ẩn"
Hình 23.5. Bố cục trang web "Việt Nam Vẻ đẹp tiềm ẩn"

Thiết kế mĩ thuật:

Thiết kế mĩ thuật trang web là việc thiết kế hình thức của trang web sao cho có vẻ đẹp phù hợp với thẩm mĩ của người dùng và phù hợp với nội dung, góp phần gây ấn tượng và tăng sức thuyết phục. Tiến hành chi tiết cho từng nội dung, từng bài viết của trang web. Ở mức thiết kế chung, sẽ chỉ giới hạn trong phạm vi lựa chọn các định dạng chữ và bảng màu.

Hình 23.6. Ví dụ về bảng màu
Hình 23.6. Ví dụ về bảng màu
Hình 23.7. Ví dụ định dạng chữ và bảng màu của một trang web trên VnExpress
Hình 23.7. Ví dụ định dạng chữ và bảng màu của một trang web trên VnExpress

c) Lựa chọn phần mềm, chuẩn bị tư liệu

Hiện nay, có nhiều phần mềm hỗ trợ làm trang web một cách trực quan, nhưng hầu hết chúng là những phần mềm thương mại. Tuy nhiên, Google có cung cấp miễn phí, trong hệ sinh thái của mình, một phần mềm làm trang web với giao diện hoàn toàn trực quan. Phần mềm này có điểm rất mạnh là dễ sử dụng và kết nối một cách dễ dàng với những phần mềm khác của Google như Docs, Sheets, Slides, Maps, Photos, YouTube. Các trang web sau khi làm xong sẽ được lưu trữ trên Google Drive và có thể chia sẻ, xuất bản ngay trên Google với một địa chỉ URL hỗ trợ bởi Google. Yêu cầu cần có chỉ là người dùng đăng kí để có tài khoản Google Mail.

Vì vậy, sách này sẽ chọn giới thiệu phần mềm làm web của Google và hướng dẫn từng bước tạo dựng trang web với ví dụ cụ thể là làm trang web "Việt Nam Vẻ đẹp tiềm ẩn".

Việc chuẩn bị tư liệu cho trang web là việc kéo dài suốt thời gian thực hiện dự án, bắt đầu từ việc thiết kế favicon, logo, lựa chọn hình nền cho phần đầu trang, thực hiện các bài viết cho từng nội dung, lựa chọn hình ảnh minh hoạ.

LUYỆN TẬP

Hình 23.8. Phần đầu trang và chân trang của trang web 24 giờ
Hình 23.8. Phần đầu trang và chân trang của trang web 24 giờ

VẬN DỤNG

Phân tích nội dung, bố cục, phông chữ, màu sắc và rút ra nhận xét của mình.