Đừng lạm dụng quảng cáo

Việc bạn kiếm tiền từ trang web của bạn là việc hoàn toàn hợp lý và nên làm. Bởi vì bạn bỏ công sức lao động ra để giúp đỡ người khác thì bạn cũng xứng đáng được “trả công” hoặc chí ít bạn cũng phải kiếm được đủ tiền để duy trì trang web. Nhưng bạn cũng nên biết rằng, đừng chỉ vì một chút lợi trước mắt mà bạn quên đi yếu tố quan trọng nhất trong trang web của bạn – đó là người đọc. Tôi đã từng thấy nhiều trang web chỉ vì nôn nóng kiếm tiền từ các dịch vụ kiếm tiền trên mạng mà họ nhồi nhét trang web của mình với hàng tá các banner và pop up. Gần như mọi khoảng trắng trên trang web đều được tận dụng mà không hề quan tâm đến người đọc sẽ nghĩ gì.

Khi quyết định đặt banner lên trang web của bạn, bạn hãy lưu ý những điều sau:

1. Thẩm mỹ

Hãy nghiêm khắc với chính mình ở điểm này, khi đặt banner ở một vị trí nào đó trên trang web, bạn có thấy rằng nó làm phá đi bố cục của trang web không? nó có hợp lý không? nó có choán hết chỗ để của nội dung không? nói chung, bạn đừng nhồi nhét banner quảng cáo vào bất cứ chỗ nào có thể trên trang web.

2. Tác động đến người đọc

Bạn hãy thử đóng vai mình là người đọc và xem trang web của chính mình với những vị trí bạn vừa đặt banner có ảnh hưởng đến quá trình xem thông tin không. Nếu banner đó có dung lượng quá lớn và ảnh hưởng đến tốc độ load của trang web, đừng ngại ngần mà hãy bỏ nó đi. Tuy bạn bị thiệt một chút tiền, nhưng ngược lại bạn sẽ giữ được nhiều người đọc hơn.

3. Đừng đánh lạc hướng người đọc

Tôi từng gặp nhiều trang web đặt banner của Google Adsense muốn đánh lạc hướng người đọc là đó không phải là quảng cáo mà là một phần của nội dung, hòng kiếm tiền nhờ vào sai lầm của họ. Có nhiều trang lại chọn vị trí dễ bị click nhầm như là dưới menu thả xuống, khi bạn kéo chuột quá tay, rất dễ click nhầm vào banner của họ. Nếu bạn trong vị trí của tôi, bạn có bị lừa mãi không?

4. Tuyệt đối không nền dùng pop up

ĐỪNG! đừng dùng pop up dưới mọi hình thức. Pop up là một trong những dạng quảng cáo gây phản cảm với người đọc nhất. Đó là chưa kể đến hầu hết các trình duyệt hiện hành đều có tích hợp chương trình chống pop up. Nó vừa không hiệu quả lại tạo hiệu ứng ngược cho trang web của bạn

5. Đừng yêu cầu người đọc click vào banner quảng cáo

Không những điều này là vi phạm vào quy định của hầu hết các chương trình quảng cáo mà nó còn cho thấy bạn quá “tham lam”. Bạn muốn người đọc phải trả cho bạn từng đồng để đọc được những gì bạn viết.

6. Tránh đặt quảng cáo không liên quan đến nội dung trang web

Bạn nên tránh đặt banner cho những dịch vụ có mặt hàng không liên quan gì đến nội dung trang web của mình. Đừng chỉ vì họ cho bạn phần trăm hoa hồng cao mà bạn đặt banner của họ lên trang web của mình. Ai sẽ click vào một banner có nội dung làm chóng mọc tóc trong khi đang đọc bài về thiết kế giao diện bằng Photoshop? Nó vừa không hiệu quả mà lại làm cho người đọc thấy “bất ngờ”.

Có thể trong một khoảng thời gian ngắn bạn sẽ kiếm được một khoản nhờ vào những kiểu đặt quảng cáo như trên. Nhưng về lâu về dài, bạn sẽ làm xấu đi hình ảnh của mình với người đọc. Họ có cảm giác rằng bạn không thực sự chú ý đến nội dung, cái mà họ quan tâm nhất chứ không phải là banner quảng cáo. Mục đích chính họ đến trang web của bạn là vì nội dung của trang web, chứ họ không đến chỉ để xem quảng cáo trên trang. Vậy nên nếu trang web của bạn cung cấp những thông tin chất lượng và bổ ích, thì bạn không cần phải gạt hoặc kêu gọi họ click vào banner. Nếu họ thấy nội dung của quảng cáo đó liên quan đến phần họ đang đọc, thì họ sẽ tự động click vào nó. Nó vừa tốt cho người đọc, cho bạn và cả cho nhà tài trợ quảng cáo của bạn nữa.

