Giáo trình Thiết kế web

Nội dung text: Giáo trình Thiết kế web

1. Thi
   t k
   Web
2. N
   i dung Khám phá trang ch  (Home Page) 1 Internet - m
   t tp h p các ph n c ng 1 Khái ni m v  trang Web 1 Web site là gì? 2 Bn ch t c a các trang web 3 Hãy th to t p tin HTML 5 Tìm hi u v  HTML 5 Các siêu liên k t và các web sites 6 Tóm t t s  l c 7 Máy ch trên Internet 7 Tng k t bài h c 8 Câu h i ki m tra 9 Th c hành 9 To và nh d ng trang Web 11 Các y u t  v n b n c a m
   t trang Web 11 Thanh tiêu  11 N
   i dung 12 Siêu liên k t 13 Bi u tr ng, v n b n  h a và WordArt 13 Các l a ch n chuy n h ng v n b n thu n túy 13 Thông tin v  ngày tháng 14 Thông tin b n quy n 14 Các yêu c u thi t k  n
   i dung trang Web 14 Tng k t bài h c 15 Câu h i ki m tra 16 Th c hành 16
3. Thi
   t k
   Web S dng  h a trên trang Web 18 C ch   h a c a Web 18 nh i m, b ng màu và màu s c 18 Các d ng t p tin  h a 21 Các màu s c “an toàn” cho Web 22 nh JPEG 23 Kích c  nh 24 Thay i kích c   h a 24 nh kích c  hình nh 25 Ct xén hình nh 26 S dng hình thu nh  27 S d ng nh ch p 27 Tng k t bài hc 28 Câu h i ki m tra 29 Th c hành 29 Không gian l u gi 30 Kt n i Internet và không gian máy ch 30 Không gian tr c tuy n mi n phí 31 Mua không gian máy ch 32  ng ký a ch ! Web 32 Tìm không gian cho trang Web c a b n 33 Các công c  t o trang Web 33 Trình so n th o v n b n và trình so n th o HTML 34 Trình so n th o vn b n và HTML c b n 34 Trình so n th o v n b n và HTML thông th "ng 37 Các trình so n th o HTML chuyên sâu 37 Các ng d ng  ha 38 Các ti n ích FTP 39 Các trình duy t 40 Tng k t bài h c 41 Câu h i ki m tra 41 Th c hành 41 ii
4. Ni dung Lp k ho ch cho Website 43 Xác nh các m c tiêu 44 Tìm hi u v  ng "i xem 44 V# thi t k  chi ti t cho trang Web 46 Lu gi $ các t p tin 47 %t tên cho hình nh 48 Danh sách ki m tra l p k  ho ch cho trang Web 50 %t n n t ng cho trang ch 51 Danh sách ki m tra l p k  ho ch cho trang ch 52 Tp h p công c  và chu &n b  xây d ng 53 Danh sách ki m tra công c  54 Tng k t bài h c 54 Câu h i ki m tra 54 Th c hành 55 Tìm hi u ngôn ng HTML 57 Tp h p các “dng c ” c a d án 57 Ti sao dùng HTML? 58 C b n v  HTML 58 S d ng các th ' HTML 59 X lý các tài li u HTML và các  h a Web 64 Lu và xem tr c các tài li u HTML 64 Lp k ho ch cho trang HTML 65 Sp x p các th  m c và các  h a 67 Chu &n b  t p tin trang ch 68 Ch n màu n n và màu s c liên k t 70 To b ng 71 Chèn các liên k t bi u tr ng 74 Chèn  h a bi u ng $ trang ch 76 Thêm các liên k t chuy n h ng 77 Chèn thông tin vào cu i trang 80 Sao chép khung trang ch vào các trang ph  83 Chèn v n b n vào thân trang ch 88 To các  u  88 Thêm on v n b n 90 iii
5. Thi
   t k
   Web nh d ng các khóa trích d (n và tô màu v n b n 91 To danh sách các liên k t 93 Chèn m
   t b c nh có liên k t 96 Hoàn t t trang ch 97 S d ng m
   t trang ã có làm khung trang m (u 97 Các ngu n tài li u b  sung 99 Câu h i ki m tra 101 To trang Web v i FrontPage 103 Lp k  ho ch cho trang Web 104 To m
   t trang Web m i 106 To b  trí dàn trang cho trang ph  107 Thi t % t Page Properties 107 Lu công vi c c a b n 109 Thêm bi u tr ng và  h a bi u ng $ tiêu  109 Chèn b ng 112 Thêm nút chuy n h ng 116 Thêm thông tin cu i trang phía d i b ng 120 S d ng khuôn m (u trang ph   xây d ng trang Web 122 Chu &n b   t o các trang ph  123 Thêm v n b n và  h a thanh tiêu  124 Chèn m
   t hình nh thu nh  128 To b n  nh 130 To bi u m (u 132 Chu &n b  trang Liên h  132 Chèn m
   t vùng bi u m (u và thêm nhãn 133 To tr "ng bi u m (u 134 nh c u hình thu
   c tính tr "ng bi u m (u 135 %t tên các tr"ng 137 Hoàn thành trang liên h  138 To m
   t trang ch trong FrontPage 139 Thi t % t khung làm vi c c a Trang ch 139 Lp ráp  h a chính 141 To liên k t bên trong  h a chính 143 iv
6. Ni dung Thêm HTML 
   ng vào  h a chính 143 Chuy n trang Web lên Internet 149 Chuy n các t p tin c a b n lên Internet. 150 Các trình ng dng FTP 150 Các th  m c Web và My Network Places 153 To m
   t  a i m m ng s d ng My Network Places 155 To  a i m m ng t ) trong Word 156 Các l a ch n FTP khác 158 Xem l i công trình c a b n 158 v
7. Khám phá trang ch  (Home Page) Sau khi hoàn thành bài h c này, các b n có th :
   S
   khác nhau gi a Internet và World Wide Web
   Cu trúc c a m t trang web in hình
   To m t trang HTML  n gi n và xem trang web Vi c  u tiên c a b n trên hành trình tr * thành m
   t nhà thi t k  trang web không gì khác chính là phát tri n nh $ng ki n th c tin h c c  b n s  ng bn hi n ang có. Ví d , ngoài nh $ng kh  n ng s d ng vi tính "khiêm t n" mà b n s * h $u lúc này thì b n còn ph i tìm hi u m
   t chút m i liên h  gi $a Internet, m ng thông tin toàn c u web và các trang web khác nhau. Vì v y,  trình bày m
   t cách n gi n và d hi u, chúng tôi s # c t g n bài h c này và s # ch ! miêu t  s  l c nh $ng nhân t  chính c a m ng thông tin l n nh t th  gi i - m ng Internet, web và các trang web. Sau khi gi i quy t xong nh $ng v n  c  b n nh t, chúng ta s # giành ph n còn l i c a các bài h c  tp trung vào vi c l p k ho ch và xây d ng trang web c a riêng b n. Internet - m
   t tp h p các ph n c ng Nói m
   t cách n gi n Internet hay Net th c ra là các ph n c ng, r t nhi u các ph n c ng c k t n i v i nhau t o nên m ng toàn c u r
   ng l n. Ph n cng Internet bao g m t t c  các thi t b  mà m
   t ng "i có th ch m vào c nh  máy tính, các router (B
    nh tuy n), cáp, "ng dây in tho i, mch d $ li u t c 
   cao và các thi t b  m ng khác n $a. Vy  y, ó là t t c  nh $ng gì b n c n bi t v  Internet, Internet là ph n cng. Nu b n mu n tìm hi u v  l ch s ra " i c a Internet thì xin m "i tìm hi u thông tin trên m ng và n hi u sách hay th  vi n n i b n s ng. (B n c+ng có th ghé th m m
   t  a ch ! tài nguyên thông tin theo a ch ! www.creationguide.com/resources , trang web này s # cung c p cho b n m
   t s "ng links h $u ích). Sau khi ã bi t Internet chính là ph n c ng, gi " chúng ta s # ti p t c m
   t lôgic khác. C +ng gi ng nh  t t c  các ph n c ng máy tính khác (ví d  nh  máy tính  bàn hay máy tính xách tay), Internet c+ng c n ph n m m; n u không thì ph n l n các thi t b  ph n c ng Internet trên toàn th  gi i s # ch ! n ,m cho b i ph ngày qua ngày mà thôi. Vì th  chúng ta s # chuy n sang tìm hi u v  World Wide Web. Khái ni m v trang Web World Wide Web (c +ng c g i là WWW hay  n gi n web) không n gi n và d hi u nh  Internet. ó là b *i vì web bao g m các ph n m m
8. Thi
   t k
   Web (ch  ng trình, tài li u, và t p tin) cho phép thông tin có th c luân chuy n trong các ph n c ng Internet. Nh  ã nói * trên, th c ch t Internet là c  s * h t ng ph c v  cho vi c truy n tin - ó là c  s * h t ng c t o nên b *i máy tính, router, cáp, "ng dây in tho i, m ch d $ li u t c 
   cao và các ngu n thông tin c gi là máy ch . Nh ng c s * h t ng này l i có c u trúc r t khác nhau, không ph i máy tính nào c +ng ch y c t t c  các  nh d ng t p tin. Vi c áp d ng t t c  các ph  ng pháp hi n có (hay các c u hình hi n có)  hi u c t t c  các  nh d ng t p tin trên t t c  các máy tính là m
   t vi c làm không kh  thi. Vì th  nên c
   ng  ng Internet ã sáng ch  ra m
   t s n ph &m mang tính toàn c u cho riêng mình, th "ng c bi t  n v i cái tên World Wide Web. Lúc u, Tim Berners-Lee ã nh n th c c v n  và phát tri n m
   t web (m ng l i) nh  th  * phòng thí nghi m CERN * Thu - S . nh ,m ph c v  cho c
   ng  ng v t lý n ng l ng cao. Web này ã nhanh chóng thu hút c s  chú ý r
   ng rãi và t m nh h *ng v t ra ngoài gi i v t lý. V  l ch s Internet thì b n có th tìm th y hàng lo t thông tin trên m ng hay trong r t nhi u sách v  vi tính. Còn v i m c ích c a chúng ta thì ch ! c n bi t Internet là ph n c ng còn Web là ph n m m th  là  . Qu  là  n gi n! Nào, chúng ta cùng chuy n sang m
   t trình 
   cao h n - tìm hi u v  các t p tin, các h / tr  ph n m m c a Web trên ph n c ng Internet. Web site là gì? Chúng ta hãy bt  u i tìm hi u nh $ng trang web. Nói  n gi n, khi bóc i t t c  cái l p v  t ) ng $ chuyên ngành thì các trang web chính là các t p tin. C th h n, chúng là các t p tin HTML. Các b n ) ng  ý  n "HTML" làm gì vì trong bài sau, chúng ta s # khám phá nh $ng bí m t v  HTML. Còn lúc này b n ch ! c n nh  m
   t iu: trang web chính là các t p tin mà web l u gi $; c +ng gi ng nh  các t p tin v n b n (.doc) c Microsoft Word s dng. Do trang web chính là t p tin nên ch 0ng c n ngh . sâu xa b n c +ng bi t r ,ng thi t k  1 trang web n gi n là thi t k  m
   t lo i t p tin nh t  nh trong máy tính c a b n. Có nh $ng lo i t p tin nào? V n b n Word, b ng tính, c  s * d $ li u, các trang web - t t c  chúng  u là t p tin. Nh v y là trang web c +ng ch 0ng ph i là cái gì quá khó hi u. i m khác bi t gi $a trang Web và các t p tin thông th "ng là trang web th "ng luôn bao g m r t nhi u t p tin và các siêu liên k t và các trang web th "ng c nhóm vào các nhóm g i là các web sites. 2
9. Khám phá trang ch  (Home Page) Bn ch t c a các trang web Chúng ta v )a kh 0ng  nh r ,ng trang web n gi n ch ! là các t p tin. Nh ng chúng ta c +ng nên tìm hi u xem nh $ng t p tin ó thu
   c lo i nào. Tr c khi i xa h n thì ít nh t b n c +ng ph i có m
   t chút hi u bi t (không nh t thi t ph i n m ch c) v  các y u t  c u thành và các t  ng tác trong trang web. Tr c tiên, * c p 
   c  b n nh t, m /i m
   t trang web là m
   t tài li u v n b n. Vn b n text là m
   t t p tin bao g m t ), ch $ cái và s  không kèm theo nh dng nào. Nh ng ây ch a ph i là trang web âu, ây m i ch ! là m
   t tài li u vn b n mà thôi. Hình 1-1 là m
   t ví d  n gi n v  m
   t tài li u v n b n m * trong Notepad. Hình 1-1. Mt tài li u v n b n trong Notepad.  nâng c p tài li u v n b n này thành m
   t trang web ti m n ng, b n ch ! cn thêm vào các l nh HTML c  th nh  trong Hình 1-2. Hình 1-2. Tài li u v n b n này bao g m l nh HTML c  b n cùng v i v n b n tiêu và m t dòng trong v n b n thân bài. 3
10. Thi
    t k
    Web Sau khi b n ã thêm vào các câu l nh HTML, b n ph i lu tài li u v n b n nói trên v i uôi .html ho %c .htm thay cho uôi .txt hay .doc. Gi " thì b n có th m * tài li u nói trên b ,ng trình duy t r i, ví d  m * tài li u vi Internet Explorer. Hình 1-3 cho th y tài li u v n b n cùng v i các câu l nh HTML trong Hình 1-2 c th hi n th  nào trong trình duy t. Hãy  ý, trong hình 1-3 ch ! xu t hi n thanh tiêu  và ph n v n b n thân bài. ó là vì các l nh HTML ch ! là các ch ! d (n v  cách th c th hi n thông tin ch  không ph i là n
    i dung c th hi n. Hình 1-3. Trong trình duy t này, b n có th xem tài li u v n b n ch a các câu l nh HTML c c u trúc m t cách úng ki u. Chúng ta s # cùng tìm hi u quá trình thi t k  m
    t web site s d ng HTML trong Notepad và Wordpad trong bài sau. Khi ó các b n s # th y HTML th c ra r t d hi u n u ta tìm hi u t ) t ) t )ng b c m
    t. (N u b n mu n m
    t thông tin áng khích l  h n thì chúng tôi có th cho b n bi t r ,ng b n hoàn toàn có th l p trang web mà ch 0ng c n bi t gì v  HTML c .) Lúc này thì bn c n ph i nh n ra r ,ng: Trang web chính là các tài li u v n b n. Ch c ch n nhi u b n s # th c m c v  m
    t iu h i trái ng c * ây khi chúng tôi tuyên b  ch c n ch r ,ng: trang web chính là tài li u v n b n. Nhi u b n s # v %n r ,ng: N u v y t i sao trên web l i tràn ng p nh $ng hình nh  ho ? ây chính là m
    t iu thú v , trên web b n hoàn toàn có th k t hp c  t p tin tài li u v n b n v i các t p tin hình nh c th khác. i m m u ch t là ây:  th hi n m
    t hình nh trên trang web, tài li u v n bn HTML s # ch a các câu l nh h ng d (n trình duy t tìm m
    t hình nh nào  y và ch ! cách th hi n nó trên trang web (v  v  trí, kích th c, ). n ây, ch c b n ã th y rõ b n ch t nhi u t p tin c a trang web. Thông th "ng khi b n xem m
    t trang web trên m ng là b n ang xem m
    t s  t p tin nh t  nh - bao g m t p tin v n b n HTML và m
    t s  t p tin hình nh khác. 4
