Tin học 12 – Bài 23. Chuẩn bị xây dựng trang web

1. Những đặc điểm chung của trang web

  • Một trang web đầy đủ thường có ba phần chính:
    • Phần đầu trang (header)
    • Phần thân trang (body)
    • Phần chân trang (footer)

a. Phần đầu trang (Header)

  • Vai trò: Tóm tắt thông tin chung nhất về trang, tương tự trang bìa của một cuốn sách.
  • Nội dung thường gồm có:
    • Logo
    • Tên trang
    • Thanh điều hướng (menu chức năng, có thể có tìm kiếm)
    • Tiêu đề trang
    • Tóm tắt thông tin nổi bật/cập nhật
  • Lưu ý:
    • Favicon: Biểu tượng nhỏ hiển thị trên tab trình duyệt, đại diện cho website.
    • URL: Địa chỉ truy cập trang web.
Tin học 12 Bài 23 Phần đầu trang Header

b. Phần thân trang (Body):

  • Chứa nội dung chính của trang.
  • Bố cục: Thường chia thành các khối hình chữ nhật, mỗi khối trình bày một nội dung với tiêu đề riêng.
  • Nội dung khối: Văn bản, hình ảnh, âm thanh, biểu mẫu, ứng dụng nhúng (bản đồ, dự báo thời tiết…).
Tin học 12 Bài 23 Phần thân trang Body

c. Phần chân trang (Footer):

  • Thông tin thường có:
    • Thương hiệu
    • Bản quyền
    • Bảo mật
    • Tóm tắt thông tin quan trọng
    • Thông tin liên hệ
    • Liên kết mạng xã hội
Tin học 12 Bài 23 Phần chân trang Footer

Luyện tập

Tên trang web và logo trang được đặt ở phần nào của trang web?

Tên trang web và logo thường được đặt ở phần đầu trang (header).

Phần thân trang web thường có bố cục như thế nào?

Phần thân trang thường có bố cục là các khối hình chữ nhật.

Thông tin liên hệ của chủ thể của trang web được đặt ở phần nào của trang web?

Thông tin liên hệ thường được đặt ở phần chân trang (footer).

2. Các bước chuẩn bị để xây dựng trang web

  • Bắt đầu từ việc phân tích, xác định mục đích trang web và đối tượng người dùng
    • Trang web xuất phát từ nhu cầu cụ thể.
    • Xây dựng cho người đọc, cần xác định đối tượng, khả năng, mong muốn.
    • Xác định mục đích, đối tượng, yêu cầu trước khi thiết kế chi tiết.
Tin học 12 Bài 23 Luyện tập

a. Định hình ý tưởng:

Xác định mục đích của trang web và đối tượng người dùng.

Khảo sát nhu cầu người dùng để xác định yêu cầu về nội dung và hình thức.

b. Thiết kế:

Xây dựng dàn ý và bố cục cho trang web.

Lựa chọn phông chữ và bảng màu phù hợp để tạo sự hài hòa.

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

Sử dụng Google Sites để tạo trang web dễ dàng và trực quan.

Luyện tập

Để định hình được ý tưởng xây dựng một trang web cần phải thực hiện những công việc gì?

Cần xác định mục đích của trang web, hiểu rõ đối tượng người dùng, đặt câu hỏi và khảo sát để tìm hiểu về người dùng (mong muốn, sở thích, đặc điểm…)

Công việc thiết kế trang web bao gồm những nội dung gì?

Thiết kế trang web bao gồm xây dựng dàn ý, bố cục, thiết kế mỹ thuật (chọn phông chữ, màu sắc…)


Câu hỏi trắc nghiệm dạng D1 và D2 Tin học 12 Bài 23. Chuẩn bị xây dựng trang web

Thời gian làm bài: 30 phút
Đáp án chỉ hiển thị sau khi hoàn thành bài làm
Câu hỏi sẽ được hiển thị ngẫu nhiên
Vui lòng nhập họ và tên để bắt đầu làm bài

NB

Phương án nào sau đây chỉ ra đúng ba phần chính của một trang web đầy đủ?

NB

Phương án nào sau đây chỉ ra đúng vị trí thường đặt logo và tên trang web?

NB

Phần nào của trang web chứa các thông tin về thương hiệu, bản quyền và thông tin liên hệ?

NB

Phương án nào sau đây chỉ ra đúng tên tiếng Anh của phần đầu trang web?

NB

Phương án nào sau đây chỉ ra đúng tên gọi của biểu tượng nhỏ hiển thị trước địa chỉ trang web trên tab của trình duyệt?

TH

Phương án nào sau đây mô tả đúng về bố cục của phần thân trang web?

TH

Phương án nào sau đây giải thích đúng về favicon?

TH

