Xây dựng website giới thiệu công ty TNHH một thành viên MVB hải phòng

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

LỜI CẢM ƠN

Trong quá trình làm đề tài mặc dù đã có nhiều cố gắng nhưng kinh nghiệm còn chưa nhiều nên thiết kế của em không thể tránh khỏi những thiếu sót Em rất mong nhận được sự chỉ bảo, đóng góp ý kiến của toàn thể các thầy cô giáo để thiết

kế của em ngày càng hoàn thiện hơn nữa

Đầu tiên em xin gửi lời cảm ơn chân thành đến thầy Bùi Anh Tú giảng viên

bộ môn Công Nghệ Phần Mềm - Khoa Công Nghệ Thông Tin - Trường Đại Học Công Nghệ Thông Tin và Truyền Thông người đã hết lòng giúp đỡ, hướng

dẫn và chỉ bảo tận tình trong quá trình em làm đồ án tốt nghiệp này

Em xin gửi lời cảm ơn chân thành đến các thầy cô trong trường Đại học Công Nghệ Thông Tin và Truyền Thông đã tận tình giảng dạy quan tâm và tạo

điều kiện thuận lợi để chúng em học tập, rèn luyện và truyền đạt cho em những kiến thức vô cùng quý báu trong suốt thời gian em theo học tại trường

Em xin gửi lời cảm ơn đến anh Lê Đức Tuấn – Phó giám đốc công ty TNHH MVB và các anh chị nhân viên tại công ty đã tạo điều kiện và nhiệt tình

giúp đỡ em trong việc thu thập dữ liệu để thực hiện đồ án này

Em xin chân thành cảm ơn !

Sinh viên thực hiện

Nguyễn Yến Đường

LỜI CAM ĐOAN

Sau thời gian nỗ lực thực hiện đồ án tốt nghiệp dưới sự dẫn dắt của giáo viên hướng dẫn em đã hoàn thành đúng thời gian quy định và hoàn thành được yêu cầu của đồ án, bản thân em đã cố gắng tìm hiểu và nghiên cứu, học tập và thực hiện trong thời gian làm đồ án tốt nghiệp Em đã tham khảo một số tài liệu được nêu trong phần “Tài liệu tham khảo” và các website thông tin và giới thiệu , cùng các diễn đàn tin học trên Internet

Nội dung đồ án hoàn toàn không sao chép từ các đồ án khác, không vi phạm bản quyền tác giả Toàn bộ đồ án là do bản thân em tìm hiểu, nghiên cứu và sản phẩm của đồ án là của chính bản thân xây dựng nên

Em xin cam đoan những lời trên là đúng, nếu có thông tin sai lệch em xin hoàn toàn chịu trách nhiệm trước Hội đồng

Thái nguyên, ngày 01 tháng 06 năm 2015.

Sinh viên

Nguyễn Yến Đường

MỤC LỤC

LỜI CAM ĐOAN 2

MỤC LỤC 3

DANH MỤC HÌNH ẢNH 5

CHƯƠNG 1 CƠ SỞ LÝ THUYẾT 8

1.1 HTML 8

1.1.1 Định nghĩa về HTML 8

1.1.2 Thành phần của HTML 8

1.1.3 Cơ bản về các thẻ HTML 9

1.1.4 Điểm khác biệt giữa HTML và HTML5 17

1.2 CSS 18

1.2.1 Giới thiệu về CSS 18

1.2.2 CSS3 20

1.3 Giới thiệu về UML 21

1.3.1 Khái niệm và đặc điểm của UML 21

1.3.2 Mô hình khái niệm của UML 21

1.4 Tổng quan về SEO 24

1.4.1 Các khái niệm liên quan 24

1.4.2 Ưu điểm của SEO 31

1.4.3 Cơ chế hoạt động của Search Engine: 32

CHƯƠNG 2 : KHẢO SÁT PHÂN TÍCH THIẾT KẾ HỆ THỐNG 35 2.1 Khảo sát hiện trạng hệ thống 35

2.1.1 Tìm hiểu hiện trạng 35

2.1.2 Mô tả bài toán 35

2.1.3 Phân tích yêu cầu bài toán 36

2.1.4 Thông tin đầu vào, đầu ra của bài toán 36

2.1.5 Mục đích của đề tài 37

2.1.6 Khảo sát sơ bộ về công ty TNHH một thành viên MVB 37

2.2 Các tác nhân và Use Case của hệ thống 38

2.3 Biểu đồ Usecase 39

2.3.1 Biểu đồ Usecase Tổng quát 39

2.3.2 Biểu đồ Usecase mức chi tiết Người dùng 40

2.3.3 Biểu đồ Usecase mức chi tiết Quản trị viên 40

2.4 Đặc tả Usecase 41

2.4.1 Đặc tả Usecase Đăng nhập hệ thống 41

2.4.2 Usecase Quản lý tài khoản 42

2.4.3 Đặc tả Usecase Quản lý liên kết website 43

2.4.4 Đặc tả Usecase Quản lý banner 45

2.4.5 Đặc tả Usecase Quản lý thông tin 47

2.4.6 UC Quản lý thư viện ảnh 48

2.4.7 UC Quản lý liên hệ 50

2.4.8 UC Xem thông tin 51

2.4.9 UC Liên hệ 53

2.4.10 Đặc tả Usecase Quản lý SEO 54

2.4.11 Biểu dồ lớp thực thể 56

CHƯƠNG 3 : XÂY DỰNG WEBSITE GIỚI THIỆU CÔNG TY TNHH MỘT THÀNH VIÊN MVB 57 3.1 Giới thiệu website 57

3.1.1 Bố cục website 57