11. Khám phá trang ch  (Home Page) Hãy th  to t p tin HTML Bn có th t  mình th y c tác d ng c a các câu l nh HTML. ánh on vn b n trong Hình 1-2 vào Notepad. L u tài li u Notepad này lên màn hình (Desktop) (  sau này có th xoá i d dàng) * d ng tp tin HTML (.html) b,ng cách gõ: “tên t p tin.html” trong h
    p File name, và óng Notepad. Và bây gi " bn hoàn toàn có th xem v n b n ó b ,ng trình duy t web theo nh $ng b c sau: ° B m chu
    t vào tên tp tin HTML v )a t o. ° M* trình duy t và kéo bi u t ng t p tin HTML th  vào c a s  trình duy t. Ho %c ° M* trình duy t, trong thanh a ch ! ánh "ng d (n t i t p tin HTML. Chú ý  s d ng tài li u v n b n nh  ngu n thông tin n n cho tài li u HTML, b n có th  i tên t p tin v n b n.  th c hi n iu này, hãy nh p ph i vào tên tâp tin, và ch n Rename. Thay th  uôi .txt b ,ng .htm ho %c .html. Khi Windows hi n th  h
    p thông ip h i b n có ch c mu n thay  i lo i t p tin (và c nh báo b n v  nh $ng "nguy hi m" ti m tàng), nh p Yes - b n không ti n hành b t k 1 vi c phá h y t p v n b n nào * th "i i m này. Tìm hi u v  HTML Vn b n và các câu l nh HTML dùng  t o trang web nh  trình bày * trên c g i chung là mã ngu n c a trang web ó. (Mã ngu n * ây ch ! c  v n bn và các câu l nh HTML c dùng  t o nên trang web.) H u h t các trình duy t  u cho phép b n xem mã ngu n. Ví d : trong Internet Explorer, mu n xem mã ngu n, b n ch n Source * m c View trên thanh thc  n. Sau khi ã xem hình 1-4, b n có th i  n m
    t k t lu n “bao quát” nh  sau: Khi xem m
    t trang web trên trình duy t Internet là b n ang xem r t nhi u tp tin ph i h p v i nhau  t o ra m
    t trang web duy nh t. Sau khi ã hi u r ,ng m
    t trang web bao g m nhi u t p tin, bây gi " ch c b n ã t !nh táo mà nh n ra r ,ng, m
    t trang web không  ng n 
    c m
    t mình mà nó luôn dùng các siêu liên k t  n i v i các trang web khác. 5
12. Thi
    t k
    Web Hình 1-4: Xem th  m c t p tin c a trang ch  c a Hi p h i in nh Arizona; ta có th th y rõ ràng có ba t p tin k
    t h p l i th hi n trang web này trên m ng. Các siêu liên k t và các web sites Nh  tình hu ng gi   nh ban u, ó là các b n ang mu n t o m
    t trang web và các b n v )a l t Net xong. Khi l t trên m ng, ch c b n ã b m vào r t nhi u siêu liên k t. Siêu liên k t là nh $ng v n b n hay nh $ng hình nh cho phép b n i ti p  n nh $ng tài nguyên Internet và nh $ng trang web khác khi b n b m vào v n b n hay hình nh này. Dùng thu t ng $ chuyên ngành thì siêu liên k t là nh $ng nhân t  có trong v n b n HTML, nh $ng nhân t  d(n  n nh $ng trang web hay nh $ng v n b n Internet khác (t  ng t  nh  cách m
    t s  câu l nh HTML s # d (n  n các t p tin hình nh) hay nh $ng khu vc khác trên cùng m
    t trang web. Hình 1-5 cho th y m
    t s  siêu liên k t (hyperlinks) trên trang ch c a Hi p h
    i in nh Arizona a n các trang web khác. Khi b m vào m
    t trong nh $ng siêu liên k t này, trình duy t s # th hi n m
    t khu v c khác trên chính trang web ó ho %c m
    t trang web khác, có th ó là b t c  trang nào trên Internet t i b t c  n i nào trên th  gi i ch  không ph i ch ! có m /i m
    t trang web b n v )a m i làm c. Là m
    t ng "i thi t k  web, n u b n dùng siêu liên k t thì b n s # m %c nhiên s d ng nhi u trang web. Tâm lý chung là b n s # không thích a t t c  thông tin lên m
    t trang ch v )a r
    ng l i v )a dài. Thay vào ó, b n có th mu n t o ra nhi u trang web nh  h n có liên quan và c k t n i v i nhau. Tp h p nh $ng trang web có liên k t nh  th  t o nên m
    t web site. 6
13. Khám phá trang ch  (Home Page) Hình 1-5. Siêu liên k
    t a ng i duy t web t i nhi u trang web khác, t i nh ng khu v c khác trên cùng m t trang web hay t i nh ng tài nguyên Internet khác. Tóm t t s  l c n ây, các b n ã c bi t v : Internet, web, các trình duy t web, siêu liên k t và các trang web. Tuy nhiên, n ây thì chúng ta l i g %p ph i m
    t th c m c, ó là làm sao  m
    t t p tin v n b n và m
    t s  t p tin hình nh mà chúng ta v )a t o ra trên máy có th tr * thành m
    t trang web trên Internet. Tr c khi i quá sâu vào v n  truy n thông tin trên trang web, chúng ta cn tránh m
    t s  nh m l (n r t ph  bi n là: Nh $ng ai xem trang web c a b n u có th xâm nh p vào máy vi tính c a b n. iu này không úng âu vì các trang web không c l u trên máy tính c a b n, mà chúng c l u trong máy ch . Máy ch  trên Internet Máy ch n gi n là nh $ng chi c máy tính có c u hình m nh c dùng  lu tr $ các t p tin Internet và ch y m
    t s  ch  ng trình ph n m m % c bi t  tr  l "i yêu c u c a khách hàng. Bây gi " chúng ta s #  n v i thu t ng $ "khách". 7
14. Thi
    t k
    Web V c  b n, các t p tin web c truy n i thông qua mô hình khách/ch . Trong mô hình này, m
    t h  th ng (máy ch ) k t n i m ng s # ph c v  yêu cu c a m
    t h  th ng khác (khách hàng). Trong vi c thi t k  web, "khách hàng" là tên khác cho m
    t trình duy t web (ví d  nh  Internet Explorer) ch y trên máy tính c a ng "i s d ng, và m
    t máy ch là s  k t h p gi $a m
    t máy tính c u hình m nh l u gi $ các trang web và các ph n m m áp ng nhu c u v  th hi n các trang web c l u gi $. Vì th  khi b n truy c p m
    t trang web, s # di n ra m
    t quá trình sau: 1. Kt n i máy tính c a b n v i Internet và m * trình duy t. Nh p vào thanh a ch ! m
    t  a ch ! web (URL) nào ó, nh n Enter ho %c nh n vào m
    t siêu liên k t trên trang u trình duy t c a b n. 2. "Khách hàng" (trình duy t c a b n) s # g i URL v )a c nh p vào h
    p Address ho %c URL ó cùng v i siêu liên k t qua "ng dây in tho i, cáp, và có th là router n nhà cung c p d ch v  Internet (ISP). ISP là công ty b n tr  ti n  có th truy c p Internet. 3. ISP c a b n sau ó l i g i yêu c u URL c a b n thông qua Internet, qua nhi u "ng dây cáp h n, nhi u router và các m ch d $ li u t c 
    cao khác t i h  th ng l u gi$ trang web c yêu c u (h  th ng máy ch ) 4. T) h  th ng máy ch thông tin v  trang web yêu c u c g i qua Internet t i ISP c a b n và cu i cùng ISP c a b n s # chuy n l i nh $ng thông tin ó t i máy tính c a b n. Vi vai trò c a m
    t ng "i thi t k  trang web, sau khi t o ra m
    t trang web, bn s # sao chép các t p tin * trang web ó sang h  th ng máy ch n i s # l u gi $ trang web c a b n. Vi c này c +ng n gi n nh  thao tác sao chép t p tin t)  c ng sang  m m. N u b n dùng các ng d ng giao th c chuy n giao tp tin (FTP), Web Folders và My Network Places hay các trình cài %t web thì vi c sao chép các t p tin c a trang web b n t  làm ch ! n gi n là kéo các t p tin ó t ) th  m c g c sang th  m c c a máy ch n i s # ch a trang web c a b n. Vì v y khi có ai ó xem trang web mà b n xu t b n, h  s # truy cp vào h  th ng máy ch có l u nh $ng t p tin trong trang web c a b n ch  không ph i là truy c p tr c ti p vào máy c a b n. Nh  v y là chúng ta ã k t thúc ph n t ng h p v  nh $ng thành t  c  b n nh t v  Internet và Web. Lúc này, ch c h 0n b n ã s 2n sàng i ti p v i vi c thi t k  và v n hành trang web c a riêng b n, nh $ng v n  s # c trình bày trong nh $ng ph n ti p theo. Tng k t bài h c Sau khi h c bài này chúng ta ã tìm hi u và n m c m
    t s  khái ni m sau: ° Internet là ph n c ng. ° Web là ph n m m (bao g m các ch  ng trình và tài li u). 8
15. Khám phá trang ch  (Home Page) ° Trình duy t là các ng d ng giúp b n xem các trang web. ° Hu h t các trang web c  b n u bao g m nhi u t p tin: m
    t t p tin v n bn HTML và các t p tin hình nh. ° Web site là m
    t nhóm các trang web có liên quan và k t n i vi nhau. ° Siêu liên k t giúp truy c p các trang web khác, các khu v c khác trên cùng m
    t trang và các ngu n tài nguyên khác trên Internet. ° Internet s d ng mô hình khách/ch (client/server) trong ó h  th ng máy ch áp ng các òi h i c a khách v  thông tin. ° Ng "i dùng Internet truy c p các trang web c l u trên h  th ng máy ch . ° Nu b n dùng c máy tính thì )ng b n kho n, b n hoàn toàn có th thi t k  c m
    t trang web c a riêng mình. Câu h i ki m tra 1. Có gì khác bi t chính gì gi $a Internet và World Wide Web? 2. Bn ch t nhi u trang c a trang Web ngh .a là gì? 3. Trang Web là gì? 4. Th  nào là m
    t trình duy t Web? 5. Mc ích c a siêu liên k t trên trang Web là gì? 6. Mô hình khách/ch c a Internet ho t 
    ng nh  th  nào? Th c hành Bài t p 1: Bài h c này khái quát m
    t s  khái ni m v  trang Web, bao g m ph n chúng c t o ra v i các t p tin HTML. Bn có th xem mã ngu n HTML c a trang Web sau khi hi n th  trang trong trình duy t. Trình bày quá trình hi n th  mã ngu n HTML c a trang Web b ,ng cách hi n th  trang Web www.creationguide.com và sau ó hi n th  mã ngu n HTML c a trang. Sau khi xem mã ngu n, óng trình biên t p v n b n và duy t các c a s . Bài t p 2:  th c hành l u tài li u v n b n d i d ng t p tin HTML, t o m
    t tài li u v n b n n gi n, gõ v n b n, và l u t p tin. Trong bài t p này, m* Notepad và gõ m
    t câu n gi n trong tài li u v n b n. Lu tài li u v n bn d i d ng t p tin HTML trên máy tính c a b n và sau ó óng tài li u li. Bài t p 3:  b t  u tìm hi u thêm v  HTML, hãy thêm các th ' HTML vào tài li u v n b n b n ã t o và l u trên máy tính c a b n.  làm iu này, m * Notepad, và sau ó m * tài li u v n b n b n ã t o. Ti p theo, gõ 9
16. Thi
    t k
    Web vn b n c hi n th  trong Hình 1-2, ngo i tr ) vi c bn t t o dòng tiêu  c a riêng b n và chèn v n b n c a b n vào v  trí c a v n b n Thông th ng, n c s t cà chua n m ch  nên cho vào m t ít thôi. Lu nh $ng thay  i c a bn, óng Notepad, và sau ó m * trang Web trong trình duy t c a b n. Xem mã ngu n trang Web c a b n, và sau ó óng Notepad và duy t các c a s . 10
