THIẾT KẾ WEB VỚI FRONTPAGE

Chia sẻ: Nguyen Duy Tuong | Ngày: | Loại File: PDF | Số trang:11

Thêm vào BST

Báo xấu

437
lượt xem 156
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

Chuẩ n bi:̣ Máy của bạn cần cài phần mềm Frontpage trong bộ Office Giao diện gồ m: một Banner, vài hình ảnh, một vài ca khúc yêu thích, nội dung web... Tự u chung lại Bồ Câu sẽ thự c hiện vơi chính ́ website của minh để mọi ngươi tham khảo nhé. ̀ ̀ Bắ t đầ u: Một Banner đượ c thiết kế chiều rộng khoảng 800 x 150 pixels, một file hình làm nền Cells có chiều rộng 800 x 4 pixels, hoặc một file hình nhỏ khác làm nề n web, tấ t cả các...

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: THIẾT KẾ WEB VỚI FRONTPAGE

THIẾT KẾ WEB VỚI FRONTPAGE BIÊN SOẠN: NGUYỄN DUY TƯỞNG Thiế t kế website dễ dàng vơi MS Frontpage (cơ bản) ́ Chuẩ n bi:̣ Máy của bạn cần cài phần mềm Frontpage trong bộ Office Giao diện gồ m: một Banner, vài hình ảnh, một vài ca khúc yêu thích, nội dung web... Tự u chung lại Bồ Câu sẽ thự c hiện vơi chính ́ website của minh để mọi ngươi tham khảo nhé. ̀ ̀ Bắ t đầ u: Một Banner đượ c thiết kế chiều rộng khoảng 800 x 150 pixels, một file hình làm nền Cells có chiều rộng 800 x 4 pixels, hoặc một file hình nhỏ khác làm nề n web, tấ t cả các hình ảnh phải được đưa vào thư mục ...\My Documents\My Web Sites\images. Nội dung cần chuẩn bị sẵn lưu bằng file word trong My Web Sites là được. Việc đầu tiên bạn mở Frontpage lên, trang trắng mặc định có tên new_page_1.htm. Bạn chưa cần quan tâm, nhấn chuột phải vào nền trang bắt đầu tạo các mục cơ bản cho website: chọn Page Properties > General thẻ này nếu bạn muốn có âm thanh nổi lên ngay khi khách mở trang, thì bạn chọn mục Browser tại Background sound, nên dùng file âm thanh .midi cho nhẹ và chuẩn bị sẵn trong thư mục my web sites. Tại thẻ Formatting chọn màu nền trang, hoặc có thể dùng file ảnh để làm nền ngay mục Browser của Background picture. Thẻ Advanced bạn chỉnh phần Magrins =0 hết thảy, thẻ custom mục add bạn có thể nhập tên và một số từ khoá nội dung web. Sang thẻ language > chọn Unicode (UTF-8) và nhấn OK. 1 lytuongspk@gmail.com
__________________________________________ Tiếp đến phần tạo bảng cho web cực kỳ quan trọng, nếu bạn muốn định dạng trang web của mình luôn luôn thể hiện giữa màn hình. Thao tác rất đơn giản, nhấn vào Table > Insert để tạo bảng cho web, chọn trong size cột, hàng. Phần Alignment chọn center, Float: Default, đánh dấu kiểm Specify width: gõ vào 800 In pixels. Phần dưới chọn background picture > Browser tìm hình nền và nhấp OK. Vậy là xong phần tạo bảng của web, lúc này bạn nên save as bằng tên dễ nhớ như web_mau chảng hạn. 2 lytuongspk@gmail.com
Tiếp đến bạn chèn banner bằng cách dùng chuột nhấn vào dòng đầu tiên, định dạng giữa tất cả rồi vào insert > picture > From file, chọn banner có sẵn trong images (Nếu bạn để hình ảnh nơi khác, khi lên mạng website sẽ không thể hiện hình ảnh vì thiếu đường dẫn). Làm chữ chạy Marquee Ở dòng thứ hai bạn nhấn vào Insert > Insert web Component > chọn Marquee > Finish bảng mới hiện ra mục text gõ dòng chữ: Welcome to Company (tuỳ ý), nhấn OK. (Nhấn vào Preview góc trái màn hình để xem trước các hiệu ứng web) Tạo nút Button tuỳ biến Đến phần nội dung và danh mục địa chỉ web, bạn cần chia dòng thứ ba thành hai cột bằng cách nhất chuột vào vùng cần chia, sau đó vào Table > Split Cells > OK. Định vùng cho ô danh mục bằng cách nhấn chuột phải vào vùng, chọn Cell Propreties > đánh dấu kiểm vào Specify gõ vào 140pixels > OK. Lúc này ta được phía trái 140 pixels, phía phải 660 pixels. 3 lytuongspk@gmail.com
Vào Format > Paragraph > định dạng Align Right, chọn tất cả các mục khác = 0, chuẩ n bị làm button cho danh mục web. Chọn Insert > Interactive Button, bảng mới hiện ra bạn chọn kiểu Button ưng ý, cỡ chữ, size... tuỳ thích! Phầ n text button bạn thay vào nội dung Trang chủ, mục link bạn gõ vào đầy đủ địa chỉ trang web, nhấ n OK. Bạn làm tiế p các nút Button khác tiế p theo, phầ n text thay thế tương ưng vơi đia chỉ web... ́ ́ ̣ Đế n đây cơ bản bạn đã có một trang mẫu "rỗng", nội dung bây giơ bạn sẽ phải nhập ̀ vào cho đúng và lưu lại bằng cách đặt tên cho file với địa chỉ web sau này thể hiện. Tạo trang nghe nhạc Vơi trang rỗng mẫu ơ trên, bạn có thể chèn window media player để nghe nhạc, xem ́ ̉ video... bằ ng cách: đặt chuột nơi muố n chèn > Insert > Web Component > Advanced Ctrols - ActiveX Ctrols > Next > dùng chuột kéo xuống phía dưới cùng chọn mục Window Media Player, nế u không thấ y bạn nhấ n vào thẻ Customize > chọn trong đó và nhấn OK. Màn hình WMP quen thuộc xuấ t hiện, bạn click đôi vào nó bảng Media Properties hiện ra, trong phầ n URL bạn dùng bấ t cư một link nhạc nào còn xài đượ c và dán vào, thí ́ dụ: http://bocau.com.googlepages.com/KATYKATY.wma các mục Auto, volum... tuỳ 4 lytuongspk@gmail.com
thích chỉnh sửa rồi nhấn OK, (không cầ n phải đưa cả bản nhạc lên web) nế u muố n bạn copy lời ca khúc dán phía dưới nhìn cho chuyên nghiệp và nhấn Preview để nghe thư(máy có nối mạng internet). Nhơ lưu lại bằ ng tên amnhac vào trong My web sites. ̉ ́ Kế t nố i vơi Flash (.swf) ́ Cũng với trang rỗng đó bạn chèn flash vào bằng cách: (chuẩ n bi ̣ một file .swf) Đặt chuột nơi muố n chèn, vào Insert > Web Component > Advanced Ctrols > Plug in hoặc Movie in Flash Format > next chọn file .swf, có thể chỉnh chiều rộng, cao của flash và nhấ n Preview để xem thư. ̉ Còn nhiều chức năng khác như: mục phản hồi khách thăm web, ô tìm kiế m... các bạn có thể tìm hiểu thêm. Chắ c rằ ng ngươi mơi làm quen việc này sẽ rấ t bỡ ngỡ vơi việc ̀ ́ ́ đăng ký tên miề n, hosting và xuấ t bản website. Các bạn cứ yên tâm thiết kế web, có gì chưa hiể u xin mạnh dạn hỏi sẽ có ngươi giúp đỡ bạn. ̀ Tổ ng kế t Một trang web đơn lẻ không thể thu hút khách tham quan, bạn phải làm nhiều trang khác nhau sau đó liên kết chúng lại tạo sự đa dạng và gây sự chú ý của mọi ngươi. ̀ Khi họ thăm trang của bạn họ sẽ tìm thấ y những điề u họ mong muố n và hơn thế nữa, lúc đó mới mong khách hàng của bạn quay trở lại để khám phá những điều mới mẻ và hấp dẫn do chính bạn tạo nên. Phím tắt dùng trong MS Fontpage Phím tắt Chức năng Ctrl + N tạo mới một trang web Ctrl + O mở một trang web Ctrl + F4 đóng một trang web 5 lytuongspk@gmail.com
Ctrl + S lưu một trang web Ctrl + P in một trang web F5 cập nhật, làm tươi nội dung một trang web Ctrl + Tab chuyển đổi qua lại giữa các trang Web Ctrl + Shift + B xem trang web bằng trình duyệt web Alt + F4 thoát khỏi Frontpage Ctrl + Shift + 8 hiển thị những ký tự không được in ra Ctrl + / hiển thị các thẻ HTML Ctrl + F tìm kiếm Ctrl + H thay thế F7 kiểm tra chính tả một trang web Shift + F7 tìm một từng đồng nghĩa Esc bỏ qua một thao tác đang thực hiện Ctrl + Z, Alt + trở về trạng thái trước khi thực hiện lệnh cuối BackSpace cùng Ctrl + Y, Shift + lùi lại trạng thái trước khi thực hiện Ctrl + Z Alt + BackSpace Định dạng ký tự và đoạn Phím tắt Chức năng Alt + Enter Hiển thị cửa sổ định dạng Font Ctrl + Shift + F thay đổi kiểu chữ (font) Ctrl + Shift + P thay đổi cỡ chữ Ctrl + B định dạng in đậm Ctrl + U định dạng gạch chân Ctrl + I định dạng in nghiêng Ctrl + dấu cộng định dạng chỉ số trên (bàn phím số) Ctrl + dấu trừ định dạng chỉ số dưới (bàn phím số) Ctrl + Shift + C sao chép định dạng Ctrl + Shift + V dán định dạng Ctrl + Shift + Z, xóa định dạng trở về định dạng mặc định 6 lytuongspk@gmail.com
Ctrl + phím cách Ctrl + E canh giữa đoạn Ctrl + L canh trái đoạn Ctrl + R canh phải đoạn Ctrl + M thụt lề đoạn từ biên trái Ctrl + Shift + M thụt lề đoạn từ biên phải Ctrl + Shift + S áp dụng một kiểu cho đoạn Ctrl + Shift + N áp dụng kiểu mặc định Ctrl + Alt + 1 áp dụng kiểu Heading 1 Ctrl + Alt + 2 áp dụng kiểu Heading 2 Ctrl + Shift + L áp dụng kiểu danh sách liệt kê Chỉnh sửa, di chuyển, xóa văn bản, hình ảnh. Phím tắt Chức năng Backspace () xóa một ký tự phía trước Delete xóa một ký tự phía sau con trỏ hoặc các đối tượng đang chọn Ctrl + Backspace xóa một từ phía trước () Ctrl + Delete xóa một từ phía sau Ctrl + C, Ctrl + sao chép một nội dung, hình ảnh Insert Ctrl + X, Shift + cắt một nội dung, hình ảnh Delete Ctrl + V, Shift + dán một nội dung, hình ảnh Insert Shift + Enter chèn thêm một dòng trống Ctrl + Shift + chèn một ký tự không phải là khoảng trống Phím cách Thủ thuật thiết kế với FRONTPAGE 01.Kiểm tra các kết nối Để kiểm tra các đường link trên trang web thiết kế bởi FrontPage, hãy chắc chắn rằng bạn đang hiển thị trang web ở chế độ FrontPage Explorer. Kích vào nút Hyperlink Status trên ô Views. Sau vài giây, một danh sách các đường link trong trang web của bạn sẽ được hiển thị trong phần chính của cửa sổ FrontPage Explorer. Để bắt đầu việc kiểm tra các kết nối, sử dụng menu Tools > Recalculate Hyperlinks. FrontPage sẽ kết nối vào Internet và truy cập vào tất cả các site bạn link tới. Quá trình kiểm tra này sẽ hiện ra ở thanh trạng thái phía dưới cửa số FrontPage Explorer. 02. Hiển thị banner quảng cáo Hãy marketing cho doanh nghiệp của bạn bằng việc bổ sung Nội dung web tự động (Automatic Web Content) vào trang web của bạn với bCentral Banner Ad của Microsoft. Với mỗi hai quảng cáo bạn đăng trên trang của mình, bạn sẽ có được một banner quảng cáo của chính bạn trên một site của thành viên khác. 7 lytuongspk@gmail.com
Để đưa một Banner Ad vào website của mình từ bCentral, mở hoặc tạo một trang web với Microsoft FrontPage version 2002 và làm theo các bước sau: - Trong chế độ hiển thị trang (Page view), chọn Web Component từ menu Insert, - Dưới mục Component Type, chọn bCentral Web Components, - Dưới mục Choose a bCentral component: chọn bCentral Banner Ad, - Kích Finish. Cửa sổ bCentral Banner Ad Properties sẽ hiện ra. Làm theo các chỉ dẫn trong LinkExchange Banner Network wizard để trao đổi và tạo ra banner quảng cáo của bạn. 03. Tạo ra một trang điều tra trực tuyến Hãy sử dụng Microsoft FrontPage 2002 để tạo và thêm một trang điều tra trực tuyến động với các nút, hộp kiểm và menu sổ có sẵn. Người sử dụng website của bạn có thể tham gia điều tra từ trình duyệt của họ và có thể xem kết quả từ trang hiển thị tự động dưới dạng đồ thị. Bạn có thể đơn giản hoá trang điều tra của mình bằng các tệp mẫu (template) hoặc tạo ra một điều tra mới chỉ trong vài giây với New Survey Wizard. Các trang điều tra trực tuyến động có thể được thực hiện từ dịch vụ SharePointT Team Services của Microsoft. Để tạo ra một trang web điều tra động, bạn có thể sử dụng New Survey Wizard, hãy mở một website của SharePoint bằng FrontPage 2002 và sửa trực tiếp trên máy chủ này theo hướng dẫn sau: - Trong chế độ hiển thị Folder List, chọn Lists, - Từ menu File, tới New và kích Survey, - Trong New Survey, chọn New Survey Wizard và kích OK, - Kích Next và gõ vào tên và mô tả nội dung điều tra, - Kích Next, chọn nút Add để đưa vào các câu hỏi, dạng thông tin và các câu trả lời lựa chọn. Kích Finish cho mỗi câu hỏi đặt ra. - Lặp lại bước thứ 5 cho tới khi tất cả có đủ các câu hỏi, sau đó kích Next, - Đặt quyền truy nhập là đọc, hiệu chỉnh và thay đổi (read, edit và modify) và lựa chọn các chế độ hiển thị, sau đó kích Finish. 04. Bổ sung thêm cơ sở dữ liệu Database Interface Wizard trong Microsoft FrontPage 2002 là một tiện ích cho phép bạn tạo ra hệ thống cơ sở dữ liệu trong website của mình, bao gồm một cơ sở dữ liệu, mẫu biểu và các trang web cần thiết. Với một giao diện web của cơ sở dữ liệu của bạn, người sử dụng có thể hiệu chỉnh hoặc xoá các bản ghi (record) từ cơ sở dữ liệu thông qua trang web được tạo bởi Database Interface Wizard. Và bạn cũng có thể cho phép người sử dụng bổ sung thêm các bản ghi và hiển thị các bản ghi có sẵn cũng như đặt các chế độ lọc cơ sở dữ liệu để nhanh chóng tìm ra dữ liệu cần thiết. Để bổ sung thêm chức năng cơ sở dữ liệu trong website của bạn bằng FrontPage 2002, hãy làm theo các bước sau: - Chọn menu File > New > Page or Web 8 lytuongspk@gmail.com
- Từ cửa sổ Task Pane, chọn Web Site Templates - Kích vào Database Interface Wizard - Chọn Add to current Web box và kích OK, sau đó làm theo hướng dẫn để tạo lập cở sử dữ liệu và trang web. 05. Thay đổi chế độ mặc định Khi bạn chạy Microsoft FrontPage 2002, chương trình này sẽ tự động mở lại tệp mà bạn đã làm việc cuối cùng trong phiên hoạt động trước. Bạn có thể bỏ chế độ này như sau: - Chọn menu Tools > Options - Kích tab General và bỏ chọn Open last Web automatically when FrontPage starts Lại nói vế thiết kế web với Front Page . Kiểm tra các kết nối Để kiểm tra các đường link trên trang web thiết kế bởi FrontPage, hãy chắc chắn rằng bạn đang hiển thị trang web ở chế độ FrontPage Explorer. Kích vào nút Hyperlink Status trên ô Views. Sau vài giây, một danh sách các đường link trong trang web của bạn sẽ được hiển thị trong phần chính của cửa sổ FrontPage Explorer. Để bắt đầu việc kiểm tra các kết nối, sử dụng menu Tools > Recalculate Hyperlinks. FrontPage sẽ kết nối vào Internet và truy cập vào tất cả các site bạn link tới. Quá trình kiểm tra này sẽ hiện ra ở thanh trạng thái phía dưới cửa số FrontPage Explorer. Hiển thị banner quảng cáo Hãy marketing cho doanh nghiệp của bạn bằng việc bổ sung Nội dung web tự động (Automatic Web Content) vào trang web của bạn với bCentral Banner Ad của Microsoft. Với mỗi hai quảng cáo bạn đăng trên trang của mình, bạn sẽ có được một banner quảng cáo của chính bạn trên một site của thành viên khác. Để đưa một Banner Ad vào website của mình từ bCentral, mở hoặc tạo một trang web với Microsoft FrontPage version 2002 và làm theo các bước sau: - Trong chế độ hiển thị trang (Page view), chọn Web Component từ menu Insert, - Dưới mục Component Type, chọn bCentral Web Components, - Dưới mục Choose a bCentral component: chọn bCentral Banner Ad, - Kích Finish. 9 lytuongspk@gmail.com
Cửa sổ bCentral Banner Ad Properties sẽ hiện ra. Làm theo các chỉ dẫn trong LinkExchange Banner Network wizard để trao đổi và tạo ra banner quảng cáo của bạn. Tạo ra một trang điều tra trực tuyến Hãy sử dụng Microsoft FrontPage 2002 để tạo và thêm một trang điều tra trực tuyến động với các nút, hộp kiểm và menu sổ có sẵn. Người sử dụng website của bạn có thể tham gia điều tra từ trình duyệt của họ và có thể xem kết quả từ trang hiển thị tự động dưới dạng đồ thị. Bạn có thể đơn giản hoá trang điều tra của mình bằng các tệp mẫu (template) hoặc tạo ra một điều tra mới chỉ trong vài giây với New Survey Wizard. Các trang điều tra trực tuyến động có thể được thực hiện từ dịch vụ SharePointT Team Services của Microsoft. Để tạo ra một trang web điều tra động, bạn có thể sử dụng New Survey Wizard, hãy mở một website của SharePoint bằng FrontPage 2002 và sửa trực tiếp trên máy chủ này theo hướng dẫn sau: - Trong chế độ hiển thị Folder List, chọn Lists, - Từ menu File, tới New và kích Survey, - Trong New Survey, chọn New Survey Wizard và kích OK, - Kích Next và gõ vào tên và mô tả nội dung điều tra, - Kích Next, chọn nút Add để đưa vào các câu hỏi, dạng thông tin và các câu trả lời lựa chọn. Kích Finish cho mỗi câu hỏi đặt ra. - Lặp lại bước thứ 5 cho tới khi tất cả có đủ các câu hỏi, sau đó kích Next, - Đặt quyền truy nhập là đọc, hiệu chỉnh và thay đổi (read, edit và modify) và lựa chọn các chế độ hiển thị, sau đó kích Finish. Bổ sung thêm cơ sở dữ liệu Database Interface Wizard trong Microsoft FrontPage 2002 là một tiện ích cho phép bạn tạo ra hệ thống cơ sở dữ liệu trong website của mình, bao gồm một cơ sở dữ liệu, mẫu biểu và các trang web cần thiết. Với một giao diện web của cơ sở dữ liệu của bạn, người sử dụng có thể hiệu chỉnh hoặc xoá các bản ghi (record) từ cơ sở dữ liệu thông qua trang web được tạo bởi Database Interface Wizard. Và bạn cũng có thể cho phép người sử dụng bổ sung thêm các bản ghi và hiển thị các bản ghi có sẵn cũng như đặt các chế độ lọc cơ sở dữ liệu để nhanh chóng tìm ra dữ liệu cần thiết. Để bổ sung thêm chức năng cơ sở dữ liệu trong website của bạn bằng FrontPage 2002, hãy làm theo các bước sau: - Chọn menu File > New > Page or Web - Từ cửa sổ Task Pane, chọn Web Site Templates 10 lytuongspk@gmail.com
- Kích vào Database Interface Wizard - Chọn Add to current Web box và kích OK, sau đó làm theo hướng dẫn để tạo lập cở sử dữ liệu và trang web. Thay đổi chế độ mặc định Khi bạn chạy Microsoft FrontPage 2002, chương trình này sẽ tự động mở lại tệp mà bạn đã làm việc cuối cùng trong phiên hoạt động trước. Bạn có thể bỏ chế độ này như sau: - Chọn menu Tools > Options - Kích tab General và bỏ chọn Open last Web automatically when FrontPage starts 11 lytuongspk@gmail.com