Cấu trỳc nội dung website

Một phần của tài liệu thiết kế và sử dụng website hỗ trợ dạy và học phần lý thuyết chủ đạo môn hóa học ở trường trung học phổ thông (Trang 76)

Hỡnh 2.1. Sơ đồ cấu trỳc website

2.4.2. Nội dung website

Dựa trờn cỏc tài liệu tham khảo, cỏc thụng tin, tin tức trờn mạng internet về thiết kế website kết hợp với nội dung của lý thuyết chủ đạo, chỳng tụi đĩ cố gắng thiết kế

sao cho website mang được tớnh cỏch riờng, nội dung và bố cục của cỏc trang trong website hài hũa, hợp lý về mặt logic, cú sức lụi cuốn người xem về hỡnh thức cũng như giao diện sử dụng thõn thiện.

2.4.2.1. Hệ thống lý thuyết

Hệ thống lý thuyết là cỏc bài học thuộc 6 chương: “Nguyờn tử”, “Bảng tuần hồn cỏc nguyờn tố húa học”, “Liờn kết húa học”, “Tốc độ phản ứng và cõn bằng húa học”, “Phản ứng oxi húa khử”, “Điện li” được trỡnh bày một cỏch hệ thống, ngắn gọn, cốt yếu cho HS dễ nhớ. Những kiến thức trừu tượng được minh họa cụ thể giỳp HS hiểu được bản chất vấn đề từ đú nắm vững kiến thức.

2.4.2.2. Bài giảng

Hệ thống bài giảng gồm 22 bài giảng điện tử thuộc 6 chương trong phần lý thuyết chủ đạo chương trỡnh nõng cao lớp 10. Cỏc bài giảng sinh động, hấp dẫn được thiết kế trờn phần mềm Microsoft Powerpoint. GV cú thể sử dụng cỏc bài giảng trờn website cho cỏc bài lờn lớp, đồng thời HS cú thể xem lại bài giảng của GV để hiểu bài hơn. Cỏc kiến thức trừu tượng khú hiểu của phần lý thuyết chủ đạo được minh họa trực quan, sinh động giỳp HS hứng thỳ học tập hơn.

2.4.2.3. Thớ nghiệm húa học

Cỏc chương về lý thuyết chủ đạo được nghiờn cứu ngay từ đầu chương trỡnh THPT, từ những chương đầu tiờn của lớp 10, lớp 11. Kiến thức thuộc cỏc chương này cú ý nghĩa là cơ sở lý thuyết quan trọng trong việc nghiờn cứu tồn bộ chương trỡnh Húa học phổ thụng. Đõy là phần kiến thức vừa khỏi quỏt vừa khú hiểu, với nhiều khỏi niệm mới mẻ và trừu tượng, với nhiều thớ nghiệm khú cú thể tiến hành trờn lớp được. Trang thớ nghiệm cung cấp 50 thớ nghiệm mụ phỏng và thớ nghiệm thật dưới dạng video. Cỏc thớ nghiệm, mụ phỏng này được sắp xếp vào 5 mảng lớn tương ứng với 5 chương lý thuyết giỳp GV dễ dàng tỡm kiếm và hướng dẫn HS tỡm kiếm thớ nghiệm minh họa cho bài giảng. Đồng thời những thớ nghiệm này giỳp HS kiểm chứng một cỏch trực quan và hiểu được bản chất những kiến thức lý thuyết được học, những kiến thức mà cả GV và HS khú cú thể kiểm chứng trong điều kiện thực tế trờn lớp.

Trang thớ nghiệm được thiết kế đẹp mắt, sinh động, được phõn tỏch theo cỏc mảng kiến thức rừ ràng thực sự thu hỳt HS tỡm hiểu, khỏm phỏ bớ ẩn của Húa học.

2.4.2.4. Hệ thống bài tập

Trong dạy học khụng thể thiếu bài tập, và việc sử dụng bài tập để luyện tập là một biện phỏp hết sức quan trọng để HS nắm vững kiến thức, hiểu bài học một cỏch sõu sắc, và biết cỏch vận dụng cỏc kiến thức đĩ học, do đú giỳp nõng cao chất lượng dạy học.