17. To và nh d ng trang Web Sau khi hoàn thành bài h c này, b n s  bi t:
    Nhng i u ki n  m t trang Web có th  c cho là t t.
    Xác nh các y u t  v n b n ch  y u c a m t trang Web
    Ch n các k  thu t khác nhau  trang trí trang Web. Khi ai ó suy tính v  chuy n xây d ng trang Web, h  th "ng ngh .  n thi t k  u tiên - t c là trông trang Web s # nh  th  nào ch  không ph i là nó s # nói iu gì. Tuy nhiên,  thành công trang Web c a b n ph i cung c p nh $ng thông tin nhanh chóng thu hút c s  chú ý c a ng "i xem; n u không, ng "i xem s # không * l i thêm b t k 1 giây phút nào và có th s # không quay l i n $a. Do v y, b n nên b t  u ngh . v  n
    i dung c a trang Web tr c khi b n i quá sâu vào thi t k  c a nó. Nu b n theo dõi bài h c này, b n s # có th xây d ng n
    i dung trang Web y  và rõ ràng Nh ng th m chí n u b n ch a xây d ng n
    i dung cho m
    t trang Web c  th nào n m c ó, nhìn chung b n v (n có th xác  nh và xây d ng n
    i dung Web t t. H n n $a, b n s # bi t cách t i a hóa l i ích c a v n b n trong trang Web t  ng lai c a b n. N u b n nh  rõ nh $ng bí quy t này, b n s # có th d dàng ph i h p n
    i dung và thi t k  khi b n b t u xây d ng trang Web. Bây gi " tr * l i v i v n  tr c m t ó là b n ang ph i thi t k  m
    t v n bn tr c tuy n. V n b n tr c tuy n t hi u qu  hay không b n ph i quan tâm n tính ch t: rõ ràng, ti p th , h p d (n v  hình nh, gi i h n công ngh , và m
    t chút tâm lý 
    c gi . Các y u t  v n b n c a m
    t trang Web Hu h t các trang Web  u s d ng nhi u thành t  v n b n, nh  minh h a trong Hình 2-3. Nh  b n có th th y trong hình (c +ng nh  h u h t các trang Web), các y u t  v n b n xu t hi n trên các trang Web c mô t  trong ph n sau ây. Thanh tiêu  Khi b n t o m
    t trang Web, ph i t o vn b n xu t hi n trên thanh tiêu  c a c a s  trình duy t. Y u t  c n b n c a tiêu  là rõ ràng, chính xác và h$u ích. L u ý r ,ng khi b n m * m
    t trang Web, tiêu  c a trang Web xu t hi n trên thanh tác v  c a Windows. N
    i dung tiêu  trên thanh tác v  giúp ng "i dùng có th d dàng hn khi h  chuy n  i gi $a m
    t s  c a s  ang m*. Do v y, m %c dù b n có th chèn vào các n
    i dung tiêu  thông minh ho %c dí d m, song b n nên d a vào các y u t  h $u ích và rõ ràng. Hãy xem li các n
    i dung tiêu  không h p lý trong các Hình 2-1 và 2-2.
18. Thi
    t k
    Web Hình 2-3. Các trang Web hi u qu  có m t s  y
    u t  v n b n chung. N
    i dung N
    i dung c a m
    t trang Web  c p  n th c ch t v n  c a nó - lý do khi n m i ng "i ghé th m trang web. N
    i dung c a m
    t trang Web ph i rõ ràng, ng n g n, d l t, nhi u thông tin, có tính cp nh t và không có l /i chính t , . Luôn ghi nh  r ,ng dù m
    t trang Web trông có 3 p m t  n âu, %c tính h p d (n c a Internet v (n là v n b n. 12
19. S d ng  h a trên trang Web Siêu liên k t Các siêu liên k t cung c p các liên k t t ) trang Web c a b n  n m
    t nhóm các trang Web (ho %c m
    t trang Web dài) b ,ng cách liên k t trang ch c a bn (c +ng nh  các trang tr c)  n khu v c có các thông tin c  th liên quan. Nói cách khác, các siêu liên k t giúp b n t  ch c thông tin, và chúng c+ng giúp nh $ng ng "i khác ti p c n thông tin c a b n nhanh chóng và d dàng. Các siêu liên k t v n b n ph i rõ ràng, nh t quán và c % t * v  trí thích h p, iu này chúng ta s # th o lu n sau. Bi u tr ng, v n b n  h a và WordArt Bn có th s d ng các bi u tr ng, v n b n  h a và WordArt  làm cho trang Web có v ' chuyên nghi p h n. Nh  chúng tôi gi i thích trong Bài tr c, b n có th s d ng v n b n  h a  t o s  nh t quán trong hình th c và c m giác c a m
    t nhóm các trang Web có liên quan nhau. N u t t c  các ph n c a m
    t trang Web có hình th c t  ng quan nhau s # cho ng "i dùng bi t r ,ng h  v (n còn * trong lãnh th  trang Web c a b n m %c dù h  ã i t ) trang này n trang khác. H n n $a, bi u tr ng, v n b n  h a và WordArt th "ng xuyên c s d ng  làm "ng liên k t  h a nh t quán n trang ch c a m
    t trang Web. B n có th khám phá ra khi b n l t Web r ,ng b n th "ng xuyên nh p vào bi u tr ng c a m
    t công ty  quay li trang ch c a trang Web. (N u b n v (n ch a phát hi n ra bí m t này, b n nên th nó trong l n l t Web sau c a mình.) B t c  khi nào có th , hãy t n dng ph  ng pháp này  liên k t bi u tr ng v i trang ch trong toàn b
    trang Web c a b n. Các l a ch n chuy n h ng v n b n thu n túy Nhi u nhà thi t k  Web l a ch n  nh d ng thanh thc  n và các y u t  chuy n h ng (các nút) c a h  ch ! là hình h a (trong Hình 2-3, các nút trong vùng phía trên bên trái c s d ng nh  là thanh chuy n h ng c a trang ch ). S d ng các y u t  chuy n h ng  h a là t t, nh ng chúng tôi  ngh  b n c +ng nên hi n th  các siêu liên k t chuy n h ng c a b n nh  là vn b n thu n túy cùng v i các y u t   h a. N u thi t k  trang Web c a bn s d ng thanh thc  n ho %c các nút  h a, b n có th tránh vi c phá v b  trí c a trang web b ,ng cách hi n các siêu liên k t * cu i trang.  a ra la ch n cho các liên k t d a trên  h a r t có ích b *i vì m
    t vài khách t t tính n ng  h a trình duy t c a h   t i trang Web. N u b n không cung c p các thành ph n chuy n h ng d a trên v n b n, m
    t vài ng "i s d ng có th không bi t cách  truy c p vào các trang g c c a b n. 13
20. Thi
    t k
    Web L u ý Bn nên b sung các liên k t chuy n h ng d a vào v n b n * cu i các trang Web c a b n s # giúp cho ng "i dùng di chuy n  n các trang khác trong mi n Web c a b n mà không ph i cu
    n lên u c a trang hi n th "i  ti p c n v i các liên k t chuy n h ng chính. Thông tin v  ngày tháng Nhìn chung, b n nên  a y u t  ngày tháng vào trang Web. Ngày tháng có th là m
    t dòng v n b n nh  khó nh n th y * cu i trang. Tuy nhiên, n u n
    i dung th "ng xuyên c c p nh t là m
    t trong các i m h p d (n c a trang Web, b n có th mu n dòng ngày tháng d th y h n b ,ng cách % t nó * phía trên g n khu v c phía trên bên trái. M %t khác, n u b n không  nh c p nh t trang Web th "ng xuyên, b n có th l a ch n b  qua không công b  ngày sa  i m i nh t. Thông tin b n quy n Bn s * h $u b n quy n v i t t c  v n b n g c và  h a g c mà b n t o ra. Do v y,  b o v  tài s n c a mình, b n nên thêm vào b n thông báo b n quy n v  trang Web c a mình. Hãy luôn ghi nh  r ,ng n u b n s d ng ph n mm mi n phí (ví d  nh  các  h a mi n phí b n quy n mà b n t i v  t ) trang Web khác) trên trang Web c a b n, ph n m m mi n phí này là mi n phí i v i b t k 1 ai khác s d ng nó. Khi b n thêm vào v n b n b n quy n, thông tin có th n gi n nh  là © Bn quy n 2004 tên bn ho %c tên công ty. M i quy n c b o l u. H n n$a, thông tin b n quy n nên c % t * cu i trang và có c  ch $ nh  h n c  vn b n thân trang Web. Bây gi " khi chúng ta ã tìm hi u v  các y u t  v n b n c  b n c a trang Web, b n ã có th nh hình và vi t n
    i dung trang Web. Các yêu c u thi t k n
    i dung trang Web Nh  b n ã bi t, vi c a v n b n lên m
    t trang Web c +ng nh  b  sung cho toàn b
    thi t k  c a trang. (Xem Hình 2-3.) B n nên b t  u suy ngh . v  các v n  thi t k  v n b n c  b n khi b n k t h p các v n b n v i nhau. Do ó, trong khi b n t o n
    i dung, hãy ghi nh  các v n  thi t k  v n b n sau: ° To tiêu  và u   h a cho các hi u ng ngh  thu t b  sung. ° Hi n th  on trích và thanh nách  gi m nh 3 dung l ng v n b n. ° Thêm WordArt, bi u tr ng, v n b n  h a và các bi u ng $  t o hình th c và c m giác nh t quán cho trang. 14
21. S d ng  h a trên trang Web ° S d ng các bi u t ng d hi u  thay th  các t ), t  ng t  nh  các bi u tng “new”, “hot” và “home” c b  trí kh p n i trên trang Web. ° Áp d ng th n tr ng các màu s c ho %c các nh d ng in n (ví d  ch $ m ho %c nghiêng)  lôi kéo s  chú ý vào các t ) và khái ni m quan tr ng. ° S d ng ch $ hoa trang trí ho %c ch $ hoa treo (ch $ cái l n u tiên c a on)  ánh d u s  b t u m
    t on. ° m b o r ,ng vi c trang trí nn không làm cho vn b n tr * lên khó c. °  a vào các thông tin quan tr ng (nh  chi ti t liên l c, tên công ty, ) b,ng v n b n, th m chí c  khi thông tin ã xu t hi n d i d ng  h a * ni khác trên trang. M
    t s  ng "i t t  h a  &y nhanh t c 
    l t web, có ngh .a là h  s # b  qua các thông tin b ,ng  h a có trên trang web c a b n. °  tránh in ch $ quá bé - ho %c n u nghi ng ", hãy  ng "i dùng xác nh c v n b n thông qua thi t l p trình duy t m %c nh c a h . ° S d ng các phông ch $ d c và cùng v i n n thích h p. Hi n t i, các phông ch $ thích h p nh t v i các máy Apple Macintosh d a trên Windows bao g m Arial, Arial Narrow, Comic Sans, Courier New, Times New Roman, và Verdana. Cu i cùng, b n hãy vui v ' v i n
    i dung trang Web c a b n. Web a l i cho bn s  t  do  ph  bi n thông tin nhanh chóng và sáng t o b ,ng các cách th c m i. Hãy ngh . th t chính xác b n mu n truy n t i iu gì, sau ó vi t thông ip c a b n càng rõ ràng và sinh 
    ng càng t t. M
    t khi b n b t  u vi t các câu v n xúc tích và m nh m #, b n s # lôi cu n 
    c gi . Tng k t bài h c ° Ng "i dùng ch ! l t các trang Web ch  không c k 4 t )ng dòng m
    t. ° Tiêu , n
    i dung, siêu liên k t, bi u tr ng, các tác ph &m WordArt, các yu t  v n b n  h a, l a ch n chuy n h ng, ngày c p nh t m i nh t, và thông tin b n quy n là các cách s d ng v n b n trang Web i n hình. ° Vn b n trên m
    t trang Web lôi cu n s  chú ý c a ng "i dùng tr c khi các hình h a có tác d ng. ° Thông tin trang Web không nên ganh ua v i ph  ng pháp vi t d ng tin tc hình kim t  tháp ng c. ° Vi t các câu v n rõ ràng, sinh 
    ng và có các on v n súc tích úng ng $ pháp. ° Các tiêu  và siêu liên k t ph i rõ ràng và có n
    i dung. ° S d ng danh sách có ánh d u u dòng và h  th ng các tiêu   giúp ng "i c nhanh chóng xác nh c các i m chính. 15
22. Thi
    t k
    Web ° Bt u ngh . v  các y u t  thi t k  v n b n, trong ó có nh d ng in n, mu s c và y u t  v n b n  h a. ° Trên h t, ó là sau khi tính n các th  m nh và h n ch  c a vi c vi t Web, hãy  vi c vi t Web tr * thành m
    t kinh nghi m h ng thú và sáng to. Câu h i ki m tra 1. Mi ng "i  c trang Web nh  th  nào? 2. M
    t s  k 4 thu t nào b n có th s d ng  giúp trang Web c a b n d c l t h n? 3. M
    t s  y u t  v n b n thông th "ng b n có th tìm th y trên ph n l n các trang Web là gì? Th c hành Bài t p 1: Bài t p này th o lu n v  các vai trò khác nhau c a v n b n trên trang Web. Hãy nhìn vào trang Web Ants Online và nh nhãn cho nh $ng yu t  sau: thông tin b n quy n, thanh tiêu , ngày "ch !nh s a l n cu i", n
    i dung và siêu liên k t. Bài t p 2: c on thông tin sau. Sau ó dành vài phút  xem l i nh $ng iu ó. Hãy ngh . cách b n có th nhóm và s p x p thông tin thành m
    t b n trình bày có th  t  sao cho thông tin có th d dàng c tìm th y. Phác h a  c  ng cách b n có th trình bày thông tin t t nh t trên trang Web. Nh  thêm tiêu  và các nút u dòng n u c n. Ngoài ra, nên xem xét nh $ng m c c g ch d i có th coi nh  nh $ng siêu liên k t có trình t   n nh $ng thông tin ph  thêm. Chim cánh c t có th s ng 20 n m và chúng ch  s ng  bán c u nam. Chúng không th bay nh ng l i di chuy n r t nhanh  d  i n  c. Chúng  tr ng trên m t  t. Chúng r t có tính c ng  ng và s ng trong nh ng nhóm c gi là b y chim cánh c t có kho ng vài tri u con chim cánh c t. Có 17 loài chim cánh c t chính, th ng c chia thành nh ng nhóm d a trên các c tính t  nhiên. C th , nh ng con chim cánh c t Emperor và King thu c lo i nh ng con chim cánh c t l n. Nh ng con chim cánh c t nh  nh t th ng c g i là chim cánh ch t Nh . Nh ng con chim cánh c t Adelie, Chinstrap, và Gentoo là nh ng con chim cánh c t có uôi quét. Nh ng con chim cánh c t có mào là Macaroni, Royal, Erect-Crested, Fiordland, Snares, và Rockhopper. Bn dòng chim cánh c t là African, Humboldt, Magellanic, và Galapagos. Và cu i cùng nh ng không kém ph n quan tr ng là chim cánh c t Yellow-Eyed (m t vàng). 16
23. S d ng  h a trên trang Web 17
24. S d ng  h a trên trang Web Sau khi hoàn thành bài h c này, b n s  có th :
    Hi u c nh ng ki n th c c b n v  h a Web.
    Xem xét và v n d ng  h a Web trong m t ch  ng trình  h a.
    Mô t các ki u  nh d ng t p tin  h a khác nhau.
    Ch n các màu s c “an toàn” cho Web.
    Ct xén m t hình nh  h a. Trong bài h c này, chúng ta  n gi n hóa ch   h a Web. Chúng tôi c+ng không mu n b n c m th y choáng ng p khi s d ng  h a Web. Có th b n ã t )ng khám phá ra r ,ng b n có th r t d có th )a thông tin v  các  h a tiên ti n b ,ng cách tìm ki m trên Internet và trong các hi u sách kh p m i n i. Th t may m n là b n có th s d ng  h a Web m
    t cách hi u qu  mà không ph i nh n chìm chính mình trong các thuy t v  h a. Do v y, chúng tôi l a ch n cách th c ti p c n th c hành nh ,m gi i thi u nh $ng gì mà chúng tôi cho là nh $ng thông tin c  b n và quan tr ng nh t v   h a trang Web. C ch  h a ca Web Tr c khi b n b t  u l t gi * s  qua bài h c này  xem tranh nh tìm tòi các a ch ! tr c tuy n c a chúng tôi, b n th c s  c n ph i  c ph n này  nm ch c r ,ng b n hi u m
    t s  v n   h a Web chính y u. Nh  b n ã bi t,  h a Web trông có v ' g n gi ng v i  h a in n, song m
    t vài y u t % c tr ng Web s # óng vai trò quan tr ng khi b n sáng t o và s d ng  ha trên Web. %c bi t là  h a tr c tuy n òi h i b n ph i tính  n gi i hn màu s c,  nh d ng t p tin, và kích c  t p tin c +ng nh  
    trong su t có th , v n  t i nh và nh ho t. Nh n th c c ba y
    u t  chính - màu s c, dng t p tin và kích th  c t p tin - cho phép b n b t  u s d ng  h a trên các trang Web c a mình. Hãy b t  u b ,ng cách xem xét cách th c hi n th  màu c a  h a. nh im, b ng màu và màu s c u tiên và quan tr ng nh t, m /i  h a tr c tuy n bao g m m
    t chùm ô vuông màu nh  k t h p v i nhau  t o nên m
    t hình nh. Máy tính hi n th  các b c tranh s d ng các i m nh. Ví d , hãy nhìn vào hình nh $ng qu  s - ri trong Hình 3-1. Hình 3-1 c +ng có th là b t c  hình nào hi n th  trên màn hình c a b n. Nh  b n có th th y,  h a trông gi ng nh  h u h t các b c tranh tr c tuy n khác và không có b t c  d u hi u rõ ràng nào c a các d u ch m, các ô vuông hay i m nh.
25. S d ng  h a trên trang Web Hình 3-1. Mt hình nh  h a i n hình. Bây gi " hãy nhìn vào hình nh  h a g n h n m
    t chút. Trong th  m c các tp tin th c hành c a Lesson03 c a khóa h c này, hãy ch n t p tin cherries_photo.jpg và m * nó b ,ng m
    t ng d ng s a ch $a  h a nh  Jasc Paint Shop Pro, Adobe Photoshop, ho %c Microsoft Paint. N u sau ó b n phóng i hình nh lên nhi u l n, b n s # có th th y nh $ng ô vuông th c s  (các i m nh) t o nên b c tranh, nh  th hi n trong Hình 3-2. N u b n phóng i các qu  s -ri trên màn hình, b n s # th y r ,ng màu s c c a b c tranh và hình bóng bi n  i theo t )ng nh i m, ho %c theo t )ng ô vuông. Hình 3-2. Khi phóng to m t hình nh tr c tuy
    n, có th th y các i m nh. 19
26. Thi
    t k
    Web V(n m * t p tin cherries_photo.jpg trong ch  ng trình  h a, b n hãy phóng to b c tranh b ,ng cách s d ng công c  phóng to ho %c kính lúp c a ch  ng trình  h a.  minh h a rõ h n tác d ng c a các nh i m, hãy gi m 
    phóng  i c a hình nh (ho %c “thu nh ”) xu ng kích th c nhìn nh  h n m
    t chút, nh  sau: Nu b n t ) t ) thu nh , b n có th th y các i m nh b t  u hòa l (n v i nhau  t o nên m
    t b c tranh rõ ràng. Sau khi ã hi u v  i m nh, chúng ta có th nói m
    t chút v  các bng màu. M
    t b ng màu ch ! n gi n là m
    t b ng các màu s c s d ng trong m
    t  h a. M
    t s   h a Web (ví d  các  h a c l u d i  nh dng t p tin GIF) s d ng m
    t s  l ng màu h n ch . B n có th phân b  bng màu cho m
    t hình nh, ho %c b n có th  ch  ng trình  h a t  
    ng to b ng màu khi b n t o và s a m
    t hình nh. M
    t b ng màu t p tin GIF có th ch a t i 256 màu, nh ng nhi u hình nh s d ng ít màu h n th . Ví d , nhìn vào Hình 3-3, hình nh qu  s -ri s d ng 8 màu và hình nh qu  t s dng 128 màu. Hãy chú ý t i kích c  hình nh – hình nh qu  s -ri là 3KB (r t nh ), và hình nh qu  t là 7KB (nhìn chung là c +ng nh  nh  hình nh GIF c a qu  cherry). Hình 3-3. Bng màu c a hình nh qu  s -ri ch a 8 màu, và b ng màu hình nh qu  t ch a 128 màu. 20
27. S d ng  h a trên trang Web Nói chung, h u h t các trình ng d ng  h a cho phép b n xem các màu có trong b ng màu  h a GIF. H n n $a, b n có th gi m kích c  c a m
    t hình nh GIF b ,ng cách gi m ho %c h n ch  s  màu trong b ng màu c a b c tranh. Và nh  b n ã bi t, kích c  t p tin nh  h n t  ng ng v i th "i gian ti nhanh h n trên Web. Trong ph n ti p theo, chúng tôi s # nói v  b ng màu và gi i thi u m
    t s  nh d ng nh Web khác nhau. Các d ng t p tin  h a Trong ph n tr c chúng tôi ã nói r ,ng m i  h a trên trang Web u c lu tr $ trong m
    t t p tin riêng bi t.  nh  l i, hãy quay l i Hình 1-4 trong Bài 1. Chú ý tên c a hai t p tin hình nh s d ng trong Hình 1-4. Tên tp tin hình nh thanh tiêu  k t thúc b ,ng uôi t p tin .gif (afs_title.gif), và tên t p tin hình nh khác k t thúc b ,ng uôi t p tin .jpg (4members.jpg). Ví d , n u b n th y m
    t t p tin trên máy tính c a b n có tên holiday_gift_list.doc, b n bi t ngay r ,ng t p tin ó có th là m
    t tài li u Microsoft Word, và b n s # mu n m * tài li u này b ,ng Word. T  ng t , n u bn th y m
    t t p tin trên máy tính c a b n có tên bills.xls, b n bi t r ,ng .xls có ngh .a là m
    t tài li u Microsoft Excel, vì v y b n có th m * t p tin trong Excel. Liên quan n các  h a Web, trang Web c a b n có th có các hình nh  h a s d ng uôi t p tin .gif và .jpeg (ho %c .jpg) do h u h t các trình duy t Web ph  bi n  u có th hi n th  các t p tin GIF và JPEG (phát âm là “jay-peg”). nh GIF GIF là d ng  h a c h / tr  r
    ng rãi nh t trên Web (có ngh .a là h u h t các trình duy t  u có th hi n th  các hình nh GIF). GIF là vi t t t c a Graphics Interchange Format. CompuServe ã t o ra  nh d ng này vào th p k5 1980 nh  là m
    t công c  h $u hi u  truy n t i các hình nh qua các mng d $ li u. i m m nh chính c a  nh d ng GIF là các hình nh GIF th "ng có kích c  nh , có ngh .a là chúng t i và hi n th  nhanh. Nh  chúng tôi ã nh c  n trong bài này, các hình nh GIF s d ng các bng màu và c h / tr  t i 256 màu (t o nên  h a 8-bit). Do GIF h / tr  s l ng màu có h n, b n nên s d ng  nh d ng GIF cho các vùng màu d 3t, các bi u trng, v # nét n, các bi u t ng, các minh h a ki u ho t hình, các nút, các th c ngang, các d u  u dòng, n n và các y u t   h a khác c n ít màu s c. Hình 3-4 cho th y m
    t vài ví d  i n hình v  vi c s d ng các hình nh GIF. 21
28. Thi
    t k
    Web Hình 3-4. Nét k  n, th  c ngang, nút, d u  u dòng và các v n b n  h a là các cách s  d ng các t p tin GIF i n hình. nh GIF 
    ng “Trò ch i” cu i cùng v i nh GIF liên quan n nh 
    ng. S d ng các công c  nh GIF 
    ng và các ch  ng trình s a  h a, b n có th s p x p các nh GIF và l u các nh này theo "chu /i”  t o nh 
    ng  n gi n. Khi m
    t trình duy t hi n th  các hình nh GIF theo chu /i này, nó s# hi n th  di d ng nh này k  ti p nh khác. K 4 thu t này t  ng t  v i các k4 thu t làm phim th "i tr c l t gi * các tranh ã t )ng ph  bi n r t lâu tr c khi chúng ta ra " i. Các bi u t ng 
    ng, các nút cu n và m
    t s  qu ng cáo trên bi u ng $ là các ví d  c  b n v  nh GIF 
    ng. Hình 3-7 minh h a lý thuy t v  các nh GIF 
    ng. Nh  b n s # th y * ph n sau bài hc này, b n có th t i mi n phí các nh GIF 
    ng và các công c  ho t nh GIF t ) Web. Hình 3-7. Mt chu i nh GIF có th hi n th ! theo th  t  t o nh ng. Các màu s c “an toàn” cho Web Nh  b n ã bi t, t t c  các h  th ng máy tính là có c u trúc khác nhau. Nhi u ng "i không có th "i gian ho %c không có nhu c u  b t k p b c phát tri n ph n c ng c a ngành công nghi p máy tính. Vì vy, khi b n thi t k  trang Web, b n nên nh  r ,ng không ph i t t c  m i ng "i  u có th truy cp trang Web c a b n n u trang web òi h i ph i có ph n c ng hi n th  mi nh t và t t nh t. Trên th c t , g n 10% nh $ng ng "i l t Web không th xem c các trang Web có 256 màu. Do v y, trong m
    t vài n m t i, khi b n thi t k  trang Web c a mình và t o các hình nh GIF ho %c PNG, b n có th cân nh c v  các màu s c mà các màn hình 256 màu có th hi n th  mà 22
