Giáo trình thiết kế web (nghề thiết kế đồ họa cao đẳng)

BỘ NÔNG NGHIỆP VÀ PHÁT TRIỂN NÔNG THÔN TRƢỜNG CAO ĐẲNG CƠ ĐIỆN XÂY DỰNG VIỆT XÔ KHOA CÔNG NGHỆ THƠNG TIN VÀ NGOẠI NGỮ GIÁO TRÌNH MƠN HỌC: THIẾT KẾ WEB NGHỀ: THIẾT KẾ ĐỒ HOẠ TRÌNH ĐỘ CAO ĐẲNG TUYÊN BỐ BẢN QUYỀN: Tài liệu thuộc loại sách giáo trình nên nguồn thơng tin phép dùng nguyên trích dùng cho mục đích đào tạo tham khảo Mọi mục đích khác mang tính lệch lạc sử dụng với mục đích kinh doanh thiếu lành mạnh bị nghiêm cấm LỜI NĨI ĐẦU Chương trình khung quốc gia nghề Quản trị mạng máy tính xây dựng sở phân tích nghề, phần kỹ thuật nghề kết cấu theo môđun, môn học Để tạo điều kiện thuận lợi cho sở dạy nghề trình thực hiện, việc biên soạn giáo trình kỹ thuật nghề theo môđun, môn học đào tạo nghề cấp thiết Thiết kế web mơ đun đào tạo nghề biên soạn theo hình thức tích hợp lý thuyết thực hành Trong trình thực hiện, nhóm biên soạn tham khảo nhiều tài liệu thiết kế lập trình web nước, kết hợp với kinh nghiệm thực tế sản xuất Mặc dầu có nhiều cố gắng, không tránh khỏi khiếm khuyết, mong nhận đóng góp ý kiến độc giả để giáo trình hồn thiện Ninh Bình 2019 Biên Soạn Thạc sỹ: Phạm Anh Đức MỤC LỤC Bài 1: CÁC ĐỊNH NGHĨA VÀ THUẬT NGỮ Internet dịch vụ Internet 1.1 Internet 1.2 Lợi ích Internet 1.3 Dịch vụ Internet Giới thiệu WWW 11 Quy trình xây dựng Website 12 Web page, Website 12 Trình duyệt Web 13 5.1 Khái niệm trình duyệt Web 13 5.2 Các trình duyệt Web 13 5.3 Một số thao tác với trình duyệt Web 13 Bài 2: GIAO DIỆN WEB 21 Các loại giao diện Website 21 Bố cục giao diện Web 21 Xây dựng giao diện Web theo yêu cầu 22 Bài 3: CÁC ĐỊNH NGHĨA VÀ THUẬT NGỮ 22 Giới thiệu HTML 23 Các thẻ HTML 23 Các thẻ khung 23 2.2 Thẻ định dạng văn 23 2.3 Thẻ chỉnh nội dung 25 2.4 Liên kết 25 2.5 Thẻ ảnh 25 2.6 Bảng 26 2.7 Form 26 Giới thiệu CSS 34 4.Các lệnh CSS 37 4.1 Background 38 4.2 Định dạng chữ 41 4.3 Các lệnh CSS khác 45 Bài 4: MÃ NGUỒN MỞ 63 Giới thiệu mã nguồn mở 64 1.1 Khái niệm mã nguồn mở 64 4: Quản trị nội dung Website Wordpress 69 4.1 Làm việc với AdminCP 69 4.2 Cài đặt Plugin cho WordPress 71 4.3 Cài đặt Themes cho WordPress 74 4.4 Chỉnh giao diện CSS Theme 79 4.5.Tuỳ chỉnh header va background 82 4.6 Hướng dẫn viết Wordpress 82 4.7.Cách tạo menu Wordpress 86 4.9 Hướng dẫn tạo trang (Add new pages) 90 4.12 Hướng dẫn Widget Wordpress 102 4.15 Tối ưu hố tìm kiếm (SEO) 111 4.18 21 website để tìm theme miễn phí 127 Bài 5: XUẤT BẢN VÀ DUY TRÌ WEBSITE 128 Đăng ký tên miền, hosting 128 1.1 Tên miền – domain 128 1.2 Hosting 128 1.3 Đăng ký dịch vụ 128 Cài đặt Website lên Server 128 2.1 Xác nhận thông tin server 128 2.2 Đưa mã nguồn lên server 128 Phát triển Website 128 3.1 Kiểm tra thử nghiệm nội dung 128 3.2 Phát triển nội dung 128 Bảo mật Website 128 4.1 Hiểm họa Website 128 4.2 Các giải pháp 128 MÔ ĐUN: Thiết kế Web Mã mơ đun: MĐ 38 Vị trí tính chất mơ đun: - Vị trí: Mơ đun bố trí sau sinh viên học xong môn học chung, môn sở chuyên ngành đào tạo chuyên môn nghề - Tính chất: Là mơ đun chun mơn nghề Mục tiêu mơ đun: - Về kiến thức + Trình bày cấu trúc Website; + Trình bày quy trình xây dựng phát triển Website; + Trình bày vấn đề liêu quan đến an toàn bảo mật Website - Về kỹ năng: Tạo Website dựa ngôn ngữ HTML, CSS, Javascrip, XML ; - Về lực tự chủ trách nhiệm + Bố trí làm việc khoa học đảm bảo thời gian xây dựng vận hành Website + Cần cù, chủ động học tập, đảm bảo an toàn học tập Nội dung mô đun: Nội dung tổng quát phân phối thời gian: Thời gian Thực Số hành, thí Tên chƣơng mục Tổng Lý Kiểm tra TT nghiệm, số thuyết thảo luận, Bài tập Bài 1: Các định nghĩa 3 thuật ngữ Internet dịch vụ Internet 0.5 0.5 1.1 Internet 1.2 Lợi ích Internet 1.3 Dịch vụ Internet Giới thiệu WWW 0.5 0.5 2.1 Dịch vụ WWW 2.2 Giao thức WWW 0.5 0.5 Quy trình xây dựng Website Web page, Website 0.5 0.5 4.1 Web page 4.2 Website Trình duyệt Web 0.5 0.5 5.1 Khái niệm trình duyệt Web 5.2 Các trình duyệt Web 5.3 Một số thao tác với trình duyệt Web 6: Phần mềm thiết kế Web Bài 2: Giao diện Web Các loại giao diện Website Bố cục giao diện Web Xây dựng giao diện Web theo yêu cầu Bài 3: Ngôn ngữ HTML CSS Giới thiệu HTML Các thẻ HTML 2.1 Các thẻ khung 2.2 Thẻ định dạng văn 2.3 Thẻ chỉnh nội dung 2.4 Liên kế - Link 2.5 Ảnh – Img 2.6 Bảng – Table 2.7 Biểu mẫu – Form 2.8 Multimedia, video 3.Giới thiệu CSS 4.Các lệnh CSS 4.1 Định dang khung 4.2 Định dạng chữ 4.3 Sắp xếp khối Xây dựng giao diện Web tử file PSD Xây dưng Web chuẩn SEO Bài 4: Mã nguồn mở Giới thiệu mã nguồn mở 1.1 Khái niệm mã nguồn mở 1.2 Các loại mã nguồn mở 2.Web server 2.1 Khái niệm Web server 2.2 Tác dụng Web Server 2.3 Cài đặt Web server Cài đặt Wordpress 3.1 Giới thiệu Wordpress 3.2 Cài đặt Wordpress 4: Quản trị nội dung Website 0.5 0.5 16 1 12 10 41 11 28 0.5 0.5 14 0.5 0.5 12 10 23 14 0.5 0.5 2 1 12 1 Wordpress 4.1 Tạo danh mục 4.2 Tạo viết 4.3 Quản lý viết, quản lý ảnh 4.4 Quản lý người dùng 4.5 Quản lý bố thành phần khác Cấu trúc mã nguồn Wordpress 6: Theme Wordpress 6.1 Thay đổi Theme Wordpress 6.2 Tìm cài đặt Theme Wordpress 6.3 Chỉnh sửa Theme Wordpress 7: Plugin Wordpress 7.1 Tác dụng Plugin Wordpress 7.2 Các Plugin Bài 5: Xuất trì Website Đăng ký tên miền, hosting 1.1 Tên miền – domain 1.2 Hosting 1.3 Đăng ký dịch vụ Cài đặt Website lên Server 2.1 Xác nhận thông tin server 2.2 Đưa mã nguồn lên server Phát triển Website 3.1 Kiểm tra thử nghiệm nội dung 3.2 Phát triển nội dung Bảo mật Website 4.1 Hiểm họa Website 4.2 Các giải pháp Cộng 2.5 1.5 0.5 0.5 1 1.5 0.5 90 29 58 Bài CÁC ĐỊNH NGHĨA VÀ THUẬT NGỮ Mã bài: MĐ 21 – 01 Internet dịch vụ Internet 1.1 Internet Internet hệ thống thơng tin tồn cầu truy nhập cơng cộng gồm mạng máy tính liên kết với Hệ thống truyền thơng tin theo kiểu nối chuyển gói liệu (packet switching) dựa giao thức liên mạng chuẩn hóa (giao thức IP) Hệ thống bao gồm hàng ngàn mạng máy tính nhỏ doanh nghiệp, viện nghiên cứu trường đại học, người dùng cá nhân phủ tồn cầu 1.2 Lợi ích Internet Internet có nhiều lợi ích sống thường ngày:  Đọc báo, xem tin tức Online  Lướt Facebook, xem phim, nghe nhạc trực tuyến  Gửi nhận Mail, tìm kiếm thơng tin mạng  Mua bán, học tập, chí chữa bệnh qua mạng  … Nói tóm lại, Internet mang lại CỰC KỲ tiện ích cho người, cung cấp khối lượng thông tin Khổng Lồ Các cách thức thông thường để truy cập Internet quay số, băng rộng, không dây, vệ tinh qua điện thoại cầm tay 1.3 Dịch vụ Internet 1.3.1 Web, E-Mail, FTP, hội thoại Website - trang web, trang mạng, tập hợp trang web, thường nằm tên miền tên miền phụ World Wide Web Internet Một trang web tập tin HTML XHTML truy nhập dùng giao thức HTTP Website xây dựng từ tệp tin HTML (website tĩnh) vận hành CMS chạy máy chủ (website động) Website xây dựng nhiều ngơn ngữ lập trình khác (PHP,.NET, Java, Ruby on Rails ) Email - Thư điện tử (từ chữ Electronic mail) hệ thống chuyển nhận thư từ qua mạng máy tính Email phương tiện thơng tin nhanh Một mẫu thơng tin (thư từ) gửi dạng mã hố hay dạng thơng thường chuyển qua mạng máy tính đặc biệt mạng Internet Nó chuyển mẫu thơng tin từ máy nguồn tới hay nhiều máy nhận lúc Ngày nay, email truyền gửi chữ, cịn truyền dạng thơng tin khác hình ảnh, âm thanh, phim, đặc biệt phần mềm thư điện tử kiểu cịn hiển thị email dạng sống động tương thích với kiểu tệp HTML FTP (File Transfer Protocol - Giao thức truyền tập tin) thường dùng để trao đổi tập tin qua mạng lưới truyền thông dùng giao thức TCP/IP (chẳng hạn Internet - mạng ngoại - intranet - mạng nội bộ) Hoạt động FTP cần có hai máy tính, máy chủ máy khách) Máy chủ FTP, dùng chạy phần mềm cung cấp dịch vụ FTP, gọi trình chủ, lắng nghe yêu cầu dịch vụ máy tính khác mạng lưới Máy khách chạy phần mềm FTP dành cho người sử dụng dịch vụ, gọi trình khách, khởi đầu liên kết với máy chủ Một hai máy liên kết với nhau, máy khách xử lý số thao tác tập tin, tải tập tin lên máy chủ, tải tập tin từ máy chủ xuống máy mình, đổi tên tập tin, xóa tập tin máy chủ v.v Vì giao thức FTP giao thức chuẩn công khai, cơng ty phần mềm nào, hay lập trình viên viết trình chủ FTP trình khách FTP Hầu tảng hệ điều hành máy tính hỗ trợ giao thức FTP Hiện thị trường có nhiều trình khách trình chủ FTP, phần đơng trình ứng dụng cho phép người dùng lấy tự do, không tiền 1.3.2 Gopher, News Group, Newsletter Các dịch vụ phổ biến khác Gopher dịch vụ tương đối Internet, Gopher cho phép truy nhập thông tin Internet theo thực đơn Thông tin Gopher văn hay đồ họa Newsgroup Nhóm thảo luận : Dịch vụ cho phép nhóm người dùng trao đổi, san sẻ ý tưởng truyền đạt thông tin với người đồng ý nghĩ đề tài mà tất thành viên nhóm quan tâm Usenet Tập hợp vài ngàn nhóm thảo luận (Newgroup) Internet Những người tham giao vào Usenet sử dụng chương trình đọc tin (NewsReader) để đọc thư người khác, gởi thư trả lời thư khác Usenet Mailing List (danh sách thư tín) danh sách địa thư điện tử nhóm người có nhu cầu chia sẻ ý tưởng với người quan điểm Chỉ cần gửi thư đến địa người mailing list, tất người có tên danh sách thư nhận hồi đáp thư diễn tương tự Hai điểm khác biệt mailing list newgroup là: - Trong mailing list, thư đến gửi trực tiếp vào hộp thư bạn, hộp thư bạn có khả biị đầy cách nhanh chóng, với Newsgroup khơng gặp tình trạng - Với Newsgroup, người nhóm xem thơng tin nhóm, cịn mailing List mang tính cá nhân người khác xem thông tin người Mailing List cách đơn giản để tìm kiếm thơng tin thích hợp cập nhật thường xuyên chủ đề thú vị mà bạn quan tâm Simple CSS Standard Edition WallPearl website ảnh hưởng đến thứ hạng website website có thứ hạng khơng tốt khơng chủ đề nội dung Vì thế, cảm thấy khơng cần thiết, tiến hành chèn thẻ rel=”nofollow” vào đâu có liên kết trỏ ngồi, ngoại trừ khu vực bạn trao đổi text link :D  Nếu bạn muốn tự động gắn thêm thẻ rel=”nofollow” vào tất liên kết trỏ (ngoại trừ blogroll) nên sử dụng plugin WP External Link 4.15.4 Tăng tốc blog Tốc độ tải trang blog bạn có phần quan trọng việc máy tìm kiếm đánh mục website Website tải nhanh bot tìm kiếm làm việc nhanh hơn, nhờ mà đánh mục nhiều trang cho lần “thăm viếng” Hơn nữa, tốc độ tải trang yếu tố định blog bạn có nhiều người truy cập hay khơng trở thành thành viên thân thuộc website mà tốc độ tải trang thuộc hàng “tốc độ rùa” Vì thế, để cải thiện tốc độ cho blog bạn, có số gợi ý sau:  Chọn nhà cung cấp hosting ổn định có tốc độ tải trang tốt Sử dụng Javascript CSS tốt, có nén chúng lại  plugin WP Minify Hạn chế sử dụng nhiều plugin, nên sử dụng plugin thật cần  thiết mà bạn làm cách thủ công Tham khảo viết plugin nên có cho WordPress Sử dụng cache cho website, thật cần thiết cho  website nào, sử dụng plugin WP Super Cache W3 Total Cache để tạo cache cho website để tăng tốc độ truy cập cách đáng kể 4.15.5 Tạo chiều sâu cho liên kết liên quan Sẽ thật bổ ích viết bạn có chèn số liên kết có liên quan, điều giúp cho người đọc dễ dàng điều hướng đến viết có liên quan để tìm thêm thơng tin, thẻ viết chèn liên kết viết người đọc dễ dàng tìm viết có chủ đề để đọc Hơn nữa, điều giúp cho bot tìm kiếm có thêm hội đánh mục viết 114 Simple CSS Standard Edition WallPearl Có cách để tạo chiều sâu liên kết:  Tạo danh sách viết liên quan  Trỏ link đến thẻ viết Với WordPress làm điều khơng khó khăn, bạn sử dụng plugin sau kết hợp với nhau:  Yet Another Related Post Plugin – Tự động tạo danh sách viết liên quan viết cách dựa vào độ tương quan chữ, thẻ category Auto Link Best Tag – Tự động tạo liên kết tag có mặt  viết Có thể tùy chỉnh số lần hiển thị link tag viết SEO Smart Link Pro - Đây plugin giúp bạn tự động thêm liên kết vào  số từ khóa cụ thể tự động hiển thị viết Ngồi tính phiên Pro cịn giúp bạn tạo redirect cho số liên kết mà bạn muốn giấu đường dẫn, ví dụ http://thachpham.com/go/dreamhost hỗ trợ lưu danh sách từ khóa Plugin có phiên miễn phí hồn tồn vơ dụng với từ khóa tiếng Việt khơng hỗ trợ bảng mã UTF-8 từ khóa liên kết, thành chữ mà có dấu tịt ngịi ln Vì đính kèm link download Pro trên, bạn tải sử dụng mà khơng cần tốn chi phí  SEO Auto Links & Related Posts - Tới thời điểm plugin tốt để tạo liên kết sâu tự động hồn tồn miễn phí WordPress Không tự động chèn liên kết vào số từ khóa định, tags hay categories, mà cịn hỗ trợ bạn tạo danh sách viết liên quan đẹp mắt, hỗ trợ ảnh thumbnail slide bên phải hình Theo lời khuyên bỏ qua SEO Smart Link Pro mà sử dụng này, không áy náy chuyện quyền Và cịn cách thủ cơng vơ hiệu tự tay chèn liên kết đến viết có liên quan mật thiết đến nội dung 4.15.6 Thiết lập XML Sitemap Robots.txt XML Sitemap định dạng nội dung chứa đường dẫn viết, thư mục, tag v.v….và tất đồ chi tiết trang web Từ đó, webmaster muốn thơng báo trang web lên máy tìm kiếm dùng sitemap gửi lên trang tìm kiếm Các bot tìm kiếm tiến hành phân tích thu thập liên kết có sitemap tiến hành đưa lên cỗ máy tìm kiếm So với cách thu thập liệu thông thường từ việc crawl trang web, sitemap giúp cho bot tìm kiếm dễ dàng xác định cấu trúc website, hỗ trợ thời gian đánh mục liên kết Vì vậy, bạn muốn website nhanh chóng biết đến trang tìm kiếm tạo sitemap từ thành lập website 4.15.7 Hướng dẫn tạo sitemap xml với Google XML Sitemap 115 Simple CSS Standard Edition WallPearl Google XML Sitemap – Đây plugin tạo sitemap phổ biến WordPress chuẩn xác sitemap để dễ dàng tương thích hoạt động tốt máy tìm kiếm Yahoo, Google, Bing Bạn tùy chọn loại bỏ đánh sitemap số trang tùy chỉnh độ ưu tiên trang Sau tải kích hoạt plugin, bạn kiểm tra xem đường dẫn sitemap bạn có hoạt động khơng, kiểm tra cách truy cập vào http://yourdomain.com/sitemap.xml Nếu trang màu xanh dương liệt kê đường dẫn coi cài đặt thành cơng Cịn website báo khơng tìm thấy file sitemap.xml bạn tiến hành tạo file sitemap.xml sitemap.xml.gz, sau upload lên thư mục gốc website CHMOD cho thành 666 4.15.8 Gửi sitemap lên Google Để gửi sitemap lên Google bạn truy cập đăng nhập vào trang Google Webmaster Tool Nhấp vào nút Thêm trang web nhập địa blog bạn vào Bước xác nhận bạn chủ nhân website cách thêm đoạn thẻ vào website tải tập tin xác nhận sau upload lên thư mục gốc website Sau xác nhận xong, bạn vào Tối ưu hóa -> Sơ đồ trang web, nhấp vào nút thêm sơ đồ trang web nhập sitemap.xml Sau lưu lại chờ thơng báo 4.15.9 Sử dụng Robots.txt File robots.txt hiểu file dùng để điều khiển trình đánh mục website Trong file robots bạn xác định thư mục không cần đánh mục để giúp cho bot đỡ thời gian đánh mục website bạn, đồng thời che giấu số thư mục nhảy cảm Để tạo file robots.txt bạn tạo thủ cơng trình soạn thảo văn đơn giản (như 116 Simple CSS Standard Edition WallPearl notepad) lưu lại với tên robots.txt upload lên thư mục gốc website Hoặc bạn sử dụng công cụ Robots.txt Generation Giả sử bạn sử dụng WordPress file robots.txt sau:  User-agent: * Disallow: /wp-admin/ Disallow: /wp-includes/ Disallow: /wp-content/ Đoạn User-agent:* nghĩa cho phép tất bot tìm kiếm thi hành lệnh Cịn đoạn Disallow ngăn chặn bot lập mục cho thư mục Các bạn thêm thứ cần thiết mà bạn không muốn bot thu thập gửi lên máy tìm kiếm 117 Simple CSS Standard Edition WallPearl 4.16 Danh sách plugin WordPress tốt Chắc hẳn sử dụng WordPress khó khăn việc lựa chọn plugin, chí người sử dụng WordPress lâu năm có lúc phân vân việc lựa chọn plugin có nhiều plugin giống nên dùng tốt Các plugin danh sách đánh giá để xếp hạng thông qua chức năng, hỗ trợ, cập nhật thường xuyên chắn đoạn mã độc hại đính kèm Hiện danh sách xếp hạng plugin gồm:  Các plugin bảo mật tối ưu tốt Các plugin SEO tốt  Các plugin bán hàng tốt   Các plugin có ích Các plugin có tiềm  Quy trình kiểm tra plugin bao gồm Test thử host online  Kiểm tra mã độc qua file đính kèm   Theo dõi change log plugin để biết plugin có update thường xuyên Kiểm tra đánh giá người sử dụng khác  Vì vậy, bạn hồn tồn n tâm với danh sách Tuy nhiên, không gian danh sách có hạn nên khơng ghi rõ chức ra, bạn vào trang tải plugin đọc phần mô tả xem screenshot, xin lỗi bất tiện Nếu bạn sử dụng phát lỗi, liên lạc với phatnguyen@kent-international.edu.vn để kiểm tra giảm thứ hạng Ngồi ra, bạn biết plugin hay giới thiệu cho Các bạn vào http://wordpress.org/download/ để download plugin bên Những plugin SEO tốt Tên Wordpress SEO by Yoast SEO Ultimate All in One SEO Google XML Sitemap WP External Links Tác giả Joost de Valk SEO Design Solutions Michael Torbert Arne Brachhold Victor Villaverde Laan Đánh giá Dễ dùng tốt Đa chức Dễ sử dụng Tạo sitemap tốt Dễ sử dụng Những plugin bảo mật tối ƣu hóa tốt Tên Tác giả 118 Đánh giá Simple CSS Standard Edition BulletProof Security Better WP Security 6Scan Security Akismet WP 2-Step Verification WallPearl Edward Alexander Bit51 6Scan Automattic As247 Mạnh mẽ Dễ sử dụng Tiện dụng Trùm chống spam lớp bảo mật Những plugin làm trang bán hàng tốt Tên Tác giả Đánh giá WooEcommerce WooThemes Dễ dùng eShop Rich Pedley Tốt khó dùng Ecwid Ecwid Team Gọn nhẹ PayPal Simple Cart Ruhul Amin Đơn giản Ready! Ecommerce Shopping Ready Shopping Đa tính Cart Những plugin có ích Plugin SEO, bảo mật hay làm trang bán hàng có ích để dễ tham khảo xin tách ra, 20 plugin plugin nên dùng bạn có nhu cầu Tác giả Đánh giá Newsletter Sign-Up DvanKooten Tạo form đăng ký nhận tin dễ dàng EWWW Image Optimizer Nosilver4u Nén ảnh dung lượng lớn Jetpack Wordpress Đa chức WP Super Cache Donncha O Caoimh Dễ sử dụng Contact Form Takayuki Miyoshi Dễ sử dụng BackWPUp Daniel Hüsken Không thể thiếu Lightbox Plus Dan Zappone Không thể thiếu nRelated Post Plugin nRelate & SlipFire Không thể thiếu Yet Another Related Post Micho Đơn giản – mạnh mẽ WP Mashsocial Widget Ahmad Awais Đẹp – Tiện dụng WP Page Navi Lester „GaMerZ‟ Nên sử dụng Chan GRAND FIAGAllery Rattus Đẹp mắt User Role Editor Vladimir Garagulya Nên dùng blog có nhiều author Facebook Facebook Tương tác Wordpress với Facebook Disqus Comment System Disqus Dễ sử dụng 119 Simple CSS Standard Edition BJ Lazy Load Special Recent Post Fancier Author Box Better Wordpress Recent Comment External Links Shortcode Ultimate Liveblog Use Google Libraries BJ Lazyload WallPearl Bjørn Johansen Luca Grandicelli ThematoSoup Khang Minh Nên dùng Nên dùng Nên dùng Nên dùng Denis de Bernardy Hỗ trợ SEO Vladimir Anokhin Bộ shortcodeđẹp Automatic Đăng status giống mạng xã hội Jczorkmid Bjornjohansen Không thể thiếu Không thể thiếu Những plugin có tiềm Đây plugin tốt người biết đến, có hội trở thành plugin phổ biến ngày không xa Tên Tác giả Đánh giá Schema Creator Norcross Tạo microdata cho viết dễ dàng Wordfence Security Mmaunder Bảo vệ file toàn diện CSS & Javascript Evgeniy Tối ưu hóa JS CSS Optimizer Kotelnitskiy WP Retina TigrouMeow Resize ảnh tốt Auto SEO Phillip.Gooch SEO đơn giản Infinite WP Client InfiniteWP Multi Blog Client FAQ Manager IndiaNIC Tạo quản lý trang F.A.Q Wordpress Video Contus Support Tạo gallery cho video chuyên nghiệp Gallery Drop Shadow Boxes Stevehenty Tạo hộp đổ bóng Simple Instagram Rollybueno Tương tác với tài khoản Instagram Live Chat Danycode Khung chat đơn giản Easy PayPal Manojtd Cổng toán PayPal đơn giản Codepress Admin Codepress Sắp xếp kiểu hiển thị WpColumns admin SlideDesk Lite Dtelepathy, Kynatro Slide ảnh chuyên nghiệp Content Simple Footnote Nacin Thêm ghi cho viết Advanced Youtube Embedplus Đăng video từ youtube đa Embed Easy Rotetor DWUser Slide ảnh đơn giản 120 Simple CSS Standard Edition WallPearl Social Login Claude Schlesser A Better Search Live Chat Robot Post View Count Ultimate TinyMCE Solioquy Lite Mikko Saari Acobot Juliobox Josh Lobe Griffinjt Bình luận, đăng nhập tài khoản mạng xã hội Tối ưu chức tìm kiếm Chat tự động Hiển thị lượt xem viết Khung soạn viết trực quan Tạo slide ảnh định dạnh Responsive 4.17 28 plugin kết nơí WordPress với ứng dụng Google Google thật làm chủ giới công nghệ không với dịch vụ phổ biến Google Search Google Email (Gmail) mà làm cho ngày chịu phụ thuộc nhiều vào gã “tay to” với nhiều ứng dụng Google Calendar, Google Alert, Google Plus, Google Picasa, Youtube Và bạn trung thành với dịch vụ Google, hẳn muốn tích hợp chúng vào blog để dễ dàng kiểm sốt quản lý hơn, đồng thời giúp chia sẻ tốt dịch vụ chia sẻ Google Google Page Rank Badget Dễ dàng chèn hình ảnh hiển thị Page Rank website, thích hợp để “khoe” PR Google+ Plugin Nếu bạn muốn chèn nút +1 vào đâu blog mà không muốn tốn nhiều thời gian nên dùng plugin Plugin làm việc WordPress Multi User (WordPress MU) 121 Simple CSS Standard Edition WallPearl WordPress Social Login Thêm tính đăng nhập, bình luận tài khoản mạng xã hội khác Google Plus Favicon Plugin tự động hiển thị favicon blog avatar Google Plus bạn Gravatar Google Images Nếu blog bạn có q nhiều comment dùng Gravatar để hiển thị avatar bạn cho hiển thị hình ảnh tự động từ Google Images để làm đẹp blog, ngược lại người dùng có avatar hiển thị avatar người dùng Google Picasa Viewer Hiển thị gallery ảnh từ tài khoản Picasa viết trang shortcode, đồng thời hỗ trợ widget hiển thị TubePress 122 Simple CSS Standard Edition WallPearl Hiển thị widget video clip tài khoản bạn Youtube blog WordPress Hỗ trợ chèn showcase đẹp mắt tiện lợi Youtube Simple Gallery Không phức tạp TubePress, plugin giúp bạn chèn showcase video từ Youtube vào viết dễ dàng, hỗ trợ xem video popup-lightbox đẹp CodeArt – Google Mp3 Player Chơi định nhạc định dạng mp3 player Google, nhẹ tiện lợi Chỉ hoạt động bạn dùng link mp3 trực tiếp Google Maps Plugin Chèn phần đồ từ Google Map vào viết dễ dàng Chỉ cần nhấn vào nút chèn Google Map viết, tìm địa điểm cần chèn có đồ từ Google Map vào viết mà không cần trải qua số bước phức tạp làm thủ công Convert Address to Google Map Tự động chuyển đổi địa dạng chữ thành Google Map, kích hoạt địa nằm cặp thẻ Comprehensive Google Map Chèn đồ vào blog từ Google Map, hỗ trợ hiển thị đồ đẹp mắt dễ sử dụng 123 Simple CSS Standard Edition WallPearl WP Google Drive Tự động backup tất liệu blog upload vào tài khoản Google Drive bạn, có hỗ trợ tự động backup theo chu kỳ Google Document Enbedder Hiển thị nội dung file văn Google Document WordPress Điểm đặc biệt plugin không yêu cầu người dùng cài thêm Flash hay PDF cho trình duyệt WordPress Google Form Nếu bạn thường xuyên sử dụng Google Form vào blog plugin bạn nên sử dụng Plugin cho phép hiển thị form Google Form lên viết trang WordPress giống hiển thị form bình thường, xem ảnh để biết thêm chi tiết Easy Adsense Chèn widget quảng cáo từ tài khoản Google Adsense dễ dàng vào viết Hỗ trợ hiển thị widget footer Adsense Plugin Chèn quảng cáo Google Adsense vào viết, chỉnh sửa màu sắc font chữ cho quảng cáo trang quản trị 124 125 Google Analytics Dashboard Nếu bạn ngại thường xuyên vào trang chủ Google Analytics để xem thống kê website mang vào trang Dashboard WordPress với plugin Ngồi hỗ trợ chèn widget hiển thị lượt truy cập đếm lượt xem trang viết, nên dùng cho tất người Google XML Sitemap Tự động tạo sitemap định dạng xml để submit lên máy tìm kiếm nhằm hỗ trợ SEO cho WordPress Google Site Verification Plugin Một số dịch vụ Google liên quan đến website phải yêu cầu bạn chứng thực website việc thêm thẻ meta vào website upload file xác nhận lên hosting làm thời gian, plugin giúp bạn vượt qua cơng đoạn với cú click Google Authorship Widget Chèn widget hiển thị avatar từ Google Plus, đồng thời hỗ trợ hiển thị avatar Google Plus kết tìm kiếm máy tìm kiếm để kết bạn bật Xem thêm Google Calendar Event Chèn widget hiển thị kiện tài khoản Google Calendar vào WordPress Stout Google Calendar Chèn widget hiển thị lịch Google Calendar cho phép chỉnh sửa màu sắc Google Libraries 125 126 Nếu blog bạn sử dụng nhiều plugin javascript gây trở ngại đến tốc độ website hao tốn nhiều băng thông Plugin cho phép bạn dùng plugin javascript có thư viện thay sử dụng file javascript website, tiết kiệm băng thông cải thiện tốc độ cho blog Google Font Tùy chọn hiển thị font chữ đẹp vào blog WordPress lấy từ thư viện Font Google Feedburner Plugin Tự động chuyển link RSS mặc định blog link RSS Feedburner Google Alert Hiển thị báo cáo từ Google Alert Dashboard WordPress Google Custom Search 126 127 Chèn chức tìm kiếm viết blog từ Google vào blog, hỗ trợ tùy chỉnh màu sắc, kiểu hiển thị Với plugin bạn thấy lợi ích dịch vụ nhỏ Google lớn đến mức nào, có tới dịch vụ Google phải phụ thuộc vào nhiều Cịn bạn sao? Hiện bạn sử dụng dịch vụ Google? 4.18 21 website để tìm theme miễn phí Để tìm giao diện miễn phí dành cho WordPress khơng có khó WordPress phổ biến giới, có hàng trăm website cung cấp theme miễn phí dành cho bạn lựa chọn, vấn đề nên tìm giao diện miễn phí đâu để chắn theme khơng bị chèn quảng cáo, mã độc làm ảnh hưởng đến hoạt động website bạn WordPress Theme Showcase Fresheezy Graph Paper Press BlogOhBlog TopWPThemes WooThemes ThemeLab WpThemeFree BestWPThemes 10 ArcSin Templates 11 Design Disease 12 Free Theme Layout 13 SkinPress 14 WordPress Theme Base 15 Rock Kitty Theme 16 WP Skins 17 Templates Browse 18 Free WordPress Themes 19 FreeWpThemes.net 20 WPTemplates 21 WordPress Theme Generator – Tự thiết kế theme WordPress 127 128 Bài XUẤT BẢN VÀ DUY TRÌ WEBSITE Mã bài: MĐ21– 05 Mục tiêu Trình bà quy trìn xây dựng Website; Làm thủ tục để triển khai Web lên hệ thống mạng Internet; Kiểm thử phát triển Website; Cẩn thận tỉ mỉ kiểm tra lỗi phát triển Web Nội dung Đăng ký tên miền, hosting 1.1 Tên miền – domain 1.2 Hosting 1.3 Đăng ký dịch vụ Cài đặt Website lên Server 2.1 Xác nhận thông tin server 2.2 Đưa mã nguồn lên server Phát triển Website 3.1 Kiểm tra thử nghiệm nội dung 3.2 Phát triển nội dung Bảo mật Website 4.1 Hiểm họa Website 4.2 Các giải pháp 128 ... Quy trình xây dựng Website Web page, Website 0.5 0.5 4.1 Web page 4.2 Website Trình duyệt Web 0.5 0.5 5.1 Khái niệm trình duyệt Web 5.2 Các trình duyệt Web 5.3 Một số thao tác với trình duyệt Web. .. 11 Quy trình xây dựng Website 12 Web page, Website 12 Trình duyệt Web 13 5.1 Khái niệm trình duyệt Web 13 5.2 Các trình duyệt Web 13... WWW Quy trình xây dựng Website Để xây dựng Website cần trải qua số bước sau:  Xác định giao diện, đặc tính cần thiết website  Chọn tên miền, hosting cho website  Tiến hành thiết kế website