Từ FrontPage 2000/XP đến FrontPage 2003... Beta

LÊ HOÀN

Qua những thăm dò, trao đổi trong nhóm FrontPage và ý kiến của bạn đọc gởi về, cũng như sau nhiều lần tham quan các website “mới toanh” do bạn đọc tự làm. e-CHÍP cảm thấy cần phải đúc kết một số đặc điểm khi sử dụng FrontPage 2000/XP để “học” thiết kế web. Nhân đây, xin giới thiệu sơ nét về các tính năng mới, nổi bật trong phiên bản FrontPage 2003 Beta để các bạn chuẩn bị “tiếp cận”.

Dễ học, dễ “xài”

Gần như tất cả những người đã từng “xài” qua FrontPage đều cảm thấy đây là một chương trình dễ tìm hiểu, dễ sử dụng do cách thao tác, cách sử dụng lệnh tương tự như các phần mềm “phổ thông” khác trong bộ Office. Người dùng có thể nhập văn bản, chèn hình, tiến hành định dạng text, bố trí hình ảnh với những phương thức quen thuộc giống như khi sử dụng Word hay các phần mềm văn phòng khác. Đây là một ưu điểm rất lớn mà các chương trình thiết kế web khác không có được, giúp tiết kiệm rất nhiều thời gian và công sức nhập liệu cho người “làm” web.

Đa số trang web trong Nhóm FrontPage tham gia cùng e-CHÍP tuy có hình thức đơn giản nhưng nội dung thông tin lại khá phong phú. Điều này chứng tỏ việc nhập liệu và đáp ứng yêu cầu thẩm mỹ cơ bản không còn là việc quá khó khăn đối với những người mới “chân uớt chân ráo” vào nghề bằng FrontPage.

e-CHÍP nhận thấy thời gian để một người “không biết gì” tiếp cận và sử dụng khá thành thạo FrontPage để làm một trang web tĩnh (không sử dụng các ứng dụng web trên máy chủ để tương tác với người xem) rất nhanh so với việc học và sử dụng các chương trình thiết kế web khác để tạo cùng một trang web như vậy. FrontPage là công cụ rất phù hợp để làm web cá nhân (không cần có tính tương tác cao), đặc biệt là thích hợp với trẻ em và người lớn tuổi vì có thể xem việc tạo trang web như một trò chơi (khá hấp dẫn và lôi cuốn).

Dàn trang... web chuyên nghiệp

FrontPage giống như một chương trình dàn trang trong chế bản điện tử, có nghĩa là bạn phải chuẩn bị sẵn các “nguyên liệu” (các thành phần trong nội dung trang web như văn bản, hình ảnh, video, audio, flash...) rồi đưa tất cả vào FrontPage để sắp đặt, trình bày sao cho thu hút người xem. Bạn dễ dàng thiết kế các trang web có dáng vẻ chuyên nghiệp với rất nhiều kiểu dáng mẫu (theme) do FrontPage cung cấp sẵn (trên 60 kiểu dáng) hay tự tạo theo ý thích. Ngoài ra, bạn còn có thể sử dụng kiểu (style) là một tập các đặc tính xác lập sẵn như kích thước, khoảng cách, màu... áp dụng cho các phần tử của trang web (ví dụ như tiêu đề). Và bảng kiểu (style sheet) là một tập các kiểu xác lập sẵn, áp dụng cho toàn bộ trang web. Bình thường các phần tử (tiêu đề, văn bản...) có dạng thể hiện mặc định phụ thuộc vào trình duyệt web và font chữ cài đặt trên máy tính của người xem. Khi dùng kiểu và bảng kiểu, bạn sẽ thay đổi các giá trị ngầm định này và “bắt” trang web hiển thị theo đúng ý bạn. Cách làm được nhiều người thích là tạo một bảng kiểu riêng gọi là cascading style sheet - CSS (bảng kiểu chồng lớp) rồi liên kết nó vào một hay nhiều trang web trong website, nhằm thực hiện cùng một sự thay đổi kiểu cho nhiều trang web mà không cần phải viết lặp đi lặp lại các dòng mã trong từng trang. Trong trường hợp dùng bảng biểu để định vị các phần tử trong trang web, bạn chỉ việc chọn menu và các hộp thoại để xác định vị trí cho các phần tử này, FrontPage sẽ làm hết công việc “biên tập mã lệnh” cho bạn, khiến cho thậm chí bạn không cần biết mã bảng kiểu “mặt mũi” ra làm sao.

Chú ý: Định vị tuyệt đối là đặt các phần tử chính xác tại vị trí theo khoảng cách so với lề trái và lề trên của trang web. Định vị tương đối là di chuyển phần tử xuống và về phía phải một khoảng cách xác định so với vị trí đáng lẽ nó phải được thể hiện (chứ không phải so với các lề của trang web).