29. S d ng  h a trên trang Web không b  rung nhi u. Các màu s c ph  bi n c coi là các màu s c an toàn cho Web ho %c an toàn cho trình duy t. N u trang Web c a b n s d ng các màu s c ngoài các màu s c an toàn cho Web, các h  th ng ch ! h / tr  256 màu s # b rung nhi u và hi n lên các màu s c không chu &n.  tránh rung nhi u, hãy dùng 216 màu an toàn v i Web. (40 màu còn l i c a 256 màu c d  tr $ cho h  th ng máy tính.)  xem b ng các màu s c an toàn cho Web, hãy m * t p tin palette216.gif b ,ng ch  ng trình  h a c a b n. T p tin này n ,m trong th  m c Lesson03 dành cho khóa h c này trong  c ng c a b n.  xem các màu s c trong  nh d ng bi u  màu, hãy truy c p www.creationguide.com/colorchart. Các ch  ng trình  h a th "ng cung c p b ng màu an toàn v i Web  b n có th t i khi làm vi c vi các hình nh GIF. nh JPEG Ngoài các  h a GIF, trang Web c a b n c +ng có th ch a các nh JPEG. nh d ng t p tin nh JPEG c xây d ng và %t tên b,ng t ) t t c a Joint Photographic Experts Group. nh d ng hình nh này h / tr  hàng tri u màu, và JPEG c h u h t các trình duy t h / tr  r
    ng rãi. (JPEG h / tr  màu 24- bit, c coi là màu y  ho %c màu th c.) Do JPEG có th ch a hàng tri u màu, các  h a JPEG th "ng hi n th  tr c tuy n cho các nh ch p. Khi b n làm vi c v i nh JPEG cho trang Web c a mình, b n có th xác nh b n mu n l u nh JPEG theo ch  
    chu &n hay phát tri n: ° Chu n Khi b n l u hình nh là t p tin JPEG chu &n, hình nh c t i theo t )ng dòng t ) !nh màn hình xu ng, t  ng t  nh  cách t i nh GIF m%c nh. ° Phát tri n Khi b n l u hình nh là t p tin JPEG phát tri n, hình nh ban u s # xu t hi n m " m ", sau ó rõ d n khi d $ li u nh c t i lên. N u tc 
    k t n i Internet nhanh, quá trình phát tri n d "ng nh  vô hình i vi ng "i xem, thay vì th , sau m
    t kho nh kh c ng )ng l i, hình nh d"ng nh  "b t lên” trên trang. Theo kinh nghi m c a chúng tôi, nh JPEG phát tri n d "ng nh  có kích c  t p tin nh  h n và t i lên nhanh hn m
    t chút so v i t p tin JPEG chu &n. Ti ây, ch c bn ã hi u v  các t p tin JPEG, nh ng chúng tôi v (n ch a gi i thích cách l p các c u hình cho m
    t nh JPEG. Th t may m n là h u h t các ch  ng trình s a nh  u có th xác  nh các thông s  t p tin JPEG khá d dàng.  vào thi t l p t p tin JPEG trong Paint Shop Pro, hãy làm theo các b c sau: 1. M* nh JPEG trong Paint Shop Pro. (Hãy t  do th c hành v i b t k 1 nh fruit.jpg nào dành cho khoá h c này, có trong th  m c Lesson03 trên  cng c a b n.) 2. Ch n Save As t ) th c n File. H
    p tho i Save as xu t hi n. 23
30. Thi
    t k
    Web 3. Nh p vào m
    t tên t p tin m i, sau ó nh p vào la ch n  vào h
    p tho i Save Options, nh  th hi n trong Hình 3-8. Hình 3-8. Hp tho i Save Options cho phép b n  t c u hình nén JPEG và các thi
    t l p hoàn tr  trong Paint Shop Pro. 4. Xác nh m
    t l a ch n mã (Chu &n hay Phát tri n), ch n m
    t thi t l p nén, nh p OK, sau ó nh p vào Save. Kích c ! nh Mi quan tâm l n cu i cùng v  m %t k 4 thu t c a  h a Web mà chúng ta nói n trong bài h c này là kích c  t p tin, v n liên quan tr c ti p  n t c 
    t i xu ng. Là m
    t ng "i thi t k  Web, b n c n ph i quan tâm  n c m giác nôn nóng c a ng "i l t Web khi ph i ch "  i. Khi b n thi t k  các trang Web và s d ng ngh  thu t Web, b n nên  ý v n  th "i gian c a ng "i dùng. ( iu này h u nh  có v ' r t khó kh n!) Khi b n s d ng ngh  thu t Web, b n có th tranh th m
    t vài k 4 thu t s # giúp b n gi $ kích c  t p tin trong t m ki m soát. 6 ph n tr c bài h c, chúng tôi ã nói n m
    t s  ch  chính có th giúp b n gi m kích c  t p tin và th "i gian t i xu ng, bao g m: ° Tránh làm rung nhi u hình nh GIF b ,ng cách s d ng các màu s c an toàn v i Web b t c  khi nào có th , %c bi t * nh $ng khu v c màu r
    ng và ph 0ng. ° Lp c u hình cho nh JPEG hi n th  theo ki u phát tri n. Ngoài vi c s d ng hai k 4 thu t t p tin  h a trên ây, b n có th ki m soát tc 
    t i b ,ng cách gi m kích c  hình nh c a b n, c t xén hình nh và s dng nh nh . Chúng tôi ch ! mô t  ng n g n m /i k 4 thu t trong các ph n sau ây. Hãy luôn nh  r ,ng các k 4 thu t th c t   hoàn t t các thao tác nh t nh s # thay  i gi $a các công c  s a ch $a  h a. Thay i kích c !  h a M
    t trong nh $ng cách t t nh t  duy trì th "i gian t i là thay i kích c  c a hình nh trong m
    t trình s a ch $a  h a. L u ý r ,ng chúng ta ang nói v  24
31. S d ng  h a trên trang Web thay i kích c  hình nh, không ch ! n gi n là thay i khung nhìn c a bn. Phóng to thu nh  ch ! thay  i khung nhìn c a b n  i v i m
    t hình nh ch  không nh h *ng  n dung l ng th c t  c a t p tin hay kích th c. Hãy c  g ng  nh c  hình nh  n kích c  x p x ! b n mu n hi n th trên trang Web. Hình 3-9 cho th y h
    p tho i thay i kích c  mà b n s d ng trong Paint Shop Pro 7  thay  i kích c  hình nh.  vào h
    p tho i Resize, m * hình nh và sau ó ch n Resize t ) trình  n Image. Hãy luôn nh  r ,ng các hình nh nh  h n thì kích c  t p tin nh  h n, d (n  n th "i gian t i nhanh h n. Hình 3-9. Thay "i kích c # hình nh thanh kích th  c th c t
    trong Paint Shop Pro nh $m t i thi u hóa th i gian t i. "nh kích c ! hình nh Khi b n l n  u tiên thi t k  trang Web, b n có th không bi t  h a c a mình s # có kích th c nào.  giúp b n thay  i kích c   h a  n kích th c b n mu n hi n th  trên trang Web c a mình,b n có th s d ng ch  ng trình s a ch $a Web nh  Microsoft FrontPage.  xác  nh kích th c t i u cho  h a Web, hãy làm theo các b c sau: 1. Chèn  h a vào m
    t trang Web tr ng trong FrontPage và thay i kích c hình nh b ,ng cách kéo các nút ch n c a hình nh. 2. Sau khi hình nh c  nh  n kích th c b n mu n, hi n th  các thu
    c tính c a hình nh (trong FrontPage, nh p chu
    t ph i vào  h a và ch n Picture Properties trên th c n pop-up) và l u ý (sau ó hãy ghi l i) các thông s  chi u cao và 
    r
    ng c a hình nh. 25
32. Thi
    t k
    Web 3. M* l i hình nh trong ch  ng trình s a ch $a  h a c a b n và sau ó thay i kích c   h a b ,ng cách nh p các con s  mà b n ã sao chép t) FrontPage (ho %c ch  ng trình s a ch $a Web khác) vào trong các h
    p tho i thích h p. Ví d , trong Paint Shop Pro, b n m * h
    p tho i Resize b,ng cách ch n Resize trên trình  n Image, và trong MS Paint, b n m * h
    p tho i Attributes b ,ng cách ch n Attributes trên trình  n Image. Ct xén hình nh Ngoài vi c thay  i kích th c m
    t hình nh, b n có th c t xén hình nh  gi m kích c  c a nó. Khi b n c t xén m
    t hình nh, b n c t các ph n hình nh mà b n không mu n s d ng. C t xén th "ng c s d ng  xóa các ph n không mong mu n ho %c không c n thi t c a b c nh. Ví d , b n có th mu n c t xén hình nh apples.jpg nh  trong Hình 3-9  hi n th  hình nh cn c nh c a qu  táo xanh gi $a các qu  táo  trong gi . Hình 3-10 cho th y "ng c t xén ( "ng nét  t xung quanh ph n hình nh b n mu n gi $ l i) trong nh apples.jpg, kích c  ban  u là 50KB, và k t qu c t xén nh apples.jpg. Phiên b n ã c t xén ch ! có 6KB. Hình 3-10. Các i m ánh d u c t xén ch  ph n hình nh s % c s  d ng làm  ha Web. Hình nh ã c t xén ch  ch a thông tin mà b n ã bao quanh b $ng d u c t xén. Các b c th c hi n  c t xén m
    t hình nh, hãy làm theo các b c sau: 1. M* m
    t hình nh trong trình s a ch $a  h a c a b n. 2. Nh p vào công c  l a ch n (th "ng trông gi ng m
    t hình ch $ nh t ho %c hình vuông nét t trong thanh công c  ng d ng). 3. Nh p và kéo trong hình nh c a b n  xác nh vùng hình nh b n mu n gi $ l i. (N u b n xác  nh sai khu v c, n Esc và th l i l n n $a.) 4. Sau khi b n ã l a ch n, ch n Crop To Selection (trong Paint Shop Pro) ho %c Crop (trong Photoshop) t ) trình  n Image, ho %c ch n m
    t l nh t ng t  trong ch  ng trình s a ch $a  h a c a b n. 26