Add to Cart More Info

Giới thiệu công nghệ thiết kế web bằng Joomla! CMS

Công nghệ thiết kế web là gì? Nói dễ hiểu đó chính là website của bạn được viết bằng ngôn ngữ gì, cơ sở dữ liệu được sử dụng là gì, các hiệu ứng trên website như thế nào...? Làm cách nào để nhận biết joomla?

Công ty TNHH Tin Học Nhật Quang xin giới thiệu đến quý khách hàng công nghệ thiết kế web bằng Joomla! đang được rất nhiều công ty sử dụng để phát triển, lập trình website.

Vậy chính xác Joomla! là gì?
- Joomla! một trong những bộ CMS mã nguồn mở, miễn phí, mạnh nhất hiện nay. Với bộ khung ứng dụng mở này các công ty thiết kế web nhanh chóng tạo ra những website mạnh mẽ trong việc xử lý nội dung, hình ảnh... Joomla! còn dễ dàng tạo ra các website đa ngôn ngữ về cộng đồng trực tuyến, cổng thông tin truyền thông, blog, và các ứng dụng thương mại điện tử...
- Tên gọi "Joomla" được phát sinh từ chữ "Jumla" của một cộng đồng người Swahili có nghĩa là "gom tất cả".

Ngoài chúng ta, còn ai đang sử dụng Joomla! để thiết kế web?
Joomla! được sử dụng trên toàn thế giới để phát triển các ứng dụng website từ đơn giản đến phức tạp. Dưới đây là một số các ứng dụng sử dụng mã nguồn mở của Joomla đoạt được giải thưởng của các tổ chức CNTT:

Các trang web hoặc cổng thông tin doanh nghiệp
Website bất động sản
Thương mại điện tử trực tuyến
Website về Khách sạn và Du lịch
Giới thiệu Doanh nghiệp nhỏ
Các trang web về các tổ chức phi lợi nhuận
Website thông tin nội bộ công ty
Các trang web Trường học và Nhà thờ
Cá nhân hoặc gia đình
Cổng thông tin cộng đồng
Báo và tạp chí
Và rất nhiều các web ứng dụng khác...
Joomla! rất dễ dàng quản lý mọi khía cạnh của website bạn từ thay đổi giao diện, nội dung, hình ảnh, vị trí các phần tử đến cập nhật danh mục sản phẩm, xử lý thanh toán qua thẻ tín dụng hoặc đạt phòng trực tuyến...

Sự khác biệt giữa Joomla và các bộ CMS thương mại khác
- Không giống như các giải pháp CMS thương mại, cung cấp các tiện ích khác nhau tùy vào ngân sách thiết kế web của bạn, Joomla! bao gồm tất cả các tiện ích đó vào trong một bản duy nhất và nó hoàn toàn miễn phí từ A đến Z.
- Có nhiều công ty đưa ra giải pháp CMS thương mại kèm theo hàng loạt các mô-đun mở rộng, có công ty "khoe" đến 80 bộ, và chi phí thì nhiều vô số tùy thuộc vào mức độ của từng mô-đun. Thế nhưng Joomla! cung cấp cho bạn một con số ấn tượng các bộ mở rộng hoàn toàn miễn phí lên đến 6030 bộ và ngày càng tăng. Nguyên nhân của sự tăng trưởng mạnh mẽ này là do Joomla có một sự hậu thuẫn vững chăc từ hơn 200 000 người lập trình và phát triển (đã xác nhận trong hệ thống).

Một lợi thế lớn không nên bỏ qua...
Nếu bạn thuê một công ty thứ 3 để phát triển & thiết kế website của bạn trên nền Joomla! thì có nghĩa là bạn không lệ thuộc vào công ty thiết kế đó. Cho dù công ty đó có đóng cửa hay không còn kinh doanh nữa, bạn vẫn có thể thuê một công ty khác để phát triển trang web của bạn. Bạn sẽ tốn ít chi phí & thời gian hơn khi tiếp tục phát triển ứng dụng website của bạn mà không phải thiết kế mới hoàn toàn. Điều này rất quan trọng nếu bạn bắt đầu sai với một công ty hay một đối tác nào đó.

