u.v n ed ui n- ww w lib A dobE ui ed u.v Hướng dẫn thực hành _ ỵ ^ Ể ~ ^ c i-< y w lib D re a m w e a v e r C S ? ui ed u.v n- ww Chỉ dẫn hình cho người sử dụng -w ww lib Sách hướng dẫn bạn đọc kỹ làm việc thành thạo với Dream w eaver CS5 để tạo trang Web ấn tưỢng thu hút người xem ed u.v n Sách hướng dẫn bước nâng cao chèn đoạn phim Flash, sử dụng applet Java, tạo biểu mẫu (form), thử nghiệm Web site, quản lý W eb site chuyển site đến Internet ww w lib ui ed u.v n -w ww lib ui Sách có bố cục rõ ràng kèm hình ảnh minh hoạ trực quan, ví dụ đưỢc lấy từ thực tế giúp bạn dễ dàng thực bước tác vụ mau chóng nắm vững kỹ thiết k ế Web với D ream weaver CS5 NHÀ XUẤT BẢN HỒNG ĐỨC u.v n ed w lib ui ed u.v n- ww w lib ui Chướng 1: Chuẩn bị lên kế hoạch Web site ui ed u.v n- ww Chuẩn bi• lên kế hoQch • LUeb site lib Trong chtứAig bạn bắt đầu với điểm sail đây: -w ww ^ Bắt đầxi với kế hoạch n Tạo đồ tư chiy tníc quan n Tạo Timeline ed u B Lổip ghép Site ui M Tạo kế hoạch nổị) tbị lib lÊ Tạo Storyboard ww w H Tạo Folder Root cục Site n- Giói th iệu D ream w eaver CS5 ww w lib ui ed u.v Có lẽ bạn nghe đến câu nói: Một hành trình 1000 dặm bắt đầu với bước Cho dù điều hồn tồn hợp lý, có điều khác phải hoàn th n h trước thực bước có tính chất định hoạch định cách Cô" th iết k ế W ebsite phức tạp mà không hoạch định cách giống chuyên từ New York đến California mà khơng có đồ đường Có thể bạn hiểu bạn cần theo hướng u.v n ed ui _ Chường 1: Chuẩn bị lẽn kẽ' hoạch Web site ww w lib phía Tây; nhiên khơng hoạch định cách, có lẽ bạn nhầm khúc cua trước đến đích cuối Do hoạch định phần hành trình phần dự án th iế t kế Web ed u.v n- Hoạch định cho Web site địi hỏi hiểu hai lĩnh vực chính: kiến thức ứng dụng mà bạn sử dụng (khía cạnh logic) kiến thức hướng mà bạn muốn mang dự án Web theo (khía cạnh sáng tạo) w lib ui Dreamweaver giúp dự án thiết kế Web tiến hành trơn tru hơn, cho dù bạn xây dựng website từ đầu, cộng tác với đội th iết kế Web nơi Do trước bắt đầu tiến trình hoạch định, bạn cần có kiến thức Dreamweaver có khả làm điều ui ed u.v n- ww B ất kể phạm vi dự án, dành trước chút thời gian để suy xét qua cấu trúc site (cấu trúc layout toàn trang tùy chọn để định hướng site), phát triển diện mạo (thiết kế, giao diện đồ họa) thu thập nội dung thông tin mà bạn muốn đưa lên tran g site) Khi công việc sơ hồn tất, bạn nhảy vào việc phát triển, dàn dựng, khởi động việc bảo trì site rấ t quan trọng -w ww lib Tạo kế hoạch tồn diện dự án để đơn giản hóa tiến trìn h tạo Web site phức tạp đồ đường, giúp bạn hướng bạn thực chuyên hành trình ngàn dặm Bắt đ ầ u vói kế hoạch ui ed u.v n Trước bạn khởi động phần mềm bắt đầu tạo trang Web, bước trở lại bước từ tiến trình tự hỏi bạn nhắm vào điều việc th iế t kế Website Bạn nhận trợ giúp việc trả lời câu hỏi bàng cách tự hỏi thêm câu hỏi sau đây: lib u Ai thiết kể site nỉiy? -w ww M Các mục tiêii site gp ^ Site đítợc hồn thành nìio? Tại tơi làm điền này? ed u.v n n Khán giả mục tiên tơi ¡à gì? ww w lib ui Ai thiết kế site này? Trong trường hợp câu trả lời bạn Bạn có trách nhiệm thứ từ việc tạo đồ họa từ thứ đến việc gõ nhập văn bản, chí đến việc nén video Vì bạn biết Dreamweaver, cấu trúc site từ đầu tất tùy thuộc vào bạn It bạn nghĩ u.v n ed ui Chương 1: Chuẩn bị lên kế hoạch Web site ui ed u.v n- ww w lib Ví dụ, bạn biết Dreamweaver từ đầu đến cuôl, bạn biết sơ" ứng dụng khác mà bạn cần sử dụng chẳng hạn Photoshop, Illustrator, Flash Fireworks; nói đến vài ứng dụng Nếu bạn thiếu hiểu biết ứng dụng thiết yếu khác, có th ể bạn cần nhờ đến chuyên gia khác Ngoài nhiều n hà th iế t kế Web có th ể lắp ghép trang Web cách dễ dàng thiếu hiểu biết cách tải quản lý site đến Server Và việc tiếp thị site bạn sao? Bạn nghe đến câu nói, xây dựng họ đến hay khơng? Nhiều người đă xây dựng website khơng có người đến Tại sao? w lib Không biết chúng tồn Câu hỏi: Ai th iế t kế site này? giúp bạn tập trung không vào trò chơi cuối mà giúp bạn đến ww Các mục tiêu site gì? ww w lib ui ed u -w ww lib ui ed u.v n- Bạn ngạc nhiên (hoặc bạn khơng ngạc nhiên) thấy người xây dựng website, khơng có mục tiêu rõ ràng họ mn site hồn thành (chỉ nói đến số’ khách hàng tơi) Một Website nói việc giao tiếp, đơn giản dễ hiểu Ví dụ mục đích cho c"n sách hướng dẫn bạn cách sử dụng Dreamweaver cách logic sáng tạo, dễ hiểu đơn giản Chúng ta nói mục đích Website đạt thêm cơng việc kinh doanh, mà hầu hết site thương mại thiết k ế để thực Tuy nhiên muốn th àn h phần site dành riêng cho thơng tin túy miễn phí; vùng dành riêng cho thơng tin mẹo vặt thủ thuật việc chụp ảnh đẹp Một website có nhiều mục tiêu, điều quan trọng phải xác định chúng từ đầu Nếu bạn khơng có mục tiêu xác định rõ ràng cho site, làm th ế bạn biết liệu bạn có thành cơng hay khơng? Phần sau nói cách bạn giám sát mục tiêu th ế nào; việc xác lập chúng Nếu bạn hiểu mục tiêu cuôl site dừng đừng tiến phía trước bạn có th ể xác định chúng Site hoàn tất nào? ww w lib ui ed u.v n- Trong điều nghe bình thường, có th ể bạn biết nhà th iết kế Web giỏi th ấ t nghiệp họ hứa khơng thực Vì bạn thiết kế site này, câu hỏi trở nên chí quan trọng cho bạn kỳ hạn cố gắng đạt R ất dễ vấn đề cần xem xét khác xen vào việc hoàn thành site Và có lý hợp lý khác th ế giới thương mại, thời điểm có tính chất định cho nhiều người mùa mua sắm dịp lễ Từ CI tháng 11 đến cl tháng 12, nhiều nhà bán lẻ kiếm nhiều tiền u.v n ed Chương 1: Chuẩn bị lên kế hoạch Web site ui 10 w lib ui ed u.v n- ww w lib Bạn tin bạn bán nhiều ảnh m ình thời gian năm bạn hoạch định cho site hoàn th n h hoạt động ngày lễ Nhưng điều th ậ t có nghĩa gì? Sự th ật có nghĩa site vào hoạt động muộn nh ất vào th án g Điều cho site thời gian để tạo index tất m áy tìm kiếm cho bạn thời gian để giải trở ngại có th ể có việc vận hành site Điều tồi tệ n hất mà bạn muốn xảy xây dựng site vào tháng 11 sau ichám phá module shopping cart đầy cố Xác lập ngày tháng hợp lý đạt sau làm việc hướng đến mục tiêu Hợp lý đạt có dựa vào kiến thức bạn site, phức tạp bạn m ất khoảng để làm thứ bạn phải dành thời gian ngày cho dự án Khán giả mục tiêu đâu? ui ed u.v n- ww Làm th ế bạn biết để đặt vào site bạn trừ bạn hiểu khán giả bạn đến từ đâu? Đến từ đâu khơng có nghĩa vị trí địa lý (mặc dù điều quan trọng) Khi bạn th iế t k ế website cho khách hàng, bạn muốn tìm hiểu người mà ghé thăm site Thực tế điều khơng thực tiễn cho Sau cùng, bạn không gõ cửa trước khách tham quan, ngồi xuống với tách cà phê thảo luận mà khách hàng thích khơng thích .ha ui ed u.v n -w ww lib Những bạn tìm giai đoạn khám phá ý kiến khái quát khách tham quan bạn ai: loại người mua ảnh video tôi? Một bạn nắm sô' liệu thống kê doanh số khán giả, bạn thiết kế site dựa vào tham số dó Ví dụ, bạn thiết kế website cho người 60 tuổi khác nhiều so với site dành cho công ty lớn chẳng hạn General Elec­ tric Williams-Sonoma Phần sau chương nói thêm cách hồn th àn h điều Tuy nhiên điều quan trọng phải hiểu khán giả mục tiêu .lib Tại phải làm điều này? ww w lib ui ed u.v n -w ww Mặc dù điều dường gần giơVig với mục tiêu cho site, đơn giản công cụ làm động thúc đẩy Ví dụ, mục tiêu site tăng công việc kinh doanh bạn, cuối mục tiêu bạn chia sẻ công yiệc chụp ảnh với th ế giới Nó đảm bảo an tồn Ví dụ bạn nhà nhiếp ảnh cho người khác phòng studio họ cơng việc kinh doanh khơng thú vị thế, bạn chắn bạn xếp hàng chờ th ất nghiệp từ lâu Mục đích bạn để thiết kế W ebsite mục đích cá nhân mà bạn có nhiều năm; để bắt đầu công việc kinh doanh riêng bạn, bạn trở thành nhà nhiếp ảnh cho riêng u.v n ed ui Chướng 1: Chuẩn b| lẽn ké' hoạch Web site _ 11 ww w lib Thiết k ế W ebsite khơng nói việc kiếm tiền Bạn ngạc nhiên tự cho m ình câu hỏi: Tại tơi làm điều này? Nó thúc dẩy bạn khơng chĩ hồn th àn h cơng việc lúc mà cịn làm cơng việc hồn tồn tốt nhâ't Đây giấc mơ trở thành th ậ t bạn n- Tợo S0 đồ tư trực quan ed u.v Có nhiều cách để mở rộng ý tưởng đơn giản thành thiết kế phức tạp Cách ưa thích việc tạo đồ tư ww w lib ui Các đồ tư có nhiều ứng dụng vấn đề cá nhân, gia đình, giáo dục cơng việc kinh doanh Các ý tưởng chèn vào đồ quanh ý nghĩ trung tâm (hạt giông) mà tổ chức đến từ phân câp xếp trình tự (kết nhóm tổ chức dành riêng cho giai đoạn sau đó) Một đồ tư gồm bốn yếu tố bản: n- K Ý tỉiởng (bạt giống) đtiợc đặt tâm trang trống ed u.v K Các chủ đề (theme) ý tìtởng tning tâm tỏa tùcinh tning tâm đìtịng nối nhánh .ha ui u Mỗi nhánh chứa từ ý tưởng phụ tỏa từ nhánh -w ww lib ^ Các nhánh hình thành cấu tnĩc kết nối trở lại ý tưởng tning tâm ed u.v n Thời gian tố t n h ấ t để tạo đồ tư dự án bạn hoàn toàn cảm thấy thư thái điềm tĩnh với thứ xung quanh Hãy nhớ, đồ tư nói kết hợp tự -w ww lib ui Quay trở lại đồ tư Web site Tên doanh nghiệp bạn YouTechTube, nơi để lưu trữ hiển thị video gia đình cơng nghệ Bắt đầu tiến trình việc tránh khỏi điểm gây xao nhăng, tắ t máy truyền hình, rời khỏi máy điện thoại di động Nhạc hồn tồn tùy chọn giúp tập trung đầu óc bạn việc loại bỏ tiếng ồn gây xao lãng Các liệu mà bạn cần số’ giấy trắng trơn bút chì màu, lời giải đáp cho câu hỏi phần "Bắt đầu với kế hoạch" tâm trí thơng s't ww w lib ui ed u.v n Bắt đầu việc vẽ hình trịn trang viết tiêu đề site hình trịn Bạn vẽ đường từ hình trịn tâm, nhánh trê n nh án h bạn viết từ, Application Sau sử dụng nhánh nhỏ này, bạn bắt đầu liệt kê ứng dụng mà bạn cần đến để hoàn th àn h mục tiêu bạn: Dreamweaver, Flash, Photoshop, Final Cut Pro, Khi bạn viết Final Cut Pro, bạn nhận bạn khơng có nhiều kinh nghiệm với ứng dụng Tuy nhiên rấ t quan u.v n ed ui 12 _ Chướng 1: Chuẩn bị lẽn kẽ' hoạch Web site ww w lib trọng việc thiết kế nén file video Một người bạn tốt bạn Harold Driver chuyên gia bạn tạo nhánh nhỏ kế bên Final Cut Pro ghi Contact Harold ed u.v n- Tiến trình kết hợp tự ý nghĩ chắn dẫn đến ý nghĩ liên quan khác Nếu b ất lúc bạn dường dừng lại, việc đọc lại câu trả lời mà bạn đưa cho năm câu hỏi mà bạn thực phần "Bắt đầu với kế hoạch” trước cho bạn nguồn cảm hứng tinh thần để tiếp tục ww w lib ui Một đồ tư hồn chỉnh, bạn muốn làm việc nhập thông tin từ viết tay vào xử lý văn Đôi việc gõ nhập lại chi tiết đồ tư duy, việc nhận thứ mà có lẽ bạn quên giúp ích Nếu bạn thích làm đồ tư máy tính hơn, tham khảo Web site sau đây: K Mindmap u.v n- bttp://unvw.mindmap.com/EN/mindmaps/definition.html ui http://imưw.inspiration.com/ ed M Inspiration .ha K MỉndGenỉus -w ww M M ind manager .lib hnp://unvw mindgenhis.com/ bttp://iưu)W.mindjet com/i ik/ ed u.v n M M ind tools http://tưwu>.mindtools COÌYƯ lib ui Hãy nhớ đồ tư khịng khỏa bạn cị dịnh; đơn giản trìn h bày ý tưởng cách bạn tiến hành xây dựng Web site th ế u.v n -w ww Tiến trình lập đồ tư cho dự án đơn giản diễn nhanh Dự án phức tạp, đồ tư phức tạp Tuy nhiên thời gian sử dụng tốt Hầu hết nghiên cứu cho thấy việc hoạch định dự án phức tạp cuối tiết kiệm thời gian lên đến 20% Bản đồ tư ww w lib ui ed Một đồ tư hoàn chỉnh, dành chút thời gian để vẽ băng tay số diện mạo trang Website Bạn bắt đầu việc vẽ hình chữ nhật mẫu giấy phác họa thô nơi bạn muôn đặt thành phần trang; xếp đồ đạc phòng, đặt thành phần trang nơi khách tham quan cảm thây thoải mái dễ tiếp cận chúng nhât u.v n Chương 1: Chuẩn bị lên kê' hoạch Web site M ain p iQ ( ww w lib Ỡ ui ed 13 \ .r * T « x ti - ^ R M O U K rtrt^ id ; ui i? ; }? O v a le iin io /I w lib u ẠđeẠ«n*jh Ọ m;f ji L i'io Timtlhiri ■ •V i N^9»*io>i'^ i.OwilM "ft:Rttourtfti Rttourtftirit«a»d riHNÌed'1 Ì o »V9 images Ktiouf«» Accdtd' ww o oniin* twir ^ord ed Q myMhl»,^ ,r ' ĩ ' ^ c Ạứưbt Contnbotff, 'Ị?it:1uịOurái'n»KÌtđT^ LJ ilArt d^e If ãf>ằ4ô(n.f --y.MUAl-iớớM u.v ^ nô4điirc#i Aôằ^' ^ iTớớioutcti fiitied I n- y I W.iWflcomf O.iWfl WiHPi.f*>«4 C J » » rv r » It« j“ "' I t ^ I • " X T -i ■ L J4«nifto/T » JJM iflM n g j- 'V ; ClrUlm ^fi ! — o rin#i Cvl A fp it rin#Ị ( u.v n- '[' ftJ õ ỹ ^ r r \ Ị O,cọnjut vh ? ConJoci ]lé vm: I re m e l« ị >crvv* ui ed u.v li Ỉ77 lib L ắp r p site ed u.v n -w ww P hần lớn bạn hồn th àn h không sử dụng máy tín h (trừ bạn sử dụng máy tín h để tạo đồ tư lưu đồ) Trong tiến trìn h dường tẻ nhạt, thực tế hồn tồn đơn giản T hật bạn trả i nghiệm lợi ích việc hoạch định site cách, bạn không thio’t kế dự án khác mà khơng có kế hoạch -w ww lib ui P hần tiến trìn h đòi hỏi thu th ập "thứ" mà bạn cần để hồn th àn h dự án Đó ứng dụng hình ảnh, hoạt hình, text, tấ t thứ tạo nên site phù hợp Dù tin hay không, dự án web điển hình, Dream weaver nơi cl bạn đến; nơi Hãy nghĩ theo cách này: Dream weaver ứng dụng layout th iế t k ế trang Để sử dụng nó, bạn cần thứ để "layout" (sắp đặt) u.v n T/tu thập thông tin vê khách tham quan bạn ww w lib ui ed Như trước đề cập câu nói: "Hãy xây dựng họ đến" khơng n h ấ t th iế t đặc biệt nói đến th iế t k ế Web Bạn cần thông tin Nếu bạn tiến hành nghiên cứu nhân học (còn gọi giai đoạn khám phá) dựa vào khán giả mục tiêu, làm việc Nếu điều dường chống ngợp, có nhiều site chun cung câp cho bạn xác loại thơng tin u.v n ed 15 ui Chưởng 1: Chuẩn bị lên kế hoạch Web site D anh sách sau vài sô' site khám phá có: ww w lib u http://wunv.omnihire.com/ u hưp://ivtưw.peunntemet.org/ K bttp://intemet-statistics-gĩiide.netfirms.com/ u.v n- ^ http://unvw.iv3-org/ ed u.v n- ww w lib ui ed Một nghiên cứu nhân học cho bạn biết loại người ghé th ám site bạn, họ họ có loại kiến thức web Thông tin quý giá việc tạo th iế t k ế site Ví dụ phần site xử lý video có th ể làm cho hiệu nhiều bạn sử dụng codec n h ấ t từ Adobe Flash Tuy nhiên nghiên cứu bạn cho thấy hầu h ết khách tham quan tiềm khơng có phiên h àn h Flash player, bạn định downsize (giảm cấp) video để phù hợp với mà khách tham quan bạn có Một nghiên cứu nhân học nói việc m ang đến cho khách tham quan trả i nghiệm thú vị Nếu họ thích nó, họ quay trở lại ui Tợo k ế hoợch tiếp thị -w ww lib ui ed u.v n -w ww lib Cho dù bạn không b đầu việc tạo site th ậ t sự, không sớm để bắt đầu kế hoạch tiếp thị Có hàng ngàn website xuất trê n In te rn e t tuần Làm th ế bạn biết? Trước tiên máy tìm kiếm web tìm thấy bạn; chúng tậ n dụng chương trìn h gọi Web robot đến tất server trê n hành tin h kiên nhẫn tạo index cho site Bằng cách đó, chúng có th ể cho khách tham quan khả truy cập thông tin từ b ất kỳ site, hất bâ"t nơi hành tinh Chúng tạo index nhiều site site bạn chúng tính phí nhà quảng cáo chúng nhiều tiền Điều có nghĩa chúng hăng hái tìm bạn Điều khơng có nghĩa bạn ngồi chờ, đệ trìn h site bạn đến máy tìm kiếm bước việc làm cho th ế giới biết đến bạn u.v n Nếu bạn có tiền, có nhiều cơng ty giúp bạn thực tiến trìn h độ trình Ví dụ, site sau giúp ích cho bạn, địi hỏi chi phí: ^ http://iưww.iopromote.com/ ui ed ^ hüp://umrw.addpro.com/ Nếu ban thích tự thử tiến trìn h hơn, có nhiều cách để làm mà không tốn đồng xu .lib ww w K hưp://umnv.prioriịysnhmit.com/ ... n- Hoạch định cho Web site đòi hỏi hiểu hai lĩnh vực chính: kiến thức ứng dụng mà bạn sử dụng (khía cạnh logic) kiến thức hướng mà bạn muốn mang dự án Web theo (khía cạnh sáng tạo) w lib ui Dreamweaver. .. hưp://ivtưw.peunntemet.org/ K bttp://intemet-statistics-gĩiide.netfirms.com/ u.v n- ^ http://unvw.iv3-org/ ed u.v n- ww w lib ui ed Một nghiên cứu nhân học cho bạn biết loại người ghé th ám site bạn, họ họ... đầu việc vẽ hình trịn trang viết tiêu đề site hình trịn Bạn vẽ đường từ hình tròn tâm, nhánh trê n nh án h bạn viết từ, Application Sau sử dụng nhánh nhỏ này, bạn bắt đầu liệt kê ứng dụng mà bạn