Trang “Bài tập” cung cấp hệ thống bài tập tự luận, bài tập trắc nghiệm giỳp GV rốn luyện kĩ năng giải bài tập cho HS và giỳp HS vận dụng, ụn tập, củng cố kiến thức đĩ học một cỏch nhuần nhuyễn.

a. Bài tập tự luận

Dựa trờn SGK và SBT của NXB Giỏo dục cựng một số sỏch tham khảo trờn thị trường, hệ thống bài tập tự luận được xõy dựng để HS vận dụng kiến thức lĩnh hội từ nội dung bài học trong cỏc trang “Bài giảng” và “Hệ thống lý thuyết” giải quyết.

BÀI TẬP TỰ LUẬN

Chủ đề 1: So sỏnh KL ngtử với KL hạt nhõn Chủ đề 2: Tớnh d dựa vào r và A

Chủ đề 3: Tớnh r dựa vào d và A

Chủ đề 4: Toỏn về cỏc loại hạt trong ngtử Chủ đề 5: Toỏn về đồng vị

Luyện tập

Bảng tuần hồn cỏc nguyờn tố húa học

Chủ đề 6: Biểu diễn sơ đồ MNL cỏc electron Chủ đề 7: Viết cấu hỡnh electron của một ngtử Chủ đề 8: Sự tạo thành ion

Chủ đề 9: Định vị trớ một nguyờn tố trong BTH

Chủ đề 10: So sỏnh tớnh kim loại, phi kim của cỏc nguyờn tố Chủ đề 11: Xỏc định tờn nguyờn tố trong BTH Luyện tập Liờn kết húa học Chủ đề 12: Liờn kết ion Chủ đề 13: Liờn kết cộng húa trị Chủ đề 14: Cỏch viết CTCT

Chủ đề 15: Khảo sỏt liờn kết húa học Chủ đề 16: Húa trị một nguyờn tố Luyện tập

Hỡnh 2.3. Sơ đồ cỏc chủ đề trong hệ thống bài tập tự luận

Hệ thống bài tập tự luận được phõn chia thành 5 chuyờn đề ứng với 5 chương lý thuyết, mỗi chương lại được chia thành cỏc chủ đề cụ thể nhằm mục đớch tạo thuận lợi cho người học dễ dàng tiếp cận thể loại bài tập mỡnh quan tõm, đồng thời nắm chắc được cỏc dạng bài thường gặp tương ứng với từng học thuyết chủ đạo. Sau khi học xong chương nào, HS sẽ tự học cỏc chủ đề bài tập trong chương đú và luyện tập cỏc bài tập tương tự trong mục “luyện tập” cuối mỗi chương.

Chủ đề 17: Cỏch tớnh số oxi húa một nguyờn tố. PƯ OXK Chủ đề 18: Cõn bằng PƯ OXK ở dạng phõn tử

Chủ đề 19: Cõn bằng PƯ OXK ở dạng ion (theo mụi trường) Luyện tập Tốc độ phản ứng và cõn bằng húa học Chủ đề 20: Tốc độ phản ứng Chủ đề 21: Cỏc yếu tố ảnh hưởng đến tốc độ phản ứng Chủ đề 22: Cõn bằng húa học Chủ đề 23: Phỏ vỡ cõn bằng húa học Luyện tập Phản ứng oxi húa khử

Hỡnh 2.4. Giao diện trang “Bài tập tự luận” (adsbygoogle = window.adsbygoogle || []).push({});

Sau khi xem hướng dẫn phương phỏp giải của từng chủ đề, HS bắt đầu giải cỏc bài tập minh họa trong chủ đề ấy. Để hỗ trợ tối đa cho HS tự học, mỗi bài tập luụn cú bài giải hoặc hướng dẫn kốm theo. Với nỳt bấm “hiện lời giải”/ “ẩn lời giải”, chỉ cần nhấp chuột HS cú thể cho hiển thị hoặc ẩn đi phần bài giải của bài tập khi gặp khú khăn trong quỏ trỡnh giải bài tập ấy.