Joomla! có độ thân thiện cao với các bộ máy tìm kiếm không?
- Joomla cung cấp một nền tảng tốt nhất để phát triển một website đáp ứng tất cả các yêu cầu về SEO (tối ưu website với các bộ máy tìm kiếm).
- Giao diện HTML của Joomla ít chứa các mã <table> mà sử dụng phần nhiều là <div> rất thích hợp với các rô-bốt của các máy tìm kiếm.
- Joomla hỗ trợ chức năng viết lại địa chỉ website không hề chứa bất kì chuỗi truy vấn. Các địa chỉ được viết lại theo dạng www.website.com/gioi-thieu-cong-ty.html cực kì thân thiện với các máy tìm kiếm.
- Các thẻ meta có thể định dạng cho toàn trang hoặc cấu hình riêng biệt cho từng trang một.

Một trang web được thiết kế theo công nghệ Joomla! có khó quản trị không?
- Joomla rất thân thiện cho người sử dụng cũng như người quản trị. Tất cả mọi người có kiến thức cơ bản về website đều có thể dễ dàng học cách quản trị. Joomla! không đòi hỏi người quản trị phải có kỹ thuật cao để thêm hay chỉnh sửa nội dung, hình ảnh, để tổ chức sắp xếp các dữ liệu quan trọng của công ty bạn hiệu quả.
- Thông qua giao diện đơn giản và thân thiện qua trình duyệt web, bạn có thể dễ dàng cập nhật thông cáo báo chí mới, danh mục tin tức, quản lý sản phẩm, sắp xếp lịch làm việc...

Joomla! có phải là một công nghệ đắt đỏ?
Sự xuất hiện của giải pháp CMS thật sự là một cuộc cách mạng trong công nghệ thiết kế web. Một giải pháp cực kì linh hoạt, mạnh mẽ... Các công ty như Interwoven, Broadvision, và tất nhiên có cả Microsoft đã từng thống lĩnh thị trường này với giá cả ít nhất là 12000 Euro với một giải pháp sử dụng CMS. Thế nhưng Joomla! cho phép chúng ta thiết kế ra một website CMS với chi phí như một web tĩnh.

Công nghệ Joomla có thích hợp cho các website đa ngôn ngữ?
Có lẽ một trong những lợi thế lớn nhất của Joomla! là khả năng tạo ra một website đa ngôn ngữ với một bộ quản trị duy nhất. Joomla! cũng có thể nhận diện người sử đụng để chuyển đổi ngôn ngữ quản trị một cách linh hoạt nhất. Và tất nhiên người dùng cũng có toàn quyền chuyển đổi sang bất kì ngôn ngữ nào họ muốn.

Trên đây là một số ý kiến về công nghệ thiết kế web bằng Joomla! mà công ty TNHH Tin học Nhật Quang muốn giới thiệu đến toàn thể quý khách hàng đang có ý định thiết kế website. Hy vọng bài viết này giải đáp được phần nào những thắc mắc của quý khách.

Add to Cart More Info

Các định dạng hình phổ biến

GIF và JPEG là hai định dạng được dùng phổ biến nhất hiện nay trên mạng Internet. Trong bài này các bạn sẽ hiểu thêm về những đặc điểm của từng loại và khi nào bạn nên dùng loại nào

Định dạng GIF 

Định dạng này là phổ biến nhất hiện nay trên mạng Internet. Bởi vì nó có thể nén hình với những màu giống nhau rất tốt, hơn thế nữa nó là định dạng duy nhất hỗ trợ hiệu ứng động cho phép trình duyệt hiển thị trên mạng (trừ khi bạn sử dụng Flash hoặc những định dạng hình động vector khác). GIF cũng hỗ trợ hiệu ứng trong suốt.

Định dạng GIF hỗ trợ tối đa là 256 màu, quá đủ để sử dụng cho những hình mang tính đồ hoạ. Nó không đủ màu để thể hiện hình ảnh đầy màu sắc như những tấm hình bạn chụp. Nếu bạn muốn giảm dung lượng của file GIF, bạn có thể làm bằng cách giảm số màu của nó ở Color Palette. Bạn cũng nên biết rằng định dạng này sử dụng chế độ nén hình LZW tự động và làm cho nó có dung lượng nhỏ nhất có thể mà không làm ảnh hưởng đến dữ liệu.

Độ trong suốt: 

Như nói ở trên, GIF là định dạng hỗ trợ hiệu ứng trong suốt. Ví dụ khi bạn muốn tách một tấm hình ra khỏi nền của nó, và lưu lại dưới đuôi .GIF, thì tấm hình đó sẽ được đảm bảo độ trong suốt là không còn hình nền nữa. Cho nên khi bạn đặt tấm hình này vào một tài liệu có hình nền là màu khác, nó sẽ hiện lên trên nền mới.

