TỔNG QUAN VẤN ĐỀ NGHIÊN CỨU
Tầm quan trọng, ý nghĩa vấn đề nghiên cứu
Trong hai năm qua, điện thoại và thiết bị di động đã trải qua một cuộc cách mạng lớn Quan sát xung quanh, ta dễ dàng nhận thấy những chiếc smartphone có cấu hình phần cứng vượt trội hơn cả máy tính desktop cách đây một thập kỷ Theo vnexpress, người dùng Việt Nam đang ưa chuộng điện thoại màn hình lớn, cảm ứng, với giá cao hơn cả laptop Vì vậy, thiết kế website cho thiết bị di động sẽ phát triển mạnh mẽ trong những năm tới để đáp ứng nhu cầu ngày càng tăng từ thị trường smartphone.
Năm 2011 đánh dấu sự bùng nổ của các thiết bị di động thông minh, với sự cạnh tranh mạnh mẽ từ các thương hiệu như Samsung, Apple, Nokia và LG Các mẫu smartphone mới liên tục ra mắt, thu hút người tiêu dùng nhờ vào những tính năng được cải tiến Công nghệ 3G phát triển sớm tại Việt Nam đã giúp người dùng, kể cả sinh viên, dễ dàng cập nhật Facebook ngay cả khi đang di chuyển trên xe buýt.
Trước đây, thiết kế website cho điện thoại thường yêu cầu phát triển phần mềm riêng hoặc phiên bản web dành riêng cho di động, dẫn đến chi phí cao cho doanh nghiệp Chỉ một số công ty lớn mới có khả năng đầu tư cho những giải pháp này Tuy nhiên, trong những năm gần đây, công nghệ thiết kế website đã có những bước tiến đáng kể, với các ngôn ngữ lập trình và kỹ thuật mới giúp tối ưu hóa trải nghiệm người dùng trên thiết bị di động mà không cần phải xây dựng thêm một website hay phần mềm riêng biệt.
HTML5, CSS3, PHP6 và WordPress cung cấp nhiều giải pháp mới cho việc lập trình website Các nhà thiết kế web hàng đầu đã nhanh chóng áp dụng xu hướng thiết kế responsive, cho phép website tự động điều chỉnh độ rộng phù hợp với trình duyệt, giúp hiển thị tốt trên mọi kích thước màn hình.
Để đáp ứng xu hướng hiện đại, website FPT Polytechnic và các trang web của doanh nghiệp khác cần tối ưu hóa hiển thị nội dung trên điện thoại di động và các thiết bị số.
Tổng quan các tài liệu liên quan đến nội dung đề tài
Luận văn "Website trường ĐH Công nghệ phiên bản tiếng Anh trên thiết bị di động" của tác giả Nguyễn Thị Thanh Tâm, thuộc Khoa Công Nghệ Thông Tin, nghiên cứu việc tối ưu hóa giao diện và nội dung của website trường ĐH Công nghệ cho người dùng di động Bài viết nhấn mạnh tầm quan trọng của việc cung cấp thông tin bằng tiếng Anh để phục vụ sinh viên quốc tế và nâng cao khả năng tiếp cận thông tin giáo dục Nghiên cứu này cũng đề xuất các giải pháp kỹ thuật nhằm cải thiện trải nghiệm người dùng trên các thiết bị di động.
Đề tài này tập trung vào việc xây dựng phiên bản tiếng Anh của website trường ĐH Công nghệ dành cho thiết bị di động, nhằm tối ưu hóa hiển thị trên màn hình nhỏ Qua việc nghiên cứu hệ thống website hiện tại được phát triển trên nền tảng Drupal, các thành phần và module quan trọng đã được phân tích để thiết kế template cho phiên bản di động Quá trình triển khai bao gồm việc cài đặt một trang Drupal mới, sử dụng dữ liệu từ phiên bản gốc và áp dụng template đã thiết kế Kết quả là một phiên bản di động thành công với tên miền riêng, mặc dù hệ thống vẫn chưa có chức năng tự nhận diện thiết bị truy cập để chuyển hướng người dùng.
Cuốn sách "Wordpress 3 completer" của April Hodge Silver (1/2011) cung cấp kiến thức toàn diện về Wordpress, từ những bước khởi đầu cho người mới sử dụng đến việc thay đổi thông tin trên trang chủ và bài viết Nó hướng dẫn cách tải lên hình ảnh, âm thanh và video, cũng như thực hiện các công việc xuất bản, di chuyển và bảo trì website Ngoài ra, sách còn đề cập đến việc tạo giao diện, sử dụng các widget và plugin, cùng với cách xây dựng website trên nền tảng di động bằng Wordpress.
Sau khi tham khảo hai tài liệu và khảo sát tại FPT Polytechnic, tôi quyết định nghiên cứu đề tài “Hoàn thiện chức năng hiển thị nội dung số trên điện thoại di động cho website của FPT Polytechnic Việt Nam bằng công cụ WordPress” Tôi chọn WordPress vì nó khắc phục những nhược điểm của Drupal, như tính khó sử dụng cho người mới và sự bối rối khi tạo Menu WordPress có nhiều thành phần mở rộng hơn và không yêu cầu chờ đợi nâng cấp như Drupal Giao diện của WordPress thân thiện hơn, cho phép người dùng tạo Blog hoặc website chỉ trong vài phút Bạn có thể tạo trang miễn phí tại http://wordpress.com và dễ dàng cài đặt, nâng cấp các plugin miễn phí ngay trong phần quản lý của WordPress.
Mục tiêu nghiên cứu của đề tài
Bài viết này tập trung vào việc hình thành cơ sở lý luận về website, bao gồm khái niệm và chức năng hiển thị trên điện thoại di động, cùng với các công cụ hỗ trợ cho việc này Đồng thời, nó cũng nghiên cứu và đánh giá thực trạng website của FPT Polytechnic, nhằm hoàn thiện chức năng hiển thị nội dung số trên điện thoại di động cho trang web của FPT Polytechnic.
Đối tượng và phạm vi nghiên cứu của đề tài
1.4.1 Đối tượng Đối tượng nghiên cứu của đề tài là hệ thống website của FPT Polytechnic Việt Nam, chức năng hiển thị nội dung số trên điện thoại di động, công cụ wordpress
Phạm vi nghiên cứu của đề tài bao gồm website của FPT Polytechnic Việt Nam, các đề tài liên quan, và nguồn thông tin từ chuyên gia phòng hệ thống thông tin của FPT Polytechnic Nghiên cứu cũng thu thập tài liệu tham khảo từ internet để đảm bảo tính chính xác và đầy đủ.
Các phương pháp áp dụng thực hiện đề tài
1.5.1 Phương pháp điều tra dữ liệu sơ cấp
Phương pháp thu thập dữ liệu sơ cấp là cách điều tra các dữ liệu chưa qua xử lý, được thu thập trực tiếp từ các đơn vị trong tổng thể nghiên cứu thông qua các cuộc điều tra thống kê Mặc dù dữ liệu sơ cấp đáp ứng tốt yêu cầu nghiên cứu, nhưng việc thu thập loại dữ liệu này thường phức tạp và tốn kém Trong bài khóa luận này, tôi đã sử dụng phương pháp phỏng vấn cá nhân như một hình thức thu thập dữ liệu sơ cấp.
Phương pháp phỏng vấn cá nhân trực tiếp (personal interviews):
Nhân viên điều tra tiến hành phỏng vấn trực tiếp đối tượng theo bảng câu hỏi đã chuẩn bị sẵn Phương pháp này được áp dụng trong các nghiên cứu phức tạp, nơi cần thu thập nhiều dữ liệu, cũng như khi muốn thu thập ý kiến của đối tượng thông qua các câu hỏi ngắn gọn và dễ trả lời.
Gặp mặt trực tiếp giúp nhân viên điều tra thuyết phục đối tượng trả lời và giải thích rõ ràng các câu hỏi, đồng thời có thể sử dụng hình ảnh để minh họa Họ cũng có khả năng kiểm tra dữ liệu ngay tại chỗ trước khi ghi vào phiếu điều tra Tuy nhiên, phương pháp này tốn kém và mất nhiều thời gian, làm cho việc đạt được chất lượng hỏi cao trở nên khó khăn.
Phương pháp nghiên cứu tài liệu:
Phương pháp này cho phép nghiên cứu chi tiết nhiều khía cạnh của tổ chức và hệ thống Thông tin được ghi chép không chỉ phản ánh quá khứ mà còn cả hiện tại và tương lai của tổ chức, hệ thống.
Để thực hiện nghiên cứu, cần xem xét các tài liệu liên quan đến báo cáo doanh thu, chi phí cùng với các mẫu phiếu và đơn tại tổ Điều hành quản lý tại Trung tâm Bảo dưỡng Ứng cứu thông tin Dữ liệu thu thập được sẽ được ứng dụng trong việc phân tích kết quả hoạt động kinh doanh của doanh nghiệp trong những năm gần đây và một số phần liên quan khác.
Phương pháp sử dụng phiếu điều tra:
Là phương pháp được sử dụng khi lấy thông tin từ một số lượng lớn các đối tượng trên một phạm vi địa lý rộng.
Để thực hiện điều tra, sử dụng phiếu điều tra tại các tổ trong trung tâm nhằm thu thập thông tin chi tiết về hệ thống tính cước và chăm sóc khách hàng với số lượng câu hỏi phù hợp Thông tin thu thập được sẽ được áp dụng để xây dựng bài toán cụ thể cho hệ thống tính cước và chăm sóc khách hàng, đồng thời đưa ra kiến nghị cho doanh nghiệp liên quan đến phần cứng, phần mềm và nhân sự.
Phương pháp tìm kiếm trên Internet:
Phương pháp tìm kiếm này phổ biến, dễ thực hiện, tiết kiệm chi phí và mang lại kết quả nhanh chóng Tuy nhiên, dữ liệu thu thập thường có tính chất rộng rãi và thiếu chi tiết.
Cách thức thực hiện: tìm kiếm thông tin về website, hiển thị nội dung trên điện thoại di động, các công cụ hỗ trợ việc thiết kế, lập trình
Ngoài ra, còn sử dụng phương pháp thống kê, thu thập số liệu để làm rõ những nội dung liên quan.
1.5.2 Phương pháp điều tra dữ liệu thứ cấp a Dữ liệu thứ cấp
Dữ liệu thứ cấp là thông tin được thu thập bởi người khác và có thể phục vụ cho các mục đích khác với nghiên cứu của chúng ta Loại dữ liệu này có thể là dữ liệu thô chưa qua xử lý hoặc dữ liệu đã được xử lý Điều này có nghĩa là dữ liệu thứ cấp không phải do chính người nghiên cứu thu thập.
- Ưu điểm Tiết kiệm tiền bạc, thời gian do tận dụng các công trình nghiên cứu tìm hiểu hay những thống kê do người đi trước đã điều tra
Dữ liệu thứ cấp, mặc dù được thu thập cho các nghiên cứu khác, có thể không phù hợp với vấn đề hiện tại Việc phân loại dữ liệu gặp khó khăn do sự khác biệt về biến số và đơn vị đo lường Hơn nữa, vì dữ liệu thứ cấp thường đã qua xử lý, nên việc đánh giá độ chính xác và độ tin cậy của nguồn dữ liệu trở nên phức tạp.
Trong bài khóa luận này em đã thu thập nguồn dữ liệu thứ cấp thông qua việc tìm hiểu các tài liệu tham khảo, trên internet
1.5.3 Xử lý dữ liệu đã thu thập a Phân tích và tổng hợp
Phân tích là quá trình chia nhỏ đối tượng nghiên cứu thành các bộ phận, yếu tố cấu thành đơn giản hơn nhằm phát hiện thuộc tính và bản chất của từng yếu tố Qua đó, phân tích giúp chúng ta hiểu rõ hơn về đối tượng nghiên cứu, làm sáng tỏ những khía cạnh phức tạp từ các yếu tố riêng lẻ.
Khi nghiên cứu một đối tượng, chúng ta thường gặp nhiều hiện tượng phức tạp, khiến bản chất của nó trở nên mơ hồ Để hiểu rõ hơn, cần phân chia đối tượng theo các cấp bậc Phân tích giúp chúng ta khám phá cái chung từ cái riêng, tìm ra bản chất từ hiện tượng, và nhận diện cái phổ biến từ cái đặc thù.
Khi phân chia đối tượng nghiên cứu cần phải:
- Xác định tiêu thức để phân chia.
- Chọn điểm xuất phát để nghiên cứu.
- Xuất phát từ mục đích nghiên cứu để tìm thuộc tính riêng và chung.
Bước tiếp theo trong quá trình phân tích là tổng hợp, một quá trình ngược lại nhưng hỗ trợ cho phân tích nhằm tìm ra cái chung và khái quát Qua việc tổng hợp các kết quả nghiên cứu từ từng khía cạnh, chúng ta có thể đạt được nhận thức đầy đủ và chính xác về bản chất cũng như quy luật vận động của đối tượng nghiên cứu Mối quan hệ giữa phân tích và tổng hợp là rất chặt chẽ, giúp nâng cao hiểu biết và khám phá sâu hơn về vấn đề nghiên cứu.
Phân tích và tổng hợp là hai phương pháp nghiên cứu có mối liên hệ chặt chẽ, bổ sung cho nhau và dựa trên cơ sở khách quan của sự vật Trong phân tích, việc xây dựng tiêu thức phân loại đúng đắn là rất quan trọng để hình thành đối tượng nghiên cứu Ngược lại, trong tổng hợp, khả năng liên kết các kết quả phân tích, kể cả những kết quả trái ngược, và khả năng khái quát từ nhiều khía cạnh định lượng khác nhau là yếu tố then chốt.
Kết cấu của khóa luận
Bài khóa luận gồm 3 phần:
- Phần 1: Tổng quan vấn đề nghiên cứu
- Phần 2: Cơ sở lý luận và thực trạng về website của FPT Polytechnic Việt Nam.
- Phần 3: Giải pháp định hướng phát triển cho chức năng hiển thị nôi dung số trên điện thoại di dộng cho website của FPT Polytechnic Việt Nam.
CƠ SỞ LÝ LUẬN VÀ THỰC TRẠNG WEBSITE CỦA WEBSITE FPT
Cơ sở lý luận của đề tài
2.1.1.1 Khái niệm về website a) Khái niệm website
Theo [3] các khái niệm được nêu ra như sau:
Website là tập hợp các trang web (webpage) có liên quan với nhau.
Trang web là một tệp văn bản chứa dữ liệu siêu văn bản (HTML) bao gồm văn bản, hình ảnh, âm thanh, video và các tài liệu kỹ thuật số, được kết nối với nhau Mỗi trang web được lưu trữ trên ít nhất một máy chủ web và có thể truy cập qua Internet thông qua địa chỉ URL Trang đầu tiên mà người dùng truy cập từ tên miền được gọi là trang chủ, từ đó người dùng có thể điều hướng đến các trang khác thông qua các siêu liên kết Để một website hoạt động, cần có tên miền, không gian lưu trữ và nội dung Đối với doanh nghiệp trong lĩnh vực thương mại điện tử, website chứa đựng thông tin, dữ liệu và hình ảnh về sản phẩm, dịch vụ mà doanh nghiệp muốn truyền tải đến khách hàng, đóng vai trò quan trọng như bộ mặt của công ty trong việc giao dịch trực tuyến.
Website tích hợp thương mại điện tử (TMĐT) đóng vai trò như một cửa hàng trực tuyến, cho phép doanh nghiệp thực hiện các giao dịch như bán hàng, đặt hàng, thanh toán và chăm sóc khách hàng Doanh nghiệp có thể dễ dàng cập nhật thông tin về sản phẩm, dịch vụ mới, chương trình khuyến mãi và xu hướng sản phẩm Nhờ vào website, thông tin được cung cấp nhanh chóng và kịp thời cho khách hàng, giúp họ truy cập mọi lúc, mọi nơi.
Theo [3] phân loại dữ liệu như sau
- Phân loại theo dữ liệu:
Website tĩnh là loại website chỉ bao gồm các trang tĩnh mà không có cơ sở dữ liệu đi kèm, với nội dung không thay đổi thường xuyên Để cập nhật thông tin, người sở hữu phải trực tiếp chỉnh sửa mã lệnh Loại website này thường có định dạng file ".htm" và không có công cụ điều khiển nội dung gián tiếp Ưu điểm của web tĩnh là phù hợp cho các nội dung đơn giản, dễ dàng thiết kế mà không cần can thiệp phức tạp từ lập trình viên, giúp tạo ra hình thức hấp dẫn và bắt mắt cho người dùng.
Nhược điểm của hệ thống hiện tại là thiếu hỗ trợ cho việc cập nhật thông tin, dẫn đến chi phí cao và yêu cầu người có kỹ năng kỹ thuật web để thực hiện việc này.
Web động là loại trang web cho phép người dùng tương tác và quản lý nội dung một cách dễ dàng mà không cần kiến thức về HTML hay lập trình Nó bao gồm hai phần: phần hiển thị trên trình duyệt (front-end) và phần điều khiển nội dung (back-end) mà chỉ người quản trị mới có quyền truy cập.
Web động được phát triển bằng các ngôn ngữ lập trình hiện đại như PHP, ASP, ASP.NET, Java, CGI, và Perl, kết hợp với các cơ sở dữ liệu quan hệ mạnh mẽ như Access, My SQL, MS SQL, và Oracle Ưu điểm nổi bật của web động là tính linh hoạt, cho phép cập nhật thông tin thường xuyên và quản lý các thành phần trên website một cách dễ dàng.
Nhược điểm của website động là cấu trúc khó thay đổi vì các trang thường có sự tương đồng, bên cạnh đó, tốc độ tải trang cũng chậm hơn so với website tĩnh do nội dung được tạo ra theo yêu cầu của người dùng.
- Phân loại theo hệ thống nội dung:
Các website cung cấp thông tin, bao gồm báo điện tử và các trang chuyên đề, thường miễn phí cho người dùng Nguồn thu chủ yếu của họ đến từ quảng cáo Tuy nhiên, nếu nội dung có giá trị cao, người xem có thể cần phải trả phí để truy cập thông tin đó.
Website cung cấp sản phẩm hoặc dịch vụ có thể chỉ đơn thuần giới thiệu thông tin về các sản phẩm và dịch vụ, hoặc tích hợp các tính năng cho phép người dùng mua sắm trực tiếp trên trang.
- Phân loại theo sự tương tác với người dùng:
Web 1.0: là web thế hệ đầu tiên, website thường chỉ một chiều thông tin từ website đến người xem.Người được ở vào thế bị động là tiếp nhận thông tin và không có sự phản hồi trực tiếp lên website.
Web 2.0: là thế hệ web thứ 2 Dạng web này có tính tương tác cao, người xem có thể tham gia đăng tải bài viết và tham gia xây dựng nội dung của website đó, dạng web này mang tính cộng đồng và tất cả các dữ liệu trên web là dữ liệu mở được tất cả mọi người xem web cung cấp Chính vì thế dạng web này thân thiện với người đọc tạo cảm giác như người đọc cũng là người sở hữu website.Nó cuốn hút mọi người cùng cung cấp thông tin, chia sẻ dữ liệu, tạo ra những nguồn dữ liệu khổng lồ trên Internet.Ngày nay dạng web này đang được phát triển mạnh nhất trong các thể loại web tương tác.
Web 3.0: Đây sẽ là web thế hệ thứ 3, giai đoạn hiện nay dạng web này trong thời kỳ đang hình thành và vẫn còn nhiều khái niệm chưa thống nhất Tuy nhiên nếu nói một cách đơn giản dễ hiểu thì web 3.0 sẽ có bước đột phá về băng thông kèm theo là sự phát triển mạnh mẽ về phim ảnh và truyền hình trên Internet.
Some popular web browsers for personal computers include Internet Explorer, Mozilla Firefox, Safari, Opera, Avant Browser, Konqueror, Lynx, Google Chrome, Flock, Arachne, Epiphany, K-Meleon, and AOL Explorer.
2.1.1.2 Khái niệm về hiển thị website trên điện thoại di động
Theo trang http://www.thietketrangweb.vn thì định nghĩa website trên điện thoại di động như sau:
Website cho thiết bị di động được thiết kế tương tự như các website truyền thống, nhằm đảm bảo rằng bất kỳ thiết bị nào hỗ trợ duyệt web đều có thể truy cập một cách dễ dàng và thuận tiện.
Khái niệm hiển thị website trên di động ra đời cùng với sự phát triển của những chiếc điện thoại có khả năng lướt web tương tự như máy tính Hiển thị website trên di động phụ thuộc vào cấu hình của từng loại điện thoại và khả năng hỗ trợ hiển thị của trang web đó.
Phân tích, khảo sát thực trạng wesite của FPT Polytechnic
2.2.1 Giới thiệu chung về FPT Polytechnic Việt Nam
Thông tin doFPT Polytechnic cung cấp:
FPT Polytechnic, thuộc công ty FPT Education của tập đoàn FPT, chuyên cung cấp các chương trình đào tạo trong lĩnh vực giáo dục với các chuyên ngành như Thiết kế Web, Ứng dụng phần mềm, Kế toán doanh nghiệp, Quản trị Doanh nghiệp - Nhân sự & Văn phòng, và Quản trị Doanh nghiệp - Marketing & Bán hàng Chương trình đào tạo kéo dài 2 năm với 3 học kỳ mỗi năm Đối tượng tuyển sinh là học sinh tốt nghiệp THPT có điểm tổng kết môn Toán lớp 12 từ 5,5 trở lên hoặc sinh viên hệ chính quy từ các trường Cao đẳng, Đại học khác.
FPT Polytechnic chính thức khai giảng vào ngày 28/8/2010, với hai lĩnh vực đào tạo chính là Công nghệ thông tin, bao gồm Thiết kế web và Ứng dụng phần mềm, và Kinh tế - Kinh doanh, với các chuyên ngành như Kế toán doanh nghiệp, Quản trị Doanh nghiệp - Nhân sự & Văn phòng, cùng Quản trị Doanh nghiệp - Marketing & Bán hàng Chương trình học kéo dài trong hai năm, và sinh viên sẽ nhận bằng cao đẳng nghề chính quy do Đại học FPT cấp.
FPT Polytechnic đang triển khai mô hình giáo dục - đào tạo mới dựa trên sức mạnh công nghệ thông tin với phương châm “Thực học – Thực nghiệp” Mô hình này tập trung vào việc đào tạo thông qua dự án và hướng dẫn trực tiếp, mang lại trải nghiệm thực tế cho sinh viên Các nhiệm vụ và dự án thực tế từ doanh nghiệp được tích hợp vào chương trình học, giúp sinh viên học hỏi và hoàn thiện kỹ năng ngay từ đầu FPT Polytechnic tạo ra môi trường học tập tương tự như doanh nghiệp, nơi sinh viên thực hiện vai trò của nhân viên và các giờ học được tổ chức để giao việc và kiểm soát tiến độ công việc.
Mô hình đào tạo tại FPT Polytechnic tập trung vào thực hành và truyền nghề, với sự hỗ trợ của giảng viên chính và trợ giảng có kinh nghiệm hoặc sinh viên khóa trên Giáo trình và tài liệu tham khảo được cập nhật thường xuyên từ các nhà xuất bản uy tín toàn cầu như McGraw-Hill, Pearson và Wiley, được biên soạn sang tiếng Việt, giúp sinh viên dễ dàng tiếp cận tri thức công nghệ Nhà xuất bản Pearson cung cấp sách giáo trình với mức giá ưu đãi và học bổng cho sinh viên, đồng thời FPT Polytechnic tạo điều kiện cho sinh viên phát triển thông qua các hoạt động hướng nghiệp và giới thiệu việc làm trong quá trình học.
2.2.2 Thực trạng website của FPT Polytechnic
2.2.2.1 Giới thiệu chung Địa chỉ website: http://www.poly.edu.vn Thời gian thành lập tháng 8/2010 Giao diện trang chủ của FPT Polytechnic:
Hình 2.1 Giao diện trang chủ của FPT Polytechnic trên PC
( Nguồn www.poly.edu.vn)
Website FPT Polytechnic đóng vai trò là cầu nối thông tin cho sinh viên, phụ huynh và đối tác Nơi đây tổ chức nhiều sự kiện và cuộc thi hấp dẫn như Thử Thách Của Anh Gió, Chuyện của Lu-ka, Ảnh đẹp lúc 0 giờ, Nam Vương Poly, iPoly và Poly Confessions Để chăm sóc khách hàng, website cung cấp hệ thống bình luận và yahoo pingbox cho sinh viên và phụ huynh Ngoài ra, sinh viên tương lai có thể đăng ký trực tuyến tại địa chỉ www.poly.edu.vn/dang-ky-truc-tuyen, thông tin sẽ được lưu lại và xử lý bởi cán bộ FPT.
2.2.2.2.Các công nghệ được ứng dụng trên website a Sử dụng mã nguồn WordPress bản mới nhất:
WordPress là một hệ thống xuất bản blog được phát triển bằng ngôn ngữ lập trình PHP và sử dụng cơ sở dữ liệu MySQL Nó là hậu duệ chính thức của b2/cafelog, do Michel Valdrighi phát triển Tên gọi WordPress được đề xuất bởi Christine Selleck, một người bạn của nhà phát triển chính Matt Mullenweg.
HTML5 là ngôn ngữ cấu trúc và trình bày nội dung cho World Wide Web, được phát triển bởi Opera Software và hiện đang được cải tiến bởi World Wide Web Consortium và WHATWG Là phiên bản thứ 5 của HTML, HTML5 sẽ đóng vai trò công nghệ cốt lõi của Internet trong tương lai.
Phiên bản CSS mới nhất được hầu hết các trình duyệt hiện nay hỗ trợ, nhanh hơn, đẹp hơn, dễ dàng hơn. d jQuery
jQuery là một thư viện JavaScript đa trình duyệt, được phát triển để đơn giản hóa lập trình phía máy người dùng của HTML Được ra mắt vào tháng 1 năm 2006 tại BarCamp NYC bởi John Resig, jQuery hiện đang được sử dụng bởi hơn 52% các website toàn cầu, trở thành thư viện JavaScript phổ biến nhất hiện nay.
Twitter Bootstrap bao gồm các mã CSS + HTML cơ bản cho typography, forms, buttons, tables, grids, navigation, và nhiều thành phần khác của website.
Twitter Bootstrap cung cấp giao diện dạng lưới cố định (fixed) rộng 940px và
12 cột và giao diện động Fluid Tương thích với màn hình phân giải cao Retina. f RWD (Responsive Web Design)
Sau hai lần nâng cấp lớn, website FPT Polytechnic tại địa chỉ www.poly.edu.vn đã được tối ưu hóa để tương thích và hoạt động hiệu quả trên tất cả các thiết bị, bao gồm PDA, điện thoại di động, máy tính bảng và máy tính để bàn.
Hệ thống Cache và Minify không chỉ cải thiện hiệu suất và bảo mật cho website mà còn giúp duy trì hoạt động ổn định khi gặp sự cố, đồng thời giảm băng thông sử dụng.
Website tương tác tốt với mạng xã hội Facebook, Google Plus và Twitter. i Bảo mật
Phần lớn plugin sử dụng trong website FPT Polytechnic đều được ban HTTT tự phát triển hoặc đánh giá trước khi tích hợp.
Website được sao lưu thường xuyên để phòng ngừa sự cố và rủi ro Được đặt trên server riêng tại FPT và sử dụng hệ điều hành Linux, website đảm bảo an toàn bảo mật tốt hơn Ngoài ra, website cũng được cập nhật và sửa chữa kịp thời các lỗi khi phát hiện.
2.2.3 Phân tích, đánh giá về website của FPT Polytechnic
2.2.3.1 Quản trị website a Quyền hạn
+ Có tất cả các quyền trên cả server.
+ Có quyền sửa file trực tiếp.
+ Có quyền thêm tất cả các user khác trên tất cả các quyền.
+ Có quyền thêm/ sửa mọi nội dung trên website.
Administrator + Có đủ mọi quyền như Super Admin nhưng không có quyền truy cập vào Server, Database và sửa code.
Editor + Có quyền quản lý tất cả bài viết, quản lý link, quản lý comment, các widget và menu.
Author + Có quyền thêm và sửa bài viết của chính user Có quyền sửa comment trong bài viết.
Contributor + Chỉ có quyền thêm bài viết, phải chờ Editor đồng ý thì bài viết mới được đăng.
Commentator + Người trả lời tất cả các comment.
Bảng 2.1 Quyền hạn trong website của FPT Polytechnic
( Nguồn www.poly.edu.vn) b Quá trình đăng bài.
- Người đăng bài truy cập phần Admin, chọn Posts / Add New Post, sau đó nhập nội dung vào phần soạn thảo, chọn chuyên mục và thẻ tương ứng.
- Nếu người viết có quyền hạn là Author, bài viết sẽ được lưu lại, để ở trạng thái chờ để Editor và Administrator đồng ý mới được đăng.
- Mỗi cập nhật của bài viết đều được lưu lại giống với hệ thống Track Change của Microsoft Word để tiện theo dõi và sửa đổi.
- Nếu bài đăng được đặt trong các vị trí đặt biệt , , Widget thì phải chờ sự đồng ý của Administrator. c Quá trình cập nhật website:
Khi xuất hiện lỗi hoặc cần bổ sung tính năng và nâng cấp hiệu năng, bộ phận Hệ Thống Thông Tin sẽ tiến hành kiểm tra và phát hành bản cập nhật Quá trình cập nhật này đảm bảo hệ thống hoạt động ổn định và hiệu quả hơn.
+ Yêu cầu được gửi đến ban HTTT + Ban HTTT đưa ra giải pháp.
+ Tiến hành kiểm thử trên máy nội bộ.
+ Nếu không còn xuất hiện lỗi, backup website và Super Admin sẽ đưa bản cập nhật lên.
2.2.3.2 Phân tích website Đánh giá bằng công cụ SEO Worker
Kết quả Đánh giá Điểm PRChecker 4 Hạng Alexa 362.679 Tiêu đề website FPT Polytechnic – Hệ Cao Đẳng thực hành thuộc Đại Học FPT
Số lượng ký tự trong tiêu đề vừa phải Tiêu đề website hoàn toàn phù hợp với nội dung.
Mô tả website “FPT Polytechnic tuyển sinh cao đẳng thực hành năm 2013 theo hình thức xét tuyển hồ sơ.
Tiêu chí đào tạo: Thực học – Thực nghiệp!”
FPT Polytechnic là một trường cao đẳng nổi bật chuyên đào tạo thực hành và thực học, giúp sinh viên chuẩn bị tốt cho sự nghiệp tương lai Trường tuyển sinh hàng năm với nhiều chương trình học đa dạng, tập trung vào việc trang bị kiến thức và kỹ năng thực tiễn Với phương châm "thực học – thực nghiệp", FPT Polytechnic cam kết mang đến cho sinh viên những trải nghiệm học tập chất lượng và cơ hội việc làm hấp dẫn.
Meta Robot Không tìm thấy
Bảng 2.2 Đánh giá website FPT Polytechnic bằng công cụ Seo Worker
2.2.3.3 Mạng xã hội Địa chỉ Facebook http://www.facebook.com/fpt.poly
Tiêu đề website khi hiển thị trên Facebook
“FPT Polytechnic – Hệ cao đẳng thực hành thuộc Đại học FPT”
Mô tả website khi hiển thị trên Facebook
FPT Polytechnic tuyển sinh cao đẳng thực hành năm 2013 theo hình thức xét tuyển hồ sơ.
Tiêu chí đào tạo: Thực học – Thực nghiệp!” Ảnh mặc định của website trên Facebook
Bảng 2.3 Mạng xã hội facebook của FPT Polytechnic
( Nguồn www.poly.edu.vn)
2.2.3.4 Hiệu suất (Sử dụng công cụ đo PageSpeed và Yslow )
Tổng quan: Trang FPT Polytechnic có tổng điểm Tốc độ trang là 83 (trong tổng số 100 điểm)
Mức ưu tiên cao Mức ưu tiên trung bình Mức ưu tiên thấp
Nâng cao lưu vào bộ nhớ cache trong trình duyệt
Cung cấp các tài nguyên từ một URL nhất quán
Trì hoãn việc phân tích cú pháp JavaScript
Cung cấp hình ảnh được chia tỷ lệ
Tối ưu hóa hình ảnh Giảm bớt JavaScript
Kích hoạt tính năng Keep- Alive
Bật nén Đặt nội tuyến CSS nhỏ
Tránh CSS @import Ưu tiên các tài nguyên không đồng bộ
Giảm bớt CSS Chỉ rõ kích thước hình ảnh Xóa các chuỗi truy vấn từ các tài nguyên tĩnh
Bảng 2.4 Hiệu suất website của FPT Polytechnic
Một số đánh giá khác về FPT Polytechnic: Điểm đánh giá kỹ thuật trên Google 4
Thứ hạng đánh giá trên Alexa
- Phạm vi toàn thế giới 362,679
Số lượng truy cập Trung Bình hàng ngày
Hiệu quả tương tác người dùng
- Số lượng comment tính đến hiện tại 28.000
- Số lượng comment trung bình mỗi ngày
~40 (Lượng comment nhiều nhất vào những đợt tuyển sinh)
- Số lượng bài viết tính đến hiện tại 1250
- Số lượng bài viết trung bình mỗi ngày
Bảng 2.5 Một số đánh giá khác về website của FPT Polytechnic
2.2.4 Đánh giá hiện trạng website của FPT Polytechnic
2.2.4.1 Kết quả phân tích dữ liệu thứ cấp
Kể từ khi thành lập, FPT Polytechnic đã liên tục mở rộng quy mô đào tạo, với số lượng sinh viên tăng trưởng đáng kể Theo báo cáo, số lượng sinh viên vào năm 2010 chỉ là 500, nhưng đến nay đã đạt khoảng 1800 học viên.
Chúng tôi có 6 chi nhánh tại các tỉnh thành phố lớn như Hà Nội, Đà Nẵng, TP Hồ Chí Minh, Quảng Ninh, Thanh Hóa và Đắk Lắk Việc quảng bá hình ảnh của chúng tôi mang lại nhiều lợi ích quan trọng.
GIẢI PHÁP, ĐỊNH HƯỚNG PHÁT TRIỂN VÀ CÁC ĐỀ XUẤT VỀ CHỨC NĂNG HIỂN THỊ NỘI DUNG SỐ TRÊN ĐIỆN THOẠI DI ĐỘNG CHO WEBSITE
Hoàn thiện chức năng hiển thị nội dung số trên điện thoại di động
3.1.1 Từ giao diện trên PC, xác định những thành phần cần loại bỏ, những thành phần cần thay đổi để phù hợp với giao diện trên thiết bị di động
Website hiển thị khác nhau trên máy tính và điện thoại di động do kích thước màn hình khác biệt Để tối ưu hóa trải nghiệm người dùng trên di động, cần xác định những phần không cần thiết và điều chỉnh kiểu hiển thị, chẳng hạn như chuyển từ dạng hiển thị dọc sang ngang.
Các vùng cần được thay đổi hay được lược bỏ được hiển thị trên hình vẽ dưới đây, được đánh dấu bằng công cụ Photoshop
Photoshop là phần mềm đồ họa chuyên dụng của Adobe Systems, ra mắt năm 1988 trên hệ máy Macintosh, và hiện đang dẫn đầu thị trường sửa ảnh bitmap Kể từ phiên bản 7.0 vào năm 2002, Photoshop đã cách mạng hóa lĩnh vực chỉnh sửa ảnh Phiên bản mới nhất hiện nay là Adobe Photoshop CS5, không chỉ phục vụ cho việc chỉnh sửa ảnh cho ấn phẩm mà còn được sử dụng trong thiết kế web, vẽ tranh (như matte painting), và tạo texture cho các chương trình 3D Photoshop tương thích tốt với nhiều phần mềm đồ họa khác của Adobe như Illustrator, Premiere, After Effects, và Encore.
Các vùng đánh dấu khoanh vùng trên website khi hiển thị trên máy tính sẽ được thay thế bằng các thành phần tương ứng khi truy cập từ điện thoại di động.
Vùng 1: Tin nổi bật Vùng 2: Ô tìm kiếm Vùng 3: Ô tư vấn trực tuyến Vùng 4: Ảnh nền thay đổi được của website Vùng 5: Chú thích cho ảnh nền
Vùng 6: Ô quảng cáoVùng 7: Menu chính bao gồm trang chủ; giới thiệu; chương trình đào tạo; tuyển sinh; liên hệ
Vùng 8: Menu phụ bao gồm đăng ký trực tuyến; thong báo tuyển sinh; chương trình đào tạo; trắc nghiệm nghề nghiệp; một số hoạt động khác
Các vùng đánh dấu màu đỏ, được đánh số từ 1 đến 6, sẽ bị loại bỏ khi hiển thị trên thiết bị di động (Tham khảo thêm trong phần phụ lục 1)
Vùng 1, 2 và 5 sẽ làm loãng không gian hiển thị, người dùng sẽ mất tập trung.
Vùng số 3 cần phần mềm bên ngoài, người dùng thiết bị di động không sử dụng được.
Vùng số 4 cần không gian hiển thị quá lớn, ảnh hưởng nhiều đến việc tải trang.
Vùng số 6 hiển thị quảng cáo sử dụng Flash, gây tốn nhiều không gian và tài nguyên Đồng thời, các phần màu xanh dương được đánh số từ 7-9 cần được điều chỉnh hình thức hiển thị trên thiết bị di động để tối ưu hóa trải nghiệm người dùng.
Vùng số 7 cần chuyển sang dạng Menu dropdown (Menu dọc) vì thiết bị di động không đủ chiều ngang để hiển thị.( Kết quả tham khảo phần phụ lục 1)
Hình 2.3 Thanh menu ngang thành menu dọc
Vùng số 8 cần chuyển sang dạng Menu dọc để hiển thị nhiều thông tin hơn.
Hình 2.4 Hộp đăng ký trực tuyến ngang thành dọc
Vùng số 9 cần giảm kích thước chiều ngang và giảm số lượng ảnh.
Hình 2.5 Thư viện ảnh được cắt bớt Những vùng còn lại ( Kết quả tham khảo phần phụ lục 1)
Những vùng còn lại chỉ cần thay đổi kích thước, vị trí, hoặc màu sắc cho phù hợp với thiết bị di động.
3.1.2 Vẽ phác thảo phiên bản trên điện thoại bằng bansamiq mockup
Bước đầu tiên trong thiết kế web là tạo bản phác thảo bố cục website, sau đó khách hàng sẽ xem xét và quyết định chỉnh sửa Việc tạo mockup hoàn hảo bằng Photoshop có thể mất nhiều công sức nếu cần thay đổi Balsamiq Mockups là phần mềm hữu ích giúp bạn dễ dàng tạo ra các bản mockup (wireframe) cho website hoặc ứng dụng, mô tả các thành phần chính như tiêu đề, menu và nút bấm Việc làm mockup rất cần thiết để tiết kiệm thời gian trước khi bắt tay vào thực hiện Nếu bạn có ý tưởng về thiết kế nhưng gặp khó khăn khi sử dụng Photoshop, Balsamiq Mockups sẽ giúp bạn thể hiện ý tưởng một cách trực quan và nhanh chóng Phần mềm này hoạt động trên mọi nền tảng máy tính, giúp bạn chia sẻ ý tưởng với bạn bè và đồng nghiệp một cách hiệu quả.
Dưới đây là bản phác thảo website của FPT Polytechnic trên điện thoại di động sử dụng bansamiq mockup
Hình 2.6 Phác thảo website bằng công cụ Bansamiq mockup
3.1.3 Thiết kế giao diện trên Photoshop ( Kết quả tham khảo phần phụ lục 1) a) Bước 1 Vào File \ New Hộp thoại New hiện ra cho phép tạo một File mới. Đặt tên là Home.
◦ Các thiết lập khác đặt mặc định, như hình sau
Hình 2.7 Thiết kế giao diện trên Photoshop b) Bước 2: Lần lượt tạo các Layer Group có tên Header, Featured, News,
Testimonials, Events, Gallery, Ads, Footer bằng cách vào menu Layer / New / Group
Tất cả các tham số đặt mặc định.
Sau khi tạo, tại mục Layer, sẽ hiện lên như sau:
Trong bước 3, hãy sử dụng các công cụ Text, Line Tool và Rounded Rectangle Tool để thiết kế các Layer trong phần Header trên Photoshop Kết quả cuối cùng sẽ hiển thị như hình 2.7.
Hình 2.8 Thiết kế menu chính bằng Photoshop
Logo FPT Polytechnic được cung cấp sẵn.Khoảng cách tối thiểu giữa logo và cỏc thành phần xung quanh là ẵ kớch thước Logo.
Font chữ sử dụng là Arial.
Màu nền của Top Menu là #000
Các link có màu #fff d) Bước 4: Sử dụng các công cụ Text, Image và Layer để tạo các layer trong group Featured như sau:
Hình 2.9 Thiết kế menu đăng ký trực tuyến bằng Photoshop
Các đề mục cần có kích thước 320x100px với màu nền #999 và màu chữ #fff Ảnh trong các đề mục nên có kích thước 60x60px Để thực hiện, hãy sử dụng các công cụ Layer và Image Tool để tạo các layer.
Hình 2.10 Thiết kế phần tin tức bằng Photoshop
Trong đó: Kích thước layer này là 320x460px.
Kích thước ảnh là 300x150px
Cỡ chữ phần “Tin tức Poly” 16px đậm, màu chữ #21759B.
Cữ chữ tiêu đề bài vết đầu tiên: 16px đậm, màu chữ #000
Cỡ chữ phần except 12px, màu chữ #333
Cỡ chữ 3 bài viết tiếp theo 11px, đậm, màu chữ #4c4c4c, màu bullet #c00 f) Bước 6 Copy các layer được tạo trong bước 5 vào layer group
Testimonials, thay thế hình ảnh và chữ, ta được kết quả sau:
Hình 2.11 Thiết kế phần Poly góc nhìn bằng Photoshop g) Bước 7: Sử dụng công cụ Text, Layer và Line Tool để tạo các layer trong group Events như sau
Hình 2.12 Thiết kế phần sự kiện bằng Photoshop
Màu nền của Event: #FE3905
Màu chữ phần ghi ngày: #000
Kích thước text “SỰ KIỆN”: 16px, chữ hoa
Đường kẻ phân cách được thiết lập với độ dày 1px, kiểu liền và màu sắc #FF5807 Bước 8 yêu cầu sử dụng các công cụ Image Tool, Text và Layer để tạo các layer trong nhóm Gallery, từ đó đạt được kết quả mong muốn.
Hình 2.13 Thiết kế phần thư viện ảnh bằng Photoshop
- Phần chữ “Thư viện ảnh” cỡ 16px, màu #21759B, đậm, Kích thước mỗi ảnh là
- Khoảng trống giữa ảnh và đường viền : 4px, Độ cong của đường viền : 4px.
Màu đường viền được sử dụng là #ddd, kích thước chữ dưới mỗi ảnh là 13px với màu chữ #333 Bước 9 yêu cầu sử dụng các công cụ Layer (Pattern), Text và Image để tạo các layer trong nhóm Footer, với kết quả cuối cùng đạt được như mong đợi.
Hình 2.14 Thiết kế phàn liên hệ bằng Photoshop
Màu chữ: #fff Màu link: #FFB3B3 Pattern sử dụng trong layer có màu đậm, các icon sử dụng từ Google Plus và Facebook
Bước 10: Vào File / Save hoặc nhấn Ctrl + S để lưu file.
3.1.4 Thiết kế giao diện trên WordPress cho thiết bị di động sử dụng Twitter Bootstrap ( các bước chi tiết tham khảo phụ lục 2)
Tất cả các thành phần đều được hiển thị, sau đó thêm class "visible-phone" cho những thành phần chỉ xuất hiện trên thiết bị di động, và class "hidden-phone" cho các thành phần không hiển thị trên thiết bị di động.
Sử dụng media query trong CSS để tác động đến những thành phần có kích thước xác định
Sử dụng phương thức $(window).width() trong JavaScript giúp kiểm tra kích thước của trình duyệt, trong khi sự kiện $(window).resize() cho phép theo dõi các thay đổi kích thước của trình duyệt.
3.1.5 Tối ưu hóa ảnh hiển thị trên thiết bị di động (ảnh hiển thị trên điện thoại nhỏ hơn, lazy load, nén ảnh )
Mặc định, Twitter Bootstrap tự động điều chỉnh kích thước ảnh để phù hợp với kích thước trình duyệt, giúp hiển thị tốt hơn trên thiết bị di động Tuy nhiên, để tối ưu hóa thời gian tải trang, chúng ta nên thực hiện một số biện pháp.
- Tối ưu hoá hình ảnh: có thể sử dụng công cụ có sẵn trong WordPress hoặc timthumb, resize bằng tay hoặc công cụ lossless compress của Google.
Định hướng phát triển của đề tài
Sự phát triển mạnh mẽ của điện thoại di động đã mở ra thời kỳ của máy tính bảng, với các sản phẩm nổi bật như iPad của Apple và Galaxy Tab của Samsung Máy tính bảng không chỉ có màn hình lớn hơn mà còn sở hữu cấu hình cao hơn, cho phép thực hiện đầy đủ chức năng của laptop và máy tính cá nhân Kích thước nhỏ gọn và tính tiện dụng của máy tính bảng đang dần khiến laptop và máy tính cá nhân mất đi vị thế trên thị trường.
Theo nghiên cứu của IDC, thị phần máy tính để bàn và laptop hiện nay lần lượt đạt 12,4% và 16,8% vào năm 2012, vẫn chiếm ưu thế so với tablet với 10,7% Tuy nhiên, dự báo cho thấy cả sản lượng và thị phần của máy tính để bàn và laptop sẽ giảm nhanh chóng trong thời gian tới.
Theo dự báo của IDC, sản lượng tablet dự kiến sẽ tăng 174,5% vào năm 2017 so với năm 2012, chiếm 16% thị phần Ngược lại, sản lượng máy tính để bàn sẽ giảm 5%, chỉ còn chiếm 6% thị phần.
Theo Megha Saini, chuyên gia từ IDC, trong các thị trường mới, smartphone thường là lựa chọn đầu tiên, và người dùng có xu hướng chuyển sang máy tính bảng trước khi sử dụng máy tính để bàn Bà cũng nhấn mạnh rằng áp lực lên thị trường máy tính để bàn đang gia tăng mạnh mẽ, dẫn đến sự thay thế nhanh chóng của các thiết bị này.
Theo báo cáo của IDC, thị trường "các thiết bị kết nối thông minh" như smartphones, máy tính bảng và máy tính đã tăng trưởng 29,1% trong năm 2012, với hơn 1 tỉ thiết bị được tiêu thụ và tổng giá trị đạt 576,9 tỉ đô la Mỹ Dự báo cho năm 2017 cho thấy sẽ có 2,2 tỉ thiết bị được bán ra, với tổng giá trị ước tính lên tới 814,3 tỉ đô la Mỹ.
Theo báo cáo của IDC, Apple chiếm 20,3% thị trường thiết bị kết nối thông minh, thấp hơn Samsung với 21,2% Tuy nhiên, Apple dẫn đầu về doanh thu với 30,7%, trong khi Samsung chỉ đạt 20,4%.
Để bắt kịp với xu thế công nghệ mới, FPT Poly cần triển khai dự án phát triển website tối ưu cho các thiết bị số như máy tính bảng, nhằm nâng cao trải nghiệm người dùng yêu thích công nghệ.
Cập nhật công nghệ mới cho website di động là điều cần thiết, khi mà công nghệ thay đổi liên tục và thiết bị di động ngày càng có cấu hình cao cùng khả năng hiển thị tốt hơn Để tối ưu hóa trải nghiệm người dùng, Polytechnic cần nâng cấp website của mình với các phiên bản mới nhất của WordPress, CSS và jQuery.
Đề xuất và kiến nghị đối với FPT Polytechnic nhằm áp dụng tốt các giải pháp
FPT Polytechnic nên áp dụng các công cụ như Wordpress, CSS và jQuery để tối ưu hóa hiển thị website trên điện thoại di động Việc cài đặt phiên bản mới nhất của các công cụ này là cần thiết, đồng thời cần xác định và loại bỏ những phần nội dung không quan trọng, rườm rà Điều này sẽ giúp nâng cao trải nghiệm người dùng, cho phép họ dễ dàng tiếp cận những thông tin quan trọng khi truy cập website từ thiết bị di động.
Công ty cần triển khai các giải pháp nâng cao nguồn nhân lực bằng cách tự đào tạo nhân viên hiện tại và tổ chức tuyển dụng nhân viên mới có chuyên môn vững vàng Đặc biệt, ưu tiên tuyển chọn những ứng viên tốt nghiệp chuyên ngành công nghệ thông tin, có năng lực, đạo đức và tinh thần trách nhiệm cao trong công việc.
KẾT LUẬN CỦA KHÓA LUẬN
Với sự phát triển nhanh chóng của công nghệ thông tin, việc lướt web qua điện thoại di động đã trở thành một phần thiết yếu trong cuộc sống hàng ngày Người dùng có thể dễ dàng tìm kiếm thông tin mọi lúc, mọi nơi mà không cần đến máy tính cồng kềnh Điều này đặt ra thách thức cho FPT Polytechnic trong việc cải thiện và nâng cao hiệu quả của website để đáp ứng nhu cầu người dùng Khóa luận đã hoàn thành một số nội dung quan trọng nhằm nghiên cứu và ứng dụng các phương pháp cải tiến website.
Hệ thống hóa các vấn đề lý luận liên quan đến website bao gồm khái niệm cơ bản, các công cụ hỗ trợ tối ưu hóa website và lợi ích mà website mang lại cho doanh nghiệp Việc hiểu rõ những yếu tố này giúp doanh nghiệp nâng cao hiệu quả hoạt động trực tuyến và gia tăng sự hiện diện trên thị trường.
Dựa trên kết quả phân tích phiếu điều tra và phỏng vấn chuyên gia, bài viết đã đánh giá thực trạng của website và nhấn mạnh rằng để hoàn thiện website, cần giải quyết một số vấn đề cấp thiết.
Dựa trên đánh giá thực trạng cấu trúc và chức năng của website, tôi đã đề xuất một số giải pháp để cải thiện khả năng hiển thị nội dung trên điện thoại di động cho website của FPT Polytechnic.
Khóa luận này hy vọng sẽ góp phần vào việc tìm kiếm giải pháp hoàn thiện website của FPT Polytechnic Mặc dù đã nỗ lực nghiên cứu và hoàn thiện để đạt kết quả tốt, nhưng do hạn chế về thời gian và trình độ, bản báo cáo không tránh khỏi thiếu sót Rất mong nhận được ý kiến đóng góp từ thầy cô và bạn đọc để khóa luận được hoàn thiện hơn.
DANH MỤC TÀI LIỆU THAM KHẢO
PGS TS Đàm Gia Mạnh (2013) đã biên soạn tài liệu “Hướng dẫn thực tập và làm khóa luận tốt nghiệp cho sinh viên đại học chính quy chuyên ngành Quản trị hệ thống thông tin khóa 4” tại Trường Đại Học Thương Mại Tài liệu này cung cấp những hướng dẫn chi tiết nhằm hỗ trợ sinh viên trong quá trình thực tập và hoàn thành khóa luận tốt nghiệp, giúp nâng cao kỹ năng và kiến thức chuyên môn trong lĩnh vực quản trị hệ thống thông tin.
[2] Nguyễn Thị Thanh Tâm, (2010) “Website trường ĐH công nghệ phiên bản tiếng anh trên thiết bị di động”, Đại Học Quốc Gia-Trường Đại Học Công Nghệ.
[3] Bài giảng "Thiết kế và triển khai web" ( 2010) - Bộ môn CNTT, khoa Tin học thương mại, trường Đại học Thương Mại
[4] Bài giảng "Quản trị tác nghiệp TMĐT B2C" ( 2010) - Bộ môn Quản trị tác nghiệp, khoa TMĐT, trường Đại học Thương Mại
[5] April Hodge Silver, ( 1/2011) “ Wordpress 3 completer”, Packt Publishing.
[6] Earle Castledine& Craig Sharkie, (2010) “jQuery: Novice to Ninja”, Sitepoint.
[7] Raena Jackson Armitage, Brandon R Jones & Jeffrey Way,(7/2010) “ Build
Your Own Wicked WordPress Themes”, Sitepoint.
[8] Wallpearl, (2008) “ Simple CSS Standard Edition”, Wallpearl’s Blog.
Here are some useful websites for various purposes: Poly.edu.vn offers educational resources, while WordPress.org provides a platform for website creation Balsamiq Mockups is great for designing wireframes, and Vi.wordpress.org caters to Vietnamese users Eureka.com.vn and Vipsoft.com.vn offer software solutions, whereas Twitter's GitHub Bootstrap is essential for web development For performance analysis, GTmetrix is a valuable tool, and SEOWorkers.com helps with SEO insights.
Kết quả thực hiện giải pháp trên smart phone hệ điều hành IOS
2 Chức năng đăng ký trực tuyến, thông báo
Sử dụngTwitter Bootstrap a Bước 1 Download Twitter Bootstrap tại: http://twitter.github.io/bootstrap Phiên bản hiện tại:
2.3.1 Sau khi download và giải nén, ta có các thư mục sau:
To set up the Poly theme in WordPress, copy all folders into the wp-content/themes/poly directory Inside the css folder, you will find four stylesheet files: bootstrap.css (development version), bootstrap.min.css (deployment version), bootstrap-responsive.css (development version), and bootstrap-responsive.min.css (deployment version).
Trong thư mục img (chứa ảnh), ta có 2 file glyphicons-halflings.png chứa các icon màu đen và glyphicons-halflings-white.png chứa các icon màu trắng.
In the directory containing the JavaScript files, there are two versions of Bootstrap: bootstrap.js (development version) and bootstrap.min.js (deployment version) Additionally, open the style.css file located in the wp-content/themes/poly folder and append the following code at the end of the file.
@import url("css/bootstrap.css");
@import url("css/layout.css");
To ensure that your website reloads properly when the screen is rotated or zoomed, open the header.php file and insert the following code within the head tag.
d Bước 4: Để các plugin của bootstrap hoạt động, mở file footer.php thêm đoạn mã sau trước đoạn đóng thẻ body
Để tối ưu hóa hiển thị trên thiết bị di động, bạn cần thực hiện các bước sau: Thêm class "hidden-phone" vào tất cả các thẻ chứa thành phần cần ẩn khi duyệt web trên màn hình nhỏ, giúp chúng không hiển thị trên thiết bị di động Tiếp theo, sử dụng class "visible-phone" cho các thẻ chứa thành phần cần hiển thị trên thiết bị di động Cuối cùng, chèn đoạn mã thích hợp để hiển thị menu mini trên các thiết bị này.
h Bước 8: Thêm đoạn mã sau để hiển thị danh sách bài viết nổi bật (Featured Content)
i Bước 9: Mở file layout.css, thêm đoạn mã sau:
Tính năng @media query trong CSS3 cho phép các đoạn mã CSS trong cặp ngoặc { và } chỉ áp dụng cho các trình duyệt có kích thước cửa sổ tương ứng, đặc biệt là kích thước tối đa cho thiết bị di động Để sử dụng tính năng này, bạn cần thêm đoạn mã phù hợp.
#top{ padding: 5px 0 5px 10px;
-moz-border-radius: 0 0 4px 4px;
-webkit-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;
} #branding-container{ background: #fff; margin: 0; padding: 0;
} #mini-menu{ margin-top: 15px;
} #events{ float: left; width: 100%; margin-top: 10px; height: auto !important;
} home-gallery-wrapper ul{ width: 100%;
} byline{ float: left; margin-left: 0 !important; width: 100%; display: block; clear: both;
} register input[type=text], register textarea{ width: 46%;
}Kết quả cuối cùng.( Kết quả tham khảo phần phụ lục 1)
PHIẾU ĐIỀU TRA TRẮC NGHIỆM VỀ CẤU TRÚC VÀ CHỨC NĂNG CỦA WEBSITE
WWW.POLY.EDU VN CỦA FPT POLYTECHNIC
A Thông tin về phiếu điều tra nhân viên FPT Polytechnic:
Phiếu điều tra gồm: 15 câu hỏi Độ tuổi người được điều tra: 22-40
Số người được điều tra: 5
1 Website của FPT Polytechnic đã thành lập được bao lâu:
2 Chi phí đầu tư cho website của FPT Polytechnic chiếm bao nhiêu % trong tổng chi phí hoạt động sản xuất kinh doanh của FPT Polytechnic:
3 Số nhân viên trong FPT Polytechnic phụ trách về quản lý website:
4 Theo anh (chị), số nhân viên trong FPT Polytechnic phụ trách về quản lý website như vậy đã hợp lý chưa:
Không hợp lý Khá hợp lý Hợp lý Rất hợp lý
4 Tần suất bạn truy cập vào website của FPT Polytechnic:
Hàng ngày Hàng tuần Hàng tháng Không thường xuyên
5 Theo anh (chị), nội dung thông tin và cách sắp xếp thông tin trên website của FPT Polytechnic như hiện nay đã hợp lý chưa:
Chưa hợp lý Bình thường Hợp lý Rất hợp lý
6 Theo anh (chị), nội dung thông tin về sản phẩm trên website của FPT Polytechnic như thế nào?
Tốt Rất tốt Bình thường
7 Theo anh (chị), tốc độ tải trên website của FPT Polytechnic như thế nào?
8 Theo anh (chị), website của FPT Polytechnic cần thay đổi gì về cấu trúc:
Sắp xếp nội dung ngắn gọn hơn Việc bố trí menu, tab trên website Đồ họa, hình ảnh hiển thị
Thêm chức năng hiển thị trên mobile
9 Hình thức liên lạc chủ yếu của sinh viên, phụ huynh:
Điện thoại Mail Gặp trực tiếp
10 Kênh giao tiếp của sinh viên, phụ huynh với FPT Polytechnic:
Điện thoại Mail Gặp trực tiếp Yahoo Messenger
11 Chức năng nào trên website của FPT Polytechnic làm anh (chị) hài lòng nhất:
Giới thiệu khóa học Đăng ký trực tuyến Tư vấn trực tuyến Tất cả các phương án trên Không phương án nào
12 Theo anh (chị), chức năng nào trên website cần nâng cấp, bổ sung:
Chức năng tìm kiếm An toàn và bảo mật thông tin của sinh viên Chi tiết hơn về thông tin khóa đào tạo Hệ thống câu hỏi thường gặp
Diễn đàn Đăng ký thành viên Thăm dò ý kiến sinh viên, phụ huynh
13 Theo anh (chị), website của FPT Polytechnic cần nâng cấp, hoàn thiện hơn không:
14 Trong thời gian tới, FPT Polytechnic có chính sách đầu tư cho website của FPT Polytechnic không:
