BÀI 24. XÂY DỰNG PHẦN ĐẦU TRANG WEB

Nhiệm vụ 1: Làm quen với giao diện đầu tiên của Google Sites.

 Bước 1. Đăng nhập vào tài khoản Google

 Bước 2. Nhận biết ba phần của giao diện

Nhiệm vụ 2: Tìm hiểu giao diện tạo phần đầu trang.

 Bước 1. Tạo trang web mới

 Bước 2. Làm quen với giao diện và các chức năng tạo phần đầu trang

Nhiệm vụ 3: Tạo phần đầu trang

 Bước 1. Nhập tên tệp lưu trữ trang web

 Bước 2. Thiết lập logo, favicon, nhập tên trang và thông báo đầu trang

 Bước 3. Thiết lập kích thước phần đầu trang, ảnh nền và tiêu đề trang

 Bước 4. Thiết lập tiêu đề trang

 Bước 5. Xem trước, chỉnh sửa

 Bước 6. Xuất bản và truy cập trang web theo URL

- Truy cập vào địa chỉ sites.google.com/new trên trình duyệt web.

Ví dụ: Em mở Chrome, gõ địa chỉ sites.google.com/new và đăng nhập bằng tài khoản Gmail của mình.

- Phần thứ nhất (trên cùng): Chứa ô tìm kiếm và biểu tượng truy cập các ứng dụng khác của Google.

Ví dụ: Biểu tượng 9 dấu chấm vuông ở góc phải để mở Drive hoặc Mail.

- Phần thứ hai: Khu vực tạo trang web mới, có thể chọn trang trắng hoặc theo mẫu có sẵn.

Ví dụ: Em nháy chuột vào dấu cộng (+) Trống để bắt đầu một trang web hoàn toàn mới.

- Phần thứ ba: Danh sách các trang web mà người dùng đã mở hoặc tạo trước đó.

Ví dụ: Nếu hôm qua em đã tạo trang Câu lạc bộ tin học, nó sẽ hiện ở danh sách này.

- Chọn biểu tượng dấu cộng (+) ở giao diện chính để mở trang thiết kế mới.

Ví dụ: Nháy vào biểu tượng dấu cộng (+) Trống nhiều màu sắc.

- Dòng "Trang web không có tiêu đề": Nơi nhập tên tệp để lưu trữ trong Google Drive.

Ví dụ: Em đặt tên tệp là Web_Lop_12A1 để dễ tìm lại trong Drive.

- Dòng "Nhập tên trang web": Nơi hiển thị tên trang web, logo và favicon cho người xem.

Ví dụ: Nhập tên Lớp 12A1 Thân Thiện sẽ hiện ở góc trên cùng bên trái giao diện web.

- Tùy chọn hiển thị (Loại tiêu đề và Hình ảnh):

+ Có thể thay đổi hình nền và kích thước phần đầu trang.

+ Các loại kích thước: Bìa (cao nhất), Biểu ngữ lớn, Biểu ngữ, hoặc Chỉ có tiêu đề.

Ví dụ: Chọn loại Bìa nếu em muốn ảnh nền to tràn màn hình giống bìa tạp chí.

- Dòng "Tiêu đề trang": Nơi nhập nội dung chính và tóm tắt của trang.

Ví dụ: Dòng chữ lớn nằm giữa ảnh nền, chẳng hạn như: CHÀO MỪNG ĐẾN VỚI LỚP 12A1.

- Nháy vào dòng Trang web không có tiêu đề ở góc trên trái và nhập tên gợi nhớ.

Ví dụ: Nhập VN - Ver 1.

- Logo & Favicon:

+ Nháy vào Thêm biểu tượng hoặc vào phần Cài đặt → Hình ảnh thương hiệu.

+ Tải lên ảnh định dạng png, jpg hoặc gif.

Ví dụ: Tải ảnh huy hiệu trường làm Logo, và ảnh nhỏ kích thước 16 x 16 pixels làm Favicon (biểu tượng trên tab trình duyệt).

- Thông báo:

+ Vào Cài đặt → Phần thông báo để hiện một dòng tin nhắn trên cùng trang web.

Ví dụ: Em nhập dòng chữ Website đang chạy thử nghiệm với nền màu cam để người xem chú ý.

- Kích thước: Chọn Loại tiêu đề để chỉnh độ cao (VD: Chọn Biểu ngữ lớn).

- Ảnh nền: Chọn Thay đổi hình ảnh → Tải lên (từ máy) hoặc Chọn (từ Drive/Internet).

Ví dụ: Tải lên bức ảnh ruộng bậc thang Mù Cang Chải làm nền.

- Điều chỉnh hiển thị:

+ Google Sites tự động điều chỉnh độ sáng để dễ đọc chữ. Nháy vào biểu tượng lấp lánh để tắt/bật.

+ Dùng Neo điều chỉnh để chọn vùng ảnh muốn hiển thị.

- Nhập nội dung tiêu đề và định dạng (phông chữ, cỡ chữ, căn lề, in đậm/nghiêng).

- Có thể ngắt dòng bằng tổ hợp phím Shift + Enter.

Ví dụ: Gõ tiêu đề Việt Nam, xuống dòng gõ tiếp Vẻ đẹp tiềm ẩn, sau đó bôi đen chọn phông chữ Arial và in đậm.

- Nháy vào biểu tượng Xem trước (hình máy tính và điện thoại) để kiểm tra giao diện.

- Có các chế độ xem: Điện thoại, Máy tính bảng, Máy tính.

Ví dụ: Em bấm xem thử trên chế độ Điện thoại để chắc chắn chữ không bị tràn ra ngoài màn hình nhỏ.

- Nháy nút Công bố (Publish) để xuất bản web lên Internet.

- Sao chép địa chỉ URL để chia sẻ.

Ví dụ: Sau khi công bố, em gửi link sites.google.com/view/lop12a1 cho các bạn trong lớp vào xem.