Khi nào nên sử dụng GIF:

Định dạng GIF nên được sử dụng cho hình logo, icons và hình đồ hoạ. Tránh sử dụng GIF cho những hình chụp tự nhiên hoặc những hình đồ hoạ có khối màu cùng tông liên tiếp. Khi bạn thiết kế với định dạng GIF, tránh sử dụng Gradients và tắt chức nâưng Anti-Aliasing để giảm thiểu dung lượng.

Định dạng JPEG

Định dạng JPEG hỗ trợ 16.7 triệu màu, nó được dùng chủ yếu cho hình chụp tự nhiên. Thuật toán nén hình của JPEG khác với định dạng GIF, nó thực chất làm mất đi dữ liệu của hình. Ví dụ khi bạn lưu lại một tấm hình, tuỳ thuộc vào bạn thiết lập thông số ra sao, những dữ liệu bị mất đi có thể không thấy được bằng mắt thường. Cho nên một khi bạn giảm chất lượng của hình và lựa lại, những dữ liệu bị mất đi không thể lấy được lại.

Progressive JPEG:

Khi xem hình trên mạng, nhất là mạng có tốc độ chậm, bạn sẽ thấy hình được load từ từ, mờ dần và trở nên rõ ràng hơn. Tất cả các định dạng JPEG đều có thể lưu lại dưới dạng Progressive JPEG, nó cho người đọc thấy hình có chất lượng thấp hơn trước và từ từ nâng dần chất lượng hình. Một vài công cụ chỉnh sửa ảnh cho phép bạn thiết lập bao nhiêu bước “đệm” mà người đọc sẽ thấy trước khi hiển thị hình thật.

Khi nào nên sử dụng JPEG

Định dạng này luôn được sử dụng với những hình chụp tự nhiên hoặc những hình nhìn không đẹp khi hiển thị ở chế độ 256 màu.

Định dạng PNG

Đây là định dạng mới nhất và được hỗ trợ rộng rãi trong 3 định dạng được nói đến trong bài này. Định dạng này được cấu tạo để khắc phục những điểm hạn chế của GIF. PNG có tất cả những tình năng mà định dàng GIF có, nhưng nó có độ sâu hơn về màu sắc. Người ta hy vọng rằng định dạng PNG sẽ được sử dụng rộng rãi hơn trong tương lai. Tuy nhiên nó sẽ không bao giờ thay thế hoàn toàn được GIF bởi vì nó không hỗ trợ hiệu ứng động.

Add to Cart More Info

Những điều nên tránh khi tối ưu hoá SEO

Tối ưu hoá công cụ tìm kiếm hay còn được gọi tắt là SEO (Search Engine Optimization) được rất nhiều webmaster quan tâm và những trang web thường nằm trong những trang đầu của kết quả tìm kiếm của Google, họ phải đầu tư rất nhiều thời gian vào SEO. Dưới đây là những lời khuyên bạn nên tránh khi sử dụng SEO

+ Không nhồi nhét từ khoá vào những chỗ không thích hợp.
+ Nếu ai đó nói bạn thêm dấu gạch ngang vào domain sẽ tốt hơn cho SEO, nhưng bạn nghĩ chưa chắc đã phải thế, bạn không nên theo lời khuyên đó
+ Đừng tin những lời quảng cáo dạng như giúp trang của bạn có rank cực cao, chắc chắn sẽ có trong top 10 của google search trong thời gian ngắn. Đừng tin họ
+ Đừng link đến những trang khác từ trang của bạn chỉ bởi vì họ hứa sẽ link ngược lại trang của bạn
+ Đừng link đến những trang khác mà chỉ vì họ hứa sẽ trả tiền cho bạn. Trừ khi bạn biết chắc chắn những gì mình làm là đúng
+ Đừng tạo nhiều trang với nội dung hoàn toàn giống nhau
+ Đừng spam địa chỉ trang web của bạn trên trang web của người khác và cũng đừng để họ spam lại bạn.
+ Không nên sử dụng host free và những công cụ tạo web miễn phí. Nếu bạn muốn tạo ra trang web hay và hữu ích, hãy đầu tư cho nó thật chu đáo.
+ Không nên quá quan tâm đến thẻ Meta Description và Meta Keyword, hãy dành thời gian đó mà viết thêm nội dung cho trang
+ Không nên sử dụng từ khoá ẩn bằng cách giấu nó không cho người đọc thấy, nhưng lại cho những công cụ tìm kiếm thấy.
+ Đừng quá lạm dụng SEO. Cái gì nhiều quá cũng không tốt

