Thiết kế Web ONE PAGE ppt

Bạn phải tạo 1 Folder Web , trong đó chứa các Folder và Files cần thiết của nội dung Trang Web.. Trong Trang nầy có hiện diện vài Hình – Vài Links để khi nhấp lên nó sẽ Siêu Liên Kết đến

Trang 1

BÀI 1 NGÀY 12.11.2008 UTBINH SOẠN THEO KS NGUYỄNTRƯỜNGSINH Utbinh đã viết Giáo Trình FRONT PAGE 2003 nầy 2 lần rồi Lần đầu trong lúc học Photoshop với Nguyên Nhã tháng 6 năm 2005 Lần 2 , utbinh tự biên soạn Giáo Trình 45 bài Front Pages kể từ tháng 3.2006 Từ đó đến nay đã hơn 2,5 năm utbinh

đã tự tìm tòi , nghiên cứu rộng các bộ môn của Tin Học và đã viết được nhiều Bài Hướng dẫn Thiết Kế Web EXPRESSION WEB trong bộ Office 2007 Tuy nhiên utbinh

đã nhận được trên 100 thư của đọc giả xin Links của các bài viết Front Page 2003

Có lẻ những bài viết nầy đọc dễ hiểu và dễ thực hành nên có nhiều bạn cùng tìm hiểu như utbinh vậy ? Nhưng khi utbinh đọc lại thì thấy các bài viết còn thiếu sót rất nhiều , rất ngây ngô , không có bố cục mạch lạc , viết chưa đầy đủ hết các chức năng của Bộ Thiết Kế Web Front Page 2003 Bài viết còn thiếu nhiều chi tiết chưa

đề cập đến ( Do utbinh ít thời gian và do kiến thức còn hạn hẹp ) Do đó utbinh đã bắt đầu tiến hành biên soạn Giáo Trình nầy lần thứ 3 ( Tháng 11.2008 ) không ngoài mục đích : Tự ôn lại , tự tìm hiểu thêm vì bắt gặp sách hay để tham khảo viết bài : THỰC HÀNH THIẾT KẾ TRANG WEB VỚI MICROSOFT FRONTPAGE của KS Nguyễn Trường Sinh Cộng với quá trình tự học hỏi Tin Học trong 2,5 rưởi vừa qua có đôi chút tiến bộ , utbinh hy vọng rằng sẽ làm vừa lòng các bạn trẻ ham học hỏi , có chí cầu tiến sẽ lãnh hội được những gì utbinh muốn truyền đạt lại cho giới trẻ Việt Nam thân yêu của utbinh utbinh vốn không tốt nghiệp bài bản trường lớp nào cả nhưng với lòng đam mê tin học , cái nào cũng muốn ôm vào lòng vì thấy cái nào cũng hay hết , tự học , cho nên chắc chắn các bài viết nầy sẽ có nhiều thiếu sót trầm trọng mong các bạn bổ sung cho utbinh chỉ có 1 tấm lòng là muốn phục vụ cho các bạn trẻ có cơ hội học hỏi của người “ ÍT DỞ HƠN MÌNH “ mà thôi Nói rõ nghĩa : Người

DỞ viết cho người DỞ HƠN MÌNH đọc ( Thư cho utbinh : utbinhdesign@gmail.com ) Trong Giào Trình biên soạn kỳ nầy mỗi bài có 2 phần : Phần Lý Thuyết và Phần Thực Hành Các bạn có thể bắt chước Phần Thực Hành để tự Thiết Kế Trang Web cho mình Bạn phải tạo 1 Folder Web , trong đó chứa các Folder và Files cần thiết của nội dung Trang Web Điều quan trọng là bạn phải có 1 Host Server để chứa Folder Web nầy khi bạn Upload nó lên Host Server có thể do bạn mua hoặc sử dụng Host Free Trước đây utbinh dùng : www.freewebtown.com rất tốt , nay nó không cho IP Việt Nam xài free nửa

I.PHẦN LÝ THUYẾT

Trang 2

Bài nầy hướng dẫn các bạn tạo Trang Web có duy nhất 1 Trang Trong Trang nầy có hiện diện vài Hình – Vài Links để khi nhấp lên nó sẽ Siêu Liên Kết đến Trang Web khác - Bạn tự gỏ nhập Text và Format chúng giống như sử dụng Word – Copy và Paste văn bản Bạn tạo 1 Folder Web đặt tại Desktop Trong Folder nầy có : 1 Folder ( Chứa Hình Ảnh ) và 1 Folder private ( Chứa các vấn đề riêng tư , ở đây là các văn bản cần phổ biến ) và 1 File : index.html Bạn cần tìm 1 Host Free để Upload Folder Web nầy lên Host Server hoặc mua 1 Host Sau khi Upload hoàn tất bạn lấy Link của File : index.html dán lên Thanh Địa Chỉ của Trình duyệt để hiện ra Trang Web Trang Chủ ( Home Page )

1 Mở Microsoft FrontPage 2003 > Nếu Ô Tác Vụ New không mở , bạn chọn File

> New > Ô Tác Vụ New sẽ mở ra

2 Nhấp Mục : More Web Site Templates > Hiện ra Bảng Web Site Templates , chọn biểu tượng : One Page Web site (H1).

FrontPage (FP) cung cấp cho bạn 1 Folder chứa các Websites của bạn , có tên

là My Web Sites Folder nầy nằm trong Folder My Documents Website của bạn tạo ra cần phải đặt tên cho nó và chọn vị trí cho nó

3 Trong vùng Options , nhấp nút Browse > Bảng New Web Site Location xuất hiện > Trên thanh Places , nhấp Folder My Documents > Trong danh sách Files nhấp đúp Folder My Web Sites (H2)

Trang 3

4 Trên thanh công cụ của Bảng New Web Site Location , nhấp Nút Create New Folder > Bảng New Folder hiện ra , nhập : One Page trong hộp name > Ok (H3).

5 Trong Bảng New Web Site Location , nhấp Open

6 Trong Bảng Web Site Templates , nhấp Ok (H4).

7 FP hiện ra cấu trúc của Website MỘT TRANG ( ONE PAGE ) mới được tạo ra

Trang 4

8 Website One Page bao gòm :

• 1 File có tên : index.htm.

• 1 Folder trống ( chưa có chứa dữ liệu ) có tên : _private.

• 1 Folder trống ( chưa có chứa dữ liệu ) có tên : images.(H5).

Tuy nhiên nếu quan sát Folder của Site trong Microsoft Windows Explorer , bạn

sẽ thấy nhiều Files và Folders ( Một số bị ẩn ) hổ trợ cho trang nầy

Trong Folder List ( Cột Trái ) , nhấp đúp File : index.htm > Đã mở Chế độ hiển thị Page là 1 Khung nền trống , bạn sẽ tạo ra nội dung trên đó

II.PHẦN THỰC HÀNH

I.CHUẨN BỊ :

1 HÌNH ẢNH :

Bạn chọn vài Hình Ảnh cần Insert vào Trang Web để minh họa cho đoạn văn bản hoặc bố trí tạo mỹ thuật cho Trang Web nầy Những hình nầy nên có kích

cở từ 200 X 300 pixels do đó dung lượng khoảng 40 – 60 KB mà thôi vì nếu quá lớn khi Upload và Download sẽ mất nhiều thời gian Sau đó bạn Copy > Paste vào Folder images

Cách lấy Hình Quảng cáo FrontPage 2003 : Vào www.google.com.vn > Nhấp Hình ảnh > Nhập : FrontPage 2003 > Ra kết quả nhiều Hình , nhấp chọn 1

Trang 5

Hình > Nhấp Xem hình cở đầy đủ > Nhấp Phải lên Hình > Save As Images > Chọn lưu tại Desktop

2 VĂN BẢN :

Bạn cần chọn vài văn bản tâm đắc > Copy > Paste vào Foldre _privates Đúng

ra thì Folder nầy chỉ chứa những tâm sự riêng tư của bạn , rồi insert vào Trang Web để Public cho bạn đọc nhưng bài viết nầy nêu nội dung Tin Học để làm ví

dụ trong bài Thiết kế Web One Page ( Một Trang )

3 LINKS LIÊN KẾT :

Bạn tạo 1 File doc tại Desktop chứa các Links liên kết tâm đắc muốn giới thiệu cho đọc giả thưởng thức Khi đọc giả nhấp lên Links Siêu Liên Kết

( Hyperlink ) sẽ dẫn đến Trang Web cần đọc Nội dung có thể là : Vài File Videos – Vài Files Nhạc MP3 – Vài Files Flash

II.THIẾT KẾ TRANG WEB ONE PAGE :

