Giáo trình HTML và thiết kế Web (Phần 2)

V.1. Thẻ neo và mối liên kết

Các liên kết siêu văn bản trong một tài liệu HTML là để tham chiếu đến một

tài liệu khác hay một phần tài liệu khác nằm trong tài liệu đó.

Liên kết siêu văn bản gồm có ba phần: giao thức, cái neo và địa chỉ hay URL

Để tạo một mối liên kết thì việc đầu tiên cần làm là thiết lập cái neo. Cặp thẻ

tạo neo là (Anchor). Thẻ này có nhiều thuộc tính bắt buộc phải xác định

rõ, ta sẽ tìm hiểu kỹ hơn ở phần sau.

V.1.1. Thuộc tính HREF

HREF (Hypertext REFerence – tham chiếu siêu văn bản) được dùng để liên

kết đến:

Một tài liệu khác (external link) hay

Một phần khác nằm trong chính tài liệu đang đọc (internal link)

Giao thức để tham chiếu HREF là HTTP. Nếu là liên kết nội tại – internal link

thì không cần phải có phần giao thức.

Giáo trình HTML và thiết kế Web (Phần 2) trang 1

Trang 1

Giáo trình HTML và thiết kế Web (Phần 2) trang 2

Trang 2

Giáo trình HTML và thiết kế Web (Phần 2) trang 3

Trang 3

Giáo trình HTML và thiết kế Web (Phần 2) trang 4

Trang 4

Giáo trình HTML và thiết kế Web (Phần 2) trang 5

Trang 5

Giáo trình HTML và thiết kế Web (Phần 2) trang 6

Trang 6

Giáo trình HTML và thiết kế Web (Phần 2) trang 7

Trang 7

Giáo trình HTML và thiết kế Web (Phần 2) trang 8

Trang 8

Giáo trình HTML và thiết kế Web (Phần 2) trang 9

Trang 9

Giáo trình HTML và thiết kế Web (Phần 2) trang 10

Trang 10

Tải về để xem bản đầy đủ

pdf 119 trang duykhanh 6360
Bạn đang xem 10 trang mẫu của tài liệu "Giáo trình HTML và thiết kế Web (Phần 2)", để tải tài liệu gốc về máy hãy click vào nút Download ở trên

Tóm tắt nội dung tài liệu: Giáo trình HTML và thiết kế Web (Phần 2)

Giáo trình HTML và thiết kế Web (Phần 2)
út Browse. Hộp thoại New Web Site 
Location sẽ xuất hiện. Sử dụng hộp thoại này để tìm kiếm và mở thư mục nơi 
ta sẽ lưu trữ các Web site mà ta sẽ làm việc trên đó bằng FrontPage. 
5. Mỗi site FrontPage phải được cung cấp thư mục riêng của nó. Để tạo một thư 
mục cho site được nhập vào này, click nút Create New Folder. Hộp thoại 
New Folder xuất hiện. 
6. Cho thư mục một tên trong Name và click OK. 
7. Trong hộp thoại New Web Site Location, click nút Open. Thư mục được liệt 
kê trong hộp thoại danh sách Specify the Location of the New Website trong 
Import Web Wizard. 
8. Click OK. Import Web Wizard mở ra. 
VIII.4.3. Chọn một phương pháp import 
Câu hỏi đầu tiên được hỏi bởi Import Web Site Wizard là cách để truy tìm 
site, như được trình bày ở hình dưới 
 152 
Hình VIII.32. Import Web Site Wizard 
Một site có thể được nhập theo năm cách, phụ thuộc vào vị trí của nó và kiểu 
truy cập nào mà ta có đối với vị trí đó: 
 FrontPage Server Extensions hoặc SharePoint Servicess, một kỹ thuật 
hiệu quả đòi hỏi một Web server được trang bị với một trong những tính 
năng này. 
 FPT (File Transfer Protocol), cách phổ biến nhất mà các file được trao 
đổi trên Internet. 
 HTTP (HyperTExxt Transfer Protocol), một cách để truy tìm các trang 
Web và các file khác vốn có thể truy xuất trên một mạng cục bộ. 
 WebDAV, một hệ thống tạo nội dung Web ít phổ biến hơn các phương 
