ỦY BAN NHÂN DÂN TỈNH ĐỒNG THÁP TRƢỜNG CAO ĐẲNG CỘNG ĐỒNG ĐỒNG THÁP GIÁO TRÌNH MÔN HỌC: THIẾT KẾ WEB NGÀNH, NGHỀ: TIN HỌC ỨNG DỤNG TRÌNH ĐỘ: TRUNG CẤP (Ban hành kèm theo Quyết định số /QĐ-CĐCĐ ngày tháng năm 20… của Hiệu trƣởng trƣờng Cao đẳng Cộng đồng Đồng Tháp) Đồng Tháp, năm 2018 Trang i TUYÊN BỐ BẢN QUYỀN Tài liệu này thuộc loại sách giáo trình nên các nguồn thông tin có thể đƣợc phép dùng nguyên bản hoặc trích dùng cho các mục đích về đào tạo và tham khảo. Mọi mục đích khác mang tính lệch lạc hoặc sử dụng với mục đích kinh doanh thiếu lành mạnh sẽ bị nghiêm cấm. Trang ii LỜI NÓI ĐẦU Các ứng dụng web đã và đang ảnh hƣởng trực tiếp đến các hoạt động và thói quen sinh hoạt hàng ngày của mỗi ngƣời, từ sinh viên, ngƣời nội trợ cho đến giới văn phòng và doanh nhân. Lợi nhuận cao thu đƣợc từ việc kinh doanh các ứng dụng web đã thu hút các công ty phần mềm chuyển hƣớng sang lĩnh vực này. Điều này mở ra nhiều cơ hội việc làm cho những ai thực sự quan tâm và yêu thích lĩnh vực thiết kế web. Bài giảng bao gồm các chƣơng sau: Chƣơng 1: GIỚI THIỆU INTERNET Chƣơng 2: CÁC BƢỚC THIẾT KẾ WEBSITE Chƣơng 3: HTML Chƣơng 4: CSS VÀ JAVASRIPT Chƣơng 5: ĐĂNG KÝ VÀ QUẢN LÝ WEBSITE Cuối cùng, xin gửi lời cảm ơn chân thành nhất đến chúng ta bè, đồng nghiệp đã có những ý kiến đóng góp sâu sắc cho bài giảng này. Mọi ý kiến đóng góp xin vui lòng gửi đến địa chỉ mail: pqcuong@dtcc. Xin chân thành cảm ơn! Đồng Tháp, ngày 09 tháng 04 năm 2015 Tác giả Phan Quốc Cƣờng Trang iii MỤC LỤC LỜI NÓI ĐẦU .iv DANH MỤC CÁC HÌNH .vi Chƣơng 1 . 1 GIỚI THIỆU INTERNET .1 Giới thiệu những khái niệm.1 Khái niệm về Internet .2 Khái niệm về World Wide Web .2 Thuật ngữ Internet .3 Homepage - Trang chủ .9 Trình duyệt web . 4 CÂU HỎI ÔN TẬP CHƢƠNG 1. 7 CÁC BƢỚC THIẾT KẾ WEBSITE .1 Mục đích của website cần thiết kế .2 Chiến lƣợc thiết kế .3 Thiết kế giao diện . 9 CÂU HỎI ÔN TẬP CHƢƠNG 2.1 Giới thiệu HTML .2 Trình soạn thảo HTML.3 Các thuộc tính trong HTML (HTML Attributes) .6 Các thẻ định dạng . 51 CÂU HỎI ÔN TẬP CHƢƠNG 3. 76 CSS VÀ JAVASCRIPT .1 Giới thiệu CSS .2 Một số đặc tính cơ bản của CSS.3 Giới thiệu ngôn ngữ JavaScript . 90 CÂU HỎI ÔN TẬP CHƢƠNG 4. 107 ĐĂNG KÝ VÀ QUẢN LÝ WEBSITE .1 Đăng ký tên miền (domain) miễn phí .1 Tên miền tiếng việt .2 Tên miền miễn phí .3 Tên miền miễn phí uni.4 Tên miền VN.2 Đăng ký host miễn phí .1 Đăng ký host miễn phí với freeservers .2 Đăng ký host miễn phí với Hostinger . 114 CÂU HỎI ÔN TẬP CHƢƠNG 5. 117 TÀI LIỆU THAM KHẢO . 118 DANH MỤC CÁC HÌNH Trang vi Hình 1 – Mô hình Internet . 2 Hình 2 – Bố cục website . 13 Hình 3 – Độ phân giải màn hình . 14 Hình 4 – Soạn thảo HTML trong Notepad . 20 Hình 5 – Đặt tên và chọn kiểu mã hóa cho tập tin HTML trong Notepad. 21 Hình 6 – Kết quả hiển thị trên trình duyệt Google Chrome . 22 Hình 7 – Tra cứu tên miền tiếng Việt . 107 Hình 8 – Tên miền miễn phí . 108 Hình 9 – Đăng ký tên miền . 109 Hình 10 – Trang uni. 109 Hình 11 – Đăng ký tài khoản tại uni. 110 Hình 12 – Tên miền VN. 111 Hình 13 – Website freeservers . 111 Hình 14 – Chọn gói cƣớc miễn phí . 112 Hình 15 – Đăng ký thông tin trên freeservers . 113 Hình 16 – Freeserver cung cấp một số lựa chọn xây dựng website . 113 Hình 17 – Đăng ký tài khoản tại Hostinger . 114 Hình 18 – Gói hosting miễn phí . 114 Hình 19 – Chọn gói hosting miễn phí của Hostinger . 115 Hình 20 – Form đăng ký tên miền trên Hostinger . 116 Trang vii Chƣơng 1 GIỚI THIỆU INTERNET MỤC ĐÍCH Cung cấp những kiến thức tổng quát về Internet, giúp sinh viên hiểu đƣợc các khái niệm và thuật ngữ về Internet. Nhiệm vụ tự học và tài liệu tham khảo của sinh viên trong chƣơng 1 Để đạt đƣợc mục đích đề ra trong chƣơng 1, sinh viên phải thực hiện tốt các yêu cầu sau đây: Phải đọc trƣớc nội dung Chƣơng 1 trong quyển bài giảng này trƣớc khi lên lớp 1.1 Giới thiệu những khái niệm 1.1 Khái niệm về Internet Internet là một tập hợp của các máy tính đƣợc liên kết nối lại với nhau thông qua hệ thống dây cáp mạng và đƣờng điện thoại trên toàn thế giới với mục đích trao đổi, chia sẻ dữ liệu và thông tin. Bất cứ nguời nào trên hệ thống cũng có thể tiếp cận và xem thông tin từ bất cứ một máy tính nào trên hệ thống này hay hệ thống khác. Trƣớc đây mạng Internet đƣợc sử dụng chủ yếu ở các tổ chức chính phủ và trong các trƣờng học. Ngày nay mạng Internet đã đƣợc sử dụng bởi hàng tỷ ngƣời bao gồm cả cá nhân các doanh nghiệp lớn, nhỏ, các trƣờng học và tất nhiên là nhà nƣớc và các tổ chức chính phủ. Phần chủ yếu nhất của mạng Internet là World Wide Web. Mạng Internet là của chung điều đó có nghĩa là không ai thực sự sở hữu nó với tƣ cách cá nhân. Mỗi phần nhỏ của mạng đƣợc quản lý bởi các tổ chức khác nhau nhƣng không ai không một thực thể nào cũng nhƣ không một trung tâm máy tính nào nắm quyền điều khiển mạng. Mỗi phần của mạng đƣợc liên kết với nhau theo một cách thức nhằm tạo nên một mạng toàn cầu. Trang 1 Internet là một mạng toàn cầu bao gồm nhiều mạng LAN (Local Area Network), MAN (Metropolitan Area Network) và WAN (Wide Area Network) trên thế giới kết nối với nhau. Mỗi mạng thành viên này đƣợc kết nối vào Internet thông qua một router. Hình 1 – Mô hình Internet 1.2 Khái niệm về World Wide Web Word Wide Web đƣợc gọi tắt là Web - là mạng lƣới nguồn thông tin cho phép mọi ngƣời khai thác thông tin qua một số công cụ hoặc là chƣơng trình hoạt động dƣới các giao thức mạng. World Wide Web là một trong số các dịch vụ của Internet nhằm giúp cho việc trao đổi thông tin trở nên thuận tiện và dễ dàng. Sở dĩ Web trở nên phổ biến vì Web cung cấp cho ngƣời sử dụng khả năng truy cập dễ dàng từ đó ngƣời sử dụng có thể khai thác các thông tin đa dạng trên Internet bao gồm phần, hình ảnh thậm chí cả âm thanh và video nghĩa là những gì mà chúng ta có thể cảm nhận đƣợc, vì thế Web đôi khi còn đƣợc gọi là đa phƣơng tiện của mạng Internet. Thông tin đƣợc biểu diễn bằng “website” mà chúng ta có thể nhìn thấy trên màn hình máy tính. Mọi thông tin đều có thể hiển thị trên website đó, kể cả âm thanh, hình ảnh động, nhƣng vấn đề lý thú nhất của Web nằm ở khía cạnh khác, đó là website mà chúng ta nhìn thấy trên màn hình máy tính có khả năng liên kết với những website khác, dẫn chúng ta đến những nguồn thông tin khác. Trang 2 Khả năng này của Web có đƣợc là nhờ thông qua các “siêu liên kết” (hyperlink), siêu liên kết về bản chất là địa chỉ trỏ tới nguồn thông tin (website) nằm đâu đó trên Internet. Bằng những siêu liên kết này, các website có thể liên kết với nhau thành một mạng chằng chịt, trang này trỏ tới trang khác, cho phép mọi ngƣời chu du trên biển cả thông tin.2 Thuật ngữ Internet 1.1 Webpage Webpage là một website, tức một tập tin có đuôi . Đó là một tập tin viết bằng mã code HTML chứa các siêu liên kết (hyperlink) đến các trang khác. Trên website ngoài thành phần chữ nó còn có thể chứa các thành phần khác nhƣ hình ảnh, nhạc, video.2 Website Website là tập hợp những website liên kết với nhau bằng các siêu liên kết. Website đƣợc đƣa vào mạng Internet để hoà cùng các website khác, mọi ngƣời trên khắp thế giới đều có thể truy cập đƣợc vào website để lấy thông tin.3 Homepage - Trang chủ Homepage - Trang chủ, là trang đầu tiên xuất hiện khi website đƣợc truy cập. Trang chủ thƣờng chứa các thông tin căn bản nhất của website và các liên kết đến các trang chuyên đề. Trang chủ có thể có các tên nhƣ index.4 Website tĩnh Web tĩnh là website chỉ đơn thuần mô tả thông tin và thông tin này không thƣờng xuyên đƣợc cập nhật hoặc thay đổi nội dung theo thời gian.5 Website động Web động là website có các đƣờng liên kết đến cơ sở dữ liệu Database. Khi chọn một liên kết, một thành phần trong cơ sở dữ liệu sẽ xuất hiện nhƣ thể có một website mới.6 Tên miền Mục đích chính của tên miền là để cung cấp một hình thức đại diện, hay nói cách khác, dùng những tên dễ nhận biết, thay cho những tài nguyên Internet mà đa số đƣợc đánh địa chỉ bằng số. Cách nhìn trừu tƣợng này cho phép bất kỳ tài nguyên nào (ở đây là website) đều có thể đƣợc di chuyển đến một địa chỉ vật lý khác trong cấu trúc liên kết địa chỉ mạng, có thể là toàn cầu hoặc chỉ cục bộ trong một mạng intranet, mà trên thực tế là đang làm thay đổi địa chỉ IP. Việc dịch từ tên miền sang địa chỉ IP (và ngƣợc lại) do hệ thống DNS trên toàn cầu thực hiện. Với việc cho phép sử dụng địa chỉ dạng chữ cái không trùng nhau thay cho dãy số, tên miền cho phép ngƣời dùng Internet dễ tìm kiếm, liên lạc với các website và bất kỳ dịch vụ liên lạc dựa trên IP nào khác. Tính uyển chuyển của hệ thống tên miền cho phép nhiều địa chỉ IP có thể đƣợc gán vào một tên miền, hoặc nhiều tên miền đều cùng chỉ đến một địa chỉ IP. Điều này có nghĩa là một máy chủ có thể có nhiều vai trò (nhƣ lƣu trữ nhiều website độc lập) hoặc cùng một vai trò có thể đƣợc trải ra trên nhiều máy chủ.7 Máy chủ Máy chủ, máy phục vụ hay hệ thống cuối là một máy tính đƣợc nối mạng, có IP tĩnh, có năng lực xử lý cao và trên máy đó ngƣời ta cài đặt các phần mềm để phục vụ cho các máy tính khác (máy trạm) truy cập để yêu cầu cung cấp các dịch vụ và tài nguyên.8 URL URL, viết tắt của Uniform Resource Locator, đƣợc dùng để tham chiếu tới tài nguyên trên Internet. URL mang lại khả năng siêu liên kết cho các trang mạng. Các tài nguyên khác nhau đƣợc tham chiếu tới bằng địa chỉ, chính là URL, còn đƣợc gọi là địa chỉ web hay là liên kết mạng (hay ngắn gọn là liên kết).