Nhấp Đúp lên File : index.htm trong Cột Folder List > Hiện ra Trang trống là Vùng Làm Việc nơi bạn sẽ nhập nội dung thiết kế Trang Web One Page

1 INSERT HÌNH :

• Nhấp con trỏ nơi bạn chỉ định sẽ hiện ra Hình > Nhấp Nút : Insert Picture From File > Hiện ra Bảng Picture > Chọn 1 Hình ( Những Hình nầy đã nằm trong Folder images mà bạn đã đưa vào ) > Insert > Đã hiện ra Hình vừa chọn trong Vùng Làm Việc Bạn có thể Rê nút để bung lớn hay thu nhỏ Hình lại (H6)

Trang 6

• Bạn cũng có thể Rê Hình nầy đặt vào bất cứ vị trí nào bạn muốn bằng cách : Nhấp Phải lên Hình > Chọn Show Picture ToolBar > Chọn Công Cụ Position Asolutely Đây là Thanh Công cụ cho bạn Format lại Hình nầy

2 INSERT TEXT :

• Bạn có thể tự nhập văn bản trong Vùng Làm Việc và Format lại chúng giống như trong Word vậy (H8)

• Nhấp Folder _privates trong cột Folder List > Hiện ra các bài Text mà bạn đã dán vào (H9)

Trang 7

• Chọn 1 File doc nầy ( Ghost ) > Ctrl+A chọn hết văn bản nầy > Ctrl+C

để Copy > Ctrl+V để Paste vào Vùng Làm Việc > Hiện ra văn bản với định dạng gốc > Bạn có thể Foramt lại văn bản nầy theo ý muốn , thao tác giống như trong Word vậy (H10).

• Chọn 1 File doc nầy (TẠO DỈA CD và MP3) > Ctrl+A chọn hết văn bản nầy > Ctrl+C để Copy > Ctrl+V để Paste vào Vùng Làm Việc > Hiện ra văn bản với định dạng gốc > Bạn có thể Foramt lại văn bản nầy theo ý muốn , thao tác giống như trong Word vậy (H11).

Trang 8

• Chọn 1 File doc nầy (FAVORITE WEBS) > Ctrl+A chọn hết văn bản nầy

> Ctrl+C để Copy > Ctrl+V để Paste vào Vùng Làm Việc > Hiện ra văn bản với định dạng gốc > Bạn có thể Foramt lại văn bản nầy theo ý muốn , thao tác giống như trong Word vậy (H12).

Trang 9

3 SAVE : Mỗi khi thiết kế xong 1 phần , bạn nhớ Save lại để đề phòng cúp điện hay Delete nhầm bằng cách nhấp Nút Save trên thanh Công Cụ hay Phím Ctrl+S

4 THỰC HIỆN HÌNH VÀ TEXT TIẾP THEO :

Bạn áp dụng các bước giống trên khi Insert Hình và Text tiếp theo và nhớ Save lại khi xong 1 phần

5 CÁCH LẤY LINKS VIDEO CLIPS CHO TUTORIALS FRONTPAGE 2003 :

• Vào : www.google.com.vn > Nhập : you tube > Nhấp lên Trang Web đầu tiên > Ra Trang YOU TUBE , nhập : FrontPage 2003 > Enter > Hiện ra các Video Clips với chủ đề nầy > Nhấp lên 1 Video Clips > Hiện ra Khung Preview đang Play

• Nhấp Phải bên ngoài Khung Preview > Chọn Download FLV video with requested FLV video > Ra bảng Download File Info > Bạn lấy Link trong hàng URL và dán vào : www.tinyurl.com đề lấy Link rýt ngắn (H13).

Trang 10

Như vậy là bạn đã thiết kế xong Trang Web One Page ( Một Trang ) với các nội dung đơn giàn

 Tất cả Hình Ảnh cần Insert vào bạn nên đặt trong Folder images.

 Tất cả Văn bản cần Insert vào bạn nên đặt trong Folder _privates.

Trong bài viết nầy đã hướng dẫn các bạn cách :

 Copy > Paste các đoạn Văn Bản vào Vùng Làm Việc và Format lại

 Insert Hình vào và chỉ định vị trí chèn hình

 Insert Văn Bản và Format lại theo ý mình

 Nhập các đoạn Văn Bản bằng cách gỏ phím