pháp khác. 
Cách tốt nhất để nhập một site là sử dụng FrontPage Server Extensions hoặc 
SharePoint Services bởi vì điều này có thể truy tìm các trang và các file khác được 
đưa vào một Web site ngay cả nếu chúng không được trình bày trực tiếp cho các 
khách tham quan. 
Khi ta sử dụng FrontPage để tạo một Web site, nó sẽ làm việc với nhiều file 
ở hậu cảnh trong suốt quá trình chuẩn bị một trang. Ví dụ, nếu site của ta sử dụng 
một theme, sẽ có hơn hai chục file đồ họa và các thư mục con của nó. Những file 
này không bao giờ được biểu diễn trực tiếp cho những người tham quan site của ta. 
 153 
Thay vào đó, chúng được sử dụng bởi FrontPage để tạo các nút hover, đồ họa và 
định dạng các trang. 
Bằng cách sử dụng các server extension hoặc SharePoint Servicers, wizard 
cũng có thể nhập các site con (subsite) – các Web site được chứa bên trong các thư 
mục của một site khác. (Ví dụ, một Web site trong thư mục C:\My 
Sites\Sports\baseball). 
Nếu site để nhập nằm trên một phần mở rộng Web server hoặc SharePoint, ta 
có thể sử dụng chúng để nhập Web site này và toàn bộ site con của nó: 
1. Chọn FrontPage Server Extensions hoặc SharePoint Services. 
2. Nhập địa chỉ Web của trang chủ Web thuộc site vào trong trường text 
Web Site Location. 
Để đưa vào các site con, chọn hộp kiểm Include Subsites. 
Nếu site mà ta muốn nhập nằm trên máy tính của ta (hoặc trong một thư mục 
ở máy tính khác trên mạng của ta), ta có thể sao chép nó từ thư mục đó: 
1. Chọn tùy chọn File System và click đúp Browse. Hộp thoại New Publish 
Location xuất hiện. Sử dụng hộp thoại này để tìm và chọn thư mục chính 
của Web site (thư mục nơi trang chủ của nó được lưu trữ). 
2. Chọn thư mục và click Open. Thư mục được hiển thị trong trường text 
Web Site Location. 
3. Để nhập các site con cùng một lúc (nếu có), chọn hộp kiểm Include 
Subsites. 
Nếu site nằm trên một Web server mà ta có thể truy cập bằng cách sử dụng 
File Transfer Protocol (FTP), một tiêu chuẩn chung cho việc trao đổi các file với 
một Internet server, ta có thể sử dụng FTP account của ta để nhập site. Sau đây là 
cách thực hiện: 
1. Chọn FTP. 
2. Trong trường text Web Site Location, nhập địa chỉ của FTP server. Bởi vì 
nó đang sử dụng FTP, địa chỉ sẽ có ftp:// đứng trước thay vì http:// 
3. Trong trường Root Directory, gõ nhập vị trí và tên của thư mục mà ta chứa 
trang chủ của site. 
 154 
4. Nếu server đòi hỏi Passive FTP, click hộp kiểm Use Passive FTP. 
Nếu ta không thể tận dụng các phần mở rộng hoặc SharePoint, thì FTP là lựa 
chọn tốt nhất trong các tùy chọn còn lại. 
Nếu site nằm trên một Web server mà không được trang bị các phần mở rộng 
hoặc SharePoint (hoặc nếu ta không biết), ta có thể lưu các file bằng việc truy tìm 
chúng từ Web bằng cách sử dụng HTTP. 
Tùy chọn HTTP không hiệu quả bằng các phần mở rộng, SharePoint, hoặc 
FTP - chỉ lấy các trang được liên kết công cộng từ trang chủ. Nó cũng bỏ qua các 
file được sử dụng để tạo các trang đó, chẳng hạn như các theme FrontPage và 
những file khác vốn được sử dụng để tạo site. 
Tuy nhiên, biện pháp sau cùng là HTTP có thể được sử dụng để nhập site: 
1. Chọn HTTP. 
2. Nhập địa chỉ Web của trang chủ thuộc site trong trường text Web Site 
Location. FrontPage tỷ mỉ về địa chỉ: Thay vì sử dụng một địa chỉ chính 
chẳng hạn như www.example.com, nó cụ thể hơn và cũng tham chiếu tên 
của trang chủ (nói cách khác, một địa chỉ nào như 
www.example.com/index.html). 
3. Sau khi chọn một trong những phương pháp import, click Next để tiếp tục. 
Wizard được cập nhật để phản ảnh sự lựa chọn của ta. 
4. Nếu ta đang nhập một site từ một vị trí được bảo vệ bởi password, một 
hộp thoại Name and Password Required mở ra. Sử dụng các trường Name 
và Pasword để cung cấp thông tin đăng nhập của ta, và sau đó click OK. 
Sau khi chọn một phương pháp nhập, click Next. 
VIII.4.4. Chọn vị trí để lưu site 
Câu hỏi kế tiếp mà wizard có thể đặt ra là nơi để lưu site. Bởi vì ta đã chọn 
một thư mục, nó xuất hiện trong trường text trường Local Copy Location, trường 
này được tắt để ta không thể thay đổi nó. 
Tuy nhiên, có một cách để thay đổi một thực hiện một thay đổi nếu ta thay 
đổi ý định và chọn một thư mục khác: 
1. Hủy chọn hộp kiểm Add to Current Web Site. Trường Location Copy 
Location và nút Browse trở nên được chọn. 
 155 