Phục vụ giới “nhà nghề”

Đối với những người thiết kế web nhiều kinh nghiệm, FrontPage cũng là một công cụ mạnh để viết và sửa đổi các mã hoá trang web (HTML, DHTML, script, XML, ASP...) với các đặc tính sau:

- Không thay đổi mã HTML do bạn viết hay chèn vào, giữ nguyên các thẻ, ghi chú, chữ hoa, chữ thường, khoảng trắng... Do đó, bạn có thể viết mã của riêng bạn hay chèn mã lấy từ các phần mềm làm web khác trong chế độ xem HTML.

- Cho phép điều chỉnh cách canh lề các dòng mã, màu cho thẻ, khi nào cần in hoa, khi nào dùng thẻ tuỳ chọn (lệnh Tools/Page Options).

- Trong khi đang xem trang web ở chế độ Normal, bạn có thể chọn chức năng Reveal Tags (trong thư mục View) để hiển thị các thẻ HTML đang được áp dụng trong trang web.

Bạn có thể soạn thảo và dò lỗi các script được viết bằng VBScript hay Javascript bằng Microsoft Script Editor có trong menu Tools/Macro...

Tăng tốc với... khung

Trong tình trạng đường truyền chậm chạp như hiện nay, vài website đã biết tận dụng ưu thế của khung (frame) để phân chia màn hình trình duyệt thành hai hay nhiều vùng (mỗi vùng chứa một trang web riêng biệt), trong đó có những vùng không cần hay ít cập nhật như mục lục, đầu trang, cuối trang và vùng cập nhật thường xuyên để xem nội dung thông tin.

Mục đích của khung là làm cho trang web trở nên dễ xem, dễ định hướng để truy cập thông tin. Nếu bạn khéo léo trong việc trình bày, người xem sẽ không phân biệt được khung với bảng (table) và tốc độ cập nhật trang web khi thay đổi thông tin sẽ được cải thiện rõ rệt vì trình duyệt chỉ cập nhật một phần (một frame) thay vì toàn bộ trang như khi dùng bảng.

Điểm bất lợi của khung là kém sinh động và chiếm thêm không gian hiển thị cho thanh cuộn ngang, thanh cuộn dọc. Do đó, ta không nên lạm dụng khung để tránh làm người xem rối mắt và nhàm chán. Cách bố trí khung thông dụng nhất là khung chứa bảng tiêu đề ở đầu màn hình, khung menu ở bên trái, khung nội dung ở bên phải và phần lớn việc cập nhật khi xem thông tin xảy ra ở khung nội dung. FrontPage cung cấp sẵn cho bạn rất nhiều cách bố trí khác nhau trong Page Templates.

Ấn tượng với FrontPage 2003 Beta

- Khi chạy phiên bản thử nghiệm FrontPage 2003 Beta, bất ngờ đầu tiên của chúng tôi là chế độ hiển thị Split với màn hình chia đôi: nửa trên hiển thị theo chế độ Code (mã nguồn) hay còn gọi là HTML trong các phiên bản trước, nửa dưới hiển thị theo chế độ Design (Normal trong các phiên bản trước). Cách hiển thị này có ưu điểm là giúp bạn xác định rất nhanh vị trí của con trỏ chuột tương ứng ở cả hai nửa cửa sổ, điều này rất có ích cho những người muốn tìm hiểu mã lệnh HTML; và trong nhiều trường hợp, việc sửa trực tiếp vào mã lệnh cho kết quả nhanh hơn là sửa trong chế độ bình thường, nhất là đối với những trang web phức tạp có nhiều bảng lồng vào nhau hay có nhúng nhiều script để tạo hiệu ứng.

Các tuỳ chọn cho việc hiển thị mã nguồn (Tools/Page Options) đa dạng hơn các phiên bản cũ. Bạn có thể thiết đặt việc đánh số dòng, canh lề, xuống hàng tự động, dùng các thẻ tuỳ biến, tự động tạo Thumbnail, font mặc định, màu cho các thẻ, việc hiển thị chữ hoa, chữ thường, dạng thước file hình xuất ra,...

Bạn có thể thay đổi kích thước của hai phần trong màn hình Split tuỳ theo yêu cầu làm việc hay chuyển đổi qua lại giữa các chế độ hiển thị rất nhanh bằng cách sử dụng phím tắt Ctrl+Page Down hay Ctrl+Page Up.

- Ấn tượng thứ hai là lệnh Tools/ Optimize HTML (tối ưu mã nguồn), đây cũng là mong đợi từ lâu của những người sử dụng FrontPage.

