Các bước hướng dẫn bạn thiết kế một Website chuyên nghiệp

Hãy nghĩ về điều này, tạo một website thực sự quá đơng giản. Chỉ việc mở Macromedia Dreamweaver, Microsoft Frontpage hoặc thậm chí Microsoft Word vẽ với hoa hoè hoa sói và lưu lại dưới định dạng là HTML là bạn đã có một trang web rồi. Bằng cách dùng những phần mềm Macromedia Dream weaver hoặc Microsoft Frontpage ai cũng có thể tạo ra một trang web một cách nhanh chóng, nhưng về phần thiết kế thì sao? tính thẩm mỹ?

Yêu cầu của khách hàng: - Trang web phải được khác biệt và có “cảm tình” - Trang web phải thể hiện được sắc thái của doanh nghiệp - Màu chủ đạo của công ty phải được dung thật nổi bật. - Phải hoàn thiện trong vòng 7 ngày - Cuối cùng nhưng quan trọng nhất là tốc độ load của nó phải nhanh và hiệu quả. Đó là những yêu cầu chung mà một khách hàng hay hỏi khi yêu cầu thiết kế. Trong nền công nghiệp thiết kế web thì tốc độ và sáng tạo đóng vai trò quyết định. Nếu bạn có thể thiết kế một template nhìn bắt mắt và nhanh chóng bạn sẽ là người thắng cuộc trong nền công nghiệp đòi hỏi cao này. Cho nên đầu tiên hãy nghiên cứu về khách hàng của bạn. Một cách thông minh để làm việc này là tóm tắt những yêu cầu của họ hoặc đặt ra những mục tiêu để thách thức trí sáng toạ của mình. Suy nghĩ thông minh: Hãy nghĩ về điều này, tạo một website thực sự quá đơng giản. Chỉ việc mở Macromedia Dreamweaver, Microsoft Frontpage hoặc thậm chí Microsoft Word vẽ với hoa hoè hoa sói và lưu lại dưới định dạng là HTML là bạn đã có một trang web rồi. Bằng cách dùng những phần mềm Macromedia Dream weaver hoặc Microsoft Frontpage ai cũng có thể tạo ra một trang web một cách nhanh chóng, nhưng về phần thiết kế thì sao? tính thẩm mỹ? Đó là vấn đề mà "suy nghĩ thông minh" phát huy tác dụng để bạn đặt được một trang web chuyên nghiệp và người thiết kế theo nó để cho khách hàng của họ những website đẹp nhất và trong thời gian ngắn nhất có thể. - Khi thiết kế một trang web bạn luôn phải nhớ đến những thành tố cơ bản như hình ảnh của công ty,màu sắc của công ty, logo và biểu tượng vân vân. - Tối ưu hoá những hình đồ hoạ và giảm thiểu độ lớn của nó để giữ thời gian load ở mức thấp nhất có thể. - Biến đổi từ những trang được thiết kế trong Photoshop thành HTML và nó có thể được upload lên Internet. Những bước này là gì? - Thiết kế trang chủ hoặc những trang con bằng cách sử dụng những phần mềm đồ hoạ như Corel Draw, Adobe Photoshop, Macromedia Firework, Corel Photopaint vân vân - Tối ưu hoá hoạc cắt trang sử dụng những phần mềm như Adobe ImageReady hoặc Macromedia Fireworks. - Lưu lại dưới định dạng HTML và thêm các đường liên kết tới những trang con bằng các phần mềm bổ trợ như Microsoft Frontpage và Macromedia DreamWeaver thiết kế website. Internet trở nên quen thuộc khá nhanh, đặc biệt là với phát minh ra các trình duyệt đã có thể cho phép chúng ta xem được hình ảnh cùng với chữ trên các trang web. Điều đó làm cho càng nhiều người thích Internet hơn.Vấn đề ở đây là đồ hoạ đóng một vai trò quan trọng trong thiết kế web. Hình ảnh nếu được thiết kế đúng cách sẽ mang lại thông tin và liên hệ với khách hàng tốt hơn là chữ. Nếu một trang web được tạo ra bằng cách sử dụng HTML mà không có một hình ảnh đồ hoạ nào cả thì bạn sẽ thấy nó buồn chán đến mức nào. Hình ảnh không thể được tạo ra bằng HTML cho nên bạn cần một phần mềm hỗ trợ khác là những phần mềm về đồ hoạ nhứ Adobe Photoshop, Corel Draw ... Và bước đầu tiên để tạo ra một website là dùng những phần mềm đồ hoạ này để tạo ra một giao diện trước đã, vì những phần mềm này cung cấp cho bạn những tính năng vượt trội và linh động hơn phù hợp với ý tưởng thiết kế của bạn, bạn có thể tạo ra những sự kết hợp hài hoà của hình ảnh, màu sắc,chữ viết và thêm nhứng hiệu ứng khác nhau để nhìn cho nó máu. Kích thước của trang Trong khi bạn thiết kế với các phần mềm đồ hoạ hãy làm những giao diện (Template) có kích thước là 778x 800 Px. Bây giờ 2 loại độ phân giải của màn hình thông dụng là 800 x 600 Px và 1024 x 768 Px. Và trong khi thiết kế các web designer thường làm theo loại có độ phân giải là 800 x 600. Tại vì người lướt web nếu dùng ở chế độ là 800x600 họ có thể xem được mà không phải kéo thanh cuộn ngang, nhưng nếu xem ở độ phân giải 1024 x 768 thì cũng không sao vì sẽ có màu nền để phủ vào những chỗ trống đó. Còn loại màn hình từ thời Napoleon đến giờ là 640 x 480 chỉ chiểm khoảng 5% nên quên nó đi cũng được :) Màu sắc phù hợp Hãy cẩn thận khi chọn màu sắc ví dụ bạn không nên chọn màu xanh lá cây cho những trang về tổ chức y tế chữ thập đỏ và ngược lại bạn không nên chọn màu đỏ cho những trang về làm vườn. Trước khi thiết kế website bạn nên nghiên cứu những sản phẩm và dịch vụ của khách hàng của mình. Theo kinh nghiệm thì những trang về thương mại màu nền trắng là hợp lý hơn cả. Nhưng nếu khách hàng chọn một tông màu nào phù hợp với công ty của họ thì bạn nên dùng những màu của công ty đó. Ví dụ màu chủ đạo của công ty X là xanh, đỏ và trắng thì trang web cũng nên kết hợp những màu đó. Sản phẩm chính và dịch vụ nên được đặt ở trang chủ Khách viếng thăm trang web của một doanh nghiệp nào đó để lấy thông tin về những dịch vụ hoặc sản phẩm của công ty đó, thì thông tin này phải được đặt lên hàng đầu. Nếu không người ta chỉ đóng lại hoặc đi sang một công ty khác vì ngay cái nhìn đầu tiên toàn là cái giời oi đất hỡi gì đó, điều đó sẽ là một thua thiệt rất lớn cho công ty. Nhớ rằng.... trang chủ luôn là ấn tượng đầu tiên của khách khi đến thăm một trang web. Nếu trang web do bạn thiết kế phù hợp về nội dung, ấn tượng và hấp dẫn thì sẽ làm cho khách hàng đó quay lại và tìm kiếm thêm, nếu không thì người ta chỉ bỏ đi mà chẳng lấy được thông tin gì. Tuy nhiên, nếu công ty nào đó có quá nhiều dịch vụ và sản phẩm thì không phải lúc nào cũng có thể đặt hết lên trang chủ. Trong trường hợp này, thì một sự kết hợp hài hoà giữa các sản phẩm hoặc dịch vụ có thể được thể hiện ở trang chủ. Những hình ảnh đơn lẻ nên được đặt ở những chủ đề liên quan trong các trang con. Với sự trợ giúp của những kỹ năng thiết kế giao diện khác nhau, người thiết kế có thể cho hiển thị những sản phẩm rất sáng tạo và đẹp mắt. Điều đó là có thể nếu bạn kết hợp những sản phẩm đó một cách hấp dẫn, hệ thống và có cấu trúc. Tối ưu hoá và những phần mềm cần thiết Trong một phần mềm đồ hoạ nào đó thì trang chủ chiếm rất nhiều chỗ và chưa trong nó nhiều hình ảnh và dữ liệu ở định dạng của phần mềm (.PSD, .AI) đó và không tương thích với môi trường web. Do vậy những hình ảnh đồ hoạ nên được lưu lại dưới định dạng là Gif hoặc Jpg, đây là những định dạng tương thích với hầu hết các trình duyệt web. Nhưng khi nó load hình sẽ load từ trên xuống dưới và nhanh hay chậm phụ thuộc vào tốc độ truyền mạng. Do vậy khách viếng thăm sẽ không đủ kiên nhẫn để chờ quá 10 giây cho đến khi người ta nhìn thấy trang web của bạn. Chính vì lẽ đó trang chủ nên được cắt ra thành từng mảnh và lưu lại dưới định dạng là Gif hoặc JPG phụ thuộc vào yêu cảu của từng tấm hình. Nhiều người cho rằng JPG thích hợp hơn với những hình có nhiều màu sắc và Gif thì thích hợp với những hình ít màu hơn. Bạn có thể tham khảo thêm bài viết về "xuất web ra HTML bằng cách phân mảnh" có trên bantayden.com để biết thêm. Bằng cách tiết kiệm tối đa hình ảnh bạn có thể đẩy tốc độ load lên cao nhất có thể. Trang chủ của bantayden.com hiện giờ chỉ có 3 hình duy nhất là banner, background banner và footer. Còn lại là các mã màu của HTML. Những phần mềm đồ hoạ bây giờ có thể cho bạn thêm tính nắng tối ưu hoá là Opimize & Save as HTML. Quá trình tối ưu hoá hình ảnh là giảm độ lớn của hình ảnh xuống còn từ 50-80 Kb, và nó cho phép trang web đó được load khá nhanh với tốc độ trung bình của những người nối mạng bằng dial up. Một số phần mềm đồ hoạ và HTML editor Có rất nhiều phần mềm đồ hoạ đang rất phổ biến trên thị trường nhưng tốt nhất và chuyên nghiệp nhất là Adobe Photoshop, Adobe ImageReady, Macromedia Firework, Corel Photopaint và Jasc's và Paintingshop Pro. Để tạo những trang HTML bạn nên dùng Macromedia DreamWeaver hoặc Microsoft Frontpage là những phần mềm chuyên nghiệp và dễ sử dụng nhất. Adobe Photoshop Adobe Phtoshop là phần mềm đồ hoạ tốt nhất và được sử dụng rộng rãi trên toàn cầu bởi những nhà thiết kế web. Tuy nhiên những phần mềm khác như Macromedia Fireworks và Corel Photopaint cũng được dùng bởi vì nó có những đỉêm mạnh và điểm yếu khác nhau. Adobe ImageReady Adobe ImageReady là một phần mềm đi kèm theo Adobe PhotoShop và cũng rất hữu dụng trong quá trình cắt và tối ưu hoá giao diện của bạn để làm cho nó nhẹ hơn và biến những hình đồ hoạ thành định dạng tương thích với môi trường web là HTML Macromedia Dreamweaver Sau khi bạn đã xuất giao diện thành HTML rồi, thì phần mềm Macromedia DreamWeaver là rất cần thiết để thêm nội dung và tạo các đường liên kết đến các trang khác trên site. Phần mềm Microsoft Frontpage cũng có thể dùng được vì nó đơn giản hơn trong cách sử dụng nhưng cũng là một công cụ rất mạnh để thiết kế web. Theo: www.cwd.dk