Tóm lại, bạn không nên quá lo lắng về SEO, đầu tư thời gian và công sức để cho trang web của bạn được hiển thị ở những trang đầu của kết quả tìm kiếm là hợp lý. Nhưng đừng vì quá lo lắng về nó mà bạn vấp phải những thủ thuật để gạt công cụ tìm kiếm. Những công cụ tìm kiếm lớn như Google, Yahoo và MSN, họ có cả một đội ngũ nhân viên luôn làm việc để loại bỏ những thủ thuật dùng để gạt công cụ tìm kiếm của họ. Nói chung, một khi trang web của bạn có nội dung rất hay, thì không cần quá nhiều SEO, bạn vẫn có rank cao như thường.

Add to Cart More Info

Quy trình thiết kế layout website

Thiết kế Giao diện dành cho Người sử dụng là một công việc trong quytrình phát triển một Web site. Tại Việt Nam, nhiều doanh nghiệp vừa vànhỏ không quan tâm chất lượng phần mềm, dịch vụ sau bán hàng mà thườngquan tâm đến giao diện Web có đẹp hay không. Tuy nhiên đây lại là hạnchế của hầu hết các doanh nghiệp thiết kế Web. Trong phạm vi cho phép,chúng tôi xin trình bày các bước xây dựng Giao diện Web cho người sửdụng, nhằm giúp các bạn đạt hiệu quả thiết kế giao diện cao hơn.

Bài viết này không có tham vọng chỉ ra Marketing với Web như thế nào,nhưng việc hiểu về quy trình làm Web giúp các Marketer có phương phápphối hợp tốt hơn qua đó phối hợp với nhà cung cấp dịch vụ Web của côngty, sản phẩm, dịch vụ đạt hiệu quả cao hơn.

Bài viết không đi sâu vào nghệ thuật thiết kế Web, bài viết chỉ ra các bước nên làm với một dự án thiết kếgiao diện Web.
Quy trình được dựa trên Chuẩn IWP phiên bản 1.0 của IGURU. Bài viết có sử dụng giao diện của Websitebán hàng trực tuyến, Web site tin tức do iGURU thiết kế

Quy trình bao gồm các bước sau:
Bước 1: Xác định yêu cầu của khách hàng.
Bước 2: Phác thảo ý tưởng trên giấy
Bước 3: Đánh giá mẫu phác thảo
Bước 4: Thiết kế đồ hoạ bản đơn sắc
Bước 5: Phối màu cho giao diện Web
Bước 6: Xây dựng tài liệu về chuẩn CSS, clientsite script, ảnh, folder cho trang Web
Bước 7: Sử dụng các ngôn ngữ đánh dấu, lập trình để thiết kế giao diện.
Bước 8: Test giao diện trên các trình duyệt
Bước 9: Chuyển mã nguồn tới bộ phận phát triển Web

Bước 1: Xác định yêu cầu của khách hàng.
Mục tiêu của giai đoạn này là xác định chính xác yêu cầu hoặc tư vấncho khách hàng. Yêu cầu là một điều kiện hoặc khả năng mà hệ thống phảituân theo hoặc có. .

Nhiều khi khách hàng cũng không biết họ cần gì, nên khi xác định yêucầu bạn nên xây dựng trước một biểu mẫu câu hỏi để lấy yêu cầu củakhách hàng. Yêu cầu phải đạt những tiêu chí sau:

Yêu cầu phải bao quát giao diện, chức năng, cấu trúc nội dung, đối tượng xem Web site.
Trao đổi thông tin dựa trên các yêu cầu đã xác định trước khi tiếpcận khách hàng. Bạn phải nghiên cứu về yêu cầu chung của khách hàngtrước khi tiếp cận.
Xây dựng bảng câu hỏi logic để chuyển đổi sang phân tích yêu cầu nghiệp vụ, yêu cầu hệ thống đơn giản, dễ dàng.
Đặt độ ưu tiên, lọc và theo dõi các yêu cầu.
Đánh giá khách quan các chức năng và hiệu năng.


Mẹo: để có thể hoàn thành Web nhanh chóng và chính xác nên đặt những câu hỏi:

Sau 3 năm nữa Web site sẽ phục vụ mục đích gì?
Hãy liệt kê các tính năng mà bạn nghĩ ra được và đặt theo thứ hạng: Bắt buộc, Mong muốn và Tuỳ chọn.
Bạn cho biết 03 Web site bạn ưa thích nhất, trong đó những điểm nào làm bạn thích và những điểm nào bạn chưa thích?


