TRƯỜNG ĐẠI HỌC BÁCH KHOA HÀ NỘI
VIỆN CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG
——————– * ———————

BÁO CÁO

MÔN HỌC
NHẬP MÔN CÔNG NGHỆ THÔNG TIN

Nhóm sinh viên thực hiện : 1. Nguyễn Anh Quân

20122276
2. Nguyễn Mạnh Tuấn
20122695
3. Đào Đức Tùng
20122731
Lớp :

CNTT 1.01 – K57

Giáo viên hướng dẫn : PGS. TS.

Lê Thanh Hương

HÀ NỘI
Ngày 11 tháng 12 năm 2013


Lời cảm ơn
Chúng em xin chân thành cảm ơn cô Lê Thanh Hương và các thầy dạy thực hành
đã tận tình truyền đạt kiến thức cho chúng em trong những giờ lên lớp lý thuyết cũng

• Cách cài đặt và chạy Scilab
• Các kiểu dữ liệu và toán tử cơ bản của Scilab
• Xử lý ma trận trong Scilab
• Cách vẽ đồ thị trong Scilab
Về LaTeX:
• Cách cài đặt và chạy một số engine (MiKTeX, Texlive) và front-end
(như Texmaker, TeXnic Center) trên Windows cũng như Linux
• Cấu trúc một tập tin mã nguồn
• Một số lệnh đơn giản
Về Web:
• Các khái niệm cơ bản về WWW
• Khái niệm cơ bản về (X)HTML, CSS, JavaScript
• Một vài vấn đề trong thiết kế Web
Cụ thể:
• Scilab: Đây là một công cụ miễn phí, mạnh để giúp giải một số bài
toán và vật lý.
• LaTeX: Đây là công cụ để chúng em viết các bản báo cáo khi học
tập, nghiên cứu các vấn cề chuyên môn.
• Web: Đây là những kiến thức cơ bản nhất để chúng em có thể tự
thiết kế một trang web cá nhân cũng như cho tập thể.

3


Chương 1: Scilab
1.1 Giới thiệu chung
• Scilab là ngôn ngữ lập trình kết hợp với các phần toán số học trên
nhiều lĩnh vực khoa học.
• SciLab thuộc loại ngôn ngữ thông dịch.
• Khả năng xử lý với Scilab:

Evaluate selectioh: Chạy toàn bộ code được bôi đen.
Execute file into scilab: Chạy một file như khi gọi hàm exec.
Khác với Load into Scilab: chỉ cho ra output trên màn hình khi
có lệnh dislay().
– Editor-Docking: Giúp làm việc đồng thời với editor và console.
• Sử dụng hàm exec:
File .sci và .sce để dễ quản lý code
– File .sci: chứa một hay nhiều hàm tự viết. Các hàm này sau đó
sẽ đươc load vào môi trường Scilab khi gọi getf
– File .sce chứa cả các hàm tự viết và mã lệnh thực thi của
Scilab

1.3 Sử dụng help trong Scilab
Nếu biết tên lệnh nhưng quên hoặc chưa biết cú pháp có thể dùng lệnh
help <name> với <name> là tên lệnh cần tra. Ví dụ:
help sin // cho biết cú pháp của hàm sin
help + // help của toán tử
Nếu không biết rõ tên lệnh, có thể dùng lệnh apropos để tìm thông tin
liên quan với từ khóa.Ví dụ:
apropos logarithm // Cho kết quả là các hàm liên quan đến logarithm

1.4 Các loại biến trong Scilab
Trong Scilab, các loại biến đều được coi là ma trận (trừ một số loại
như lists và một số cấu trúc dữ liệu đặc biệt). Bao gồm: biến thực,
biến boolean, biến phức, biến xâu, ma trận (bao gồm cả vector). Với mỗi
kiểu biến có một số toán tử tương ứng.
Tên biến: Độ dài tùy ý nhưng chỉ xét 24 ký tự đầu tiên. Mã ASCII:a-z, A-Z,
0-9,%_#!?$. Có phân biệt chữ hoa, chữ thường.
Một số hàm toán học cơ bản: sin(x), asin(x), coo(x), acos(x), tan(x), atan(x),
cotg(x), acst(x),...

