tìm hiểu về html5 và css 3, ứng dụng để viết một website đơn giản

 *Hyper Text Markup Language chính là HTML Viết tắt * Nhiều người nhầm tưởng HTML là ngôn ngữ lập trình nhưng sự thực không phải như vậy, nó là một ngôn ngữ đánh dấu * Một ngôn ngữ đánh

Sinh Viên: Lê Duy Khánh

Lớp: CĐ K7cGiáo Viên Hướng Dẫn: Nguyễn Quốc Bảo

Bộ môn: Kỹ thuật máy tính

Đề Tài: Tìm hiểu HTML5 và CSS3 Ứng dụng để xây dựng một website đơn giản

 Giới Thiệu Đề Tài

 Phân Tích Thiết Kế Hệ Thống

 Kết Luận và Hướng Phát Triển

 GiỚI THIỆU VỀ HTML5 VÀ CSS3

 MỤC TIÊU VÀ YÊU CẦU KHI XÂY DỰNG WEBSITE

 GiỚI THIỆU VỀ JOOMLA

 GiỚI THIỆU VỀ HTML VÀ CSS

 HTML được biết đến là một loại ngôn ngữ dùng để

mô tả hiển thị các trang web

 *Hyper Text Markup Language chính là HTML (Viết tắt)

* Nhiều người nhầm tưởng HTML là ngôn ngữ lập trình nhưng sự thực không phải như vậy, nó là một ngôn ngữ đánh dấu

* Một ngôn ngữ đánh dấu là một bộ các thẻ đánh dấu

* Để có thể miêu tả trang web ta cần đánh dấu các thẻ HTML

 CSS là chữ viết tắt của cụm từ tiếng Anh “Cascading Style Sheet”, là kiểu thiết kế sử dụng nhiều lớp định dạng

chồng lên nhau CSS được tổ chức World Wide Web (W3C) giới thiệu vào năm 1996 Cách đơn giản nhất để hiểu CSS

là hãy coi nó như một phần mở rộng của HTML để giúp đơn giản hóa và cải tiến việc thiết kế cho các trang web

GiỚI THIỆU VỀ HTML VÀ CSS

HTML5 và CSS3 là những công nghệ mới nhất cho ứng dụng việc thiết kế web Các tính năng video của HTML5 – cho phép đơn giản hoá việc thêm một video vào trang Web –

đã được nhận được nhiều sự chú ý, không những thế HTML5 còn có nhiều tính năng làm nó trở nên tuyệt vời đối với người

sử dụng cũng như các nhà phát triển web

GiỚI THIỆU VỀ HTML5 VÀ CSS3

 HTML5 sẽ cho phép bạn xem video, nghe nhạc, chơi game mà không

cần sử dụng một plugin như Flash hoặc Silverlight.

- Khả năng tương thích: HTML5 vẫn giữ lại các cú pháp truyền thống

trước đây, và nếu một vài tính năng mới nào đó của HTML5 chưa được trình duyệt hỗ trợ thì nó phải có một cơ chế fall back để render trong các trình duyệt cũ Đương nhiên là, HTML5 không thể xóa bỏ tất cả những gì đã có suốt hơn 20 năm chỉ trong một ngày Mặc dù điều này cũng không đồng nghĩa với việc HTML5 hỗ trợ tất cả các trình duyệt, nhưng nếu bạn có một trình duyệt đủ cũ để không tương thích với

HTML5, có lẽ đã đến lúc bạn nâng cấp trình duyệt mới!

 CSS3 cho phép bạn áp dụng nhiều hình nền lên một phần

tử (element)

 Với CSS3 bạn có thể thay đổi kích thước phần tử với thuộc tính 

 Nếu ở CSS2 bạn bị hạn chế với các font như Arial,

Verdana , Tahoma vì phần lớn các máy tính có các font

này thì ở CSS3 bạn có thể sử dụng bất kỳ font nào bạn

muốn Font sẽ được lấy từ một địa chỉ nào đó trên

internet

 Joomla! là một hệ quản trị nội dung mã nguồn mở

Joomla! cho phép người sử dụng có thể dễ dàng xuất bản các nội dung của họ lên Internet hoặc Intranet

 Joomla! có các đặc tính cơ bản là: bộ đệm trang (page

caching) để tăng tốc độ hiển thị, lập chỉ mục, đọc tin RSS

(RSS feeds), trang dùng để in, bản tin nhanh, blog, diễn

đàn, bình chọn, lịch biểu, tìm kiếm và hỗ trợ đa ngôn ngữ

 Các Thành Phần của JOOMLA

 Front-end (Frontpage): Là các trang Web mà mọi người sẽ được