Trang 11

 Trong Văn Bản có sẵn Links Siêu Liên Kết ( Hyperlinks ) để đọc giả nhấp lên sẽ

đến Trang Web khác thể hiện nội dung muốn đọc

 Cách lấy Links Các Tutorials FP trong YOU TUBE

 Save : Mỗi khi xong 1 Phần bạn nhớ save lại đề phòng cúp điện hay nhấp lầm

Phím Delete bằng cách nhấp Nút Save hay dùng Ctrl+S

III.XUẤT BẢN TRANG WEB LÊN HOST SERVER

Khi bạn đã thiết kế xong Trang Web ONE PAGE , bạn cần Upload nó lên Host Server

để lấy Links của Trang Web nầy Bạn dán nó lên Thanh Asddress của Trình Duyệt ( Browse ) để nó hiện ra nội dung hoặc gởi Link nầy đến bạn hữu xem Muốn làm được điều nầy bạn phải trải qua 2 công đoạn :

1 Bạn phải đăng ký tạo 1 Account Free hay mua utbinh sẽ giới thiệu cho các bạn và hướng dẫn Download , cài đặt và sử dụng 1 Host Server Free để bạn thực tập tạo Trang Web One Page nầy Đó là : www.110mb.com (Xem bài sau )

2 Upload Trang Web lên Host bằng giao thức FTP Bạn Download phần mềm : cuteftp.pro.v8.3.2.build.09.02.2008.1-nope về cài đặt và sử dụng để upload Utbinh sẽ hướng dẫn Download , cài đặt và sử dụng Software nầy (Xem bài sau )

3 Vị trí đã lưu Folder One Page : Theo mặc định của FrontPage , bạn đã lưu theo đường dẫn sau đây :

My Documents\My Web Sites \ One Page Trong Folder One Page , bạn có :

- 1 File index.htm.

- 1 Folder images.

- 1 Folder _privates.(H14).

4 Khi bạn nhấp lên File : index.htm sẽ hiện ra nội dung Trang Web One Page nầy Các nội dung nầy hiện nằm trong Ổ Cứng của Bạn ( Local Site )

5 Theo ý kiến của utbinh , để tiện việc trực quan theo dỏi bạn nên Copy > Paste Folder One Page ( Folder Web ) đặt tại Desktop > Rename nó đặt tên : site121108 ( Ngày thiết kế trang Web nầy )

Trang 12

PHƯƠNG PHÁP TỰ HỌC :

VÔ : WWW.GOOGLE.COM.VN , NHẬP : FRONTPAGE 2003 > CHỌN NHỮNG TRANG WEB TIẾNG VIỆT > ENTER RA KẾT QUẢ : khoảng 107.000 Tiếng Việt trang cho FRONTPAGE 2003 (0,14 giây) BẠN VÀO NHỮNG TRANG WEB NẦY ĐỌC VÀ DOWNLOAD VỀ TỰ HỌC

Microsoft Frontpage 2003

Tuesday, 9 September 2008, 08:33:33

Download FrontPages 2003 Link Direct

http://data.vietsitecom.net/files/Soft/Office/FRONTPAGE2K3/FrontPage2k3.part1.rar http://data.vietsitecom.net/files/Soft/Office/FRONTPAGE2K3/FrontPage2k3.part2.rar http://data.vietsitecom.net/files/Soft/Office/FRONTPAGE2K3/FrontPage2k3.part3.rar http://data.vietsitecom.net/files/Soft/Office/FRONTPAGE2K3/FrontPage2k3.part4.rar

Dowload Frontpage 2003 part 04

Pass giải nén : vietsitecom.net

CDKey : WFDWY-XQXJF-RHRYG-BG7RQ-BBDHM

NGÀY 12.11.2008 :

1.THIẾT KẾ WEB FRONTPAGE 2003 : ONE PAGE

<center><img src=http://utbinh.com/ANOV08/121108/FP111108.jpg></center> [img]http://utbinh.com/ANOV08/121108/FP111108.jpg[/img]

http://utbinh.com/ANOV08/121108/FP111108.jpg

Mời các bạn xem kết quả thực tập Trang Web One Page :

http://utbinh.com/ANOV08/121108/site121108/index.htm

http://kimtrang.110mb.com/site121108/index.htm

Trang 13

Download SOFTWARE : FrontPages 2003 Link Direct