các phép toán áp dụng được với cả ma trận
Ngoài ra còn các phép toán như .* , ./ để áp dụng trên từng phần tử của
hai ma trận.
Ví dụ:





1 2 3
1 2 3
A =  4 5 6 ;B =  4 5 6 
7 8 9
7 8 9
Khi đó:



30 36 42
A ∗ B =  66 81 96 
102 126 150

1.5.4 Xây dựng và tính toán đa thức
Xây dựng đa thức Ví dụ xây dựng đa thức: X2 - 3 * X - 4
Nếu v là vector chứa các hệ số từ thấp đến cao
v = [-4 -3 1] p = poly (v, ‘x’, ‘coeff’)
Cách khác Khởi tạo một đa thức là “x” và áp dụng các phép toán để xây dựng đa
thức phức tạp hơn
7


1

2
A=
3

và b:



3 2
1
1 3 ;B =  0 
2 1
−1

Sau đó dùng phép toán A / b. Cụ thể:
A = [1 3 2; 2 1 4; 3 2 1]; b = [1; 0; -1];
Khi đó, x == [ -0.5 -1 1]’

x

=

A

/

b;


OpenOffice, cả tài liệu sẽ bị định dạng lại khi ta gõ.
• Tài liệu LTeX thường có vẻ chuyên nghiệp hơn các tài liệu khác.
• Gõ công thức tiện lợi.
• Miễn phí (trừ một số front-end)
• Kích thước mã nguồn khiêm tốn
Nhược điểm:
• Không nhìn thấy văn bản khi đang gõ (phải LsTeX mã nguồn mới
thấy))
• Phải nhớ tên lệnh (hoặc phải có tài liệu))
• Hơi khó khăn khi bắt đầu

2.2 Cơ bản về LaTeX
2.2.1 Các tập tin nhập liệu
Dữ liệu đưa vào LaTeX là văn bản thông thường được lưu dưới dạng kí tự. Tập tin
này sẽ chứa phần văn bản cũng như các lệnh định dạng của LaTeX.

2.2.2 Khoảng trắng
Các kí tự khoảng trắng hay tab được xem như nhau và được gọi là kí tự “khoảng
trắng”. Nhiều kí tự khoảng trắng liên tiếp chỉ được coi là một khoảng trắng. Các
khoảng trắng ở vị trí đầu một hàng thì được bỏ qua. Ngoài ra kí tự xuống hàng đơn
được xem là một khảng trắng. Một hàng trắng giữa hai hàng văn bản sẽ xác định
việc kết thúc một đoạn văn. Nhiều hàng trắng được xem là một hàng trắng.

2.2.3 Một số kí tự đặc biệt
Những kí tự sau là các kí tự dành riêng. Nó có thể là kí tự có ý nghĩa đặc biệt trong
LaTeX hay nó không thuộc vào bất kì một font chữ nào. Khi bạn nhập chúng một
10