33. S d ng  h a trên trang Web S dng hình thu nh  Sau khi b n thành th o các k 4 x o thay  i kích c  và c t xén hình nh, b n ã s 2n sàng  s d ng hình thu nh . M
    t hình thu nh  là m
    t b c tranh nh  liên k t  n m
    t hình nh l n h n. (Hình nh l n h n th"ng cùng n
    i dung vi hình thu nh , nh ng hi n nay chúng ta v (n th y m
    t vài cách s d ng hình thu nh  sáng t o h n). Khi b n s d ng hình thu nh , ng "i xem có th ch n xem hình nh nh  và k t thúc t i ó ho %c h  có th nh p vào hình thu nh   xem hình nh l n h n. Nói cách khác, khi b n s d ng hình thu nh , bn cho ng "i xem l a ch n t i nh l n h n n u h  s 2n sàng ch " th "i gian ti hình lâu h n. M3o s d ng hình thu nh  là t o hai  h a v i cùng m
    t tên. Th "ng th "ng b n s d ng cùng hình nh cho c  hai  h a, và b n t o m
    t nh nh  v i th "i gian t i nhanh và nh khác l n h n (tùy ch !nh t i kh  n ng l n nh t c a b n) v i th "i gian t i lâu h n. Sau ó b n hi n th  hình nh nh  trên trang Web, và b n liên k t nh nh  ó t i nh l n h n. Hình 3-11 cho th y hai hình thu nh . Hình thu nh  bên trái hi n th  toàn b
    hình nh liên k t, và hình thu nh  bên ph i cho th y ph n c t xén c a  h a liên k t. Hình 3-11 c+ng th hi n  h a l n h n liên k t v i hình thu nh . B ,ng cách nh p vào m
    t trong hai hình thu nh  trong Hình 3-11, b n có th m * m
    t c a s  hi n th  hình nh l n h n c a nh apples.jpg. Hình 3-11. C hai hình thu nh  c a nh apples u liên k
    t
    n phiên b n úng kích th  c c a nh apples.jpg. S d ng nh ch p Bn có th có ít nh t m
    t s  các b c nh trong b
    tài li u c a mình. B n có th s d ng các b c nh m i và c +  b  sung thêm ngh  thu t vào trang 27
34. Thi
    t k
    Web Web c a mình. M 3o * ây là bi n b c nh thành các thông tin mà máy tính c a b n có th hi u c.  làm iu này, b n có th s d ng b t k 1 l a ch n nào sau ây: ° Máy quét : V  c  b n, m
    t máy quét ch p m
    t b c nh t ) b c nh c a b n (ho %c v # ho %c các tài li u khác) và l u các thông tin b c nh thành m
    t tp tin trên máy tính c a b n. Sau khi b n ã có m
    t b c nh quét, b n có th s d ng t p tin này nh  b t k 1 t p tin  h a nào khác. ° Các d ch v  r a phim và sao chép tr
    c tuy n: L n sau khi b n i g i m
    t cu
    n phim  r a nh, hãy ki m tra các d ch v  mà ti m ó cung c p. Nhi u hi u nh có th ghi phim c a b n vào .a CD, g i nh c a b n lên Web, g i nh cho b n qua email, t o các b n in ch t l ng t ) nh k 4 thu t s, và cung c p nhi u d ch v  s  hóa khác. ° Máy nh k  thu t s : L a ch n th  ba  có c các nh  h a là s dng máy nh k 4 thu t s . Máy nh k 4 thu t s  cho phép b n ch p nh và ngay sau ó g i b c nh vào máy tính. N u b n ang suy ngh . v  vi c mua máy nh k 4 thu t s . Cu i cùng, l "i khuyên cu i cùng trong bài h c này, b t k cách th c và ngu n b n có c các  h a trang Web, hãy nh  t i u hóa các hình nh c a b n và l u nó thành các t p tin GIF ho %c JPEG. Hãy m b o kích c  tp tin hình nh nh  nh t có th mà không ph i gi m ch t l ng nh. H n n$a, hãy l u tr $ các b c nh trong v  trí trung tâm c a  c ng, và )ng quên %t tên cho m /i  h a m
    t cái tên duy nh t và có ý ngh .a. Tng k t bài h c ° Các  h a tr c tuy n c t o nên t ) các nh i m. ° Hu h t các trình duy t h / tr  các nh GIF và JPEG. ° nh GIF nh , gi i h n * b ng màu 256 màu, và t i nhanh. ° nh GIF có th t .nh ho %c 
    ng. ° nh JPEG có th ch a hàng ngàn màu s c và th "ng c s d ng  hi n th  các b c nh. ° nh JPEG hi n th  theo dòng t ) !nh xu ng, nh ng b n có th thay i m%c nh b ,ng cách t o nh JPEG phát tri n. ° nh kích c   h a trong ch  ng trình s a ch $a  h a  các t p tin  ha trang Web c a b n nh  n mc có th . ° Ct xén nh s # gi m kích c  t p tin. ° Hãy cân nh c vi c dùng hình thu nh   liên k t n các  h a tr c tuy n ln h n. 28
35. S d ng  h a trên trang Web ° Các b c nh có th chuy n thành các t p tin hình nh b ,ng các công c  nh  máy quét, chuy n phim, và máy nh k 4 thu t s . Câu h i ki m tra 1. Tên c a nh $ng ô vuông màu nh  t o nên hình nh trên máy tính là gì? 2. Bng màu là gì? 3. Hai lo i t p tin hình nh chính b n có th s d ng trên Web là gì và khi nào thì b n có th s d ng m /i lo i? 4. nh GIF 
    ng là gì? 5. Tính trong su t là gì? 6. S khác bi t gi $ c t và nh l i kích c  nh là gì? 7. nh nh  là gì và chúng th "ng c s d ng nh  th  nào trên Web? Th c hành Bài t p 1: Bài t p này th o lu n các  nh d ng t p tin trang Web có th s dng  hi n th  hình nh.  th c hành l u hình nh trong úng nh d ng, hãy m * t p tin có tên save_as.bmp trong ch  ng trình  h a. Sau ó, l u hình nh trên máy tính c a b n thành 2 t p tin - m
    t * d ng t p tin JPEG và sau ó m
    t * d ng t p tin GIF. Cu i cùng, xem nh JPEG và GIF trong trình duy t và l u ý n b t k 1 s  khác bi t nào trong ch t l ng hình nh. Bài t p 2: M
    t cách  gi m kích th c t p tin ho %c t o nh $ng nh nh  là ct hình nh l n thành nh $ng nh nh .  th c hành k 4 thu t này, hãy m * tp tin có tên crop.jpg trong ch  ng trình  h a. S d ng Seclection Tool và các tùy ch n thc  n  c t hình nh sao cho ch ! hình chú mèo ang ng v(n còn * trong hình nh. Lu hình nh nên máy tính c a b n v i tên cat.jpg, và xem hình nh c c t trong trình duy t. Bài t p 3: Cách khác  gi m kích th c t p tin là nh l i kích c  hình nh.  th c hành nh l i kích c  hình nh, hãy m * t p tin có tên resize.jpg trong ch  ng trình  h a. S d ng các tùy ch n thc  n   nh l i kích c hình nh  n r
    ng 200 i m nh. Nh  khóa ph n t ! l  m %t  b n không bóp méo hình nh c a b n. Lu hình nh nên máy tính c a b n v i tên dog.jpg và xem nó trong trình duy t. 29
36. Không gian l u gi Sau khi hoàn thành bài h c này, b n s  có th :
    Hi u nh ng i u ki n c n thi t d  hi n th  trang Web tr
    c tuy n.
    Tìm không gian máy ch  trên Web dành cho trang web.
    Ch n ph n m m  t o, s a  i và v n hành các trang Web.
    Th  trang m Web trên các trình duy t khác nhau. Khi b n t o trang Web, b n c n ph i có s 2n sàng ít nh t hai công c  t o trang Web (có th nhi u h n). B n hãy l u ý r ,ng, chúng tôi không nói v  ph n c ng - chúng tôi ch c ch n r ,ng b n ã hi u c t m quan tr ng c a vi c có máy tính c +ng nh  có k t n i v i m
    t máy quét, máy in và máy nh (k 4 thu t s  ho %c máy nh thông th "ng). Trong bài này, chúng tôi t p trung vào các ph n m m mà b n có th dùng  t o, s a và v n hành các trang Web. Trong các bài h c ti p theo b n s # th y r ,ng b n có th t o, s a và công b  các trang Web b ,ng cách s d ng m
    t s  ph n m m ng d ng và các công c . T  ng t  nh  v y, n u b n bi t c các l a ch n c a mình, bn s # có th t o ra m
    t môi tr "ng làm vi c phù h p nh t v i nhu c u và phong cách cá nhân c a b n.  b t  u, hãy xem hai trong s  các “công c ” c  b n nh t mà b n c n trong quá trình xây d ng trang Web - k t n i Internet và không gian máy ch . K t n i Internet và không gian máy ch  Cho dù trang Web c a b n tuy t v "i  n th  nào, nó s # ch ! s ng trong vô danh n u b n không th k t n i Internet và chuy n t i các t p tin c a trang lên máy ch . B n ph i k t n i v i Internet ho %c có th truy c p m
    t k t n i Internet tr c khi b n có th có m %t tr c tuy n. Gi  d  là b n có th t o h u ht các trang Web mà không c n k t n i Internet, nh ng b n s # không th công b  trang Web c a b n lên tr c tuy n. L u ý Nu b n dùng máy tính c a b n  l t Web, ph i ch c ch n r ,ng b n ã k t ni Internet. S d ng m
    t k t n i Internet quay s  chu &n, b n có th sao chép các t p tin trang Web t ) máy tính c a b n lên máy ch có k t n i Internet. Ngoài v n  c  b n  u tiên là k t n i Internet, b n có th c n mua ch / trên m
    t máy ch  % t các t p tin trang Web c a b n. Chúng tôi nói có th b *i vì trong nhi u tr "ng h p ch / trên máy ch c cung c p mi n phí ho %c
37. Không gian l u gi  c cung c p ph  thêm cho các d ch v  tr  ti n khác. Ví d , nhà cung c p dch v  Internet c a b n (ISP) có th cung c p cho b n 30MB không gian máy ch mi n phí b  sung cho d ch v  k t n i Internet c a b n. Không gian tr c tuy n mi #n phí Ngay lúc này, b n có th t o và hi n th  m
    t trang Web mi n phí hoàn toàn. T t c  nh $ng gì b n c n là m
    t chút th "i gian và n / l c sáng t o. B n không cn b t k 1 ph n m m b  sung nào ho %c tài kho n Internet tính phí nào - không m
    t iu gì ngo i tr ) các v n b n và tranh nh c a b n, n u b n mu n có. D . nhiên, b n s # g %p m
    t vài h n ch  nh  khi b n s d ng cách này (ví d  nh  a ch ! Web dài và có th các l a ch n b  trí trang h n ch ), nh ng tùy thu
    c vào m c tiêu cu i cùng c a b n, các h n ch  này có th hoàn toàn không nh h *ng nhi u  n b n. Vì v y hãy th "ng xuyên c p nh t thông tin - không gian Web mi n phí luôn luôn có s 2n. Cách t t nh t  tr * thành m
    t ch s * h $u áng t  hào c a m
    t trang Web mi n phí là gia nh p vào m
    t nhóm ho %c c
    ng  ng tr c tuy n. M
    t trong các l i ích khi tham gia m
    t nhóm ho %c c
    ng  ng tr c tuy n (h n là y u t  “mi n phí”) ó là h u h t các nhóm và c
    ng  ng tr c tuy n giúp b n có th to các trang Web b ,ng cách cung c p các khuôn m (u và k 4 thu t mà b n có th s d ng. Trong nhi u nhóm và c
    ng ng tr c tuy n mi n phí, có ba nhóm ph  bi n nh t mà b n s # nhanh chóng ngh . t i: ° Các nhóm MSN Web ( ° Lycos Tripod ( ° Yahoo! GeoCities ( Hn ch  l n nh t c a các nhóm và c
    ng  ng tr c tuy n là a ch ! Web c a bn th "ng khá dài, nhìn chung b n ch ! nh n c không gian máy ch h n ch , các l a ch n b  trí trang c a b n th "ng b  h n ch  ho %c ki m soát * m
    t m c 
    nào ó, b n có th ph i ch u các ch  ng trình qu ng cáo b t lên m/i l n b n vào trang Web c a mình, và, n u b n không mu n s d ng m (u c a m
    t nhóm ho %c c
    ng  ng, thì b n ph i r t khéo léo khi tùy ch !nh trang web c a b n. T ng t  nh  các nhóm và c
    ng  ng tr c tuy n, có m
    t cách a lên Web mi n phí khác ó là t o các trang riêng bi t c a t )ng mi n. Khi b n l t web, b n có th th y r ,ng m
    t s  mi n Web cung c p không gian Web mi n phí cho các thành viên ã  ng ký. Ví d , b n có th t o m
    t trang About Me trên eBay (m
    t trang  u giá tr c tuy n t i www.ebay.com) n u b n là ng "i tham gia ã  ng ký. M c ích c a các trang About Me c a eBay là gi i thi u nh $ng ng "i dùng eBay v i khách th m eBay.  tìm không gian Web mi n phí, gõ t ) free Web space vào b t c  trình tìm ki m nào - b n s # c chuy n t i m
    t lo t các trang cung c p không gian 31