Với 110 bài tập chia ra 23 chủ đề, được thiết kế bỏm sỏt chương trỡnh SGK nhưng đĩ được thay đổi số liệu, HS cú trong tay bộ sưu tập khỏ phong phỳ về cỏc dạng bài tập. Luyện tập kĩ sẽ giỳp HS nắm vững kiến thức và kĩ năng giải cỏc bài tập về lý thuyết chủ đạo, làm nền tảng vững chắc cho việc nghiờn cứu cỏc bài về chất và biến đổi chất trong chương trỡnh.

b. Bài tập trắc nghiệm

Sau khi học được phương phỏp giải ứng với cỏc dạng bài trong trang “Bài tập tự luận”, HS bước sang rốn kĩ năng giải nhanh với hệ thống cỏc cõu trắc nghiệm – như là những bài tập nhỏ - trong trang “Bài tập trắc nghiệm”. Hệ thống bài tập trắc nghiệm được chia theo 5 chương lý thuyết. Mỗi chương sẽ cú 2 phần: trắc nghiệm cú lời giải và trắc nghiệm tự giải. Phần “trắc nghiệm tự giải” được thiết kế nỳt

“Hiện đỏp ỏn” cung cấp đỏp ỏn của nhiều cõu trắc nghiệm được đặt ngay sau mỗi 20 cõu, HS cú thể giải nhanh nhiều cõu rồi dũ đỏp ỏn luụn một lần. Phần “trắc nghiệm cú lời giải” cỏc cõu trắc nghiệm đặc biệt được thiết kế nỳt “hiện/ ẩn đỏp ỏn” giỳp HS so sỏnh cỏch thức giải của mỡnh với hướng dẫn của website, qua đú tự đỏnh giỏ cỏch thức giải quyết vấn đề của mỡnh, đồng thời học được cỏc bớ quyết tư duy và kĩ năng giải quyết nhanh những dạng bài tập như thế. Từ đú, HS tiến bộ dần dần, vừa nõng cao khả năng giải quyết vấn đề vừa đỏp ứng được yờu cầu của cỏc kỡ thi.

Hỡnh 2.5. Giao diện trang “Bài tập trắc nghiệm”

2.4.2.5. Húa học vui

Nội dung trang này được sưu tầm chắt lọc từ nhiều nguồn, chia thành 3 chủ đề cơ bản đú là: Thơ vui Húa học, Sắc màu Húa học và Chuyện vui Húa học. Đõy là phần cung cấp nhiều kiến thức bờn ngồi sỏch vở GV cú thể hướng dẫn cho HS tham khảo, đồng thời giỳp HS thư giĩn sau một khoảng thời gian tập trung học tập. Trang này mở ra cho HS một gúc nhỡn khỏc về Húa học. Húa học sẽ khụng cũn khụ khan với những lý thuyết, cụng thức, phản ứng... mà đầy sắc màu lớ thỳ, đầy lĩng mạn với những vần thơ, vụ cựng phong phỳ với những cõu chuyện vui, những cõu chuyện lịch sử phỏt minh và tiểu sử cỏc nhà khoa học, và cũng thật gần gũi với cuộc sống hàng ngày của bản thõn mỗi HS.

Hỡnh 2.6. Giao diện mục “Truyện vui Húa học” trong trang “Húa học vui”

2.4.2.6. Kiểm tra đỏnh giỏ

Trang kiểm tra đỏnh giỏ cung cấp cho GV ngõn hàng cõu hỏi trắc nghiệm thuộc cỏc chương trong phần lý thuyết chủ đạo và cỏc bộ đề kiểm tra mẫu. Mỗi HS sẽ đăng kớ tờn (user) và mật khẩu để cú thể đăng nhập vào trang, tự chọn đề kiểm tra và làm bài trong thời gian quy định. Sau khi hồn thành bài kiểm tra, website sẽ thụng bỏo kết quả. HS cú thể làm lại bài kiểm tra nhiều lần hoặc chọn bài kiểm tra khỏc.