Phương án nào sau đây mô tả đúng về các bước chuẩn bị để xây dựng trang web theo trình tự hợp lý?

TH

Phương án nào sau đây giải thích đúng về URL?

TH

Phương án nào sau đây mô tả đúng về nội dung của bước định hình ý tưởng khi xây dựng trang web?

TH

Phương án nào sau đây mô tả đúng về nội dung của bước thiết kế khi xây dựng trang web?

VD

Phương án nào sau đây chỉ ra đúng loại phông chữ thích hợp nhất cho nội dung bài viết trên trang web?

VD

Phương án nào sau đây chỉ ra đúng cách sử dụng kiểu chữ đậm trên trang web?

VD

Phương án nào sau đây chỉ ra đúng cách thiết kế bảng màu cho trang web?

VD

Phương án nào sau đây chỉ ra đúng cách thiết kế thanh điều hướng cho trang web "Việt Nam - Vẻ đẹp tiềm ẩn"?

NB

Phương án nào sau đây chỉ ra đúng tên tiếng Anh của phần thân trang web?

NB

Phương án nào sau đây chỉ ra đúng tên tiếng Anh của phần chân trang web?

TH

Phương án nào sau đây mô tả đúng về phần thông báo trên trang web?

VD

Phương án nào sau đây chỉ ra đúng cách xác định đối tượng người dùng cho trang web "Việt Nam - Vẻ đẹp tiềm ẩn"?

VD

Phương án nào sau đây chỉ ra đúng phần mềm miễn phí của Google để tạo trang web được đề cập trong bài học?

Một nhóm học sinh lớp 10 đang xây dựng trang web giới thiệu về trường học của mình. Trang web sẽ có các mục như: Giới thiệu trường, Thành tích học tập, Hoạt động ngoại khóa và Thông tin tuyển sinh. Nhóm đã thảo luận và quyết định sử dụng Google Sites để xây dựng trang web. Họ đã thiết kế logo, chọn bảng màu và chuẩn bị nội dung cho từng mục. Tuy nhiên, khi bắt đầu xây dựng trang web, nhóm gặp một số vấn đề về cách tổ chức nội dung và thiết kế giao diện.
Các phát biểu:

NB Phần chứa logo, tên trường và thanh điều hướng nên được đặt ở phần đầu trang (header)

NB Phần thân trang (body) của trang web nên được tổ chức thành các khối hình tròn, mỗi khối giới thiệu một nội dung

TH Việc xác định mục đích và đối tượng người dùng nên được thực hiện sau khi đã thiết kế giao diện trang web

VD Để trang web dễ đọc, nhóm nên chọn phông Sans Serif như Arial hoặc Calibri cho nội dung bài viết và phông Serif cho các tiêu đề lớn

Một nhóm thiện nguyện đang xây dựng trang web với chủ đề "Di sản văn hóa Việt Nam" nhằm giới thiệu các di sản văn hóa vật thể và phi vật thể của Việt Nam. Nhóm đã xác định mục đích là quảng bá giá trị văn hóa Việt Nam đến với bạn bè quốc tế. Đối tượng người dùng là người Việt Nam và người nước ngoài quan tâm đến văn hóa Việt Nam. Nhóm đang trong giai đoạn thiết kế và chuẩn bị tư liệu cho trang web.
Các phát biểu:

NB Favicon là biểu tượng nhỏ hiển thị trước địa chỉ trang web trên tab của trình duyệt

TH Việc xây dựng dàn ý và bố cục trang web thuộc bước định hình ý tưởng

TH Bảng màu của trang web nên có các màu tương phản gắt để thu hút sự chú ý của người dùng

VD Nếu trang web phục vụ cả người nước ngoài, nhóm nên cung cấp thông tin giúp họ tìm hiểu và khám phá những đặc điểm văn hóa truyền thống dân tộc Việt Nam

Một học sinh đang thiết kế trang web cá nhân để giới thiệu về sở thích và thành tích học tập của mình. Em đã xác định mục đích là chia sẻ kinh nghiệm học tập và sở thích cá nhân với bạn bè. Đối tượng người dùng chủ yếu là bạn bè cùng lứa tuổi. Em đã lựa chọn Google Sites làm công cụ xây dựng trang web và đang trong quá trình thiết kế giao diện và chuẩn bị nội dung.
Các phát biểu:

NB URL là địa chỉ truy cập dạng Uniform Resource Locator để người dùng Internet có thể đọc trang web qua trình duyệt

NB Phần chân trang (footer) nên chứa các thông tin về thương hiệu, bản quyền và thông tin liên hệ

TH Các lệnh hỏi trong câu hỏi dạng D2 không cần phải sắp xếp theo mức độ nhận thức tăng dần

VD Khi thiết kế trang web cá nhân, nên sử dụng phông chữ nghệ thuật cho toàn bộ nội dung để tạo ấn tượng với người dùng