38. Thi
    t k
    Web máy ch cho trang c a b n. Ho %c ki m tra trang Web 100 dch v  Web mi n phí t t nh t t i www.100best-free-web-space.com. Trang này cung c p toàn cnh và x p h ng các trang, là ngu n phong phú  b n  nh v  và xem xét các d ch v  c p không gian máy ch mi n phí trên Web. Nhìn chung, i m chính v  các trang tr c tuy n mi n phí là không gian Web ngay l p t c c dành cho b n. Và khi nào b n còn ch a ng i m
    t  a ch ! trang ch Web dài dòng, m
    t s  h n ch  v  thi t k  và có th là các qu ng cáo b t lên, thì không gian mi n phí là m
    t cách hay  b t  u trang web c a b n. Mua không gian máy ch  Ng c l i v i s d ng không gian Web mi n phí, b n có th tr  m
    t ít ti n  có m
    t trang Web v i  a ch ! Web mà b n ch n mi n là ch a có ai l y cái tên ó. Khi b n i theo cách này, b n có hai iu chính áng quan tâm sau: ch n và  ng ký m
    t a ch ! Web (ví d  nh  PiL.com), và  ng ký v i nhà cung c p s # c p không gian máy ch (ho %c l u tr $) trang Web c a b n. Hãy xem làm cách nào   ng ký m
    t  a ch ! web và có c d ch v  c p không gian máy ch .  ng ký a ch  Web Tr c khi i sâu vào n
    i dung, chúng ta hãy xác nh m
    t s  t ) v ng n gi n. C  th , thay vì t )  a ch ! Web, chúng tôi s # nói là tên mi n. Nói m
    t cách  n gi n - m
    t tên mi n là m
    t  a ch ! Web. Nh  b n có th bi t ho %c không, t t c  các  a ch ! Web th c t   u là các nhóm s  (gi là Giao th c mng, ho %c IP, các s ) th c hi n ch c n ng  a ch ! Internet. B n c +ng bi t r,ng  i v i h u h t m i ng "i, vi c nh  m
    t cái tên có ý ngh .a thì d h n nhi u so v i nh  m
    t dãy s  c chia cách b ,ng các d u ch m. Do v y, H  th ng tên mi n (DNS) xu t hi n. DNS ch ! n gi n là %t tên b ,ng ký t  (ví d nh  Pil.com) cho các a ch ! Internet (ví d  nh  207.155.248.5). Do v y,  th hi n là b n hi u b n ang làm gì, b n nên s d ng thu t ng $ tên mi n thay cho a ch ! Web. Khi b n ã s 2n sàng  có tên mi n riêng c a mình, b n có th ch n m
    t tên mi n (ví d  Pil.com), xem tên ó còn có s 2n n $a hay không, và n u còn,  ng ký tên mi n cho chính b n v i m
    t kho n phí nh  hàng n m. Ch n và  ng ký m
    t tên mi n Web c th c hi n ngay sau khi b n truy cp vào m
    t trang  ng ký h p pháp. Th t may m n là InterNIC (d i s  bo tr  c a B
    Th  ng M i Hoa K 1) có m
    t trang Web li t kê t t c  các trang Web  ng ký tên mi n c ch p nh n. Nhi u trang cung c p không gian máy ch c +ng cung c p d ch v   ng ký tên mi n (nh  chúng tôi s # th o lu n trong ph n ti p theo).  xem danh sách chính th c các trang  ng ký tên mi n, hãy truy c p www.internic.net/alpha.html. 32
39. Không gian l u gi  Khi truy c p trang web c a InterNIC, hãy ki m tra m
    t s  trang  ng ký  xem b ng giá và chính sách c a h  (ho %c truy c p trang www.creationguide.com/resources.html, sau ó chúng tôi s # liên k t b n t i m
    t vài d ch v  cung c p không gian máy ch a thích c a chúng tôi). Khi tìm th y trang b n mu n, b n có th gõ tên mi n  ngh  c a mình vào m
    t h
    p v n b n. Sau ó, trang này s # thông báo cho b n bi t tên ó có s 2n hay không. N u có, b n ph i s p x p thanh toán (th "ng là b ,ng th ' tín d ng) và trang ó s #  ng ký tên mi n c a b n v i InterNIC. B c ti p theo c a b n là tìm m
    t ISP s # cung c p máy ch cho tên mi n và trang Web c a b n. Tìm không gian cho trang Web c a b n Nu b n không v n hành máy ch riêng – và h u h t m i ng "i c +ng v y - bc ti p theo c a b n là tìm m
    t ISP ho %c d ch v  cung c p máy ch s 2n sàng cung c p không gian cho tên mi n c a b n, n u b n ch a hoàn t t b c này trong quá trình  ng ký mi n (nh  mô t  trong ph n tr c). B n có th tìm th y r t nhi u d ch v  cung c p máy ch tr c tuy n - gõ Web hosting vào b t k 1 trình tìm ki m nào và b n có th ph i m t c  ngày  nghiên c u các nhà cung c p máy ch Web. Ho %c t t h n là truy c p trang m
    t trang toàn di n cung c p thông tin v  r t nhi u v n  v  d ch v  cung c p máy ch , bao g m c  danh sách 25 nhà cung c p tt nh t c p nh t hàng tháng. Cu i cùng, nh  ã nói * trên, b n có th truy cp www.creationguide.com/resources  liên k t v i các d ch v  cung c p máy ch và  ng ký tên mi n. B t k b n th c hi n tìm ki m không gian máy ch b ,ng cách nào, hãy nh  ki m tra m
    t vài chi ti t chính, ó là phí, c u hình m ng li, Microsoft FrontPage Server Extensions (n u b n ang dùng các tính n ng FrontPage), và 
    tin c y. Nhìn chung, các d ch v  cung c p máy ch Web c  b n ch ! tính m
    t kho n phí hàng tháng r t nh  cùng vi phí cài %t m
    t l n (hãy xem t )ng trang Web có d ch v  cung c p máy ch  bi t các giá c  th ). Tr ) khi m c giá quá b t th "ng, n u không ) ng  m c phí nh h *ng  n quy t  nh c a b n. Hi n t i b n ã xem xét các v n  tên mi n, d ch v  cung c p máy ch , và các l a ch n không gian Web c  b n, chúng ta ã n g n h n v i trang ch và nói v  các ng d ng c a desktop. Trong ph n ti p theo, chúng tôi s # xem xét các ng d ng ph n m m mà b n có th s d ng trên h  th ng c a b n  to, s a và công b  các trang Web và các y u t  trang Web. Các công c  t o trang Web Trong ph n này, chúng tôi phác th o các công c  mà b n có th c n  t o các trang Web, gi i thi u m
    t s  ng d ng mà chúng tôi th y có ích, và ch ! cho b n cách th c  tìm ki m các ti n ích phù h p nh t v i nhu c u c a mình. Nh  b n có th hình dung, do s  bùng n  dân s  Web, nhi u nhà cung c p ph n m m t p trung xây d ng các ch  ng trình t o trang Web. Trong bài h c này chúng tôi gi i thi u nhi u công c  (nh ng hoàn toàn không ph i 33
40. Thi
    t k
    Web là t t c  các ti n ích hi n có), và trong các bài h c ti p theo chúng tôi s # ch ! cho b n cách s d ng m
    t vài công c  này  t o các trang Web hoàn thi n. Cu i cùng, b n có trách nhi m ch n các b
    công c  ph n m m mà b n c m th y phù h p nh t  i v i b n.  n gi n hóa cách th c ti p c n c a chúng tôi trong bài h c này, ta chia các công c  xây d ng trang Web c  b n thành ba nhóm chính sau: ° Trình so n th o v n b n và trình so n th o HTML ° Các ng d ng  h a ° Các ti n tích FTP (Giao th c truy n t p tin) Trình so n th o v n b n và trình so n th o HTML Khi b n t o các trang Web, b n s # dành ph n nhi u th "i gian s d ng m
    t trình so n th o v n b n ho %c m
    t trình so n th o HTML. B n s d ng trình so n th o  t o các t p tin HTML có ch a các h ng d (n hi n th  cho các trình duy t Web và cung c p n
    i dung cho các trang Web c a b n. Khi b n s d ng m
    t trình so n th o, b n c l a ch n làm vi c v i trình so n th o c b n, trong ó b n t  nh p vào mã HTML, ho %c s d ng trình so n th o WYSIWYG chuyên sâu h n (what you see is what you get—phát âm là wizzy-wig), t o mã HTML cho b n khi b n gõ v n b n, chèn nh ho %c kéo các thành t  xung quanh vào khung nhìn trang Web. Cu i cùng, và không h  áng ng c nhiên, m
    t vài ng d ng k t h p c  hai trình b ,ng cách v )a là m
    t trình so n th o c  b n m * r
    ng nh ng không hoàn toàn là m
    t ng dng so n th o WYSIWYG - * trang sau chúng ta s # xem xét s  qua c  ba lo i trình s a ch $a này. Trình so n th o vn b n và HTML c b n Khi b n s d ng trình so n th o v n b n c  b n, b n gõ vào t t c  các l nh HTML và các v n b n trang Web c a b n vào m
    t tài liu tr ng. C  b n nh t trong các trình so n th o v n b n c  b n là ng d ng Notepad có trong h iu hành Microsoft Windows. Hình 4-1 cho th y m
    t tài li u Notepad có các v n b n HTML. Bn có th th c m c t i sao các nhà thi t k  Web l a ch n t  gõ mã các trang Web c a mình. Câu tr  l "i r t khác nhau, song  i v i h u h t m i ng "i, các nhà thi t k  Web t  gõ mã trang Web c a h  vì m
    t s  lý do sau: ° Ki m soát : Gõ mã cho phép b n s d ng các mã b n mu n thay vì các mã mà trình so n th o WYSIWYG chèn vào. H n n $a, m
    t vài trình so n th o WYSIWIG t o ra các mã “l
    n x
    n”; t  gõ mã có th t o các mã tr t t và d c, v i cách ch !nh l  mã theo ý c a ng "i thi t k . ° Sa ch a nhanh : Bi t cách t  t o và s a ch $a mã HTML cho phép các nhà thi t k  Web có th thay i nhanh m
    t trang Web, b t k trang Web ó ban u c xây d ng nh  th  nào. 34
41. Không gian l u gi  Hình 4-1. Nhi u nhà thi
    t k
    Web dùng Notepad khi t  gõ mã các tài li u HTML. ° D n mã : Nhi u trình so n th o HTML chuyên sâu (nh  s # th o lu n vào ph n sau bài này) và các ch  ng trình Office thêm các mã ph  vào tài li u. N u b n bi t cách t o và s a ch $a các mã HTML chu &n, b n có th dn ph n mã ph  và gi m kích c  các t p tin HTML c a mình. Và hãy nh  r ,ng - trên Web, kích c  c +ng áng quan tâm, và càng nh  thì càng tt. H n n $a, do trình so n th o HTML là do con ng "i thi t k  nên nhi u lúc các trình so n th o HTML c +ng có th nh mã sai trang c a b n. ° Tinh ch $nh : M
    t thói quen khác c a các trình so n th o HTML chuyên sâu là ôi khi chúng s d ng các uôi HTML mà không ph i t t c các trình duy t u h / tr . B n có th s d ng trình so n th o v n b n  s a ch $a mã HTML  nó có th phù h p v i kh  n ng c a h u h t các trình duy t. D. nhiên, bi t v  HTML là iu ki n tiên quy t  t o trang web c a b n trong m
    t trình so n th o. Trong ph n sau, chúng tôi s # d (n b n i qua các bc s d ng HTML  t o m
    t trang Web nh ,m cho b n hi u ôi chút v  HTML. Tuy nhiên, bài h c ó ch ! có tính gi i thi u. B n s # c n ph i tìm các ngu n tài li u b sung n u b n th c s  mu n bi t sâu h n v  HTML. Trình so n th o v n b n có th thay  i t ) lo i ch ! là công c  so n v n b n cho n c trang b   y  các tính n ng HTML % c bi t tùy ch !nh.  minh ho cho s  phân lo i này, chúng tôi s # mô t  ng n g n m
    t s  trình so n th o v n b n ph  bi n nh t hin nay ang c s d ng: 35
42. Thi
    t k
    Web ° HomeSite : (www.macromedia.com/software/homesite) Macromedia HomeSite là m
    t công c  thi t k  HTML ph  bi n ch ! dùng mã c nhi u nhà phát tri n Web chuyên nghi p s d ng. Trình so n th o v n b n này bao g m các tính n ng HTML %c bi t giúp b n t o các trang HTML sch và hi u qu . Ví d , nó bao g m HTML Tag Inspector, s a ch $a trên ca s  phân ôi, ti n ích b n  hình nh và nhi u tính n ng khác. B n có th t i m
    t phiên b n th 30 ngày  th s n ph &m. Hình 4-2. WordPad là m t trình so n th o v n b n t t khi mà tài li u b n ang làm vi c quá dài i v i Notepad. ° Notepad : Notepad i kèm v i h  iu hành Microsoft Windows và là trình c  b n nh t v  so n th o v n b n. Tuy nhiên, hãy l u ý: n u b n làm vi c v i tài li u dài, b n s # không th s d ng Notepad. i v i các tài li u dài, b n s # ph i dùng WordPad ( c mô t  * ph n sau). ° TextPad : (www.textpad.com) TextPad c a Helios Software Solutions c+ng là m
    t phiên b n t ng c "ng khác c a Notepad. Trong TextPad, b n có th xem b t k 1 trình  n th ' HTML trong khi làm vi c c +ng nh  v (n theo dõi các tài li u mà b n ang làm vi c hi n th "i. TextPad h / tr  nhi u thao tác Hoàn tác, iu này s # có ích khi b n làm vi c v i HTML. ° WordPad : WordPad là m
    t b c c i ti n t ) Notepad. N u b n ang ch y Windows, b n có th m * WordPad b ,ng cách nh p vào Start, ch ! t i Programs, sau ó là Accessories, và nh p WordPad. WordPad cung c p nhi u tính n ng x lý v n b n h n Notepad, và nó h / tr  cho các tài li u dài h n. Hình 4-2 cho th y m
    t tài li u HTML m * b ,ng WordPad. 36