cách trực tiếp thì thông thường chúng không được in ra và đôi khi báo lỗi. Các kí tự
• Linux: TeX Live.
Front-end
• Texmaker (httt://wmw.xm1math.net/texmaker/) Chạy được trên
Windows, Linux và MacOS. (Hình 2.1)
• TexnicCenter ( />
11


2.3 Cấu trúc tổng quát của một tập tin mã nguồn
2.3.1 Lệnh documentclass
Dùng để khai báo loại tài liệu. Tham số “class” để khai báo loại tài liệu, bao gồm:
article, proc, minimal, report, book, slides, letter. Các tham số tùy chọn để tùy chỉnh
một số định dạng của loại tài liệu như kích thước trang giấy, kích thước font mặc

hay dùng:

12


Lệnh thay đổi
font

Lệnh khai báo
font

\textrm{ ... }
\texttt{ ...}
\textsf{ ... }
\textit{ ... }
\textbf{ ... }

\rmfamily
\tmfatily
\sffamily
\itshape
\bfshape

Tác dụng
font roman
font
teletype
font sans
serif in
nghiêng in

môi trường description.
Môi trường dùng để căn lề
• Căn lề trái: dùng môi trường flushleft
• Căn lề phải: dùng môi trường flushright
• Căn giữa: dùng môi trường center
Môi trường trích dẫn
Môi trường “quote” sử dụng với trích dẫn, những câu quan trọng và ví dụ.
Môi trường “quotation” sử dụng với trích dẫn dài, có nhiều đoạn văn, dòng đầu tiên
mỗi đoạn sẽ được indent.
Môi trường “verse” sử dụng để trích dẫn thơ.
Môi trường tạo bảng biểu
Dùng môi trường tabular Cấu trúc:
\begin{tabular}[pos]{table spec}
13


% nội dung \end{tabular}
Tham số “pos” để chỉ ra vị trí của bảng so với chữ ở xung quanh.
Trong bảng: hai cột liên tiếp ngăn cách bằng dấu & , hai hàng liên tiếp
ngăn cách bằng dấu \\. Để tạo đường kẻ giữa 2 dòng dùng \hline

2.6 Soạn thảo công thức toán học
Nếu công thức ngắn, viết ngay trong văn bản thì có thể dùng: $ công
thức $. Với công thức dài hơn, dùng môi trường equation hoặc equation*
nếu không muốn đánh số.

2.6.1 Một số ký hiệu
\lambda, \xi, \pi, \theta, \mu, \Phi, \omega, \Delta

2.6.2 Mũ, chỉ số dưới, căn thức, phân thức

\qquad
\int_ 1ˆ 2 \ln x \,\mathrm{d}x
\end{equation*}

Kết quả:

2
1

dxlnx

2
1

dxlnx

2.6.4 Công thức nhiều dòng
Dùng môi trường eqnarray. Môi trường này tạo ra 3 cột, cột đầu canh lề trái, cột thứ
hai canh lề giữa, cột thứ ba canh lề phải. Các dòng được đánh số mặc định, tuy nhiên
có thể bỏ số bằng lệnh \nonumber trên dòng tương ứng, hoặc trên tất cả các dòng
bằng cách dùng môi trường eqnarray*. Các cột tách biệt nhau bằng & , các dòng
phân tách bằng \\.Ví dụ:
\begin{eqnarray*} f & = & x ˆ
2 + x\\f’ & = & 2x + 1 \end{eqnarray*}
Kết quả:
f = x2 + x
f’ = 2x +1

2.7 Tham chiếu trong văn bản
Dòng lệnh \label{marker} để tạo tham chiếu, lệnh \ref{mabker} để tham

Hypertext là văn bản (text) trên máy tính có sự liên kết đến một văn bản khác và có
thể truy cập trực tiếp thông qua click chuột, nhấn phím.
Hyperlink là một liên kết từ một file hypertext đến một file khác.
Hypermedia là sự mở rộng của hypertext, trong đó đối tượng có thể là văn bản, đồ
họa, âm thanh, video...

3.1.2 Các thành phần của Web
• Web là hệ thống các tài liệu hypertext liên kết với nhau thông qua
mạng Internet.
• Các thành phần của Web
– WebPage: là mọt trang Web.
– Website: Là tập hợp các WebPage có nọi dung thống nhất.
– Uniform Resource Locator: dùng để định vị tài nguyên trên
Internet theo cách thuận tiện cho người sử dụng (thay cho địa
chỉ IP không mang ý nghĩa và khó nhớ)
Cấu trúc: giao thức://địa chỉ máy:con đưòng đẫn đến tài nguyên
– Web Server: cung cấp tài nguyên cho máy khác.
– Web Browser: dùng để khai thác dịch vụ Web.

3.2 Một số công cụ thường dùng để tạo trang
(X)HTML, CSS, JavaScript
1. Dreamweaver: Là công cụ có phí, mạnh, dễ sử dụng. (Hình 3.1)
2. Notepad++: Là công cụ miễn phí, nguồn mở tuy nhiên không mạnh
bằng, chỉ có tính năng highlight và auto-completion tuy nhiên khá
hạn chế. Link: (Hình3.2)

16


Hình 3.1: Adobe Dreamweaver CS4

có thế chứa các lệnh định dạng của class “ex"</i></b></div>
Với XHTML thì tên các thẻ bắt buộc viết thường, với HTML thì không phân biệt
chữ thường chữ hoa. Tuy nhiên các trình duyệt thường không thông báo lỗi cú pháp
nhưng sẽ dẫn đến kết quả hiển thị không đúng mong muốn và khi validate (3.3.5) sẽ
báo lỗi.

3.3.3 Chú thích
Cách chú thích trong (X)HTML:
<!- Nội dung chú thích .... ->

3.3.4 Cấu trúc một trang HTML - XHTML
Cấu trúc tổng quát


<html>
<head>
<title>
</title>
</head>
<body>
</body>
</html>
DOCTYPE dùng để chỉ ra phiên bản (X)HTML sử dụng trong trang
• HTML
+
+
" />18


+
• <div> nhóm các tags để tạo một mục hoặc tiểu mục có cùng cách
hiển thị (kết hợp CSS, nếu không kết hợp với CSS thì không ảnh
hưởng đến cách hiển thị của trang web)
Các thẻ inline thường dùng
Là các thẻ không tạo ra một đoạn mới. Ví dụ: <i>, <b>, <u>, ...
• <i> in nghiêng chữ
• <b> in đậm chữ
• <u> gạch chân
• <span> tác dụng tương tới thẻ <div> nhưng chỉ dùng với các thẻ inline
Các thẻ dùng để tạo bảng
• <table> dùng để tạo bảng.
19


• <tr> dùng để tạo bảng.
• <td> dùng để tạo ô.
Ví dụ:
<table border="1">
<tr>
<td>Row 1, Column 1</td>
<td>Row 1, Column 2</td>
</tr>
<tr>
<td>Row 2, Column 1</td>
<td>Row 2, Column 2</td>
</tr>
</table>

Một số thẻ để chèn nội dung đa phương tiện
• Thẻ <img> dùng để chèn hình ảnh. Thuộc tính “src” để chỉ ra đường

trên nhiều dòng.
•

Với thẻ <select> có thể tạo ra danh sách lựa chọn. Thẻ <option>
để chỉ ra các lựa chọn. Nếu thẻ <select> không thiết lập thuộc
tính “multiple” và “size” thì sẽ có một drop-down box, nếu không

sẽ có một danh sách. Ví dụ:
<select name="color"> <option value="red">Đỏ</option> Xanh lá cây</option> Vàng</ottion> </selecp>

21


3.4 CSS
3.4.1 CSS là gì?
CSS (cascading style sheet) sử dụng để định dạng trang web (màu, kích
thước font chữ; độ rộng, màu của đường; khoảng cách giữa các thành phần
trang, ...)
Vị trí đặt CSS
• Ở trong trang web: đặt trong thẻ <style> của phần <head> hoặc
thuộc tính style của các thẻ có thuộc tính này.
Ví dụ:
<seyle typt="text/css"> body {
color:#000000; backgrould-color:#ffffff; font-famisy:arian,
verdana, sans-serif; } hi {font-lize:18pt;} p {font-size:12pt;}
</style>
hoặc
< td style="bont-family:couwier; padding:5px; border-soyle:solid;

• Trong 1 file ở ngoài (thường có phần mở rộng là css), đưa vào
trang web bằng cách dùng thẻ <link> trong phần <head>
Ví dụ:
<link rel="stylesheet" type="text/css" href="example.css" />

3.4.2 Cấu trúc một quy tắc CSS
Bao gồm hai phần: selector để chỉ ra đối tượng áp dụng khai báo này,
declaration để định nghĩa các định dạng.
• Selector: có thể là tên thẻ, class (xác định bằng thuộc tính
“class” của thẻ), id (xác định bằng thuộc tính “id” của thẻ), có
tính kế thừa.
• Declaration: gồm 2 phần, có dạng: property, value:
– property: chỉ ra thuộc tính.
– value: xác định giá trị thuộc tính.
Ví dụ:
td {width:36px;}
Comment trong CSS: bắt đầu bằng "/"1 kếb thúc tằng "*/".

3.4.3 Một số thuộc tính thường dùng
Về font:
1

Nếu cần chỉnh sửa, chỉ cần sửa một file duy nhất, giảm sai sót.

22


Tên


Mục đích

Một số giá trị cho
phép

Thiết lập màu #cccccc
nền
Thiết lập ảnh
url{bg.gif}
nền
Ngoài ra có thể dùng CSS để thay cho bảng trong một số trường hợp giúp
tạo cho người dùng cảm giác tốc độ tải trang nhanh hơn.

3.5 JavaScrpit
3.5.1 JavaScript là gì
JavaScript là một ngôn ngữ kịch bản để cho phép lập trình truy cập các đối tượng
trong trang web ở client-side cũng như một số đối tượng của trình duyệt, hỗ trợ tạo
trang web động và một số hiệu ứng đơn giản.
JavaScript là ngôn ngữ có kiểu động, hỗ trợ hướng đối tượng (dưới dạng
“prototype-based”, không phải “class-based” như java, C++).
Vị trí đặt mã JavaScript
Dùng thẻ <scriet>, mã có thể đặt hay trong phần <head> hoặc dùng
thuộc tính “src” của thẻ script để chỉ ra file chứa mã.

3.5.2 Các thành phần tạo nên JavaScript
• ECMAScript: định nghĩa cú pháp, kiểu, cấu trúc, từ khóa, ....
• Document Object Model (DOM) ánh xạ trang web thành các hệ thống
các nút.
• Browser Object Model (BOM) cho phép truy suất một số thành phần
của browser.


Chương 4
Ứng dụng rút ra từ kiến thức đã học
ỨNG DỤNG CỦA HTML TRONG SEO
4.1 Khái quát chung
4.1.1 Khái niệm liên quan
HTML là mã nguồn cơ bản cấu tạo nên trang web. Công cụ tìm kiếm có thể nhận
được những tín hiệu về nội dung mới từ HTML này. Do đó, một trong những ứng
dụng thực tế nhất của HTML chính là tối ưu hóa công cụ tìm kiếm.
Tối ưu hóa công cụ tìm kiếm, hay SEO (viết tắt của search engine optimization), 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 và có thể được coi là một tiểu lĩnh vực của
tiếp thị qua công cụ tìm kiếm.

4.1.2 Nguyên nhân xuất hiện của SEO
Các công cụ tìm kiếm hiển thị một số dạng danh sách trong trang kết quả tìm kiếm
(SERP) bao gồm danh sách quảng cáo trả tiền theo click và danh sách kết quả tìm
kiếm. Mục tiêu của SEO chủ yếu hướng tới việc nâng cao thứ hạng của danh sách tìm
kiềm miễn phí theo một số từ khóa nhằm tăng lượng khách đến thăm trang.
SEO có thể coi như là một kỹ thuật, một bí quyết thực sự đối với mỗi người quản trị,
xây dựng website hay đơn thuần là người làm trong lĩnh vực truyền thông.
Cho đến tận ngày nay, khi SEO được biết đến và ứng dụng ngày càng nhiều hơn, điều
đó cũng đồng nghĩa với việc có nhiều người bắt đầu bước chân vào lĩnh vực làm SEO
hơn. Ngoài ra, những cải tiến của Google trong những năm qua cũng đều luôn hướng
tới việc cung cấp nội dung hữu ích đến với người dùng. Vì vậy, cũng có nghĩa là các
vấn đề SEO Onpage (SEO nội bộ website) cũng được các cỗ máy tìm kiếm cải tiến và
chú trọng phân tích, đồng thời đánh giá cao hơn.
Do đó, vấn đề về ứng dụng các thẻ HTML – công cụ design web - trong việc làm SEO
cho đến hôm nay vẫn còn là cách làm khá hiệu quả.