Bước 2: Phác thảo ý tưởng trên giấy
Mục tiêu của bước này là định hình bố cục của trang Web.

Nào giờ là lúc bạn thể hiện hoa tay của mình, để linh hoạt trong việcphác ý tưởng, bạn nên sử dụng bảng vẽ, bút chì, thước kẻ và tẩy. Dựavào kinh nghiệm thành công của bạn, bạn thấy những tiêu chuẩn nào nêncó, ví dụ các tiêu chuẩn sau của IWP 1.0:

Banner không quá 1/3 màn hình thực của người sử dụng (màn hìnhthực là màn hình của trình duyệt có thể xem được trang Web, đã bỏ đicác thanh tool bar của trình duyệt Web).
Sitebar không lớn quá 25% chiều rộng trang Web.

Bạn cũng nên xây dựng chuẩn bố cục dựa trên nội dung đối với toàn bộWeb site. Web site là tập hợp của những trang Web, mỗi trang Web tậphợp các nội dung có mối liên quan hoặc không giữa các trang Web. Dựavào nội dung, bạn chia trang Web làm 02 vùng:

Vùng template (theo chuẩn IWP)
Vùng hiệu chỉnh.


Vùng template là vùng không hiệu chỉnh hoặc hiệu chỉnh rất ít xuyên suốt các trang Web của Web site.
Vùng hiệu chỉnh là vùng có thay đổi nội dung trong hầu hết các trang Web của Web site.
Bạn nên cân nhắc trước khi xác định vùng nào là vùng template hoặc vùnghiệu chỉnh, vì việc này sẽ ảnh hưởng đến xây dựng mã CSS, HTML chungcủa giao diện Web site.

Bạn cũng nên quy chuẩn các đối tượng trong bố cục để dễ trình bày, quảnlý, theo dõi. Ví dụ: Ảnh là hình chữ nhật có đánh dấu x; chữ là đườngkẻ,...
Nếu đây là một dự án phức tạp bạn nên tham khảo quy trình RUP và kếthợp với quy trình này để ra một giải pháp quản lý dự án phù hợp hơn.

Ví dụ:

Bước 3: Đánh giá mẫu phác thảo
Mục đích của bước này là đánh giá mẫu phác nào phù hợp với yêu cầu, mong muốn của khách hàng. Để tìm hiểu sâu hơn về thiết kế Web và Thương hiệu bạn xem các bài viết khác tại iGURU Blog.

Bạn nên có tối thiểu 03 mẫu phác trên giấy, sau đó bạn treo lên tườngvà mời những người khác cùng xem và đánh giá. Mẫu phác thảo đạt nhữngyêu cầu phải trả lời được những câu hỏi như sau:

Họ thích mẫu nào?
Mẫu thiết kế có đáp ứng các yêu cầu của khách hàng không?
Tìm thông tin, chức năng có dễ không?
Đứng xem, bạn có thấy bố cục có rời rạc không? Có thẩm mỹ không?


Nếu câu trả lời không đạt yêu cầu trên bạn nên ngồi lại và vẽ tiếp,điều này sẽ giúp bạn giảm chi phí nhiều nếu bạn sử dụng máy tính đểthiết kế. Sau khi chọn được một mẫu chúng ta chuyển sang bước 4.

Bước 4: Thiết kế đồ hoạ bản đơn sắc
Mục tiêu của bước này là đánh giá bản phác trên giấy khi chuyển sangĐồ hoạ vi tính bố cục có phù hợp với yêu cầu và mong muốn của kháchhàng hay không.

Sau khi phác thảo xong, bạn sử dụng công cụ đồ hoạ máy tính để thiết kếmẫu giao diện Web. Đầu tiên chúng ta cần xem bố cục trên Máy tính cóhợp lý không, chính vì vậy chúng ta chưa phối màu cho các mảng màu,đường kẻ, chữ cho trang Web, tất cả các bạn để thang màu xám để bướctiếp theo phối màu dễ dàng hơn. Nếu bạn phối màu trong giai đoạn nàybạn sẽ phải đối mặt với hai rủi ro: Sai bố cục và sai phối màu. Tuyệtđối không để màu trắng và đen với những vùng muốn phối màu khác hai mầutrên.

Nếu bạn sử dụng công cụ đồ hoạ, chúng tôi đề xuất sử dụng Photoshop CS2để áp dụng các chuẩn thiết kế giao diện dễ dàng hơn. Ví dụ đặt tên, sắpxếp folder, phân cấp folder, áp màu cho layer,...

Với iGURU, một số chuẩn dùng trong thiết kế đồ hoạ vi tính được định nghĩa như sau:

Website chia ra 3 phân vùng chính với tên viết hoa bằng tiếng Anh: TOP,MIDDLE, BOTTOM. Ba phân vùng này tương ứng với phần trên cùng, phầnthân và chân trang Web.
Trong các phân vùng, để phân biệt các vùng khác nhau thì được đặttên tương tự nhưng có dấu chấm “.” trước tên. Ví dụ: .TOP, .MIDDLE,.BOTTOM, .LEFT, .RIGHT
Hình ảnh và Chữ được phân bố vào 02 thư mục riêng: IMG và TXT

Sau khi căn chỉnh bố cục và thiết kế xong, bạn nên in ra và lạitreo lên tường mời mọi người đến đánh giá giống như bước 3. Đánh giáhiện giờ cần phải trả lời những câu hỏi như sau:

Tìm thông tin, chức năng có dễ không? Không dễ vì sao? Do độ tương phản, kích cỡ, …?
Trình bày thông tin quan trọng có dễ tìm với giới hạn của màn hình thực hay không?
Giao diện có dễ đọc, dễ sử dụng với người dùng mục tiêu hay không?
Giao diện có thể hiện ra tính cách riêng hay không?

Ví dụ:

Bước 5: Phối màu cho giao diện Web
Khi bản đơn sắc đạt yêu cầu, bạn chuyển sang phối màu cho giao diệnWeb. Khi phối màu cho giao diện bạn nên tuân thủ các phương pháp chẳnghạn như sau:

Dựa vào màu sắc yêu cầu từ bảng câu hỏi để đưa ra phương phápphối màu cho Web site. Có 1 màu chủ đạo, 1 màu thứ cấp và các màu chỏiđể tăng phần sinh động cho Web.
Với màu nền là màu pha gam xám sẽ có kiểu phối màu riêng. Ví dụphần nội dung sẽ có màu đỏ, vàng chanh, vàng, cam, xám, da trời,… tuỳthuộc vào mục đích của Web site.
Với text nên tối đa 3 màu, 3 font, 3 cỡ chữ, 3 kiểu chữ, 3 kiểu trace, kerning.

Mẹo: Giai đoạn phối màu rất dễ bị ảnh hưởng bởi màu sắc của ảnh ( ví dụ banner).
Đây là điểm có lợi nhưng cũng là điểm có hại cho thiết kế giao diện Website. Nhiều người ban đầu chọn ảnh cuốn hút và truyền đạt chính xácthông điệp của Web site và giờ họ chèn vào để lấy cảm hứng thiết kế từảnh. Một số người không có kiến thức về media hoặc không có đánh giáđúng mức hiệu quả của ảnh đem lại cho Web site, họ chọn những tấm ảnhkhông đúng thông điệp, từ đó họ thiết kế nhầm mầu sắc do ảnh hưởng từảnh.

Ví dụ:

Bước 6: Xây dựng chuẩn CSS, clientsite script, ảnh, folder cho trang Web
Mục đích của giai đoạn này giúp Web site dễ bảo trì, giảm mã, nộidung hiển thị tốt hơn với tỉ lệ mã thấp, linh động trong định nghĩakiểu. Và quan trọng hơn, nó giúp cả quy trình sản xuất, triển khai, bảotrì ít rủi ro hơn.

Các chuẩn bao gồm:

Định nghĩa vùng của site, trang Web, các vùng trong một thẻ DIV
Chuẩn đặt tên cho nhãn CSS, ảnh
Chuẩn đặt tên cho các thư mục chứa các thành phần của trang Web
Chuẩn đặt tên cho tệp tin CSS, HTM, JS, XML

Ví dụ trong một thẻ DIV chúng ta định nghĩa như sau:

TL: Top-Left: Chỉ vị trí trên cùng, bên trái
TC: Top-Center: Chỉ vị trí trên cùng chính giữa
TR: Top-Right: Chỉ vị trí trên cùng, bên phải
ML: Middle-Left: Chỉ vị trí làm việc bên trái
MR: Middle-Right: Chỉ vị trí làm việc bên phải
BL: Bottom-Left: Chỉ vị trí dưới cùng, bên trái
BC: Bottom-Center: Chỉ vị trí dưới cùng chính giữa
BR: Bottom-Right: Chỉ vị trí dưới cùng, bên phải