43. Không gian l u gi  Trình so n th o v n b n và HTML thông th  ng Mc ti p theo c a trình so n th o HTML b t  u gia nh p vào l .nh v c WYSIWYG. Chúng ta có th g i các trình so n th o v n b n thông th "ng là các ng d ng t  ng t  WYSIWYG b *i vì các ng d ng cung c p các tính nng so n th o v n b n cùng v i m
    t s  h n ch  các kh  n ng so n th o HTML chuyên sâu. Do h u h t các ng d ng  u là trình so n th o v n b n ho %c trình so n th o HTML  y  tính n ng, chúng tôi ch ! gi i thi u m
    t ng d ng chính trong lo i này - Microsoft Word phiên b n 2002 và 2003. Word cho phép b n s d ng giao di n x lý v n b n quen thu
    c  t o tài li u HTML thông qua l nh Save As . Khi b n l u m
    t tài li u Word thành m
    t trang Web, Word s # t  
    ng t o mã ngu n HTML cho tài li u. Hình 4-3 cho th y m
    t tài li u HTML trong khung nhìn Web Layout c +ng nh  trong HTML Source Wiew. Hình 4-3. Word 2002 cung c p Web Layout View c &ng nh  Source View HTML. Các trình so n th o HTML chuyên sâu Nhóm trình so n th o HTML th  ba bao g m các ng d ng chuyên sâu cho phép b n t o và s a ch $a các trang Web b ,ng cách s d ng các giao di n  ha. Trong h u h t các trình so n th o chuyên sâu, b n có th xem và s a ch $a mã ngu n HTML tr c ti p c +ng nh  làm vi c trong giao di n WYSIWYG. H n n $a, h u h t các trình so n th o chuyên sâu u có tính nng xem tr c, cho phép b n xem trang Web s # hi n th  tr c tuy n nh  th  nào tr c khi b n xem trang trong trình duy t. Các trình so n th o HTML chuyên sâu ph  bi n c gi i thi u tr c tuy n, vì v y thay vì lãng phí không gian  tóm t t l i các thông s  th ng kê tr c tuy n, chúng tôi cung c p URL thích h p c a trang Web cung c p các ng d ng mà chúng tôi ch n. M %c dù cso nhi u trình so n th o khác nh ng * ây chúng tôi ch ! gi i thi u FrontPage (nh  trong Hình 4-4) là trình so n th o HTML chuyên sâu d nh t  i v i ng "i b t  u h c và cung c p các mã HTML rõ ràng và d 37
44. Thi
    t k
    Web nhìn. H n n $a, FrontPage c +ng quen thu
    c v i gi i kinh doanh. Nh  chúng tôi ã nói, b n s # làm quen v i vi c t o trang Web trong FrontPage * ph n sau. Hình 4-4. Microsoft FrontPage là m t ch  ng trình xây d ng Web  u trên khá d ' ti
    p thu. Các ng d ng  h a Khi nói v  xây d ng trang Web, các ng d ng  h a là m
    t i m quan tr ng th  hai sau các trình so n th o v n b n ho %c HTML. H n h t, h u h t các trang u s d ng  h a, và b n s # mu n t o ho %c c t xén các  h a bn s d ng trên trang Web c a b n. Do vy, b n s # c n ph i cài %t trình ng d ng  h a trên h  th ng c a b n. Ch  ng trình a chu
    ng c a chúng tôi (ho %c ít nh t là ch  ng trình mà chúng tôi th "ng s d ng nh t) Adobe Photoshop. B t k trình ng d ng  h a c a b n là gì, b n c n ph i có n m k 4 n ng chính sau khi s d ng ch  ng trình  h a  c t xén, c t, thay  i kích c , thay i màu s c và l u d i  nh d ng t p tin khác. Vì v y hãy ki m tra các tp tin tr  giúp c a trình ng d ng  ghi nh  các k 4 thu t. Hi n nay có m
    t s ch  ng trình  h a ph  bi n cùng v i các  a ch ! Web c a h  (chúng tôi gi i thi u b n truy c p các trang Web c li t kê sau  bi t thêm chi ti t v s n ph &m và giá c ): ° Paint Microsoft Paint là m
    t ch  ng trình  h a i kèm Windows. Paint là m
    t gói  h a rút g n so v i các ch  ng trình  h a khác, nh ng nó c+ng là m
    t công c   h a ti n l i khi b n c n ho %c mu n ch !nh s a các l/i nh  nhanh chóng. 38
45. Không gian l u gi  ° Paint Shop Pro ( www.jasc.com/products/paintshoppro ) Paint Shop Pro là ch  ng trình  h a cho m i m c ích, không t ti n c nhi u nhà thi t k  s d ng. n th m trang web c a Jasc  t i xu ng phiên b n th nghi m mi n phí. ° Photoshop ( www.adobe.com/products/photoshop ) Photoshop có l # là ch  ng trình s a ch $a hình nh hàng u. Có th s # h i khó kh n m
    t chút khi b n l n u s d ng, nh ng khi b n ã thành th o v i các l nh, bn s # r t hài lòng v i tính linh ho t c a ng d ng. Chúng tôi th "ng t o các trang mô hình trong Photoshop tr c khi chúng tôi t o các trang Web th t s  trong trình so n th o HTML. H n ch  l n nh t c a Photoshop là nó khá t i v i nh $ng nhà thi t k  nghi p d . Nu b n mu n a nh GIF 
    ng vào trang Web c a mình nh ng b n không mu n xây dng m
    t nh t ) kh *i i m, b n s # r t vui m )ng khi bi t r ,ng . a CD-ROM Office XP có ch a m
    t s  ho t nh nh  mà b n có th dùng trên trang Web. Các b c th c hi n  chèn m
    t nh GIF 
    ng: 1. M* Word (ho %c ng d ng Office khác), hi n th  th c  n Insert, ch n Picture, sau ó nh p Clip Art. 2. Trong ô Insert Clip Art, tìm m
    t m c clip art, sau ó nh p úp chu
    t vào m
    t m c hi n th  kèm v i m
    t ngôi sao vàng. 3.  xem ho t nh ho t 
    ng, m * th c  n File và nh p vào Web Page Preview. Nh  ã  cp * trên, nên iu ti t khi chèn m
    t thành ph n 
    ng. nh 
    ng có th làm loãng trang Web c a b n h n là làm cho nó thêm cu n hút. Các ti n ích FTP Cu i cùng nh ng không kém ph n quan tr ng, b n có th c n m
    t trong các ti n ích k 1 di u c a FTP. V  c  b n, các ti n ích FTP là các ch  ng trình cho phép b n sao chép toàn b
    t p tin t ) máy tính c a b n sang máy tính khác thông qua Internet. Bn có th tìm th y r t nhi u ch  ng trình FTP tr c tuy n, nhi u ch  ng trình là ph n m m chia s '. Các ch  ng trình FTP ph  bi n g m: ° BulletProof FTP (www.bpftp.com) BulletProof cung c p giao di n kéo- và-th  tr c giác, t  ng t  các ch  ng trình FTP hàng u khác. ° CoffeeCup Direct FTP (www.coffeecup.com/software) Ch  ng trình này là m
    t ng d ng FTP cho phép b n s a ch $a các trang HTML tr c tuyn. Trên trang T i c a trang này, b n s # th y r ,ng CoffeeCup Software 39
46. Thi
    t k
    Web còn cung c p các ánh x nh, t o nút và các trình ng d ng t o GIF 
    ng ngoài các s n ph &m khác. ° CuteFTP (www.globalscape.com/cuteftp) Trình ng d ng FTP d s dng và ph  bi n này ã t )ng r t thông d ng, và ây là trình a chu
    ng c a chúng tôi trong máy tính cá nhân. S d ng CuteFTP, b n có th kéo- và-th  các t p tin  chuy n t p tin t ) máy c a b n n m
    t máy * xa và ng c l i. Trong các trình ng d ng, GlobalSCAPE c +ng cung c p m
    t trình so n th o HTML (CuteHTML) và m
    t ng d ng ánh x nh (CuteMAP). ° Fetch (www.fetchsoftworks.com) G n ây, Fetch ã c c p nh t t i phiên b n 4.0.2 (tr c ây, trình này ch a t )ng c c p nh t t ) n m 1997!). Fetch c thi t k   truy c p vào các trang FTP m
    t cách  n gi n nh t có th . Nó mi n phí i v i các t  ch c giáo d c và t  ch c phi li nhu n; các i t ng khác ph i tr  phí ph n m m chia s '. n ây b n ã có th bi t ôi ph n v  các ch  ng trình FTP và b n có th ti chúng xu ng t ) Web, ) ng lo l ng quá nhi u v  trình này. T i ây, bi t c s  t n t i c a chúng là  – n u b n th c s  hào h ng, b n có th t i m
    t ng d ng FTP  t i các trang lên m ng sau khi b n ã t o trang, nh ng ngay bay gi " b n không c n làm nh  v y. Chúng tôi s # giúp b n x lý v i các ch  ng trình FTP và qu n lý t p tin trong ph n sau. Nh ng tr c khi làm v y, chúng tôi mu n gi i quy t m
    t vài v n  lý thú trong ph n còn l i c a bài h c. Các trình duy t Trình duy t - B n c n ph i có m
    t trình duy t (ho %c m
    t vài trình duy t) cài %t trên máy tính  b n có th xem tr c các trang tr c khi phát hành tr c tuy n. Hãy ghi nh  r ,ng các trình duy t là các ng d ng  th hi n các trang HTML. Th t không may là không ph i t t c  các trình duy t  u th hi n HTML gi ng nhau m
    t cách chính xác. Do v y, m
    t trang b n thi t k  và xem trong Microsoft Internet Explorer có th d dàng hi n th  thành m
    t ng h /n 
    n trong trình duy t khác. Th m chí các trang c thi t k  c &n th n c +ng xu t hi n khác nhau trong các trình duy t khác nhau. Có th b n mu n t i các trình duy t b  sung  xem trang c a b n s # hi n th  nh  th  nào trong các trình duy t thay th . Xem tr c các trang Web c a bn ch ! n gi n hi n th  các t p tin HTML c a b n trong m
    t c a s  trình duy t – vì v y quá trình này r t nhanh chóng và  n gi n. M %c dù v y, quan tr ng nh t là b n nên m b o r ,ng b n có th truy c p c ít nh t m
    t phiên b n (PC ho %c Macintosh) Internet Explorer và Navigator  ki m tra và xem tr c. ) ng lo l ng – chúng tôi s # nh c l i cho b n thêm vài l n n $a trong các ch  ng ti p theo v  t m quan tr ng c a vi c xem tr c các trang Web c a b n trong h n m
    t trình duy t c +ng nh  trong h n m
    t phiên b n c a trình duy t, n u có th . 40