Với lệnh này, bạn có thể thu nhỏ dung lượng trang web bằng cách xoá bỏ các chú thích (Remove comments), khoảng trắng (Whitespace), và các thẻ rỗng (Empty tags), xác nhập các thẻ giống nhau nằm sát nhau (Merge adjecent tags), xoá nội dung VML không cần thiết (Delete VML content).

Chúng tôi đã thử dùng tính năng này để “tối ưu” một số trang web lấy từ trên mạng. Kết quả là có thể giảm dung lượng từ 15% đến 50%.

- Code View (lệnh Edit/Code View) và Quick Tag là các công cụ hỗ trợ dân lập trình hay người thiết kế web “cao cấp” sửa nhanh mã nguồn. Bạn có thể sử dụng Quick Tag Selector (lệnh View/ Quick Tag Selector), để xem tất cả thẻ trong trang web của bạn ở vị trí phía trên cửa sổ tài liệu đang mở. Nếu bạn cũng muốn can thiệp trực tiếp các code HTML, bạn có thể sử dụng Quick Tag Editor (lệnh Edit/Quick Tag Editor) để chèn, đóng gói, và chỉnh sửa thẻ HTML trong một cửa sổ con dễ sử dụng. Bạn cũng có thể sử dụng Quick Tag Editor để chọn tables, đoạn văn, và những code HTML cồng kềnh.

Mới và... mới trong FrontPage 2003

- Macromedia Flash: Cho phép bạn nhúng và thiết đặt các thông số cho file flash với lệnh Insert/Picture/ Flash và Flash Properties trong menu phím phải chuột (khi bấm phím phải vào vị trí flash). Bạn có thể cho tự động chạy file flash chỉ một lần (hay lặp đi lặp lại liên tục) khi người xem mở trang web.

- Layout Tables: Với lệnh Table/ Layout Tables and Cells, bạn có thể chọn những kiểu trình bày có sẵn từ danh sách và chèn chúng vào trong trang web. Bảng tác vụ Layout table (bảng kiểu) được định vị bên phải màn hình làm việc nên rất dễ tiếp cận. Vì vậy, khi bạn vạch kế hoạch và thiết kế trang web, bạn có thể nhanh chóng và dễ dàng thay nhiều loại layout khác nhau trước khi đưa ra quyết định cuối cùng.

Nếu bạn đòi hỏi nhiều kiểu tùy biến hơn, bạn có thể tự tạo ra những layout table cho riêng mình (Draw layout table/cell). Bằng cách sử dụng những công cụ layout table (Cell Formatting), bạn có thể ứng dụng những dạng thức đặc biệt như bo tròn cạnh góc, đường viền, tự động điều chỉnh kích cỡ (autostretch), và những hiệu ứng khác...

- Image Tracing: Bạn có thể tạo mô hình mẫu của trang web bằng một chương trình đồ họa, sau đó chèn hình này vào trang web (lệnh View/Tracing Image) như một sự hướng dẫn để dựa theo đó mà thiết kế chính thức. Bạn có thể cho thấy hoặc che giấu hình này đi, thiết lập độ trong suốt của hình (Transparent/ Opaque) và thay đổi vị trí của nó. Bạn cũng có thể xem hình này ở cả hai chế độ trong FrontPage là Design hoặc Split. Những người truy cập vào trang web sẽ không thấy được hình ảnh này (tracing image) khi duyệt web bằng các trình duyệt.

- Layers: Lệnh Insert/ Layer, với Layer (lớp) chứa đựng những thành phần của trang HTML như text và hình ảnh đồ họa. Bạn có thể chồng các lớp, lồng ghép các lớp và dấu hoặc cho hiển thị các lớp trên một trang. Bạn cũng có thể tạo hiệu ứng đặc biệt cho các lớp bằng cách nhúng các script Dynamic HTML (DHTML) vào. Bạn có thể xem và chọn lựa các script từ một danh sách trong thanh tác vụ Behavior.

- Interactive Buttons: Với lệnh Insert/Interactive Buttons), bạn có thể thêm những nút trông có vẻ chuyên nghiệp cho trang web của bạn bằng cách chọn từ danh sách các nút Javascript. Mỗi khi chọn một nút, bạn có thể thay đổi thuộc tính của nó như thêm nút chữ (button text), chọn phông chữ, màu, xác định liên kết (link), hình ảnh và text...

Làm bạn với FrontPage

FrontPage đã là người bạn đường của rất nhiều người “tập tễnh” vào nghề thiết kế web, các phiên bản càng ra sau càng dễ sử dụng và có nhiều tính năng hơn. Hy vọng khi ra đời, FrontPage 2003 chính thức sẽ vẫn đi theo phương châm: dễ (sử dụng) hơn và nhiều (chức năng) hơn.