GV sử dụng website như một quản trị viờn. GV cú thể sử dụng cỏc đề kiểm tra cú sẵn để kiểm tra kết quả học tập của HS. GV cũng cú thể sử dụng ngõn hàng cõu hỏi trắc nghiệm cú sẵn hoặc nhập thờm cõu hỏi để tự soạn đề kiểm tra phự hợp với yờu cầu học tập và HS của lớp mỡnh. Nếu website được đưa lờn mạng, kết quả làm bài kiểm tra của HS sẽ được gửi về cho GV theo địa chỉ mail đăng kớ. Do đú GV cú thể quản lớ kết quả kiểm tra của cỏc lớp, từ đú nõng cao hiệu quả sử dụng website vào dạy học.

Hỡnh 2.7. Cỏc đề kiểm tra trong trang “Kiểm tra - đỏnh giỏ”

2.4.2.7. Tư liệu

Cỏc tư liệu sưu tầm hỗ trợ GV và HS trong dạy và học phần lý thuyết chủ đạo: - Danh sỏch giải Nobel Húa học tớnh đến thời điểm hiện nay.

- Tư liệu dạy học về bảng tuần hồn và cỏc nguyờn tố húa học. - Gợi ý đưa lịch sử húa học vào dạy học phần về lý thuyết chủ đạo. - Túm tắt lịch sử phỏt triển của bảng tuần hồn cỏc nguyờn tố húa học. - Chuyện vui và giai thoại về cỏc nhà bỏc học.

- Tài liệu đề thi tốt nghiệp và đề thi đại học cỏc năm gần đõy:

+ Đỏp ỏn và đề thi tuyển sinh đại học của 2 khối A, B từ năm 2002 đến 2011. + Đỏp ỏn và đề thi tuyển sinh cao đẳng từ năm 2007 đến 2011.

+ Đỏp ỏn và đề thi tốt nghiệp trung học phổ thụng từ năm 2006 đến 2010.

2.4.2.8. Liờn h

Trang này được thiết kế với mục đớch cung cấp họ tờn và địa chỉ liờn lạc của người thiết kế website nhằm mong nhận được sự phản hồi từ phớa HS, GV khi sử dụng website, gúp phần nõng cao chất lượng của website.

cụ thể của từng phần, những ý tưởng và phương phỏp thiết kế.

2.5. Phối hợp cỏc phần mềm để thiết kế website

Dựa trờn cỏc tài liệu tham khảo, cỏc cụng cụ hỗ trợ trờn mạng internet về thiết kế website kết hợp với nội dung của phần “Lý thuyết chủ đạo mụn Húa học”, chỳng tụi đĩ tổng hợp, phõn tớch, thiết kế và đi đến hồn thiện website hỗ trợ dạy học phần Lý thuyết chủ đạo mụn Húa họcvới nhiều tớnh năng độc đỏo. Website là sự hũa trộn cỏc phong cỏch thiết kế với nhiều cụng cụ riờng biệt, phự hợp với từng phần kiến thức như: trang “Bài giảng”, trang “Bài tập”, trang “Thớ nghiệm”,… Nội dung và bố cục của cỏc trang trong website hài hũa, hợp lý về mặt logic, giao diện đơn giản nhưng thõn thiện và cú sức hấp dẫn, lụi cuốn đối với người sử dụng.

2.5.1. Thiết kế trang chủ

2.5.1.1. í tưởng thiết kế

Đõy là một website hỗ trợ dạy học nờn yờu cầu cỏc nội dung cần cú: Hệ thống lý thuyết, bài giảng, thớ nghiệm, bài tập, kiểm tra – đỏnh giỏ…ngồi ra cũn cú thể cú mục “Húa học vui”, “Tư liệu”. Tất cả cỏc nội dung này được thể hiện trờn một thanh Menu ngang mà chỳng tụi đĩ sử dụng thư viện jQuery của JavaScript để thiết kế. Khi di chuyển chuột qua cỏc danh mục, sẽ cú một vệt sỏng di chuyển theo và kốm theo đú là cỏc menu đổ xuống, rất thuận tiện cho người sử dụng cú thể theo dừi và thao tỏc. Người học chỉ cần di chuyển vệt sỏng qua cỏc danh mục và bấm lựa chọn cỏc chủ đề mỡnh muốn xem.

Hỡnh 2.8. Giao diện trang chủ Default.html