2. Click nút Browse. Hộp thoại New Page Location xuất hiện. Sử dụng hộp 
thoại này để chọn (hoặc tạo) một thư mục mới nơi mà các file của site sẽ 
được lưu. 
3. Chọn thư mục và click Open. Hộp thoại đóng lại, đưa ta trở về wizard. 
4. Chọn hộp Add to Current Web Site. Click Next để đi đến câu hỏi kế tiếp. 
VIII.4.5. Thu thập thông tin phản hồi từ các khách tham quan Web site 
của ta 
Một trong những form dễ nhất để tạo là một trang phản hồi - một vị trí 
trong site của ta nơi những khách tham quan có thể gửi cho ta một lời nhận xét 
góp ý riêng tư. Điều này cung cấp một dịch vụ tiện lợi cho những khách tham 
quan của ta và có một ưu điểm thư hai – nó cho phép ta bỏ qua địa chỉ email 
của ta từ site của ta. 
Tại sao điều này lại hữu dụng? Khi ta bắt đầu xuất Web, bất kỳ địa chỉ email 
mà ta đặt trên một trang sẽ nhanh chóng được phát hiện bởi các spammer - những 
người tiếp thị email tạp nhạp lắp đầy các inbox bằng những lời đề nghị mang tính 
thương mại không cần thiết. 
Để tìm các địa chỉ để thêm vào các danh sách thư tín của họ, cá spammer 
thường xuyên sử dụng phần mềm để truy tìm các trang trên World Wide Web. Điều 
mà ta chắc chắn không thể tránh khỏi là site của ta sẽ được tìm thấy nhanh chóng 
bởi những chương trình này - thường là trong một thời gian ngắn từ một đến hai 
tuần. 
Bằng cách đặt một trang phản hồi thay vì địa chỉ của ta trên site của ta, ta sẽ 
giảm đi lượng spam mà ta nhận được. 
Để thêm một trang phản hồi vào site của ta, hãy thực hiện các bước sau: 
1. Mở site (nếu nó chưa được mở) và trên menu Standard chọn File New. 
Khung New mở nằm dọc theo cửa sổ biên soạn. 
2. Click hyperlink More Page Templates. Hộp thoại Page Templates mở ra, 
hiển thị các trang mà ta có thể tạo bằng cách sử dụng các template hoặc 
wizard. 
3. Chọn biểu tượng Feedback Form và click OK. Một trang phản hồi tạo sử 
dụng các màu, text và nền giống với phần còn lại của site. Nó mở trong 
cửa sổ biên soạn. Một đường chấm chấm biểu thị các đường viền của form. 
Mỗi phần của form phải được đặt trong đường biên soạn này. Ở đầu trang, 
 156 