thấy khi truy cập vào Web Site của bạn

 Back-end (Admin): Là phần quản lý Web Site dành cho các

Quản trị, chủ nhân của Web Site

 Template (Temp): Là giao diện, khuông dạng, kiểu mẫu, hình

thức được thiết kế để trình bày nội dung của trang Web và có các

vị trí định sẵn để tích hợp các bộ phận, thành phần của trang

Web

Yêu cầu đặt ra cho hệ thống:

 SƠ ĐỒ PHÂN CẤP CHỨC NĂNG

 SƠ ĐỒ THỰC THỂ LIÊN KẾT

 SƠ ĐỒ MỨC ĐỈNH, DƯỚI ĐỈNH, KHUNG CẢNH

 PHÂN TÍCH HỆ THỐNG

Hoạt động của Website tin tức gồm 2 hoạt động

chính:

Hoạt động của độc giả

Hoạt động của người quản lý

Hoạt động của độc giả:

 Một khách độc giả khi truy cập vào website, họ sẽ đặt vấn đề trang website có những thông tin gì, thông tin về những vấn

đề nào, cách tìm kiếm tin tức như thế nào

 Khách hàng có thể vào các chuyên mục hoặc nhóm tin để tìm kiếm các bài viết

 Đọc tin tức

Hoạt động của người quản lý:

Hướng dẫn tìm kiếm tin tức

Quản lý tin tức

Phê duyệt tin tức

Tiếp nhận ý kiến của độc giả

Quản lý website tin tức

Quản lý bài viết

Cập nhật tin

Phê duyệ

t tin

Tìm kiếm

Tìm kiếm

Tìm kiếm theo nhóm

Tìm kiếm theo chủ đề

Tìm kiếm theo từ khóa

Hiển thị tin

Hiển thị theo tran

g chủ Hiển thị theo nhó

m

Hiển thị theo chủ đề

Quản lý danh mục

Cập nhật nhóm tin

Cập nhật danh mục

Quản lý website tin tức

Tìm kiếm

Hồi đáp

Quản lý bài viết Người đưa

tin

Tin tức Nhóm tin

Tin trang chủ

Quản lý thành viên

Quản lý thành viên

Người đưa

tin

Cập nhật

Tin trang chủ

Nhóm tin

Tìm kiếm

Phê duyệt

ê d u yệ t

Quản lý website

TK theo nhóm

TK Theo

từ khóa

TK theo chủ đề

Nhóm tin

Cập nhật nhóm tin

Cập nhật danh mục

Người quản

lý

Danh mục Nhóm tin

Tin tức

#Id_tintuc Tin_trangch u

Tieu_de Tac_gia Bi_danh Thoigian_ta o

Cap_nhat Hinh_anh Video Lien_ket Id_nhomtin Id_danhmuc Id_tacgia

 Kết Luận

 Hướng Phát Triển

 Ứng dụng đáp ứng được yêu cầu trong giai đoạn phân tích thiết kế hệ thống

 Ứng dụng kết hợp được với các thẻ HTML5 và CSS3

 Như vậy sau một thời gian làm việc nghiêm túc và sự giúp

đỡ tận tình của thầy giáo hướng dẫn Nguyễn Quốc Bảo,

em đã hoàn thành đề tài.

Do thời gian thực hiện đề tài có giới hạn và kiến thức của em còn hạn hẹp nên không thể tránh khỏi những thiếu sót và chưa giới thiệu, đưa ra được những ưu điểm, nhược điềm còn tiềm ẩn bên trong website Chính vì vậy em rất mong nhận được sự bảo ban,

đóng góp ý kiến của thầy Nguyễn Quốc Bảo, giáo viên hướng dẫn

trực tiếp cũng như các thầy cô trong khoa và các bạn sinh viên để báo cáo của em được hoàn thiện hơn và có cơ hội phát triển hơn.

- Mở rộng trang web với quy mô lớn hơn, có nhiều tin

tức hay và bổ ích đối với mọi tầng lớp và lứa tuổi

- Xây dựng website có khả năng cập nhật tin tức tự

động

Em xin chân thành cảm ơn thầy Nguyễn Quốc Bảo đã quan tâm, hướng dẫn em giúp em hoàn thành đợt thực tập này, nhờ có thầy mà

em có thể học được những kiến thức bổ ích, em luôn ghi nhớ công ơn này của thầy.

Và một lần nữa em xin chân thành cảm ơn, em xin hứa sẽ cố gắng chăm chỉ học để không phụ công của thầy trong thời gian qua

Sinh Viên: Lê Duy Khánh