3.1.2 Hướng dẫn cài đặt 57

3.2 Giao diện website 59

3.2.1 Giao diện trang chủ 59

3.2.2 Giao diện trang giới thiệu 60

3.2.3 Giao diện trang sản phẩm 61

3.2.4 Giao diện trang dịch vụ 62

3.2.5 Giao diện trang tin tức 63

3.2.6 Giao diện trang Tuyển dụng 64

3.2.7 Giao diện trang Liên hệ 65

3.2.8 Giao diện trang Lĩnh vực 66

KẾT LUẬN 67 TÀI LIỆU THAM KHẢO 68 DANH MỤC HÌNH ẢNH Hình 1.4.1: Search Engine Google 25

Hình 1.4.2: Ví dụ minh họa về backlink 26

Hình 1.4.3: App store optimization 30

Hình 1.4.4: Nguyên lý hoạt động của Search Engine 32

Hình 2.3.1 Biểu đồ Usecase mức tổng quát 39

Hình 2.3.2 BIểu đồ UC mức chi tiết người dùng 40

Hình 2.3.3 Biểu đồ UC mức chi tiết Quản trị viên 40

Hình 2.4.1 Biểu đồ trình tự UC đăng nhập hệ thống 41

Hình 2.4.2 biểu đồ cộng tác UC đăng nhập hệ thống 42

Hình 2.4.3 Biểu đồ trình tự UC Quản lý tài khoản 43

Hình 2.4.4 Biểu đồ cộng tác UC Quản lý tài khoản 43

Hình 2.4.5 UC quản lý liên kết website 44

Hình 2.4.6 UC quản lý liên kết website 45

Hình 2.4.7 UC quản lý banner trên website 46

Hình 2.4.8 UC quản lý banner trên website 46

Hình 2.4.9 UC quản lý thông tin trên website 47

Hình 2.4.10 UC quản lý thông tin trên website 48

Hình 2.4.11 Biểu đồ trình tự UC quản lý thư viện ảnh 49

Hình 2.4.12 Biểu đồ cộng tác UC quản lý thư viện ảnh 49

Hình 2.4.13 Biểu đồ trình tự UC quản lý liên hệ 50

Hình 2.4.14 Biểu đồ cộng tác UC quản lý liên hệ 51

Hình 2.4.15 Biểu đồ trình tự UC xem thông tin 52

Hình 2.4.16 Biểu đồ cộng tác UC xem thông tin 52

Hình 2.4.17 Biểu đồ trình tự UC liên hệ 53

Hình 2.4.18 Biểu đồ cộng tác UC liên hệ 54

Hình 2.4.19 UC quản lý liên kết website 55

Hình 2.4.20 UC quản lý liên kết website 55

Hình 2.4.21 Biểu đồ lớp thực thể 56

Hình 3.2.1 Giao diện trang chủ của website 59

Hình 3.2.2 Giao diện trang Giới thiệu 60

Hình 3.2.3 Giao diện trang Sản phẩm 61

Hình 3.2.4 Giao diện trang Dịch vụ 62

Hình 3.2.5 Giao diện trang Tin tức 63

Hình 3.2.6 Giao diện trang Tuyển dụng 64Hình 3.2.7 Giao diện trang Liên hệ 65Hình 3.2.8 Giao diện trang Lĩnh vực 66

Đối với các công ty, xí nghiệp, công nghệ thông tin càng trở nên quan trọng hơn Việc áp dụng công nghệ thông tin vào việc kinh doanh, quảng bá, giới thiệu mang lại hiệu quả rất to lớn Tuy nhiên không phải công ty, doanh nghiệp nào cũng

có thể áp dụng tin học hóa vào công ty mình Chính vì vậy em đã xin được xây dựng website giới thiệu cho công ty TNHH một thành viên MVB

Là một sinh viên ngành Công nghệ phần mềm đang học tập trong Trường Đại Học Công Nghệ Thông Tin Và Truyền Thông Thái Nguyên em luôn cố gắng

học hỏi và trang bị cho mình những kỹ năng cần thiết Với mục đích tổng hợp những kiến thức đã học và tìm hiểu để vận dụng vào giải quyết các công việc thực

tiễn, đặc biệt dưới sự hướng dẫn nhiệt tình của thầy giáo Bùi Anh Tú bộ môn Công nghệ phần mềm đã giúp em hoàn thành đề tài của mình đúng thời gian.

Mục tiêu nghiên cứu: Tổng hợp, vận dụng các kiến thức đã học và tìm hiểu

để khảo sát, phân tích, thiết kế và xây dựng ứng dụng trong thực tế Để xây dựng được một Website theo đúng yêu cầu cần giải quyết một số công việc sau:

 Tìm hiểu và khảo sát để thu thập các thông tin, tài liệu, tư liệu về công

ty TNHH một thành viên MVB

 Phân tích, thiết kế và xây dựng Website quản lý các thông tin thu thập được một cách khoa học và cung cấp thông tin này đến các khách hàng của công ty

Nội dung chính của đề tài bao gồm:

Chương 1: Cơ sở lý thuyết

Chương 2: Khảo sát phân tích thiết kế hệ thống

Chương 3: Xây dựng website giới thiệu công ty TNHH một thành viên MVB-Hải Phòng

CHƯƠNG 1 CƠ SỞ LÝ THUYẾT

 HTML

 Định nghĩa về HTML

 HTML được biết đến là một loại ngôn ngữ dùng để mô tả hiển thị các trang web

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

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

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

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

 Thành phần của HTML

 Các dạng thẻ HTML

 Thẻ HTML dùng để viết lên những thành tố HTML

 Thẻ HTML được bao quanh bởi hai dấu lớn hơn < và > nhỏ hơn

 Những thẻ HTML thường có một cặp giống như <b> và </b>

 Thẻ thứ nhất là thẻ mở đầu và thẻ thứ hai là thẻ kết thúc

 Dòng chữ ở giữa hai thẻ bắt đầu và kết thúc là nội dung

 Những thẻ HTML không phân biệt in hoa và viết thường, ví dụ dạng