http://data.vietsitecom.net/files/Soft/Office/FRONTPAGE2K3/FrontPage2k3.part1.rar http://data.vietsitecom.net/files/Soft/Office/FRONTPAGE2K3/FrontPage2k3.part2.rar http://data.vietsitecom.net/files/Soft/Office/FRONTPAGE2K3/FrontPage2k3.part3.rar http://data.vietsitecom.net/files/Soft/Office/FRONTPAGE2K3/FrontPage2k3.part4.rar

Dowload Frontpage 2003 part 04

Pass giải nén : vietsitecom.net

CDKey : WFDWY-XQXJF-RHRYG-BG7RQ-BBDHM

http://utbinh.com/ANOV08/121108/FP111108.doc

http://utbinh.com/ANOV08/121108/FP111108.pdf

DOC 1.27 MB – PDF 1.22 MB – JPG 1.44 MB

10 Bài Thiết kế Web FRONTPAGE 2003 utbinh soạn năm 2006 :

http://utbinh.com/ANOV08/121108/Bai1FRONTPAGE2003.doc

Files DOC thực tập tạo Web One Page :

Tạo Ghost 102 KB :

http://utbinh.com/ANOV08/121108/GHOST.doc

Ghi Dỉa CD và MP3 , 91 KB :

http://utbinh.com/ANOV08/121108/GHI_DIA_CD.doc

Favorite Webs 55 KB :

http://utbinh.com/ANOV08/121108/FAVORITE_WEBS.doc

Files JPG thực tập :

http://utbinh.com/ANOV08/121108/1.jpg

Tài liệu đọc thêm Thiết Kế Web FrontPage 2003 , 262 KB :

http://utbinh.com/ANOV08/121108/DOCTHEM_FP.doc

Softwares mới nhất ngày 11.11.2008 , 13.95 MB :

http://utbinh.com/ANOV08/121108/SOFTWARES111108.doc

Links Video Tutorials FrontPage 2003 :

How To Use Frontpage 2003 : http://tinyurl.com/6z9o3n

http://ash-v695.ash.youtube.com/get_video?

video_id=Vp5jhtW49qE&ip=58.186.196.172&signature=215674DFB72FD6A8A B6325F2EAF78B498A63C6B2.921B294388601782B6600D54A18DCCF967BD615 0&sver=2&expire=1226488058&key=yt4&ipbits=2

Ms FrontPage 2003 Tutorial : http://tinyurl.com/5w23fq

http://ash-v242.ash.youtube.com/get_video?

video_id=9ROVWyexN5g&ip=58.186.196.172&signature=30840BCF4E231EA93 52E9CB137C4A1C76D556C12.79AED8F6BE609EA3238EA6D75F3AE1E2C5BE77C 1&sver=2&expire=1226488103&key=yt4&ipbits=2

How to create your own web site Pt.1 : http://tinyurl.com/6gz9ek

Trang 14

http://208.117.253.99/get_video?origin=mia-v94.mia.youtube.com&video_id=fu8Prjh2j3A&ip=58.186.196.172&signature=0 A8F0D637E0D6CC1573F54B47305345460DDE5E6.9A1F985D1FE9D3E9021891A E3AA7632FD1468941&sver=2&expire=1226488708&key=yt4&ipbits=2&redire ct_counter=1

How to create your own web site Pt.2 : http://tinyurl.com/63bee3

http://mia-v144.mia.youtube.com/get_video?video_id=v-8eMBuL0A8&ip=58.186.196.172&signature=E046DE51C95B4E17395728C2197 82C139BB98B7C.5C2700177C344C92A001332D29F8A8D5B6459C&sver=2&exp ire=1226488183&key=yt4&ipbits=2

How to Upload Your Website to a Web Host : http://tinyurl.com/5mtrlb

http://mia-v83.mia.youtube.com/get_video?

video_id=t_qVIxVCAsY&ip=58.186.196.172&signature=98A159F1FE9522F48912F9 1E57A7CD50386798BE.95328B9ED34F653A712A63EC32544147880DE9D4&sver=2

&expire=1226488217&key=yt4&ipbits=2

Tiêu đề	Thiết Kế Web One Page
Tác giả	Utbinh
Người hướng dẫn	KS Nguyễn Trường Sinh
Trường học	Trường Đại Học
Chuyên ngành	Tin Học
Thể loại	Giáo trình
Năm xuất bản	2008
Thành phố	Việt Nam

Định dạng
Số trang	14
Dung lượng	1,29 MB