Trang Default.html là trang chủ của website. Trang này được thiết kế dựa vào cụng cụ Dreamweaver, thư viện jQuery, Adobe Photoshop CS2 và Flash Intro Maker giỳp người sử dụng cú thể thấy được tổng thể website và dễ dàng thao tỏc.

2.5.1.2. Thực hiện (adsbygoogle = window.adsbygoogle || []).push({});

Cỏch tạo trang chủ Default.html như sau:

- Ban đầu, dựng Photoshop thiết kế cỏc file ảnh cho việc tạo banner của website và cỏc file flash giới thiệu trờn trang chủ. Chỳng ta làm theo cỏc bước như sau:

+ Mở phần mềm Adobe Photoshop và chọn File/New, đặt tờn cho file ảnh trong ụ Name, đặt kớch thước cho file ảnh với cỏc thuộc tớnh width và height, cỏc thuộc tớnh khỏc để mặc định.

+ Chốn ảnh nền cho khung hỡnh Banner vừa tạo bằng cỏch mở File/Open rồi chọn ảnh nền cần chốn.

+ Chốn chữ cho ảnh Banner rồi lưu file theo dạng *.jpg bằng cỏch mở File/Save as, chọn định dạng JPEG trong ụ Format, đặt tờn file là Banner sau đú nhấn Save/OK. Để cho ảnh được sắc nột, khi chọn lưu ảnh ta chọn Quality ở mức cao nhất (Maximum).

Hỡnh 2.10. Chốn ảnh nền và chữ cho Banner

+ Tiếp đú, sử dụng phần mềm Flash Intro Maker tạo cỏc hiệu ứng cho Banner. Mở chương trỡnh và chọn kớch cỡ cho ảnh bằng cỏch điền thụng số vào mục Size and sound trong mục Main của phần mềm.

+ Chọn Background chớnh là file ảnh Banner.jpg mà chỳng ta vừa tạo bằng cụng cụ Photoshop ở bước trước đú.

+ Lựa chọn cỏc hiệu ứng cho phự hợp, sau đú nhấn nỳt Publish để thực hiện việc xuất bản ra cỏc dạng file mà chỳng ta cú thể chốn trờn website, giả sử ở đõy là tệp “Banner.swf”

Hỡnh 2.12. Xuất bản file flash với định dạng *.swf

- Mở chương trỡnh Dreamweaver tạo một tệp mới cú tờn là Default.html. Tiếp đú là tạo cỏc bảng (table) chứa banner và một bảng cho thanh giới thiệu với dũng trữ trụi ngang. Việc tạo cỏc bảng này ta thực hiện như sau: trong cửa sổ Design của Dreamweaver chọn Insert/Table với độ rộng table width: 1010 pixels bằng với độ rộng của file Banner.swf ở trờn. Căn giữa cho bảng ta chọn thuộc tớnh align là center:

<table width="1010" border="0" align="center"> </table>

- Chốn Banner cho trang Default.html bằng cỏch mở Insert/Media/Flash rồi chọn file Banner.swf vừa tạo ở trờn.

- Trong hàng (row) thứ hai của bảng ta chọn ảnh nền với thuộc tớnh Background rồi gừ vào đoạn văn bản giới thiệu nằm trong thẻ đúng <marquee></marquee> như sau:

<marquee scrollamount="3">

<span class="style13">Chào mừng cỏc bạn đến với website hỗ trợ dạy và học mụn Húa học</span>

</marquee>

- Tải về bộ mĩ nguồn JavaScript với thư viện jQuery để tạo menu ngang cho website rồi chốn phần menu vào một bảng vừa tạo trờn trang Default.html.

Hỡnh 2.14. Màn hỡnh thiết kế trang Default.html bằng cụng cụ Dreamweaver

- Trờn trang chủ cũn thiết kế thờm phần “Liờn kết website” để người sử dụng cú thể nhanh chúng truy cập đến cỏc trang web tham khảo, cỏc trang blog của một số thày, cụ cũng giảng dạy bộ mụn Húa học biờn soạn một cỏch dễ dàng bằng cỏch

Một phần của tài liệu thiết kế và sử dụng website hỗ trợ dạy và học phần lý thuyết chủ đạo môn hóa học ở trường trung học phổ thông (Trang 76)