<b> và <B> đều như nhau,

 Thành phần HTML

 Thành phần của HTML bắt đầu với thẻ: <b

 Nội dung của nó là: web design resource

 Thành phần của HTML kết thúc với thẻ: </b

 Mục đích của thẻ <b> là để xác định một thành phần của HTML phải

được thể hiện dưới dạng in đậm

 Phần này bắt đầu bằng thẻ bắt đầu <body> và kết thúc bằng thẻ kết thúc

</body> Mục đích của thẻ <body> là xác định thành phần của HTML bao gồm nội dung của tài liệu



 Các thuộc tính của thẻ HTML

 Những thẻ HTML đều có những thuộc tính riêng Những thuộc tính này cung cấp thông tin về thành phần HTML của trang web Tag này xác định thành phần thân của trang HTML: <body> Với một thuộc tính thêm vào là bgcolor, chúng ta

có thể báo cho trình duyệt biết rằng màu nền của trang này là màu đỏ, giống như sau: <body bgcolor="red"> hoặc <body bgcolor="#E6E6E6"> (#E6E6E6 là giá trị hex của màu)

 Thẻ này sẽ xác định dạng bảng HTML:<table> với một thuộc tính đường viền

(border), bạn có thể báo cho trình duyệt biết rằng bảng sẽ không có đường viền: <table border="0">

 Thuộc tính luôn luôn đi kèm một cặp như name/value: name="value"(tên="giá trị") thuộc tính luôn luôn được thêm vào thẻ mở đầu của thành phần HTML

Dấu ngoặc kép, "red" hoặc 'red'

HTML sẽ tự động thêm một dòng trắng trước và sau mỗi heading

 Đoạn văn – paragraphs

Paragraphs được định dạng bởi thẻ <p>.

<p>Đây là đoạn văn</p>

<p>Đây là một đoạn văn khác</p>

HTML sẽ tự động thêm một dòng trắng trước và sau mỗi heading

 Line Breaks - xuống dòng

Thẻ <br> được sử dụng khi muốn kết thúc một dòng nhưng lại không muốn bắt đầu một đoạn văn khác Thẻ <br> sẽ tạo ra một lần xuống dòng khi viết nó

<p>Đây <br> là một đoạn<br>đoạn văn với thẻ xuống hàng</p>

Thẻ <br> là một thẻ trống, nó không cần thẻ đóng dạng </br>

 Lời chú thích trong HTML

Thẻ chú thích được sử dụng để thêm lời chú thích trong mã nguồn của HTML.Một dòng chú thích sẽ được bỏ qua bởi trình duyệt Chúng ta có thể sử dụng chú thích để giải thích về code của ta, để sau này ta có phải quay lại chỉnh sửa gì thì cũng dễ nhớ hơn

 Thẻ Anchor và thuộc tính Href

HTML sử dụng thẻ <a> (anchor) để tạo đường liên kết đến một tài liệu khác Thẻ anchor có thể liên kết đến bất cứ một tài nguyên nào trên internet, chúng

có thể là một trang HTML, một tấm hình, một file nhạc, một bộ phim v.v

Cú pháp để tạo một thẻ anchor

<a href="url">Chữ mong muốn ở đây</a>

Thẻ <a> được sử dụng để tạo một điểm neo và liên kết bắt đầu từ đó, thuộc tính href được sử dụng để chỉ ra tài liệu sẽ được liên kết đến, và chữ ở xuất hiện ở giữa hai tag < và > sẽ được hiển thị dưới dạng siêu liên kết

Thẻ anchor và thuộc tính tên

Dưới đây là cú pháp của điểm neo được đặt tên trước:

<a name="Tên">Chữ mong muốn hiển thị ở đây</a>

Thuộc tính tên được sử dụng để tạo điểm neo Tên của điểm neo có thể là bất cứ thứ gì ta mong muốn

Dòng code sau xác định điểm neo được đặt tên trước

<a name="news Tutorial">Tất cả tutorial ở đây</a>

Chúng ta có thể nhận ra rằng thẻ anchor được đặt tên trước được hiển thị không có gì đặc biệt Để trực tiếp liên kết phần Photoshop Tutorial, ta chỉ phải thêm dấu # và tên của điểm neo và cuối cùng của một URL Xem ví dụ sau

<a href="http://www.niemvui.net/#tutorials">Quay lại trang tutorials</a>Một đường liên kết đến phần Quay lại trang tutorials từ trang

"html_chuong_3.htm" sẽ như sau:

<a href="#tutorials">Quay lại trang tutorials</a>

Nếu trình duyệt không tìm được điểm neo được chỉ ra từ trước, nó sẽ quay lên phần trên cùng của tài liệu

 Thẻ frameset

Thẻ <frameset> xác định rằng sẽ chia cửa sổ trình duyệt thành những frame như thế nào Môi một frame xác định một tập hợp các hàng hoặc cột Giá trị của hàng hoặc cột chỉ ra diện tích của màn hình mà frame đó sẽ chiếm

Với HTML bạn cũng có thể tạo bẳng cho trang web của mình

Bảng được định dạng bởi thẻ <table> Một bảng được chia ra làm nhiều hàng với thẻ <tr>, môi hàng được chia ra làm nhiều cột dữ liệu với thẻ <td> Cbữ td là chữ viết tắt của "table data", là nội dung của cột dữ liệu v.v

Đoạn code trên sẽ hiển thị như thế này trong cửa sổ trình duyệt

row 1, cell 1 row 1, cell 2row 2, cell 1 row 2, cell 2

 Bảng và thuộc tính đường biên

Để hiển thị đường biên của một bảng, bạn phải sử dụng thuộc tính đường biên

Heading trong một bảng được xác định bằng thẻ <th>Cột trống trong bảng

Cột trống không có nội dung thì không được hiển thị tốt lắm ở hầu hết các trình duyệt

Nó sẽ có dạng thế này trên trình duyệt

row 1, cell 1 row 1, cell 2row 2, cell 1

Cần chú ý rằng đường biên bao quanh cột trống bị mất Để tránh điều này xảy ra, chúng ta nên thêm một non-breaking space (&nbsp;) vào cột trống đó, để làm cho đường biên của nó được hiện thỉ

Nó sẽ hiển thị như sau ở trình duyệt

row 1, cell 1 row 1, cell 2row 2, cell 1

 HTML form và trường nhập liệu.

HTML form được sử dụng để chọn những dữ liệu nhập vào khác nhau của người dùng

<input type="text" name="user">

<input type="submit" value="Submit">

Địa chỉ URL chỉ đến điểm mà hình ảnh được lưu trữ Một file hình có tên là

"boat.gif" được đặt ở thư mục images trênwww.niemvui.netcó địa chỉ URL là:http://www.niemvui.net/images/boat.gif

 Thuộc tính Alt

Thuộc tính alt được sử dụng để xác định chữ thay cho hình Bởi vì nếu hình

đó không hiện được thì một dòng chữ sẽ xuất hiện để báo cho người đọc biết Gía trị của thuộc tính alt là một dòng chữ như sau:

<img src="boat.gif" alt="Big Boat">

 HTML Background

 Một background đẹp có thể làm cho trang của bạn nhìn đẹp mắt hơn

sổ trình duyệt.

<body background="clouds.gif">

<body background="http://www.w3schools.com/clouds.gif">

 Điểm khác biệt giữa HTML và HTML5

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

Khả năng hoạt động xuyên suốt giữa các trình duyệt: HTML5 cung cấp các khai báo đơn giản hơn và một API mạnh mẽ Một ví dụ dễ thấy là khai báo DOCTYPE:

Điểm đặc trưng đầu tiên của một ngôn ngữ đánh dấu (markup language) là các thẻ Và ở mặt này thì HTML5 được bổ sung rất nhiều cái mới, từ các thẻ tổ chức nội dung (article, aside, title…) đến các thẻ hỗ trợ tương tác và multimedia (video, audio…) Ngoài sự rõ ràng, sử dụng các semantic markup còn có thể đem lại lợi thế khi các công cụ tìm kiếm trong tương lai tận dụng chúng để phân loại kết quả.

Không chỉ dừng lại ở các tag, HTML5 bao gồm một tập các API hấp dẫn Vài API thú vị có thể kể đến như:

CSS là chữ viết tắt của cụm từ tiếng Anh “Cascading Style Sheet”, là kiểu thiết

kế sử dụng nhiều lớp định dạng chồng lên nhau CSS được tổ chức World Wide Web (W3C) giới thiệu vào năm 1996 Cách đơn giản nhất để hiểu CSS là hãy coi nó như một phần mở rộng của HTML để giúp đơn giản hóa và cải tiến việc thiết kế cho các trang web

Mỗi khi chúng ta bắt đầu một Style Sheets, thì bắt buộc mở bằng <HEAD>

và kết

thúc bằng </HEAD> và tiếp theo sau đó là khai báo <STYLE> và kết thúc bằng </STYLE> và sau những bước trên thì bạn có thể nhìn thấy nguyên đoạn code như sau

<head>

Tag {definition1; definition2; ; definition n}

ví dụ sau đây về dòng lệnh của CSS:

H2 {font-size: 16pt; font-style: italic; font-family: arial}

 Ưu điểm của CSS

 CSS có thể tách riêng phần định dạng ra khỏi nội dung một trang web,

do đó nó sẽ rất thuận tiện khi ta muốn thay đổi giao diện của một trang web

 CSS là một sợi chỉ xuyên suốt trong quá trình thiết kế một website bởi vì

nó cho phép nhà thiết kế kiểm soát toàn bộ giao diện, kiểu cách và sự sắp đặt của nhiều trang hay nhiều đối trong một lần định nghĩa

 Thứ tự xếp lớp

1 Style nội tuyến – Style đặt trong từng thẻ HTML riêng biệt

2 Stylet bên trong – Style đặt bên trong cặp thẻ <Head> … </Head>

3 Style bên ngoài – Style đặt trong các file riêng có đuôi “.css”

4 Style theo mặc định của trình duyệt

 CSS có tính kế thừa và tính kết hợp

 Multiple background

CSS3 cho phép bạn áp dụng nhiều hình nền lên một phần tử (element) Tương tự như việc áp dụngđổ bóng , bạn có thể dùng tất cả các thuộc tính như background-image, background-repeat, background-position và background-size

Body{background:

url( /images/2.png) no-repeat left top,url( /images/1.png) no-repeat right top,url( /images/3.png) no-repeat left bottom,url( /images/4.png) no-repeat right bottom;

background-color:#ffffff;}

 Selectors

CSS3 selectors cho phép chúng ta chọn các phần tử HTML dễ dàng hơn Cách chọn của CSS3 không những giúp tiết kiệm thời gian viết CSS, giảm dung lượng file mà còn giúp cho mã HTML dễ nhìn hơn

1.3 Giới thiệu về UML

1.3.1 Khái niệm và đặc điểm của UML

UML là ngôn ngữ mô hình hóa thống nhất(Unified Modeling Language), trước hết nó là mô tả ký pháp thống nhất, ngữ nghĩa và các định nghĩa về metamodel(mô tả định nghĩa chính ngôn ngữ mô hình hóa), nó không mô tả phương pháp phát triển UML được sử dụng để hiển thị, đặc tả, xây dựng và làm tài liệu các vật phẩm của quá trình phân tích xây dựng hệ thống phần mềm theo hướng đối tượng.UML là ngôn ngữ chuẩn để viết các kế hoạch chi tiết phần mềm

Nó phù hợp cho việc mô hình hóa các hệ thông tin doanh nghiệp, các ứng dụng phân tán trên nền Web, hệ thống nhúng thời gian thực

Đặc điểm của UML

 UML là ngôn ngữ

 UML là ngôn ngữ để hiển thị

 UML làm ngôn ngữ đặc tả

 UML là ngôn ngữ dễ xây dựng

 UML là ngôn ngữ tài liệu

1.3.2 Mô hình khái niệm của UML

 Phần tử mô hình UML

Các khối hình thành mô hình UML gồm ba loại như sau: phần tử, quan hệ

và biểu đồ Phần tử là trừu tượng căn bản trong mô hình, các quan hệ gắn các phần

tử này lại với nhau, còn biểu đồ nhóm tập hợp các phần tử

Phần tử cấu trúc là các danh từ trong mô hình UML Chúng là bộ phận tĩnh của mô hình để biểu diễn các thành phần khái niệm hay vật lý Có bảy loại phần tử cấu trúc, đó là: lớp, giao diện, phần tử cộng tác, trường hợp sử dụng(Use Case), lớp tích cực(active class), thành phần, nút(node)

 Phần tử hành vi là bộ phận động của mô hình UML Chúng là các động

từ của mô hình, biểu diễn hành vi theo thời gian và không gian Có hai loại chính

là tương tác và máy trạng thái

 Phần tử nhóm là bộ phận tổ chúc của mô hình UML Chỉ có một phần tử thuộc nhóm này có tên là gói(package)

 Các quan hệ trong UML

Có bốn loại quan hệ trong UML, bao gồm quan hệ phụ thuộc, kết hợp, khái quát và hiện thực hóa.Chúng là cơ sở để xây dựng mọi quan hệ trong UML

 Phụ thuộc(dependency) Phụ thuộc là quan hệ ngữ nghĩa hai phần tử trong đó thay đổi phần tử độc lập sẽ tác động đến ngữ nghĩa của phần tử phụ thuộc

 Kết hợp(association) Kết hợp là quan hệ cấu trúc để mô tả tập liên kết Khi đối tượng của lớp này gửi/nhận thông điệp đến/từ đối tượng của lớp kia thì gọi

đó là quan hệ kết hợp

 Khái quát hóa(generalization) Khái quát hóa là quan hệ đặc biệt háo/khái quát hóa mà trong đó đối tượng cụ thể sẽ kế thừa các thuộc tính và phương pháp của đối tượng tổng quát

 Hiện thực hóa(realization) Hiện thực hóa là quan hệ ngữ nghĩa giữa giao diện và lớp(hay thành phần) hiện thực lớp, giữa UC và hợp tác hiện thực UC

 Kiểu dữ liệu

Kiểu dữ liệu không phải là phần tử mô hình trong UML Kiểu dữliệu cơ

sở là kiểu dữ liệu không có cấu trúc UML có các kiểu dữ liệu sau:

 Boolean: là kiểu đếm với hai giá trị True và False

 Biểu thức (Expression): là xâu ký tự có cú pháp

 Tính nhiều (Multiplicity): là tập không rỗng của các số nguyên dương

và ký tự*(để biểu thị tính nhiều vô hạn)

 Tên (Name): là xâu ký tự cho khả năng đặc tả phần tử

 Số nguyên (Integer): là kiểu cơ bản và là phần tử của tập vô hạn các số nguyên âm và dương

 Xâu (String): là trật tự của các ký tự, được sử dụng là tên

 Thời gian (Time): xâu ký tự biểu dirn giá trị tuyệt đối hay khoảng tương tương đối

 Không lý giải (Uninterpreted): là ‘cái gì đó’ mà ý nghĩa của nó phụ thuộc và lĩnh vực

 Biểu đồ UML

Biểu đồ UML là biểu diễn đồ họa tập hợp các phần tử mô hình Vẽ biểu đồ

để biểu diễn hệ thống đang xây dựng dưới các góc độ quan sát khác nhau Có thể hiểu biểu đồ là ánh xạ của hệ thống Một phần tử có thể xuất hiện trong một hay nhiều biểu đồ Về lý thuyết thì biểu đồ có thể bao gồm tổ hợp vô số phần tử đồ họa

và quan hệ vừa mô tả trên UML cho khả năng xây dựng một vài kiểu biểu đồ trực quan để biểu diễn các khía canh

 Biểu đồ trường hợp sử dụng(Use case- UC)

Biểu đồ này chỉ ra tương tác giữa UC và tác nhân.UC biểu diễn các chức năng hệ thống Tác nhân con người hay hệ thống khác cung cấp hay thu nhận thông tin từ hệ thống đang được xây dựng Biểu đồ UC tập trung vào quan sát trạng thái tĩnh của các UC trong hệ thống biểu đồ loại này chỉ ra tác nhân nào khởi

động UC và khi nào tác nhân nhận thông tin từ hệ thống.

 Biểu đồ trình tự (Sequence)

Biểu đồ trình tự chỉ ra các luồng chức năng xuyên qua các UC, nó là biểu

đồ mô tả tương tác giữa các đối tượng và tập trung vào mô tả trật tự các thông điệp thời gian

 Biểu đồ cộng tác (Collabaration)

Biểu đồ cộng tác chỉ ra các thông tin như biểu đồ trình tự theo cách khác,

nó tập trung vào tổ chức cấu trúc của các đối tượng gửi và nhận thông điệp Biểu

đồ cộng tác và biểu đồ trình tự thuộc loại biểu đồ tương tác và chúng có thể biến đổi qua lại

 Biểu đồ lớp(Class)

Biểu đồ lớp chỉ ra tương tác giữa các lớp trong hệ thống.Các lớp được xem như kế hoạch chi tiết của từng đối tượng.Mỗi lớp trong biểu đồ lớp được tạo ra cho mỗi loại đối tượng trong biểu đồ trinh tự và cộng tác

 Biểu đồ chuyển trạng thái(State transition)

Biểu đồ chuyển trạng thái mô tả vòng đời của đối tượng, từ khi nó được sinh ra đến khi bị phá hủy.Biểu đồ chuyển trạng thái cung cấp cách thức mô hình hóa các trạng thái khác nhau của đối tượng

 Biểu đồ thành phần(Component)

Biểu đồ thành phần cho ta cái nhìn vật lý của mô hình.Biểu diễn thành phần cho

ta thấy được các thành phần mềm trong hệ thống và quan hệ giữa chúng Hai loại thành phần trong biểu diển đồ, đó là thành phần khả thực và thành phần thư viện Bất kỳ ai có trách nhiệm dịch chương trình đều quan tâm đến biểu đồ loại này

 Biểu đồ triển khai(Deployment)

Biểu đồ triển khai chỉ ra bố trí vật lý của mạng và các thành phần hệ thống

sẽ đặt ở đây Thông qua biểu đồ triển khai mà người quản lý dự án, người sử dụng, kiến trúc sư và đội ngũ triển khai hiểu phân bổ vật lý của hệ thống và các hệ thống con sẽ được đặt ra ở đâu

1.4 Tổng quan về SEO

 Các khái niệm liên quan

 SEO – Search Engine Optimization

Tối ưu hóa công cụ tìm kiếm, tiếng Anh: Search Engine Optimization, viết tắt: SEO, là một tập hợp các phương pháp nhằm nâng cao thứ hạng của một website trong các trang kết quả của các công cụ tìm kiếm (phổ biến nhất là Google) Các phương pháp đó bao gồm việc tối ưu hóa website (tác động mã nguồn HTML và nội dung website) và xây dựng các liên kết đến trang để các công

cụ tìm kiếm chọn lựa trang web phù hợp nhất phục vụ người tìm kiếm trên Internet ứng với một từ khóa cụ thể được người dùng truy vấn.

Trên thực tế tồn tại những phương pháp đánh lừa cách đánh giá website của Google (thường được gọi là Black Hat) để qua đó nâng thứ hạng website lên một cách nhanh chóng, nhưng dần theo thời gian sẽ bị công cụ tìm kiếm đó phát hiện, và khi đó, những website này sẽ bị đánh tụt thứ hạng, rất khó để có thể lấy lại thứ hạng đúng của mình Điều này đặc biệt đúng với công cụ tìm kiếm Google một công cụ tìm kiếm với giải thuật liên tục được cải tiến, và một lực lượng phát triển hùng hậu

Bởi vậy nếu bạn không muốn một ngày nào đó Website của bạn nằm trong

sổ đen của Google, bạn hãy chọn cho mình một đối tác đáng tin cậy

 Keywords

Keyword hay còn gọi là "Từ khóa" Theo bách khóa toàn thư Wikipedia: Từ khóa là từ trong một câu, đoạn văn, một văn bản, mang một ý nghĩa quan trọng hoặc có mục đích nhấn mạnh theo ý muốn của người viết Vậy trong SEO từ khóa được định nghĩa như thế nào ?

Từ khóa trong lĩnh vực SEO chính là từ hoặc cụm từ mà chúng ta nhập vào các bộ máy tìm kiếm Và từ hay cụm từ này có liên quan đến sản phẩm, dịch vụ, hay một lĩnh vực nào đó mà người dùng mong muốn tìm thấy từ các SERPs

Ví dụ: Nếu bạn đang học tiếng Anh để thi TOEIC Điều bạn cần làm là truy vấn vào các công cụ tìm kiếm và nhập vào từ khóa "luyện thi TOEIC":

Hình 1.4.1: Search Engine Google

Hình 1.4.2: Ví dụ minh họa về backlink

Nếu như trước đây backlink (Hay inbound link) được sử dụng với chức năng chính là điều hướng website Thì ngày này khi có sự xuất hiện của SE và kèm theo đó là sự phát triển của SEO (Search Engine Optimization) Backlink đóng vai trò quan trọng trong việc gia tăng vị trí xếp hạng của những từ khóa gắn liền với trang web của bạn

Vì sao backlink lại quan trọng ?

Đối với SEO, việc xây dựng backlink đóng vai trò gia tăng thứ hạng từ

khóa trên SERPs của các SE, mà tiêu biểu là Google Một khi trang web của bạn nhận được nhiều backlink từ các trang web khác, điều này chứng tỏ website của bạn nhận được nhiều sự quan tâm và cung cấp thông tin gì đó đặc biệt Google sẽ đánh giá cao điều này và giúp việc gia tăng thứ hạng từ khóa cho trang web trở nên hiệu quả hơn

 Anchor text

Anchor text là đoạn văn bản được dùng để hiển thị link và được mọi người

sử dụng để link tới site của bạn Nói một cách khác, chính là đoạn text link cụ thể

mà người dùng nhấp vào

Và Tại Sao Anchor Text Lại Quan Trọng?

Anchor text thường cung cấp cho khách truy cập thông tin hữu ích về nội dung của trang mà bạn liên kết tới, và là một yếu tố vô cùng quan trọng trong việc xếp hạng website trên các công cụ tìm kiếm nếu được sử dụng một cách khôn ngoan, đặc biệt là Google

Vì, giả sử chúng ta trở lại với VD trên: Nếu bạn sử dụng anchor text là

“click here”, thì bạn đang thông báo với mọi người rằng, trang được liên kết tới sẽ

có chủ đề là “click here” chứ không phải “dịch vụ seo” Và liệu người dùng nghĩ rằng họ sẽ tìm thấy thông tin bổ ích nào đó với trang có chủ đề là “click here” trong khi họ đang muốn tìm cho mình một nơi có thể cung cấp dịch vụ seo chuyên nghiệp?

 PageRank

Google PageRank hay PageRank là một chỉ số, Google đánh giá mức độ tin cậy và chất lượng của mỗi webpage trong bất kỳ một website nào

PageRank được phát triển tại đại học Stanford bởi Lary Page (cũng bởi vậy

mà có tên PageRank) và sau đó bởi Sergey Brin như một phần dự án công cụ tìm kiếm mới

Theo Google một cách tóm lược thì PageRank chỉ được đánh giá từ hệ thống liên kết đường dẫn Trang của bạn càng nhận nhiều liên kết trỏ đến thì mức

độ quan trọng trang của bạn càng tăng Tuy nhiên đó chỉ là những khái niệm sơ đẳng nhất mà Google hiếm khi thông báo chính thức Trong thực tế, thuật toán PageRank phức tạp hơn rất nhiều Và may mắn là như thế, nếu không trang kết quả tìm kiếm của Google sẽ không còn tin cậy bởi những người lạm dụng thuật toán

của nó, và có lẽ như thế, SEO mới là một nghệ thuật làm tốn nhiều giấy bút của Webmaster.

 Search Engine

Là các cỗ máy tìm kiếm như Google, Yahoo, Bing, Msn,… Những cỗ máy tìm kiếm này sử dụng một phần mềm gọi là Robot, hay Spider, hay Bot hoặc Crawler để tự động index và lập chỉ mục tất cả các website trên đường chúng “bò” qua Sau đó, những thông tin này được gửi về Data Center của cỗ máy tìm kiếm để

xử lý, sàng lọc, phân loại và đưa vào lưu trữ Khi một người dùng internet cần tìm một nội dung, họ sẽ đánh từ khóa và nhiệm vụ của cỗ máy tìm kiếm là lục tìm trên danh bạ của nó các kết quả liên quan (đã lập chỉ mục trước đó)

 SEM – Search Engine Marketing

SEM – Search Engine Marketing (Marketing thông qua công cụ tìm kiếm)

Theo kỹ thuật này, chuyên viên Marketing online sẽ dùng các chương trình như Google Adwords để mua các từ khóa phù hợp với sản phẩm, dịch vụ, các chiến dịch quảng bá… Khi người tiêu dùng tìm thông tin bằng các từ khóa

có liên quan, thông tin của công ty bạn sẽ xuất hiện tại khu vực dành riêng cho quảng cáo trên trang kết quả

SEM giúp tiết kiệm đến 50 – 80% chi phí marketing trực tuyến mà hiệu quả mang lại cao hơn so với các hình thức quảng cáo khác như đặt banner trên các trang web

Trên thực tế, SEO cần nhiều thời gian để thực hiện và duy trì, vì vậy để đạt được hiệu quả cao nhất trên các kênh công cụ tìm kiếm, các công ty thường thực hiện SEM song song với SEO

 Social Media Marketing

Social Media Marketing (viết tắt là SMM): Tạm dịch là tiếp thị truyền thông trên các mạng xã hội Social Media Marketing là một phương thức truyền thông đại chúng (xã hội) trên nền tảng các dịch vụ trực tuyến – tức là những trang

web trên Internet

Đặc điểm nổi bật của Social Media Marketing:

- Social Media Marketing được xây dựng dựa trên nền tảng sự liên kết nội dung, mà ở đó diễn ra một quá trình đối thoại từ nhiều phía, không phải độc thoại từ nhà sản xuất

- Và quan trọng hơn hết, Social Media Marketing không phải là truyền thông đại chúng, bởi nó hoạt động dựa trên ba yếu tố: Sự tham gia, kết nối

và mối liên hệ

Tập quán chung của một quá trình Social Media:

- Nghe Thu thập thông tin thị trường và có cái nhìn sâu sắc, thông minh vào khách hàng

- Nói Tham gia thảo luận hai chiều để nhắn gửi thông điệp của bạn và có được thông điệp từ phía ngược lại

- Lòng tin hãy để khách hàng của bạn nói với khách hàng mới của bạn, thay

vì chính bạn (Viral, Word of Mouth)

- Hỗ trợ khách hàng của bạn sẽ hỗ trợ lẫn nhau thay vì chính bạn

- Social Sharing: Flickr, Snapfish, YouTube chúng ta có thể tạo, chia sẽ các hình ảnh, video cho tất cả mọi người

 Social media optimization (SMO)

Theo định nghĩa của Bách Khoa Toàn thư mở Wikipedia SMO là một tập hợp những phương thức để thu hút khách ghé vào xem nội dung website bằng cách quảng bá và quảng cáo nó thông qua các phương tiện (truyền thông)

xã hội

Người ta chia SMO thành hai nhóm chính:

- Nhóm 1: các công cụ truyền thông xã hội (đặt trên các website) được thêm vào chính bài viết như: RSS feeds, các nguồn tin tức, các nút chia

sẻ, người dùng bình chọn, các hình ảnh, video của công ty thứ ba

- Nhóm 2: các hoạt động quảng bá qua các phương tiện xã hội riêng từ nội

dung đang được quảng bá bao gồm: bài viết blog, viết comment trên các blog khác, tham gia vào các nhóm xã hội, thông báo trạng thái cập nhật trên các hồ sơ ở các mạng xã hội.

SMO liên quan đến Marketing (qua) máy tìm kiếm – SEM nhưng có sự khác biệt đó là nó tập trung điều hướng giao thông (truy cập trang web) từ các nguồn khác hơn là từ máy tìm kiếm Tuy nhiên, việc cải tiến thứ hạng (của kết quả trả về) tìm kiếm cũng mang lại lợi ích cho thành công của SMO

 ASO - App store optimization

Hình 1.4.3: App store optimization

ASO hay còn họi là App store optimization: là quá trình nâng cao khả năng hiển thị của một ứng dụng điện thoại di động (chẳng hạn như một chiếc iPhone, iPad, Android, ứng dụng Windows Phone) trong một cửa hàng ứng dụng (như iTunes, Google Play trên Android) App store optimization (ASO) là tương đương với tối

ưu hóa công cụ tìm kiếm SEO Cụ thể, App store optimization (ASO) bao gồm các quá trình xếp hạng cao trong kết quả tìm kiếm ứng dụng trên một app store và biểu đồ bảng xếp hạng Việc đứng cao trong kết quả tìm kiếm của app store sẽ giúp tăng số lượng download ứng dụng

 Ad Network – Advertising Network

Ad Network – Advertising Network: Chỉ một mạng quảng cáo liên

kết nhiều website lại và giúp nhà quảng cáo – có thể đăng quảng cáo cùng lúc trên nhiều website khác nhau Google, Chitika, Infolinks, Admax… là những

ad networks lớn trên thế giới Tại Việt Nam hiện có một số Ad networks như: Ambient, Innity, Adnet của Adbay

 Adwords – Google Adwords

Adwords – Google Adwords: là hệ thống quảng cáo của Google cho phép các nhà quảng cáo đặt quảng cáo trên trang kết quả tìm kiếm của Google hoặc các trang thuộc hệ thống mạng nội dung của Google Google Adwords còn thường được gọi là Quảng cáo từ khoá, Quảng cáo tìm kiếm…

 Vai trò của SEO trong Internet Marketing:

Google luôn luôn thay đổi mình để phất triễn hướng tới người dùng Seoer cũng thay đổi theo để phù hợp Nó là điều cần thiết để hướng dẫn cho những người tìm kiếm các sản phẩm hoặc dịch vụ mà bạn cung cấp, hơn là lựa chọn ngẫu nhiên những người đang tìm kiếm cái gì đó Lý tưởng nhất, chiến lược SEO của bạn nên làm việc với thị trường mục tiêu của bạn và làm việc theo hướng thu hút thị trường mục tiêu này đến trang web SEO có vai trò quan trọng bởi vì nó bao gồm hầu hết các lĩnh vực chính liên quan Marketing trong khi bán hàng và quảng cáo trực tuyến – nó sẽ tạo ra nhận thức, dẫn đến việc mua sắm của khách hàng và

sự trao đổi của khách hàng, và tối ưu hóa những nỗ lực tiếp thị để hướng đến người mua

Theo một số thống kê thì có đến hơn 80% số người dùng Internet sử dụng các công cụ tìm kiếm như Google

 Ưu điểm của SEO

SEO mang lại một số ưu điểm:

 Chi phí rất thấp khi so với các phương thức quảng cáo trên công cụ tìm kiếm khác (PPC…)

 SEO giúp thu hút lượng lớn khách hàng mục tiêu có quan tâm trực tiếp đến sản phẩm, dịch vụ kinh doanh của công ty Vì vậy mang lại doanh thu

 Tiết kiệm chi phí truyền thông khác.

 Giúp doanh nghiệp mở rộng thị trường, đối tượng khách hàng, thậm chí

đa dạng hóa sản phẩm một cách dễ dàng

 SEO nâng cao thương hiệu của doanh nghiệp

 Xuất hiện nhiều trên trang kết quả tìm kiếm khiến doanh nghiệp của bạn

dễ dàng được biết đến

 Xuất hiện ở những vị trí cao hàm ý doanh nghiệp của bạn hoạt động lâu năm và là website đáng tin cậy



 Cơ chế hoạt động của Search Engine:

Để bắt đầu học SEO, thì điều căn bản đầu tiên là bạn phải hiểu được cơ chế hoạt động của Search Engine ( Cơ chế hoạt động của Google, Bing, Yahoo…)

Có 3 cơ chế chính của Search Engine là: Crawling -> Indexing -> Ranking:

- Crawling: là quá trình Spider thu thập thông tin

- Indexing: là hệ thống lập chỉ mục trong công cụ tìm kiếm thực hiện việc phân tích, chọn lựa và lưu trữ những thông tin cần thiết (thường là các từ khóa hay cụm từ khóa) một cách nhanh chóng và chính xác từ những dữ liệu mà robot thu được

- Ranking: là quá trình xếp hạng các kết quả tìm kiếm

Hình 1.4.4: Nguyên lý hoạt động của Search Engine

Google hoạt động dựa trên mạng lưới hàng ngàn máy tính nên có thể nhanh