một đoạn được tô màu đỏ tía mô tả form và cung cấp một số thông tin 
hướng dẫn về cách nó được sử dụng. Text này là một lời bình chú, text 
giải thích xuất hiện chỉ trong cửa sổ biên soạn của FrontPage chứ không 
phải khi một trang được xem trong một trình duyệt Web. (Để kiểm tra 
điều này, click nút Preview ben dưới cửa sổ biên soạn). 
Hình VIII.33. Hiệu chỉnh một trang phản hồi 
4. Để xóa lời chú thích, click nó một lần và nhấn phím Delete. 
5. Nếu ta muốn thay đổi cách diễn đạt của một câu hỏi, hiệu chỉnh nó như ta 
thường thực hiện đối với bất kỳ text khác trong FrontPage: Nhấp con trỏ 
trên trường và sử dụng bàn phím để thêm hoặc loại bỏ các thông tin. 
6. Việc định vị và định dạng các thành phần khác nhau của form cũng có thể 
được thay đổi giống như bất kỳ phần khác của một trang Web. 
7. Để xóa bất kỳ phần của form, kéo chuột lên trên nó và nhấn phím Delete 
Khi một trang phản hồi được tạo ra, FrontPage xác lập nó để lưu các câu trả 
lời sang file feedback.txt trong thư mục _private của Web site. 
 157 
Để thực thi điều này, ta phải xuất site của ta lên một Web server được trang bị 
bằng FrontPage Server Extensions hoặc SharePoint Servers, những cải tiến nhằm 
giúp những người sử dụng FrontPage thêm các tính năng đặc biệt (giống như vậy) 
vào các site của họ. 
Vào thời điểm này, ta có thể thay đổi cách thông tin phản hồi của khách tham 
quan được lưu như thế nào. Nó có thể được lưu sang một file theo nhiều dạng khác 
nhau hoặc gửi đến ta bằng một email. 
VIII.4.6. Lưu thông tin phản hồi của khách tham quan sang một file 
Những câu trả lời được thu thập trên một form có thể được lưu trữ trong một 
file trên Web server của ta theo ba dạng khác nhau: 
- Text - Dạng này có thể được xem trong một bộ biên soạn text hoặc được tải 
trong một chương trình cơ sở dữ liệu và trang bảng tính, chẳng hạn như 
Microsoft Acccess và Microsoft Excel. 
- HTML - Dạng này có thể được đọc bằng một trình duyệt. 
- XML – Đây là một dạng phổ biến cho dữ liệu được tích hợp rộng rãi vào 
FrontPage 2003 và các chương trình còn lại của bộ Office. 
Để lưu thông tin phản hồi sang một file, hãy thực hiện những bước sau đây: 
1. Click phải ở bất cứ nơi nào trong các đường viền của form - đường chấm 
chấm được minh họa ban đầu ở hình trên. 
2. Chọn Form Properties từ menu ngữ cảnh. Hộp thoại Properties xuất hiện 
như được minh họa trong hình dưới. 
 158 
Hình VIII.34. Chọn cách lưu thông tin phản hồi của khách 
3. Thông tin phản hồi của khách tham quan sẽ được lưu dưới dạng text. Để 
chọn một dạng khác, click nút Options. Hộp thoại Saving Results xuất hiện. 
4. Sử dụng hộp File Format xổ xuống để chọn một dạng cho thông tin phản 
hồi: 
 Để giúp ta đọc dễ dàng với Microsoft Excel và những chương trình cơ 
sở dữ liệu khác, hãy chọn Text Data-base Using Comma as a 
Separator. Điều này tạo một file text với phần mở rộng tên file.csv. 
 Để đọc nó bằng một trình duyệt Web, một lựa chọn tốt là HTML hoặc 
Formatted Text Within HTML. Điều này tạo ra một file.html vốn sử 
dụng cùng một định dạng với các trang Web mà ta tạo bằng 
ForntPage. 
 Để lưu theo dạng XML, chọn XML. Điều này tạo ra một file.xml. 
5. Click OK. 
6. Để chọn thư mục nơi file sẽ được lưu trữ ở đó, click nút Browse. Hộp 
thoại Current Web site xuất hiện. Sử dụng hộp thoại này để chọn một 
trong những thư mục trên site của ta. 
7. Click OK để đóng hộp thoại Form Properties. 
Form sẽ được xác lập để lưu trữ các thông điệp phản hồi trong một file được 
chỉ định. Nếu file này không hiện hữu khi một người nào đó sử dụng form phản hồi 
sẽ được tạo ra. 
 159 
