Vài thao tác cơ bản để tạo một Website với Frontpage 2003
Dưới đây là những hướng dẫn cơ bản nhất, quan trong nhất để tạo một website mà những bạn mới bắt đầu sử dụng FrontPage 2003 cần biết. Nếu bạn cần học một cách hệ thống về FrontPage (chung cho các phiên bản), xin nhấn chuột vào đây!
Bạn chọn nội dung nào?
|
Làm quen
Frontpage 2003. Bảng mã tiếng Việt nào cho web. |
Tạo một siêu liên kết cho web Đưa ảnh vào để trang trí cho Web |
http://web.good.to
Sau khi khởi động chương trình Frontpage 2003 bạn sẽ thấy giao diện như sau:
|
|
Chúng ta hãy quan tâm đến cách "chọn
kiểu soạn thảo" Gồm các lựa chọn: Design: Soạn thảo theo giao diện đồ họa Split: Soạn thảo hỗn hợp, nửa trên xem Soạn thảo theo mã HTML, nửa dưới là Soạn thảo theo giao diện đồ họa. Code: Soạn thảo bằng mã HTML Preview: Xem thử. Cho bạn xem thử đồng thời kiểm tra luôn xem các mã HTML có lỗi không! |
Nếu không biết gì
về HTML bạn chỉ cần quan tâm đến thẻ Design. Bạn sẽ thao tác với một
trang web như là thao tác với Word.
Các thanh công cụ bạn sử dụng như trong Word, bạn cũng có thể kẻ bảng, căn lề...,
chọn font chữ, khổ chữ, màu mè.... Nếu chỉ muốn tạo một trang web "đọc được" mà
không muốn quan tâm sâu hơn thì bạn có thể dừng ở đây. Còn bạn nào cần hiểu một
cách hệ thống bản chất website tạo bằng FrontPage 2003 thì mời xem tiếp!
Bảng mã tiếng Việt nào cho web?
Về
chuyện Font chữ việt, nếu chưa rõ bạn nên
click vào đây để đọc qua bài hướng dẫn về Font chữ Việt.
Nếu bạn quan tâm đến HTML để có thể can thiệp nền web, hiệu ứng Java... mà chưa
rõ lắm về nó thì hãy học qua sách điện tử iHTML-online
Bạn có thể vào đây để học HTML trực tuyến bằng sách điện tử iHTML Online (tác
giả: Trí Dũng). Chúng tôi cũng đã đóng gói sách này vào một file nén. Nếu bạn
muốn tải về nhà đọc cho đỡ tốn kém thì bạn có thể tải sách này
về tại đây.
Bạn không phải mất nhiều thời gian để học HTML, với sách điện tử iHTML bạn chỉ
cần một buổi tối để làm quen với HTML và tạo cho mình một Website rồi! Nếu có
điều kiện bạn nên đọc sách Trực tuyến để có thể sử dụng hết chức năng của sách!
Đây là mã HTML cho một trang trắng mà chương trình Frontpage tạo ra mỗi khi bật
lên :
<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
//Nên đổi "windows-1252" thành "utf-8" (sẽ giải thích sau)
<title>New Page 1</title> //Cái tit này sẽ hiển thị ở
thanh tác vụ và đỉnh của cửa sổ trình duyệt
</head>
<body>
//nội dung soạn thảo sẽ được ghi tại đây!
</body>
</html>
=============
Việc đổi "windows-1252" thành "utf-8" chính là bạn đã bắt trình duyệt web của
người truy cập phải định dạng bảng mã chính xác là UNICODE dựng sẵn. Web sẽ hiển
thị tiếng Việt rõ ràng. Không bao giờ lỗi font như khi tạo web trực tuyến bằng
công cụ của Freewebs.com. Có nhiều bảng mã UNICODE nhưng
utf-8 là UNICODE dựng sẵn. Chẳng những giảm đến 30% dung lượng website, tăng tốc
truy cập mà bạn sẽ thấy tiếng việt ngay cả khi soạn thảo bằng HTML.
Ví dụ cụ thể: khi gõ cụm từ: UNICODE tổ hợp
Nếu sử dụng UNICODE tổ hợp(để nguyên windows-1252) thì trang HTML sẽ được dịch
thành:
UNICODE tổ hợp
Nếu sử dụng UNICODE dựng sẵn(đổi "windows-1252" thành "utf-8") thì trang HTML sẽ được dịch thành:
UNICODE tổ hợp
==> rõ ràng là dễ đọc hơn, số ký tự ít hơn==> dung lượng trang nhỏ hơn==>tốc độ duyệt web nhanh hơn.
Như vậy bạn đã hoàn thành việc định dạng tiếng việt trên Web.
Frontpage 2003 "Thông minh" hơn các phiên bản trước rất nhiều. Bạn có thể cùng lúc soạn thảo theo chế độ đồ họa ở bên dưới và theo dõi sự thay đổi bằng HTML ở bên trên với chế độ soạn thảo split. Bạn sẽ tận mắt thấy được sự thay đổi tương ứng của mã HTML khi soạn thảo bằng vùng đồ họa bên dưới. Ngược lại nếu bạn soạn thảo bằng HTML, bạn không cần nhớ chính xác các thẻ mã bởi vì bạn chỉ cần gõ cách trống, tùy theo tình huống cụ thể mà chương trình sẽ bật lên một danh sách các thẻ có thể được sử dụng, bạn chỉ cần nhấn chọn thẻ đó mà thôi. Ngoài ra khi soạn thảo dạng đồ họa bạn có thể theo dõi đoạn bạn đang soạn thảo nằm trong vùng hoạt động của thẻ mã nào, từ đó có thể có biện pháp can thiệp, chỉnh sửa...
![]() |
Trong ảnh tôi
đang chọn chế độ soạn thảo split (Soạn thảo hỗn hợp).
Tôi chèn con trỏ vào tag(thẻ) <body> như sau: <body [vị trí con trỏ]>. Sau đó tôi gõ cách trống, có menu bật lên bao gồm danh sách các thẻ có thể cho vào. tôi muốn thay nền của website bằng một ảnh nên tôi chọn thẻ background.
Tôi biết sau thẻ này là dấu = nên tôi gõ tiếp dấu này. Lại có một menu nhỏ bật lên có chữ Pick URL(tra từ điển Lạc Việt bạn sẽ thấy nó có nghiã là: chỉ tới địa chỉ của ảnh) gợi ý cho tôi kích chuột đúp vào đó để bật lên bảng chọn, dẫn tới ảnh chọn làm nền web. tôi đã để file ảnh này vào chung thư mục với trang web đang tạo. chính vì thế khi bảng chọn bật lên tôi chỉ việc tìm đến thư mục đang tạo web, chỉ vào file ảnh và nhấn OK. Thật đơn giản phải không? |
Kinh nghiệm:
Bạn nên tạo ra một thư mục riêng có tên là "tenban" chứa các trang web sau khi
làm xong và tất cả các file có liên quan đến web của bạn. ví dụ ảnh, tài liệu
khác... Trong thư mục này bạn có thể tạo ra các thư mục con chứa các file khác
nhau có liên quan đến trang web. Cái này rất quan trọng vì web trên máy bạn hoạt
động thì bạn có thể để ảnh lung tung nhưng máy vẫn tìm ra. Còn khi bạn đưa nó
lên mạng, nếu không xếp gọn nó vào một chỗ để tải lên cùng nhau thì tất cả sẽ bát nháo hết chứ không còn ngon lành như trên máy bạn đâu!
Phần dưới đây nói về địa chỉ
của các liên kết trên mạng nếu bạn không biết hoặc không quan tâm về HTML có thể bỏ qua!
Các địa chỉ trên web chia làm 2 dạng: Địa chỉ đầy đủ(hay còn gọi là địa chỉ
tuyệt đối) và địa chỉ thu gọn(địa chỉ tương đối)
Địa chỉ đầy đủ là địa chỉ mà bạn phải liệt kê chính xác và đầy đủ địa chỉ dẫn
đến nó ở trên mạng.
Ví dụ: http://www.freewebs.com/tenban/logo.gif là địa chỉ file ảnh "logo.gif"
trong đó nó phải được định nghiã chính xác cả phần mở rộng (cái đuôi .gif)
Về vấn đề này bạn phải học qua tin học căn bản trong trường học (học qua MS-DOS)
thì mới hiểu được.
Địa chỉ thu gọn là địa chỉ mà bạn có thể không cần chỉ ra chính xác URL của nó
trên mạng.
Nếu file ảnh có tên là anhnen có phần mở rộng là JPG (sử dụng định dạng ảnh
JPG), bạn để cùng thư mục với trang web thì địa chỉ thu gọn dẫn tới nó chính là
tên ảnh (ở ví dụ trên địa chỉ của nó là: anhnen.jpg)
Nếu file ảnh ấy bạn để trong thư mục "Anh", mà thư mục "Anh" lại ở trong thư mục
"tenban" chứa trang web đó thì địa chỉ thu gọn dẫn tới file ảnh đó là: /anh/anhnen.jpg
Nếu file ảnh đó trong thư mục "Anh", mà thư mục "Anh" lại ở ngoài thư mục chứa
trang web thì địa chỉ file ảnh đó là: ../anh/anhnen.jpg
Như vậy bạn thấy rằng dấu "chấm chấm" để lùi lên một thư mục cấp cao hơn.
Ký tự
"/" để phân cách thư mục. rất giống NC phải không?
Phần cuối của hướng dẫn này chúng ta sẽ tìm hiểu về siêu liên kết
và cách tạo
nó. Nhưng trước hết bạn phải đọc bài viết "Cần nắm vững một vài nguyên tắc"
trên trang "Cơ bản về Web - HTML" (trang này tôi có tạo liên kết tắt đến sách
điện tử iHTML online. bạn cũng có thể học iHTML online của anh Trí Dũng
tại đây!)
Sau khi đọc xong bạn đã biết siêu liên kết là gì, để làm gì rồi và nếu bạn đã
từng sử dụng Freewebs.com để làm web theo dạng trực tuyến mà chúng tôi đã hướng
dẫn trong phần "3 bước tạo một website" thì bạn sẽ thấy để tạo một siêu liên kết
trên Frontpage cũng tương tự. ngay cả biểu tượng nút cũng hệt như nhau!
Để tạo 1 siêu liên kết bạn làm như sau:
1.Bạn chọn đối tượng muốn sử dụng làm siêu liên kết. Nếu là văn bản thì bạn bôi
đen đoạn văn bản. Nếu là ảnh thì click vào nó.
2.Nhấn nút Insert hyperlink(Nút có biểu tượng quả cầu xanh và mắt xích_có trong
thanh công cụ chuẩn-Standard) để mở hộp thoại Insert hyperlink.
3.Bạn chỉ đến trang web hoặc tài liệu muốn liên kết đến bằng cách chọn nó trong
bảng chọn hoặc gõ địa chỉ của nó vào ô address.
4.Nhấp OK.
Dùng ảnh trang trí trang web:
Bạn đã biết tạo nền cho web rồi. Bây giờ chúng ta sẽ học cách đưa ảnh vào web
như một đối tượng độc lập. Xử lý ảnh trong web gần giống như trong word Bạn cũng
có thể căn chỉnh, kéo giãn... Để đưa một ảnh vào Web cách đơn giản nhất là từ
cửa sổ Window bạn nhấn CTRL+C để copy file ảnh. Vào trong Frontpage bạn nhấn
CTRL+V để dán lên Web. Bạn cũng có thể làm thế với Word đúng không? Cả hai
chương trình đều cho Kết quả xử lý giống nhau chỉ có điều web thì không lưu trữ
luôn bức ảnh vào bản thân nó như Word mà nó chỉ có nhiệm vụ đưa địa chỉ file ảnh
đó cho trình duyệt web và bảo trình duyệt cách phải hiển thị ảnh đó. Tất cả chỉ
có thế mà thôi.
Trong quá trình làm web nếu lỡ làm sai bạn có thể Undo(nhấn CTRL+Z) (làm
ngược lại thao tác sai), tới 20 lần. và với Frontpage 2003 bạn có thể Undo trong
mọi tình huống bất kể bạn đang trong chế độ soạn thảo nào hoặc ngay cả khi bạn
chuyển chế độ vẫn có thể undo lại. Đây là một sức mạnh được đánh giá cực cao vì
mọi phiên bản trước nếu muốn undo bạn phải đưa đúng về chế độ soạn thảo đã dùng
vì thế nhiều khi bạn mất toi một trang web đấy!
Bạn nhớ là phải nhấn Ctrl+S (Save) để thường xuyên lưu lại đề phòng mất điện nhé!
Sau khi nhấn Ctrl+Sbạn vẫn có thể undo như thường.
Frontpage 2003 có rất nhiều mẫu web đẹp, nếu muốn có các mẫu độc đáo hơn bạn có
thể tìm chúng trên mạng Internet hoặc vào các website chuyên cung cấp mẫu
web(bạn vào "thư viện Web" tìm). Sau đó bạn đem về chỉnh sửa theo ý thích
Toàn bộ hướng dẫn trên tuy không hết các chức năng cơ bản của Frontpage nhưng
cũng đủ để bạn làm một trang web thú vị rồi đó! Thêm chút mày mò bạn sẽ tạo ra
được cho mình một Website có một không hai đấy!
Nếu đọc kỹ bạn sẽ thấy hướng dẫn trên có tính tổng quát, gợi mở. Nó đã gần như
bao hàm hầu hết các thao tác cơ bản trong sử dụng Frontpage2003. Cuối cùng là
phụ thuộc vào tính sáng tạo, sự mày mò tìm hiểu của bạn.
Để được hướng dẫn chi tiết, Bạn nên tìm đọc các sách sau:
Học Win XP: Sách Hướng dẫn học và sử dụng windowsXP cho người mới bắt đầu-Phan
Minh Ngọc
Học Office, học Frontpage, học đồ họa: tìm sách của nhóm tác giả MK PUP - NXB
Minh Khai- TP HCM.
Các sách này có thể tìm mua tại các hiệu sách tự chọn. tuy nhiên giá khá đắt.
Bạn có thể tìm chúng trong các thư viện trường, thư viện thành phố...Thư viện
của các trường đại học có ngành CNTT chắc chắn có các sách này!
Chuyện bên lề:
Trong phần này bạn đã thấy tôi nhắc rất nhiều đến các kiến thức về tin học căn
bản trong trường học. Bạn thấy tác dụng rất to lớn của nó rồi đấy. Và đừng bao
giờ đặt ra câu hỏi học MS-DOS làm gì, học NC làm gì nữa nhé! (Tôi đã nói câu này
không dưới một lần và nghe bạn bè than cả trăm lần. Giờ thì biết rồi nên lại
phải quay ra học lại!)
Mà không chỉ có những môn ấy đâu, tất cả những gì các bạn đang học chính là hành
trang cho bạn bước vào đời. Nó cũng giống như những thứ bạn mang theo khi đi leo
núi. Mang theo một cây gậy có thể chẳng bao giờ bạn dùng đến nhưng nếu có chuyện không may xảy ra thì cây gậy ấy có thể sẽ cứu tính mạng của bạn đó!
Để nắm vững nội dung hướng dẫn này quả thật cũng không phải đơn giản nếu bạn mới
bắt đầu! có lẽ chúng ta nên dừng ở đây cho đỡ lan man! Hy vọng bạn sẽ hài lòng
với trang web vừa tạo ra. Chúc bạn thành công !
Để tìm hiểu sâu hơn về FrontPage, hãy Click here
|
Tổng lượt truy cập:
|
Mục lục | Trang trước | Trang tiếp | Lên trên
Copyright © 2004 For You And For Me http://web.good.to