1. Tạo một dự án mới
Để tạo mới một dự án website, bạn bấm vào menu Home và chọn New Project ở mục Project. Khi đó sẽ xuất hiện một trang màu trắng ở giữa vùng làm việc và trang có tênUntitled 1 ở khung Page List. Nếu cần thêm trang mới, xóa trang hoặc tạo bản sao cho trang hiện tại thì sử dụng các tính năng Add Page, Delete Page, Duplicate Page. Tiếp theo, bạn cần quy định kích thước của trang web bằng tính năng Page Size ở mục Page Setup của menu Page Layout.
Một điểm lưu ý khi chọn kích thước là phải hướng đến độ phân giải màn hình của đa số khách truy cập, nhằm để cho trình duyệt của họ không xuất hiện thanh trượt ngang và tránh được sự che khuất bài viết. Ngoài ra, bạn có thể sử dụng tính năng Website Properties ở thanh gợi ý thực hiện, để thay đổi thuộc tính cho website. Nếu cảm thấy nền trắng của trang web không phù hợp với ý tưởng thiết kế thì bạn hãy thay đổi bằng thư viện Background trong khung Galleries. Trong danh sách hình nền mẫu hiện ra có nhiều nhóm, mỗi nhóm này chứa rất nhiều hình nền với nhiều màu sắc riêng, bạn chỉ cần bấm đôi chuột vào biểu tượng túi thư mục có hình mũi tên để mở nhóm và kéo thả hình nền mong muốn vào trang web đang làm việc. Khi khởi tạo xong dự án thì bạn bấm nút Saveđể lưu lại, tập tin được lưu có định dạng ows.
Ngoài cách tạo website mới như trên thì phần mềm cũng cung cấp cho người dùng một thư viện hơn 100 mẫu trang web. Bạn vào thẻ Templates trong khung Galleries, chọn một mẫu trong danh sách hình đại diện bên dưới, rồi thả vào trang đang thiết kế.
Khi đã tạo ra một trang web có đầy đủ các thuộc tính cần thiết thì bạn có thể tạo ra một Master Page, tức là chỉ định cho trang web làm khuôn mẫu, để tạo ra cấu trúc giao diện chung cho cả website. Để thực hiện, bạn chọn trang cần tạo Master Page rồi vào menu Page bấm Set Master Page ở mục Page. Bên cạnh đó, bạn có thể sử dụng trang web đã tạo để bổ sung vào thư viện Templates Gallery, bằng cách vào menu Pages tìm mục Templates, bấm Save as rồi chọn Save Page as a Template.
2. Tạo hệ thống menu
Một trong những bước quan trọng của quá trình thiết kế website là tạo hệ thống menu, bởi vì nó giúp cho khách truy cập dễ dàng điều hướng đến nội dung mà họ muốn xem, cũng như mang lại một giao diện khoa học và chuyên nghiệp cho website của bạn. Để tạo nhanh một menu, bạn chọn một đối tượng hình có trên trang web, chẳng hạn như là một hình chữ nhật, hình elip, hình ảnh được chèn vào,…, rồi bấm vào menu Create, bấm vào Menu Maker, chọn Manu Maker Studio.
Trong hộp thoại Menu Studio, bạn điền tên menu chính vào ô Menu Title, chọn trang cần liên kết ở Choose a Page, nhập gợi ý về menu tại Enter a Tip, rồi bấm nút Add this page trong khung Add a page to the menu. Còn đối với các liên kết ngoài website, bạn nhập vào thông tin ở các ô Enter Item Name- tên menu con, Enter URL- địa chỉ liên kết, bấm Add this URL trong khung Add an external page to the menu. Lưu ý, tùy chọnOpen the page in the new browser window giúp mở ra cửa sổ mới của trình duyệt khi bấm vào menu. Khi xong bấm Save the Design Menu. Lúc này trên thanh menu xuất hiện thêm menu Design, nó cung cấp các công cụ tùy chỉnh menu web vừa tạo, bao gồm các nhóm:Orientation (quy định kiểu menu), Menu Fonts (chọn font chữ, cỡ chữ, kiểu chữ), Menu Text Align (canh lề cho tiêu đề trên menu chính), Menu Color (chọn màu sắc), Menu Borders (thay đổi độ rộng và kiểu của đường viền), Item Text Align (canh lề cho tiêu đề trên menu con), Visual Effects (hiệu ứng hiện ra của menu con).
3. Chèn văn bản và các nội dung đa phương tiện
Menu Text cung cấp cho bạn khá đầy đủ công cụ mà một chương trình xử lý văn bản thường có, bao gồm chọn font chữ, canh chỉnh văn bản, chèn các dạng liên kết, chèn các kí tự đặc biệt. Để chèn văn bản, bạn bấm vào mục Insert, chọn New Text Object, rồi chọn vùng cần chèn trên trang web và bắt đầu nhập văn bản. Lưu ý, để nhập tiếng Việt có dấu, bạn nên sử dụng font VNI và chọn bảng mã tương ứng.
Web Studio 5.0 cho phép chèn vào các định dạng Flash, MIDI, MP4, hỗ trợ 16 định dạng tập tin âm thanh và 13 định dạng video khác nhau. Để chèn một tập tin Flash, bạn vào menu Insert tìm đến mục Media rồi bấm Flash và duyệt đến thư mục chứa tập tin định dạng swf. Cũng thực hiện tương tự đối với nội dung video và âm thanh.
Đối với các nội dung được cung cấp từ Internet như từ YouTube, Google Maps, Flickr, Picasa,…bạn bấm vào nút lệnh tương ứng và làm theo hướng dẫn trong hộp thoại hiện ra. Ví dụ, bạn cần chèn trình diễn ảnh lên trang web bằng dịch vụ Flickr thì vào menuCreate, bấm Slide Show và chọn Flickr. Trong hộp thoại hiện ra, bạn bấm nút Go to Flickrrồi đăng nhập vào tài khoản, tìm tính năng chia sẻ slideshow và sao chép đoạn mã HTML dán vào khung Paste the Flickr HTML.
4. Chèn nút bấm và form liên hệ
Nút bấm (Button) và form liên hệ là những thành phần không thể thiếu trên một trang web tương tác. Trong thư viện Buttons ở khung Galleries, phần mềm cung cấp hàng trăm mẫu nút bấm đã thiết kế sẵn, bạn lựa chọn và kéo thả một mẫu vào vị trí cần đặt nút bấm. Trong hộp thoại Rollover Button Studio, bạn nhập tên của nút bấm vào ôButton’s Text, kéo hai thanh trượt trong khung Normal Button để thay đổi vị trí chữ trên nút bấm, kéo các thanh trượt ở khung Color để thay đổi màu sắc khi trỏ chuột trên nút bấm (Mouse Over Button) và khi trỏ chuột rời khỏi nút bấm (Mouse Down Button). Ngoài ra, bạn còn có thể sử dụng các tính năng Font, Text Color, Link để thay đổi kiểu chữ, màu chữ và chèn liên kết cho nút bấm.
Khi người quản trị website tiếp nhận được thông tin phản hồi từ khách truy cập thông qua biểu mẫu tương tác thì trang web sẽ được cải tiến phù hợp hơn với nhu cầu của người sử dụng, từ đó gia tăng được số lượng người xem. Đây là một trong những lợi ích mà form liên hệ mang lại. Để tạo form, bạn sử dụng thư viện Forms trong khungGalleries, đây là các biểu mẫu khảo sát, liên hệ thông dụng trên nhiều website hiện nay. Nếu không muốn sử dụng các form này thì bạn có thể tự thiết kế form bằng những tính năng ở menu Forms. Các tính năng cần thiết như Text Field (tạo khung nhập văn bản nhưng giới hạn trong một hàng), Text Box (tạo khung nhập văn bản, có sử dụng thanh cuộn), Password Box (sử dụng mật khẩu), Check Box (câu hỏi nhiều lựa chọn), Radio Button (câu hỏi đúng sai), Submit Button (gửi form đến người quản trị). Khi đã tạo xong các form thì bạn dùng tính năng Group Form để tạo ra một biểu mẫu hoàn chỉnh.
5. Xuất ra sản phẩm
Sau khi hoàn tất việc thiết kế, bạn nên xem lại các trang web trước khi xuất bản chúng lên Internet. Bạn vào menu Page, bấm Preview Page và chọn cách thức xem trước:Use WebStudio Browser- xem trên cửa sổ của Web Studio, Use Default Browser- xem trên cửa sổ trình duyệt web. Khi không có gì thay đổi thì bạn bấm vào biểu tượng WS5 trên giao diện chính, rồi bấm Publish, chọn một trong ba cách:
- Upload website files to your hosting: Trong hộp thoại hiện ra, bạn bấm nút Connect rồi điền vào các thông số hosting ở hộp thoại Connect To Hosting Destination.
- Trial Host your website with iHostStudio: Dùng thử dịch vụ hosting iHostStudio trong 24 giờ. Bạn điền thông tin liên hệ vào mục Contact details ở hộp thoại iHostStudio Instant Publisher, bấm Next rồi chờ trong ít phút để dịch vụ kích hoạt tài khoản. Bạn tiếp tục bấmNext để tải cả website lên hosting và nhận địa chỉ website bên dưới dòng chữ Thank you publishing with iHostStudio.
- Save Website files to disk: Lưu trữ website trên ổ cứng máy tính.
Web Studio 5.0.18.rar (187.90 MB )