VIII.4.7. Nhận thông tin phản hồi của khách tham quan bằng email 
Thông tin phản hồi cũng có thể được gửi đến ta bằng email thay vì được lưu 
trong một site của ta. 
Khi nó được gửi đến, nó trông giống như sau: 
Message Type: Suggestion 
Subject: Web Site 
Username: Sam Snett 
UserEmail: snett@samspublishing.com 
ContractRequested: ContacRequested 
Date: 22 Aug 2003 
Time: 21:19:30 
Comments: 
In this thing on? 
Trong email, các câu trả lời khác nhau trên form phản hồi được hiển thị trên 
các dòng riêng biệt. Trong ví dụ này, Sam Snett với địa chỉ email 
snett@samspublishing.com đã gửi một đề nghị với chủ đề “Web Site”. Mail 
hiển thị ở cuối. Sam đặt câu hỏi, “Is this thing on?” 
Thư phản hồi bắt nguồn từ một địa chỉ tự động trả lời được thiết lập bởi Web 
host của ta - ta có thể thay đổi địa chỉ này thành địa chỉ của người đang liên lạc với 
ta như một mô tả ở phần kế tiếp. 
Để gửi các trả lời phản hồi đến một địa chỉ email, hãy thực hiện các bước sau: 
1. Click chuột phải ở bất cứ nơi nào trong form và chọn Form Properties từ 
menu tắt vừa xuất hiện. Hộp thoại Form Properties mở ra. 
2. Nhập một địa chỉ email trong trường text E-mail Address. Địa chỉ này 
phải là địa chỉ email của ta hoặc địa chỉ của một người đang trả lời thư 
cho site của ta. 
3. Xóa bất kỳ text trong hộp Filename. Thông tin phản hồi sẽ được gửi bằng 
thư bằng cách sử dụng dạng của ví dụ SamSnett. Để chọn một dạng khác, 
click nút Options. Hộp thoại Saving Result xuất hiện. 
4. Click tab Email Result để đưa nó lên phía trước. 
5. Chọn một dạng trong hộp Email Format thả xuống. Các tùy chọn có sẵn 
giống như cá tùy chọn dành cho các file. Email phản hồi được cung cấp 
dòng chủ đề “Data posted to form 1”, theo sau là địa chỉ Web của trang 
phản hồi. 
 160 
6. Để xác lập một dòng chủ đề khác và giúp dễ dàng tìm những email này, 
hãy gõ nhập nó trong trường text Subject Line. 
7. Để tận dụng địa chỉ email của người đã điền đầy đủ thông tin vào form, 
nhập text UserEmail trong trường text Reply-To Line và chọn hộp kiểm 
Form Field Name nằm ngay kế bên nó (xem hình dưới). 
Hình VIII.35. Hộp thoại Saving Result 
Click OK để đóng hộp thoại Saving Results, và sau đó click OK để đóng hộp 
thoại Form Properties. 
Khi lưu kết quả của một form dưới dạng email, FrontPage có thể hiển thị một 
hộp thoại chỉ định rằng form không thể gửi kết quả bằng email và hỏi xem địa chỉ 
email có nên được loại bỏ hay không. 
Nếu ta biết rằng Web server của ta cung cấp các server Extensions hoặc 
SharePoint, hãy click No để giữ lại địa chỉ email và bỏ qua lời cảnh báo. Sau khi ta 
xuất trang phản hồi, nó sẽ hoạt động một cách chính xác. 
Bài tập 
1. Thay vì tự viết các thẻ HTML, hãy dùng công cụ FrontPage để tạo tất cả các 
trang Web cho các bài tập ở những chương trước. 
 161 
BẢNG CÁC TỪ VIẾT TẮT 
Browser: trình duyệt là chương trình đọc nội dung của file XML và hiển thị 
thông tin của file lên trên màn hình. 
Cascading Style Sheets: một ngôn ngữ khai báo cách hiển thị các phần tử 
trong file XML. 
Style sheet: là cách gọi tắt của Cascading Style Sheets nhưng nó ám chỉ đến 
một file chứa các khai báo style.7 
HTML: Hyper Text Markup Language. 
WWW: World Wide Web 
Markup: Đánh dấu 
Language: Ngôn ngữ 
Text: Văn bản 
Rect: Hình chữ nhật 
Circle: Hình tròn 
Polygon: Hình tam giác 
Transparency: Độ trong suốt 
 162 
TÀI LIỆU THAM KHẢO 
[1] 24 bài tự học thiết kế Web với Front Page 2003, Thuận Thành, NXB Thanh 
niên. 
[2] HTML, DHTML and JavaScript, Aptech WorldWide’s book. 

File đính kèm:

  • pdfgiao_trinh_html_va_thiet_ke_web_phan_2.pdf