Một nhóm học sinh đang xây dựng trang web với chủ đề "Bảo vệ môi trường biển Việt Nam". Nhóm đã xác định mục đích là nâng cao nhận thức về vấn đề ô nhiễm biển và kêu gọi mọi người cùng hành động bảo vệ môi trường biển. Đối tượng người dùng là học sinh, sinh viên và những người quan tâm đến vấn đề môi trường. Nhóm đã lựa chọn Google Sites làm công cụ xây dựng trang web và đang trong quá trình thiết kế giao diện và chuẩn bị nội dung.
Các phát biểu:

NB Phần thân trang (body) của trang web được tổ chức theo cấu trúc nhiều khối hình chữ nhật, mỗi khối giới thiệu một nội dung

TH Việc xác định mục đích và đối tượng người dùng thuộc bước chuẩn bị tư liệu trong quy trình xây dựng trang web

TH Thanh điều hướng của trang web nên chỉ bao gồm các chức năng tìm kiếm mà không cần bảng chọn các chức năng khác

VD Để trang web thu hút đối tượng học sinh, sinh viên, nhóm nên sử dụng các hình ảnh minh họa sinh động và các bài viết ngắn gọn, dễ hiểu kèm theo các số liệu thống kê cụ thể về tình trạng ô nhiễm biển


Bảng xếp hạng

Hạng Họ tên Điểm số Thời gian
1
Trần Quốc MInh và Lê Trâm Anh 4 lần thi
100/100
1 phút 45 giây
2
thanh huy hihi 1 lần thi
100/100
2 phút 20 giây
3
Trần Ngọc Hào 3 lần thi
100/100
3 phút 1 giây
4
Kim Mai and Kim Ngân 2 lần thi
100/100
3 phút 11 giây
5
Thúy Quyên 2 lần thi
100/100
3 phút 57 giây
6
Cẩm Ly và Hoàng Trọng 1 lần thi
100/100
9 phút 8 giây
7
Nguyễn Như Ý - Trần Ngọc Thư 1 lần thi
100/100
10 phút 18 giây
8
khả 2 lần thi
100/100
10 phút 22 giây
9
Võ Thanh Sang 4 lần thi
99/100
1 phút 55 giây
10
huỳnh tỷ 3 lần thi
99/100
5 phút 50 giây
11
Bích Hậu 1 lần thi
99/100
8 phút 28 giây
12
Nguyễn Hiếu Nghĩa 1 lần thi
98/100
6 phút 21 giây
13
Đỗ Phúc Hào 1 lần thi
98/100
8 phút 7 giây
14
Trần Minh Triết 1 lần thi
98/100
11 phút 45 giây
15
phạm thị huỳnh như 1 lần thi
98/100
12 phút 49 giây
16
nguyễn phước thiện and diệp huỳnh như 12c2 1 lần thi
96/100
13 phút 59 giây
17
Yến NHi Ngọc 1 lần thi
95/100
3 phút 49 giây
18
cao uyên nhi 1 lần thi
95/100
11 phút 26 giây
19
Nguyễn Xuyên Thành ,,,Phạm thị phương Oanh12c2 1 lần thi
95/100
20 phút 27 giây
20
Lê Thanh Huy 2 lần thi
94/100
2 phút 59 giây
21
uyên nhi như mạnh 1 lần thi
94/100
3 phút 49 giây
22
huỳnh gia nghĩa 1 lần thi
92/100
11 phút 41 giây
23
Trần Quốc Minh và Lê Trâm Anh 4 lần thi
91/100
4 phút 1 giây
24
Võ Thị Yến Nhi Võ Như Ngọc 1 lần thi
91/100
8 phút 54 giây
25
Lê Như Mạnh 1 lần thi
91/100
11 phút 25 giây
26
đề ez 1 lần thi
90/100
4 phút 14 giây
27
Như Bình_Mỹ Tiên 1 lần thi
90/100
19 phút 19 giây
28
Võ thành Quy 1 lần thi
83/100
13 phút 37 giây
29
Đỗ Gia Minh 1 lần thi
79/100
15 phút 55 giây
30
Nguyễn Minh Thuận Đặng Thị Thanh Thùy 1 lần thi
75/100
18 phút 17 giây
31
d 1 lần thi
65/100
4 phút 23 giây
32
nguyễn thị trinh 1 lần thi
44/100
9 phút 39 giây
33
Nguyễn Thành Đạt 1 lần thi
42/100
59 giây
34
Thành Quy 1 lần thi
34/100
1 phút 56 giây
35
Ngọc Hào là t nè 1 lần thi
33/100
1 phút 1 giây
36
A 1 lần thi
25/100
2 phút 9 giây

Để lại một bình luận

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *