HỌC VIỆN CÔNG NGHỆ BƯU CHÍNH VIỄN THÔNG KHOA ĐA PHƯƠNG TIỆN BÁO CÁO THỰC TẬP TỐT NGHIỆP ĐỀ TÀI PHÁT TRIỂN WEBSITE LANDING PAGE GIỚI THIỆU DỰ ÁN LA TROBE Đơn vị thực tập Trung tâm Đào tạo Quốc tế.
HỌC VIỆN CƠNG NGHỆ BƯU CHÍNH VIỄN THƠNG KHOA ĐA PHƯƠNG TIỆN - - BÁO CÁO THỰC TẬP TỐT NGHIỆP ĐỀ TÀI: PHÁT TRIỂN WEBSITE LANDING PAGE GIỚI THIỆU DỰ ÁN LA TROBE Đơn vị thực tập Người hướng dẫn : Trung tâm Đào tạo Quốc tế - Học viện Cơng nghệ Bưu Viễn thơng : ThS Nguyễn Thị Thanh Tâm LỜI MỞ ĐẦU Sau bốn năm sinh viên thuộc khoa Đa phương tiện, học giảng đường Học viện Cơng nghệ Bưu Viễn thơng em tích lũy cho thân nhiều kiến thức Quá trình thực tập mặt yêu cầu bắt buộc với sinh viên mặt khác giai đoạn ý nghĩa, quan trọng giúp sinh viên tập làm quen với công việc thực tế, hội nhập vào môi trường doanh nghiệp Trong thời gian thực tập, sinh viên học hỏi thêm nhiều điều, đồng thời hội để phát triển điểm yếu kiến thức kỹ mình, để từ bổ sung, bù đắp trước rời ghế nhà trường Thực nhiệm vụ học tập nhà trường đợt thực tập tốt nghiệp, đồng ý ban lãnh đạo Khoa, bám sát đề cương Khoa đưa ra, với lý luận kiến thức học Trong trình thực tập em trau dồi thêm kiến thức lĩnh vực đào tạo hiểu biết lập trình, ứng dụng cấu tình hình hoạt động Trung tâm Được tận tình giúp đỡ hướng dẫn thầy, anh nỗ lực học tập, tìm tịi học hỏi, em hồn thành báo cáo thực tập tốt nghiệp Báo cáo gồm phần chính: - Phần A: Giới thiệu đơn vị thực tập - Phần B: Nội dung thực tập - Phần C: Bài học kinh nghiệm Trong trình thực báo cáo, cố gắng em cịn hạn chế thời gian tìm hiểu, kiến thức kinh nghiệm không tránh khỏi sai sót Em mong nhận ý kiến đóng góp nhận xét để em hồn thiện LỜI CẢM ƠN Thời gian tuần thực tập Trung tâm Đào tạo Quốc tế, em học hỏi mở mang nhiều kiến thức mới, có nhìn tổng quan cách vận hành, hoạt động phòng ban Thời gian thực tập dù ngắn nhờ có quan tâm, tạo điều kiện thầy anh giúp em hồn thành tốt cơng tác thực tập Em xin gửi lời cảm ơn chân thành đến thầy cô giáo khoa Đa Phương Tiện - Học viện Cơng nghệ Bưu Viễn thơng Nhờ kiến thức động viên mà thầy cô truyền dạy suốt chương trình học, em có bước hành trang tốt để bước vào đợt thực tập cho sống công việc mai sau Để có kết này, em xin gửi lời cảm ơn sâu sắc đến cô Nguyễn Thị Thanh Tâm Cảm ơn ln hướng dẫn, đơn đốc, tận tâm giúp đỡ em suốt trình làm báo cáo thực tập Qua thời gian thực tập, em xin gửi lời cảm ơn đến thầy Phạm Vũ Minh Tú – Quản lý Dự án tận tình giúp đỡ tạo điều kiện thuận lợi giúp em hồn thành tốt tập có thêm kinh nghiệm làm việc Đồng thời, em xin gửi lời cảm ơn đến tất anh trung tâm giúp đỡ giải đáp thắc mắc em trình làm việc Em xin chân thành cảm ơn! Báo cáo thực tập tốt nghiệp MỤC LỤC LỜI MỞ ĐẦU .1 LỜI CẢM ƠN .2 DANH MỤC CÁC TỪ VIẾT TẮT .4 DANH MỤC CÁC HÌNH PHẦN A: GIỚI THIỆU ĐƠN VỊ THỰC TẬP I Vị trí chức .6 II Nhiệm vụ III Tổ chức Cơ cấu tổ chức .8 Tầm nhìn - sứ mệnh .8 IV Kế hoạch chiến lược .9 PHẦN B: NỘI DUNG THỰC TẬP 12 I Giới thiệu chung .12 II Nội dung thực tập 13 Nghiên cứu lý thuyết 13 Thiết kế giao diện Website Landing Page giới thiệu Dự án La Trobe 21 Xây dựng Website Landing Page giới thiệu Dự án La Trobe .28 III Kết luận 31 PHẦN C: BÀI HỌC KINH NGHIỆM 32 I Về kiến thức .32 II Về kỹ 32 Kỹ giao tiếp chuyên nghiệp 32 Kỹ làm việc nhóm môi trường làm việc chuyên nghiệp 32 III Thuận lợi khó khăn 32 Thuận lợi 32 Khó khăn 33 KẾT LUẬN .34 TÀI LIỆU THAM KHẢO 35 Báo cáo thực tập tốt nghiệp DANH MỤC CÁC TỪ VIẾT TẮT Từ viết tắt Viết đầy đủ Giải thích nghĩa CIE Center for International Education Trung tâm Giáo dục Quốc tế (Trung tâm Đào tạo Quốc tế) WWW World Wide Web Mạng lưới thông tin tồn cầu HTML HyperText Markup Language Ngơn ngữ Đánh dấu Siêu văn W3C Word Wide Web Consutirum Tổ chức tiêu chuẩn quốc tế cho World Wide Web CSS Cascading Style Sheets Ngôn ngữ định kiểu theo tầng Báo cáo thực tập tốt nghiệp DANH MỤC CÁC HÌNH Hình 1: Logo Trung tâm Đào tạo Quốc tế Hình 2: Sơ đồ máy nhân Hình 3: Sơ đồ tổ chức thông tin 23 Hình 4: Wireframe dành cho Desktop .24 Hình 5: Wireframe dành cho Mobile 25 Hình 6: Giao diện dành cho Desktop 26 Hình 7: Giao diện dành cho Mobile 27 Hình 8: Hình ảnh sản phẩm Demo 31 Báo cáo thực tập tốt nghiệp PHẦN A: GIỚI THIỆU ĐƠN VỊ THỰC TẬP I Vị trí chức Trung tâm Đào tạo Quốc tế (viết tắt CIE), có địa Km10 - Đường Nguyễn Trãi - Quận Hà Đông - Hà Nội, tổ chức cung cấp dịch vụ đào tạo trực thuộc Học viện Công nghệ Bưu Viễn thơng xác định Quy chế tổ chức hoạt động Học viện, ban hành kèm theo Quyết định số 879/QĐBTTTT ngày 25/5/2016 Bộ trưởng Bộ Thơng tin Truyền thơng Hình 1: Logo Trung tâm Đào tạo Quốc tế - Học viện Công nghệ Bưu Viễn thơng Trung tâm có chức phát triển, tổ chức quản lý hoạt động, chương trình: đào tạo liên kết quốc tế; đào tạo tiên tiến; đào tạo chất lượng cao; trao đổi học viên, sinh viên quốc tế (gọi chung sinh viên); đào tạo hướng nghiệp, ngôn ngữ kỹ sống cho học sinh, sinh viên du học; tổ chức lớp học trại hè quốc tế cho học sinh, sinh viên (gọi chung đào tạo quốc tế) II Nhiệm vụ Trung tâm Đào tạo quốc tế đảm nhiệm nhiệm vụ sau: Xây dựng chiến lược, kế hoạch dài hạn, kế hoạch hàng năm Trung tâm trình Giám đốc Học viện Tổ chức thực sau phê duyệt; Tổ chức xây dựng, phát triển chương trình, nội dung đào tạo; tổ chức biên soạn tài liệu giảng dạy, học tập quy trình đào tạo quốc tế; Lập phương án, đề án đào tạo quốc tế trình cấp có thẩm quyền Tổ chức thực phê duyệt; Tổ chức đàm phán thoả thuận, hợp đồng liên kết đào tạo quốc tế theo quy định hành Nhà nước; Báo cáo thực tập tốt nghiệp Lập kế hoạch, chuẩn bị điều kiện, thủ tục để mở khóa đào tạo quốc tế theo quy định Nhà nước; Đề xuất với Giám đốc Học viện tiêu đào tạo quốc tế Xây dựng chủ trì tổ chức thực kế hoạch tuyển sinh hàng năm; Tổ chức giới thiệu, quảng bá khóa học đào tạo quốc tế nhằm phát triển đào tạo quốc tế; Chủ trì, phối hợp với đơn vị có liên quan xây dựng trình Giám đốc Học viện kế hoạch huy động lực lượng cán bộ, giảng viên, nghiên cứu viên tham gia giảng dạy Trung tâm Tổ chức thực phê duyệt; Xây dựng kế hoạch; chủ trì, phối hợp với đơn vị điều phối kế hoạch giảng dạy kỳ học năm học cho khoá đào tạo quốc tế Phối hợp với đơn vị sử dụng hợp lý hiệu quỹ giảng đường; 10 Tổ chức trình đào tạo quốc tế theo quy chế, quy định hành Nhà nước Học viện Phối hợp làm thủ tục cấp phát văn theo quy định Nhà nước Học viện Tổ chức cấp phát văn cho sinh viên, học viên; 11 Đầu mối quản lý mặt hành sinh viên, học viên nước ngồi học tập Học viện Quản lý sinh viên, học viên học tập Trung tâm phù hợp quy định Nhà nước Học viện Giữ liên lạc mối quan hệ với cựu sinh viên, học viên; 12 Định kỳ tổ chức hội nghị đánh giá công tác đào tạo quốc tế Đề xuất phương án cải tiến công tác quản lý đào tạo quốc tế nhằm không ngừng nâng cao chất lượng đào tạo; 13 Quản lý lưu trữ hồ sơ tuyển sinh, hồ sơ sinh viên, kết học tập, cơng văn giấy tờ có liên quan đến công tác đào tạo quốc tế; 14 Xây dựng quy định quản lý theo chức năng, nhiệm vụ giao Tổ chức thực hiện, kiểm tra, giám sát, tổng kết đánh giá, xử lý vi phạm văn quản lý ban hành; 15 Thực nhiệm vụ khác Học viện cấp giao Báo cáo thực tập tốt nghiệp III Tổ chức Cơ cấu tổ chức Cơ cấu phòng ban nhân đơn vị bao gồm: Giám đốc: PGS.TS Hồng Hữu Hạnh Phó Giám đốc: ThS Nguyễn Minh Phượng Tổ quản lý Đào tạo: ThS Trần Cẩm Vân - Quản lý Chương trình, Lê Thúy Hà, Trần Thị Lan Phương, Nguyễn Thị Lụa Tổ phát triển Dự án: ThS Phạm Vũ Minh Tú - Quản lý Dự án Sơ đồ máy nhân sự: Hình 2: Sơ đồ máy nhân Tầm nhìn - sứ mệnh Tầm nhìn Phát triển Trung tâm Đào tạo Quốc tế PTIT trở thành trung tâm quốc tế hoá giáo dục đại học, giáo dục định hướng nghề nghiệp dịch vụ đào tạo quốc tế cho xã hội Sứ mệnh Là trung tâm quốc tế hoá giáo dục, đào tạo dịch vụ cho xã hội, sứ mạng CIE là: Cung cấp chương trình đào tạo quốc tế chất lượng để đáp ứng xu hướng phát triển yêu cầu thực tiễn tổ chức, doanh nghiệp xã hội; Báo cáo thực tập tốt nghiệp Cung cấp chương trình đào tạo định hướng nghề nghiệp tiêu chuẩn quốc tế, nâng cao kỹ cho việc phát triển nguồn nhân lực cho thị trường nội địa quốc tế; Cung cấp dịch vụ quốc tế hoá giáo dục đạo tạo có chất lượng cho sinh viên xã hội đáp ứng yêu cầu phát triên nhanh giới đại ngày Những giá trị cốt lõi Đề cao cởi mở đón nhận giới tri thức bên ngồi Tích cực chuyển đổi để làm chủ giá trị Kiến thiết đổi sáng tạo giới tốt đẹp Chương trình đào tạo Các chương trình CIE bao gồm: Chương trình liên kết đào tạo quốc tế bậc đại học thạc sĩ (2+2, 3+1, 1+1) Tiến sĩ Chương trình trao đổi dịch chuyển sinh viên cho sinh viên nước quốc tế Chương trình du học kết nối cho sinh viên tốt nghiệp làm việc thị trường lao động tồn cầu Các khóa học định hướng nghề nghiệp từ đến nâng cao để giúp sinh viên có khả làm việc sau tốt nghiệp IV Kế hoạch chiến lược CHIẾN LƯỢC PHÁT TRIỂN CHO GIAI ĐOẠN 2020 - 2025 VỚI TẦM NHÌN ĐẾN 2030 Chương trình kỹ sư CNTT quốc tế Chương trình kỹ sư CNTT quốc tế chương trình đào tạo năm với chuyên ngành Công nghệ phần mềm trí tuệ nhân tạo Mục tiêu chương trình trang bị cho sinh viên kiến thức kỹ để làm việc lĩnh vực công nghệ thông tin mức độ thành thạo, chuyên sâu Người học sau tốt nghiệp có thể: Báo cáo thực tập tốt nghiệp Bước 3: Cuối chọn Finish để kết thúc q trình cài đặt Cài đặt thành cơng, có giao diện hình bên dưới: Thiết kế giao diện Website Landing Page giới thiệu Dự án La Trobe 2.1 Phân tích yêu cầu Báo cáo thực tập tốt nghiệp a Phân tích người dùng Xác định người dùng: sinh viên có nhu cầu du học quan tâm, tìm hiểu chương trình học bổng du học Mục đích: giới thiệu chương trình liên kết đào tạo cử nhân quốc tế với trường đại học La Trobe, Australia Phạm vi: phục vụ cho việc giới thiệu, quảng bá chương trình học bổng liên kết Trung tâm Đào tạo Quốc tế - Học viện Cơng nghệ Bưu Viễn thơng với trường Đại học La Trobe đến học sinh, sinh viên Cách trình bày: Landing page (Landing Page - hay cịn gọi trang đích) loại Website riêng biệt, tách hẳn với Website thiết kế để thuyết phục khách truy cập đến mục tiêu trọng tâm mà chiến dịch marketing/quảng cáo đặt nhằm hướng khách hàng vào hành động cụ thể (mua hàng, để lại thông tin, lấy phiếu giảm giá, đưa khách hàng đến website chính…) Hình thức: Website tĩnh Dạng thức: Onepage (Web trang) b Thiết kế chức cấu trúc trang Chức năng: cung cấp thơng tin chương trình học bổng môi trường học tập đại học La Trobe, Australia Cấu trúc: chia làm section, giới thiệu từ tổng quát đến chi tiết nội dung chương trình, section ngăn cách màu riêng hiển thị tiêu đề section Sơ đồ tổ chức thông tin: Báo cáo thực tập tốt nghiệp Hình 3: Sơ đồ tổ chức thơng tin 2.2 Thiết kế Wireframe Khái niệm: Wireframes bố cục đen trắng đơn giản phác thảo kích thước vị trí cụ thể thành phần trang, tính trang web, khu vực chuyển đổi điều hướng cho trang web bạn Chúng khơng có màu sắc, lựa chọn phông chữ, logo yếu tố thiết kế thực mà tập trung hoàn toàn vào cấu trúc trang web Thiết kế Wireframe cho trang Landing Page giới thiệu Dự án La Trobe: Báo cáo thực tập tốt nghiệp Wireframe dành cho Desktop: Hình 4: Wireframe dành cho Desktop Báo cáo thực tập tốt nghiệp Wireframe dành cho Mobile: Hình 5: Wireframe dành cho Mobile Báo cáo thực tập tốt nghiệp 2.3 Thiết kế giao diện Giao diện dành cho Desktop: Hình 6: Giao diện dành cho Desktop Báo cáo thực tập tốt nghiệp Giao diện dành cho Mobile: Hình 7: Giao diện dành cho Mobile Báo cáo thực tập tốt nghiệp Xây dựng Website Landing Page giới thiệu Dự án La Trobe III.1 Lập trình Cấu trúc Project bao gổm: Thư mục img: chứa ảnh sử dụng cho trang web File index.html: hiển thị nội dung trang web, bao gồm thẻ html File style.css: chỉnh giao diện màu sắc, kích thước cho thành phần trang web File res.css: responsive cho trang web hiển thị tương thích với loại thiết bị File script.js: thiết lập hiệu ứng cho trang web Lập trình cài đặt file: File index.html: Báo cáo thực tập tốt nghiệp File style.css: File script.js: III.2 Responsive cho loại thiết bị Các thiết bị di động, đặc biệt smartphone có xu hướng lên ngơi, thiết kế responsive ngày trở nên phổ biến Thậm chí, coi responsive yếu tố để đánh giá hiệu trang web Để Website có tính ứng dụng cao, cần responsive để thiết kế trang web cho nội dung hiển thị tương thích nhiều loại Báo cáo thực tập tốt nghiệp thiết bị khác Nói cách khác, bố cục trang web tự động thay đổi, điều chỉnh để xuất vừa in hình máy tính, điện thoại hay thiết bị sử dụng Thực responsive cho trang landing page cách sử dụng file file res.css riêng biệt, sau chia trường hợp cho loại kích thước hình cụ thể, tiến hành thiết lập, sửa đổi bố cục kích thước hiển thị cho loại hình thiết bị khác III.3 Demo sản phẩm Link Demo: https://nguyenkimdao1998.github.io/Web-LaTrobe/ Báo cáo thực tập tốt nghiệp Hình 8: Hình ảnh sản phẩm Demo III Kết luận Ngày nay, website sử dụng phổ thơng, người người, nhà nhà truy cập website đâu có kết nối internet có kết nối sóng di động Với doanh nghiệp, cá nhân thường xuyên tương tác với cộng đồng online website cơng cụ tốt giúp họ quảng bá hình ảnh, sản phẩm, thơng tin, Và từ dịch vụ thiết kế web chuyên nghiệp đời nhằm đáp ứng điều Nhận thức tầm quan trọng website, Trung tâm Đào tạo Quốc tế ứng dụng sử dụng website việc truyền tải, cung cấp giới thiệu chương trình du học, học bổng dành cho sinh viên có mong muốn học tập nước ngồi Việc thực tập trung tâm tạo website để hỗ trợ trung tâm quảng bá hình ảnh cho em có hội học hỏi, đào tạo, cọ sát áp dụng kiến thức học để hoàn thành sản phẩm mang tính ứng dụng Trong q trình thực tập, em tiếp xúc học hỏi nhiều kinh nghiệm làm việc từ thầy, anh trung tâm Đây hội tốt để giúp em làm quen với môi trường làm việc chuyên nghiệp tích lũy thêm kiến thức kỹ cho cơng việc em sau Báo cáo thực tập tốt nghiệp PHẦN C: BÀI HỌC KINH NGHIỆM I Về kiến thức Được ôn tập bổ sung thêm kiến thức xây dựng phát triển ứng dụng đa phương tiện, cụ thể website Tìm hiểu hệ cơng nghệ Web Tìm hiểu cơng cụ, ngơn ngữ phát triển ứng dụng web Tham gia phát triển website II Về kỹ Kỹ giao tiếp chuyên nghiệp Khác với môi trường Đại học trước đây, việc trao đổi công việc Trung tâm Đào tạo Quốc tế, đặc biệt tiếp xúc với thầy, anh cần thái độ giao tiếp chuyên nghiệp hơn, công việc giao qua email hệ thống chat nội đòi hỏi cẩn thận, tỉ mỉ giao phó phản hồi lại Việc trao đổi công việc gửi tài liệu công việc qua email cần thể tôn trọng, lễ phép với thầy, anh câu chữ cách thức email khơng cịn đơn gửi tài liệu trao đổi thời học Đại học trước Kỹ làm việc nhóm mơi trường làm việc chun nghiệp Ở Trung tâm Đào tạo quốc tế, em may mắn tiếp xúc làm việc với thầy, anh nhiệt tình, giỏi giang cơng việc Mỗi hệ trước sách sống để thân em học hỏi kinh nghiệm thực tiễn Đó kinh nghiệm học trình xây dựng sản phẩm ứng dụng đa phương tiện,… Việc chia làm nhóm để làm việc giúp em có thêm học hỏi từ bạn bè hồn thiện thiếu sót thân Các thầy cô anh bảo em tận tình suốt thời gian thực tập vừa qua Em nghĩ môi trường làm việc đáng học hỏi gắn bó lâu dài III Thuận lợi khó khăn Thuận lợi Báo cáo thực tập tốt nghiệp Sự hướng dẫn, bảo nhiệt tình từ thầy, anh Trung tâm Đào tạo Quốc tế Đặc biệt anh hướng dẫn trực tiếp Được làm việc với thầy, anh có kinh nghiệm, giỏi nghề sinh viên học hỏi nhiều kinh nghiệm quý báu từ người Được hỗ trợ tài liệu trình thực tập trung tâm Sự hướng dẫn nhiệt tình giáo viên hướng dẫn, ln trách nhiệm hỗ trợ thông tin với sinh viên Khó khăn Bản thân em ban đầu cịn gặp nhiều bỡ ngỡ, rụt rè, khó khăn việc làm quen với người, làm quen với môi trường làm việc mới, kinh nghiệm làm việc hạn chế nên cần bảo tận tình thầy anh Ảnh hưởng dịch Covid nên chưa có hội làm việc văn phịng nhiều, công việc trao đổi báo cáo chủ yếu qua hình thức online Báo cáo thực tập tốt nghiệp KẾT LUẬN Trong thời gian thực tập Trung tâm Đào tạo Quốc tế - Học viện Công nghệ Bưu Viễn thơng, em trải nghiệm, nhận nhiều điều lý thú sống nghề nghiệp tương lai Khoảng thời gian vừa qua hội cho em học hỏi thực hành kiến thức mà thầy cô cung cấp trường áp dụng vào thực tế, hiểu rõ môi trường làm việc, ứng xử với người quan Em học hỏi nhiều kinh nghiệm từ thầy, anh trước có khả chun mơn cao hoạt động lĩnh vực Qua khoảng thời gian thực tập, em thực sống làm việc môi trường làm việc chuyên nghiệp, lần đầu tiếp xúc, tận tay làm việc, tự ứng phó, giải vấn đề khó khăn gặp phải để từ rút học cho thân Bên cạnh đó, tập giúp em nhận cịn nhiều thiếu sót, cần phải nỗ lực học hỏi, trau dồi kiến thức, kinh nghiệm cho thân để tiếp tục tiến xa cơng việc tương lai Báo cáo thực tập tốt nghiệp TÀI LIỆU THAM KHẢO Tài liệu tiếng Việt: [1] ThS Nguyễn Tất Chung, Bài giảng Phát triển ứng dụng Web, Học viện Công nghệ Bưu Viễn thơng, 2014 [2] ThS Trịnh Thị Vân Anh, Bài giảng Lập trình Web, Học viện Cơng nghệ Bưu Viễn thơng, 2014 [3] ThS Bùi Thị Thu Huế, Bài giảng Thiết kế tương tác Đa phương tiện, Học viện Cơng nghệ Bưu Viễn thơng, 2018 [4] ThS Phí Cơng Huy, Slide giảng Thiết kế tương tác đa phương tiện, Học viện Cơng nghệ Bưu Viễn thông, 2013 Website tham khảo: https://cie.ptit.edu.vn/ https://www.w3schools.com/ https://vi.wikipedia.org/ ... 12 I Giới thiệu chung .12 II Nội dung thực tập 13 Nghiên cứu lý thuyết 13 Thiết kế giao diện Website Landing Page giới thiệu Dự án La Trobe 21 Xây dựng Website Landing. .. triển giải vấn đề dự án trí tuệ nhân tạo Báo cáo thực tập tốt nghiệp PHẦN B: NỘI DUNG THỰC TẬP I Giới thiệu chung ĐỀ TÀI: Xây dựng Website giới thiệu dự án La Trobe (Landing Page) Nội dung công... Mobile: Hình 7: Giao diện dành cho Mobile Báo cáo thực tập tốt nghiệp Xây dựng Website Landing Page giới thiệu Dự án La Trobe III.1 Lập trình Cấu trúc Project bao gổm: Thư mục img: chứa ảnh