Mẹo: người thực hiện bước 1 5 phải có tư duy về HTML, CSSvà lập trình để từ đó đưa ra một giải pháp GUI tận dụng được điểm mạnhcủa các công nghệ ứng dụng vào phát triển Web. Ở mức độ cao cấp hơn,những người này phải có kiến thức sâu rộng về Thương hiệu, Media,Marketing, Bán hàng, Chăm sóc khách hàng, từ đó cô đọng quy trình hoạtđộng trên thành những vòng lặp có thể kiểm soát từ đó áp dụng vào thiếtkế giao diện.

Bước 7: Sử dụng các ngôn ngữ đánh dấu, lập trình để thiết kế giao diện
Mục đích của giai đoạn này là thiết kế Web bằng HTML, CSS ( Flash, JS,… nếu có)

Chúng ta chuyển tải giao diện đồ hoạ sang trang Web.

Nếubạn chỉ sắp xếp bố cục, kết cấu của trang Web thì nên dùng HTML. Bạn cóthể sử dụng chương trình Adobe ImageReady CS2 để cắt ảnh ra thành trangWeb.
Nếu bạn muốn dàn trang, định kiểu cho các kết cấu của trang Web, bạn nên sử dụng CSS và bước 6 rất có ích với bạn.

Công việc của một người thiết kế Web lúc này giống như một người lậptrình nhiều hơn là một nhân viên thiết kế. Anh ta chỉ cần hiểu rõ cáchbiểu diễn phông chữ, màu sắc, canh lề, các loại đường, nét, chiều cao,độ rộng, ảnh nền các loại, ảnh, xác định vị trí cho các khối… sao chogiống các bản thiết kế đồ hoạ nhất.

Mẹo: người thực hiện thực hiện bước này phải hiểu thấu đáo vềHTML, CSS, JS nếu không giao diện sẽ hiển thị không như bản vẽ đồ hoạvi tính trên nhiều trình duyệt khác nhau.

Bước 8: Kiểm thử giao diện trên các trình duyệt
Mục tiêu của giai đoạn này là kiểm soát việc hiển thị chính xáctrang Web như giao diện đồ hoạ của bước 5 trên các trình duyệt Web khácnhau.

Tối thiểu chúng ta phải kiểm soát việc hiển thị đúng như giao diện thiết kế trên các trình duyệt:

Microsoft Internet Explorer các phiên bản 5, 6, 7 và thời gian tới là 8
Firefox 1.5+
Safiri
Opera
Netscape
Mozilla

Mỗi Web site đều nhắm đến một số phân khúc khách hàng, có một định vịvà thị trường mục tiêu. Rất ít Web site có thể phục vụ tốt toàn bộ cáctrình duyệt Web, nên bạn cần nghiên cứu người dùng cuối mục tiêu củamình dùng trình duyệt Web nào và thiết kế sao cho hiển thị tốt trên cáctrình duyệt đó.
Nghe đến đây chắc hẳn bạn sẽ vò đầu bứt tai sao mà phức tạp thế! Bạnyên tâm, với kinh nghiệm của iGURU Việt Nam, một người chưa biết về CSSchỉ cần học với chuyên gia 4 giờ/ ngày trong vòng 1 tuần là có thể sửdụng thành thạo CSS.

Mẹo: người thực hiện bước này nên tìm các đoạn mã hack CSS đểứng dụng vào việc thiết kế trang Web cho nhiều trình duyệt.

Người thực hiện việc thiết kế CSS cũng nên theo dõi người truy nhập vàoWeb ( ví dụ từ Google Analytics), từ đó tổng hợp số liệu sử dụng trìnhduyệt Web của họ để có thể liên tục cập nhật mã CSS cho trang Web, giúptrang Web hiển thị tốt theo xu hướng sử dụng trình duyệt của người dùngcuối.

Bước 9: Chuyển mã tới bộ phận lập trình
Mục tiêu của giai đoạn này là chuyển các trang Web hiển thị tốt trêncác trình duyệt chính cùng với các thành tố của trang Web tới bộ phậnlập trình.

Phải chắc chắn bộ phận lập trình cũng hiểu được yêu cầu bắt buộc củagiao diện và chuẩn thiết kế của bước 6. Thông thường các yêu cầu vàchuẩn này được quản lý dự án hoặc trưởng nhóm thông báo trước để các bộphận không hiểu nhầm nhau.

Các yêu cầu bắt buộc và chuẩn thiết kế không chỉ được chuyển tới bộphận lập trình mà còn chuyển tới bộ phận kiểm thử ( test) để họ có thểxây dựng các kịch bản kiểm thử, thông qua đó họ kiểm tra được chấtlượng của dự án. Nếu có phát sinh lỗi, họ sẽ thông báo lại bộ phận thiết kế và lập trình để sửa lỗi.

Add to Cart More Info