47. Không gian l u gi  Tng k t bài h c ° Bn c n ph i k t n i Internet và không gian máy ch  hi n th  trang Web tr c tuy n. ° Bn s # th y r ,ng không gian Web mi n phí luôn luôn có s 2n tr c tuy n, %c bi t trong các nhóm và c
    ng ng tr c tuy n. ° Bn có th mua m
    t tên mi n và mua không gian máy ch  có th ki m soát hoàn toàn trang Web và a ch! Web c a mình. ° Bn có th s d ng trình so n th o v n b n  t o các trang Web. ° Trình so n th o HTML s p x p t ) các ch  ng trình thu n v n b n cho n các giao di n WYSIWYG chuyên sâu. ° Các ng d ng  h a cho phép b n t o các  h a Web, s a nh, và t o các mô hình cho các trang Web t  ng lai. ° Bn có th tìm th y các trình t o nh GIF 
    ng, các trang t o bi u ng $, và các ti n ích ánh x nh tr c tuy n (bên c nh các ch  ng trình ph n m m chia s ' và mi n phí khác). ° Các ch  ng trình FTP cho phép b n sao chép t ) xa các t p tin t ) máy tính c a b n t i m
    t máy khác. ° Không ph i t t c  các trình duy t c t o ra gi ng nhau – các trình duy t khác nhau hi n th  cùng m
    t trang Web theo các cách khác nhau. ° Bn nên th "ng xuyên xem trang Web c a b n trên in Internet Explorer và Navigator (ít nh t) tr c khi phát hành trang Web tr c tuy n. Câu h i ki m tra 1. Ba cách b n có th có c không gian ch cho trang Web c a b n là gì? 2. Trình so n th o v n b n là gì và chúng c các nhà phát tri n Web s dng nh  th  nào? 3. Trình son th o HTML khác v i trình so n th o v n b n nh  th  nào? 4. Bn ki m tra trang Web c a mình b ,ng cách nào? Th c hành Bài t p 1: Bài t p này th o lu n cách nh $ng nhà thi t k  Web th "ng dùng m
    t b
    s u t p nh $ng công c  ph n m m khi h  phát tri n trang Web. Nhìn qua bài h c và t o m
    t danh sách nh $ng ng d ng các ch  ng trình b n có th s d ng khi b n t o trang Web. Li t kê các ng d ng trong tài li u x lý vn b n. 41
48. Thi
    t k
    Web Bài t p 2: Ph n l n các nhà phát tri n Web th "ng  ng ký tên mi n và mua không gian ph c v . B c  u tiên  s * h $u m
    t tên mi n là xem th li u tên ó có còn không.  xem quá trình ki m tra tên mi n di n ra nh  th  nào, hãy n th m trang Web c a InterNIC t i www.internic.net/alpha.html , ch n công ty  ng ký, và sau ó ki m tra  xem li u tên mi n có còn không. Ghi l i các k t qu  cu
    c tìm ki m. Bài t p 3 : M
    t khía c nh nghiên c u khác mà ph n l n các nhà phát tri n Web g %p ph i là tìm công ty l u tr $ (hosting). Khi b n tìm m
    t công ty l u tr $, b n nên tìm m
    t s  % c tính c  th , nh  ã c th o lu n trong bài h c này. i v i bài t p này, n tham trang Hostindex.com ( ch n m
    t công ty cung c p máy ch , và sau ó th tìm thông tin b n c n xác  nh n u công ty cung c p máy ch ó có phù h p vi nh $ng yêu c u c a b n hay không. 42
49. Lp k ho ch cho Website Sau khi hoàn thành bài h c này, b n s  có th :
    Xác nh các m c tiêu cho m t Website.
    Phân tích nh ng khán gi c a b n.
    To ra b n k  ho ch chi ti t cho Website c a b n
    Thi t k  trang ch  và s !n sàng xây d
    ng trang c a b n. Sau khi b n ã c cung c p các ki n th c v  Web, chúng tôi s # d (n d t bn i qua quá trình t o m
    t Website. B n ã bi t các y u t  c n xem xét, v n  bây gi " ch ! là k t h p các thông tin y thành danh sách các câu h i và b n ki m kê c  th . Nh  b n ã bi t, vi c lên k  ho ch dù ít i t ) tr c s # tránh c r t nhi u r c r i s # x y ra trong quá trình th c hi n. Và c +ng ch 0ng có gì áng ng c nhiên khi tri t lý này c +ng úng v i c  quá trình phát tri n Web - m
    t s  tính toán, chu &n b  dù nh  s # a n thành công cho trang Web. Hy v ng r ,ng b n s # xem bài h c này nh  m
    t chi c c u n i gi $a lý thuy t và th c hành Web.  minh h a quá trình l p k  ho ch, hãy nhìn vào s  phát tri n c a Website Curiosity Shoppe. Hình 5-1 cho th y phiên b n cu i cùng c a trang ch c a ca hàng (www.creationguide.com/cshoppe). Trong các ph n ti p theo, chúng tôi s # gi i quy t m
    t s  v n  chúng tôi ã xem xét khi l p k  ho ch cho Website Curiosity Shoppe và gi i thích y u t  nào ã tác 
    ng  n các quy t  nh c a chúng tôi v  các v n  ó trong thi t k  cu i cùng. Hình 5-1. Trang ch  Curiosity Shoppe gi i thi u m t tr  c c a Website c a c a hàng s u t p.
50. Thi
    t k
    Web Xác nh các m c tiêu Tr c khi b n t o ra m
    t trang Web ho %c m
    t Website, tr c h t b n ph i xác nh d  án t ) m
    t cái nhìn bao quát. B n c n cân nh c rõ ràng m c ích và mong mu n  t c c a trang Web c a b n. C  th là b n c n ph i tr  l"i các câu h i sau: ° Ti sao tôi c n m
    t trang Web ho %c Website? ° Các m c tiêu tr c m t c a Website là gì? ° Các m c tiêu lâu dài là gì? ° Khung th "i gian c a tôi là gì? i v i trang Curiosity Shoppe, các câu tr  l "i cho các câu h i trên là r t rõ ràng. u tiên, ng "i s * h $u trang Curiosity Shoppe mu n c a hàng h  c các khách hàng truy c p d dàng thông qua m
    t s  hi n di n tr c tuy n. M c tiêu tr c m t c a ng "i s * h $u trang này là thông báo cho m i ng "i v  c a hàng, cung c p m
    t ph  ng ti n  khách hàng giao ti p v i h và qu ng cáo v  v  trí c a c a hàng c +ng nh  các s n ph &m c a h . K  ho ch dài h n c a h  là bán toàn b
    các s n ph &m c a h  tr c tuy n và c p nh t trang ch hàng ngày v i m
    t m c n i b t. Cu i cùng, khung th "i gian c a ng "i s * h $u có th t ng k t nh  sau: trang t .nh tr c tuy n trong vòng 2 tháng u tiên c a trang ch ; m c bán hàng s # ho t 
    ng hoàn toàn trong vòng 6 tháng sau khi trang ch i vào ho t 
    ng; và t t c  các s n ph &m tr c tuy n s # s 2n sàng trong vòng 12 tháng t ) ngày trang ch ho t 
    ng. Các m c tiêu và khung th "i gian c a b n có kh  n ng là ít ph c t p h n c a Curiosity Shoppe. Ví d , các m c tiêu c a b n có th ch ! n gi n là t o ra m
    t b n lý l ch tr c tuy n và cho b n lý l ch y i vào ho t 
    ng trong tháng ti, và th !nh tho ng c p nh t thêm vào n u c n thi t. Tìm hi u v  ng %i xem Sau khi b n ã v ch ra c các m c tiêu c a trang Web, b n c n ph i bi t ai là ng "i s # ghé th m trang Web c a b n. Nói cách khác, b n c n ph i ngh . v  khán gi  c a b n. Ít nh t b n ph i có m
    t s  hi u bi t v  ng "i mà bn mu n h  ghé th m trang Web c a b n. B n c n ph i x lý b c l p k  ho ch t ) s m trong quá trình t o trang Web b *i vì r t nhi u quy t  nh v  n
    i dung và thi t k  là d a trên khán gi  c a b n. Cách t t nh t  bi t v  khán gi  c a b n là trò chuy n v i h , n u có th . Bn có th ngh .  n vi c ph ng v n ho %c kh o sát nh $ng ng "i s # xem trang Web c a b n. Ví d , n u b n ang làm m
    t trang Web gia ình, b n hãy g i cho các thành viên c a gia ình và tìm hi u xem h  mu n a cái gì lên trang Web. Bên c nh ó, ph i xem xét ng "i s d ng s # k t n i v i trang c a b n b ,ng cách nào. Có ph i h  là nh $ng ng "i l t Web i n hình vi các k t n i quay s ? N u úng là nh  v y, hãy gi $ cho b  trí trang n 44
51. Lp k
    ho ch cho Website gi n và kích th c trang bé. B n ang thi t k  m
    t trang Web cho nh $ng ng "i ch i trò ch i tr c tuy n? V y hãy s d ng các k t n i t c 
    cao và các công ngh  m i nh t. B n ang thi t k  trang Web cho tr ' con? Nh $ng màu s c sáng là l a ch n t t. B n ã có ý t *ng. Nh ,m giúp b n phân tích khán gi , b n hãy tr  l "i các câu h i sau: ° Ai là thành ph n khán gi  chính mà tôi ang h %ng t i? Câu tr  l "i c a b n có th s # bao g m các thành ph n nh  khách hàng, sinh viên, các ông ch , các thành viên gia ình, các thành viên c a câu l c b
    ° Khán gi  mu n tìm ki m cái gì t & trang Web c a tôi? Câu h i này khác v i câu h i b n mu n nói gì v i khán gi  c a b n - * ây b n ph i th c s  l ng nghe nh $ng khán gi  c a trang Web  t ) ó b n có th thi t k m
    t cách phù h p nh t. ° Các khán gi  c a tôi quen thu
    c v i Web ' m c 
    nào? Bn c n bi t c a s  ng "i s d ng là nh $ng ng "i m i h c, nh $ng ng "i duy t Web thông th "ng hay là nh $ng nhà chuyên nghi p v  tin h c. Bi t c mc 
    thành th o trong vi c s d ng Web c a ng "i s d ng là r t quan tr ng b *i vì m %c dù các ng "i s d ng có kinh nghi m s # bi t c “ iu gì s # x y ra ti p theo” trong m
    t trang Web c thi t k  ph c t p ho %c ít th y thì nh $ng ng "i m i b t u s d ng Web l i c n thêm h ng d (n. Ví d , n u b n ang ph c v  nh $ng ng "i m i b t u s d ng, b n nên to c u trúc trang Web m
    t cách rõ ràng, nh t quán thông qua các ph n t hoa tiêu  n gi n; dành các thi t k  và các l c  hoa tiêu m i cho nh $ng khán gi  có nhi u kinh nghi m h n. ° Lo i k t n i Internet và t c 
    c a các k t n i mà ng %i s  d ng có là gì? Bi t c khán gi  c a b n c k t n i thông qua modem thông th "ng, qua m ng n
    i b
    c a doanh nghi p, ho %c k t n i tc 
    cao nh  m
    t "ng dây thuê bao s  (ADSL) s # d (n n cách thi t k  trang Web c a b n s # khác nhau, bao g m c  các ki u c a các ph n t b n s # s dng. ° Các khán gi  quan tr ng c a tôi ' âu? B n ph i xác nh c là các ng "i ghé th m trang Web c a bn * t i n i làm vi c, * ký túc xá, hay trong phòng khách, * các quán cà phê internet, hay * ngay nhà hàng xóm c a b n. %c i m này liên quan m t thi t vi câu h i tr c ây - n u b n bi t các khán gi  ch y u c a b n * âu , b n s # d dàng oán c lo i kt n i mà h  s d ng  truy c p trang Web c a b n. H n n $a, v  trí còn quan tr ng n u b n ang thi t k  m
    t trang a ph  ng ch  không ph i m
    t trang c p qu c gia. ° Nhóm tu i in hình c a các khán gi  là gì? B n mu n ch c ch n r ,ng trang Web c a b n ph i h p d (n i v i nhóm tu i khán gi  mà b n ang hng t i. Câu h i này b t ngu n t ) m
    t iu th c t  - dù b n có thích nó hay không, b n v (n có th có m
    t s  gi  thi t (dù mang tính b o th ) d a trên l a tu i c a khán gi , và nh $ng gi  thi t này có th giúp b n trong 45
52. Thi
    t k
    Web su t quá trình t o trang Web. Bi t c l a tu i i n hình c a các khán gi  c a b n s # giúp b n có các quy t nh v  thi t k  h p lý. ° B(ng cách nào ng %i s  d ng tìm th y trang Web c a tôi? Bn mu n bi t r ,ng m i ng "i bi t n trang Web c a bn thông qua truy n mi ng, t) các th  m c tr c tuy n, t ) các danh b in tho i ho %c các th  m c v  Web, t ) các liên k t t ) các trang m 3, là k t qu  c a các máy tìm ki m, qua các qu ng cáo th  ng m i ph i tr  ti n trên TV ho %c radio. T ) ó b n s # bi t b ,ng cách nào  qu ng cáo t t nh t v  trang Web c a b n. V thi t k chi ti t cho trang Web Sau khi thi t l p c các m c tiêu c a b n và xác nh c khán gi , b n ã s 2n sàng  thi t k  nên b
    khung cho trang Web c a b n. N u có th , bc  u tiên c a b n nên là thu th p n
    i dung tr c khi thi t k . T  ch c n
    i dung - ho %c ít nh t là các khái ni m chính - có th giúp b n t  ch c toàn b
    trang Web m
    t cách h p lý. Sau khi b n ã thu th p c các lo i thông tin chính mà b n mu n a lên trang Web c a b n ()ng lo l ng - t i th "i i m này ch a c n ph i trau chu t các hình v # và ch $), b n c n ph i tìm ra cách t t nh t  trình bày thông tin c a mình. Ví d , b n có th t  ch c trang Web c a b n theo nhi u cách khác nhau, bao g m các lo i sau: ° Theo th  t  ch $ cái ° Theo th  t  th "i gian ° Bi u  ° Dng phân c p ° Theo s  l ng ° Ng (u nhiên (không c khuy n ngh  - tuy nhiên ã t )ng có) ° Theo ch  n nay, h u h t các trang c t  ch c theo ki u phân c p. M
    t trang có tính phân c p có trang ch ch a các dòng ch $ gi i thi u h p d (n và các liên kt  n các trang chính. Thi t l p này c s d ng r t r
    ng r i b *i các nhà thi t k  và c các ng "i s d ng ánh giá cao (ph n l n nh $ng ng "i ch ! mu n s d ng trang Web mà không c n suy ngh . chúng c t  ch c nh  th  nào). M
    t khía c nh r t quan tr ng (m %c dù kém h p d (n h n) c a vi c t  ch c trang Web c a b n liên quan n vi c % t tên cho các t p tin. Cu i cùng, khi bn rút l i công vi c, trang Web c t o thành hoàn toàn t ) các t p tin - do ó vi c t  ch c trang Web c a b n ph i bao g m c  vi c h  th ng hóa các tp tin. Tr c khi chúng ta t i ph n bn li t kê các mc lp k  ho ch cho 46
53. Lp k
    ho ch cho Website trang Web, ta hãy xem xét m
    t s  bài t p v  % t tên mà sau này b n có th áp d ng. L u gi các tp tin Nh  b n ã bi t, các trang Web th "ng bao g m m
    t s  ít t p tin k t h p vi nhau  t o ra di n m o cho m
    t trang. H n n $a, m
    t Web site bao g m nhi u trang Web (và m
    t trang web l i bao g m nhi u t p tin). Do tính ch t c a các trang Web và Web site là g m nhi u t p tin nên b n s # ph i l p k  ho ch cho vi c % t tên và t  ch c các t p tin cho Web site c a b n. (Trong các bài tr c, chúng tôi gi i thích cách chúng tôi t  ch c các t p tin c a m /i site, do ó b n s # có nhi u c  h
    i  hi u c cách % t tên và t  ch c các tp tin tr c khi k t thúc khóa h c này.) i v i ph n l n các tr "ng h p, m
    t Website tiêu chu &n có th g m c u trúc n gi n nh  cho th y trên Hình 5-2: Hình 5-2. Bn l u gi  các th  m c và các t p tin cho Web site trên máy tính tr  c khi b n sao l u chúng lên m t máy ch  có k
    t n i v i Internet. ° Th m c chính Ch a các t p tin HTML và m
    t th  m c nh. B n có th %t tên b t k 1 cho danh m c này khi thi t k  các trang trên máy tính c a bn. Khi b n t i các trang này lên m
    t d ch v  máy ch , b n s # %t n
    i dung c a các th  m c ch a danh m c chính vào m
    t th  m c tr c tuy n có tên là “Web” và sao l u toàn b
    th  m c nh vào th  m c Web. ° Th m c nh Ch a các t p tin nh GIF và JPEG (ho %c JPG) c s dng trên các trang Web c a b n. Th  m c này th "ng c l u gi $ trong th  m c chính. Lu ý r ,ng trên Hình 5-2 th  m c chính ang g m b n t p tin HTML - contact.html, history.html, index.html, và products.html - m /i t p tin cho m
    t trang chính c a Web site. B n ph i nh  r ,ng tên c a m
    t t p tin HTML là tên xu t hi n trên a ch ! URL c a trang Web. Ví d , mu n ghé th m trang S n ph &m c a Web site Curiosity Shoppe, b n s # gõ www.creationguide.com/cshoppe/products.html. Nh  b n có th th y,  a 47
54. Thi
    t k
    Web ch ! URL này bao g m tên mi n (www.creationguide.com), tên th  m c hay th  m c (cshoppe), và tên t p tin (products.html). i v i h u h t các trang ch và các trang con, b n có th th y r ,ng b n không c n ph i gõ vào tên t p tin. N u không có tên t p tin HTML c ch ! ra sau tên mi n hay tên th  m c, h u h t các máy ch theo m %c  nh s # hi n th  m
    t tên t p tin %c bi t - a s  là index.html, m %c dù m
    t s  máy ch c+ng h / tr  các tên index.htm, default.htm, ho %c default.html. H y h i d ch v cung c p máy ch  bi t b n nên dùng tên nào cho trang ch c a b n (ho %c ki m tra m /i tên t p tin tr c tuy n  bi t tên t p tin nào c m %c nh s d ng); thông th "ng index.html là tên c % t cho trang ch c a bn, và ó c +ng là cách an toàn nh t  i v i b n khi b n không ch c ch n nên dùng tên nào. B*i vì tên các t p tin HTML c a b n s # xu t hi n trong  a ch ! URL c a trang Web c a b n, b n nên tuân theo m
    t s  quy t c n gi n saus: ° Tên các t p tin c n ph i ng n,  n gi n và có ý ngh )a Ng "i s d ng có th mu n truy c p tr c ti p n các trang ph , vì th  nên t o ra URL  h có th d dàng nh  và gõ. Ví d , s d ng m
    t t p tin có tên “products.html” thay vì “p1-2002m.html.” ° Tránh dùng các ký hi u và d u ch m câu H u h t m i ng "i u th y r,ng gõ các ký hi u ho %c thêm các d u ch m câu s # làm ch m t c 
    gõ c a h  áng k và làm cho h  gõ sai r t nhi u. H n n $a, các ký hi u và d u ch m câu có th t o ra ki u nh m l (n m i. Ví d , n u trang c a b n c %t tên www.creation-guide.com , ng "i s d ng có th d dàng quên m t d u g ch ngang và gõ www.creationguide.com . ° S d ng d u g ch d i (_)  ch $ th  m
    t kho ng tr ng M
    t s  máy ch tr c ây không nh n ra c các kho ng tr ng, vì v y nên s d ng các d u g ch d i  ch ! th  các kho ng tr ng. H n n $a, b n c +ng s # g %p rc r i v i các kho ng tr ng nh  v i các ký hi u và d u ch m câu - các kho ng tr ng r t d b  quên và d (n n các nh m l (n (r t nhi u). ° S d ng hoàn toàn các ch th %ng M
    t l n n $a, hãy ngh . n m c tiêu “s d ng d dàng” cho các khách ghé th m Website c a b n. Tên các t p tin trong URL là phân bi t ch $ hoa v i ch $ th "ng, do ó m
    t ch $ hoa không theo quy lut s # làm cho b n m t i m
    t s  khách ghé th m. Tên tp tin có toàn b
    ch $ th "ng s # d dàng khi gõ và nh . "*t tên cho hình nh Bên c nh % t tên cho các t p tin HTML, b n c +ng c n % t tên cho các t p tin nh. Nói chung ng "i s d ng không truy c p tr c tip các t p tin nh mà các trang HTML tham chi u các t p tin nh b t k 1 lúc nào chúng c n hi n th . Vì v y, b n s # khó kh n h n khi %t tên cho các nh c a b n. M
    t bí quy t % t tên nh mà chúng tôi s d ng là nh n ra m c ích c a nh ó qua m
    t ti n t  n gi n trong tên t p tin, s # giúp chúng ta nh n d ng và tìm 48