thiết kế web và các bước đơn giản

Thiết kế Web

Các bước để có một website


Tuy nhiên để giải toả một chút cái nóng đang đốt cháy bạn, tôi có một vài mẹo để
bạn bắt đầu với một lĩnh vực mới mà bây giờ người ta hay gọi nó với một cái tên là –
câu lạc bộ webmaster.

Dùng một dịch vụ Free

Dịch vụ host free có ưu điểm là bạn không mất đồng nào để mua host và domain mà
vẫn có trang web của mình trên mạng. Nhưng trái lại bạn hầu như phải phụ thuộc vào
dịch vụ đó rất nhiều ví dụ như dung lượng rất giới hạn, bandwidth cũng rất ít, vô số các
banner quảng cáo và một điều tệ là có thể chết bất cứ lúc nào.

Một điều nữa là khi bạn dùng những host free thì bạn không có tên miền cho riêng mình
mà dạng như http: //www.doteasy.com/~username


Tuy nhiên để bắt đầu với việc làm web, một host và domain free cũng là một ý tưởng
hay để bắt đầu với.

Bạn vào Google hoặc Yahoo và search với từ khóa, free blog, free host, free domain …
thì nó sẽ cho bạn rất nhiều kết quả. Và bạn chỉ việc chọn một trong những thứ đó.

Tôi có biết một trang web cho host free rất uy tín và KHÔNG có banner. Bạn có thể đăng
ký và dùng thử Doteasy.com

Bạn cần biết về HTML

Cho dù hiện nay có rất nhiều phần mềm thiết kế web dạng HTML Editor, tuy nhiên cho
dù công cụ đó có mạnh đến đâu thì nó cũng chỉ là công cụ. Bạn mới là người quyết định.
Do vậy nếu một chút kiến thức về HTML bạn cũng không có, thì thật rất khó cho bạn khi
bạn muốn làm web.

Về HTML bạn có thể đọc phần Cơ bản về HTML có trên Vietphotoshop.com

Bạn nên biết sử dụng thành thạo một phần mềm thiết kế web

Bạn nên học cách sử dụng một trong hai phần mềm thiết kế web sau: Dream Weaver
hoặc Microsoft Frontpage. Đây là hai phần mềm mạnh nhất về thiết kế web bằng HTML
đang có trên thị trường. Về Microsoft Frontpage, bạn cũng có thể học cách sử dụng qua
chương sách “Bước đầu đến với Frontpage” có trên Vietphotoshop.

Bạn nên biết cách sử dụng một chương trình đồ hoạ

Sau khi bạn đã biết được nhưng tag cơ bản của HTML, biết sử dụng phần mềm thiết kế
web thì đã đến lúc bạn nên biết về một phần mềm đồ hoạ. Nó giúp bạn tạo banner,
button, hình ảnh … cho trang web của bạn. Đây là một bước rất quan trọng trong việc
thiết kế web.

Về cơ bản, bạn có thể học phần mềm đồ hoạ Adobe Photoshop. Với kiến thức khá vững
về phần mềm này, bạn có thể tự tạo ra layout, banner, button thậm chí là logo cho riêng
website của bạn.

Bạn nên học về PHP

Bây giờ chiều hướng của người lướt web đã thay đổi với trước kia rất nhiều. Trước đây
mọi người chỉ đọc web, bây giờ mọi người thức vọc web. Có nghĩa là người đọc muốn

được tham gia vào trang web để viết bài, gửi bài, tham gia thảo luận, nhận xét … họ
không còn thụ động như xưa nữa mà đã rất chủ động. Cho nên nhu cầu một trang web
động về nội dung là thực sự cần thiết.

Chính vì vậy hiện nay những trang web động sử dụng MySQL có thể cập nhật liên tục
mà không mất thời gian như những trang web tĩnh dạng HTML nữa. Đây là một xu
hướng mới và nó sẽ dần thay thế những trang web ban sơ dạng HTML.

Cuối cùng, như bạn thấy, để trở thành một webmaster cũng không phải là dễ. Do vậy
nếu bạn chỉ cần một chút quyết tâm và lòng đam mê, bạn sẽ đi qua hết được những
“cửa ải” mà tôi nói ở trên. Đến lúc đó hãy tạo ra một trang web với nội dung thật hấp
dẫn, và hãy quay lại Vietphotoshop chúng ta cùng liên kết nhé!

Chúng tôi luôn chờ bạn và sẵn sàng giúp đỡ bạn.

© Bá tước Monte Cristo – www.vietphotoshop.com


Tạo một trang Redirect (định hướng) tự động
Tuy nhiên sau một thời gian tồn tại, trang của bạn lại thu hút được nhiều người đến xem
vì nội dung của nó. Bạn sẽ có ý định mua host và domain cho mình thay vì dùng host
free. Nhưng vấn đề thường là trang của bạn trước đây đã được nhiều Search Engine
indexed rồi, nhiều người book mark site của bạn rồi, hoặc nhiều người đã quá quen với
tên miền đó của bạn. Bây giờ mà bạn bỏ đi không một lời từ biệt thì teo mất! cho nên
việc tốt nhất lúc này là đặt một trang tự động chuyển địa chỉ URL. Nó nên là một trang
đơn giản với hình logo của bạn, và có thể chạy lệnh redirect một cách tự động và gửi
khách đến thăm sang địa chỉ được chỉ định bởi bạn. Ở trong trang redirect này bạn nên
ghi thông tin là:

[I]"Chúng tôi đã chuyển sang dùng tên miền mới. Bạn sẽ được tự động chuyển trong 5

giây. Nếu trong 5 giây trình duyệt không tự động chuyển bạn hãy nhấn vào link sau
"[/I]

Bạn copy và paste đoạn code sau vào HTML ở giữa hai thẻ ở trang redirect

< HEAD>
< META HTTP-EQUIV=REFRESH CONTENT="X;URL=">
< /HEAD>


(bỏ hai dấu chấm đi nhé)

X ở trên là số lượng thời gian trước khi nó được chuyển sang địa chỉ mới. Bạn nên đặt
thời gian là 5 giây để người đọc có thể biết được cái gì đang xảy ra.

Bằng cách đơn giản này bạn có thể di chuyển domain thật đơn giản mà không phải lo
mất nhiều độc giả.

© www.vietphotoshop.com - Dịch bởi Bá tước Monte Cristo


Bảo vệ hình ảnh khỏi bị lấy bằng direct link
Bảo vệ hình của bạn bằng .htaccess thì khá đơn giản. Những gì bạn cần làm là cho hết
hình vào một thư mục mà bạn muốn bảo vệ. Tiếp đến là tạo một file text trong ASCII
đặt tên là .htaccess và lưu nó lại trong thư mục chưa file hình. Chú ý là tên file bắt đầu
bằng dấu chấm và tất cả đều là chữ thường không có in hoa. Mở notepad của Window
lên, Copy và dán đoạn code sau vào notepad.

>*******************<

SetEnvIfNoCase Referer "^ain-của-bạn.com/" locally_linked=1
SetEnvIfNoCase Referer "^ain-của-bạn.com$" locally_linked=1
SetEnvIfNoCase Referer "^http://domain-của-bạn.com/" locally_linked=1
SetEnvIfNoCase Referer "^http://domain-của-bạn.com$" locally_linked=1
SetEnvIfNoCase Referer "^$" locally_linked=1
<FilesMatch ".(gif|png|jpe?g)$">
Order Allow,Deny
Allow from env=locally_linked
</FilesMatch>

>********************<

Thay chữ domain-của-bạn thành tên domain thật của bạn ví dụ là www.bantayden.com.
Nếu bạn muốn cho phép những domain khác có thể dùng link hình đó thì bạn copy hai
dòng đầu tiên và cho tên của domain đó vào. Ví dụ tôi muốn cho trang www.appznet.org
dùng hình của tôi tôi làm như sau

>********************<

SetEnvIfNoCase Referer "^ locally_linked=1
SetEnvIfNoCase Referer "^$" locally_linked=1
SetEnvIfNoCase Referer "^ locally_linked=1
SetEnvIfNoCase Referer "^ locally_linked=1
SetEnvIfNoCase Referer "^$" locally_linked=1
<FilesMatch ".(gif|png|jpe?g)$">
Order Allow,Deny
Allow from env=locally_linked
</FilesMatch>

>********************<

Ở đoạn code ở trên bạn thấy có cả lựa chọn http://domain-của-bạn.com là bởi vì có
những domain không cần phải gõ www mà chỉ cần gõ thẳng tên domain vẫn có thể vào
những domain không cần phải gõ www mà chỉ cần gõ thẳng tên domain vẫn có thể vào
được. Do vậy nếu bạn chỉ luôn vào một địa chỉ là www.domain-của-ban.com thì bạn xoá
hai dòng ở dưới đi cũng được.

Thêm nữa nếu bạn muốn cho những trang khác xem được hình thì bạn cứ copy dòng
thứ nhất và thứ hai dán xuống dưới và thêm domain của trang đó. Vậy là xong, file này
có thể bảo vệ những hình có định dạng là ".gif", ".png", ".jpg" và ".jpeg".

Khi bạn đã copy và chỉnh sửa xong bạn lưu file lại dưới tên là .htaccess và upload nó lên
host bằng trình FTP nhé.

Lưu ý: khi bạn upload lên bạn sẽ không thấy file này hiện lên ở một số trình FTP ví dụ
như Cute FTP. Vì đây được coi là file hệ thống cho nên Unix nó ẩn file này đi. Để xoá file
này cũng có một vài cách dùng câu lệnh trên FTP. Nhưng cách đơn giản hơn là dùng
phần mềm FlashFTP có thể nhìn thấy file này trên host và xoá nó.

Nếu bạn không muốn phức tạp như thế thì tạo lại một file .htaccess khác với nội dung
trắng và upload đè lên là mọi việc lại trở lại bình thường.

Bá tước Monte Cristo - www.bantayden.com


Một banner đẹp là tập hợp của những điều giản dị
Author:Granny's Mettle
======================

1. Kích thước nên phù hợp với tiêu chuẩn:

Và hãy luông giữ cho nó phù hợp với tiêu chuẩn. Có một banner to, rộng cũng tốt và
cũng rất cuốn hút sự chú ý của người đọc. Tuy nhiên, nếu ai cũng làm như thế thì bạn
sẽ làm gì khác biệt không? có một chuyên gia thiết kế nhận định là:"tôi biết nếu banner
của bạn lớn hơn một xíu nó sẽ cuốn hút hơn sự chú ý của người đọc nhưng nếu ai cũng
làm như thế thì chúng ta sẽ đi tới đâu?". Cho nên tôi khuyên bạn nên làm ở mức tiêu
chuẩn. Theo một thông số không phải là chính thức thì banner tằm 778x140 là dạng tiêu
chuẩn và được nhiều site sử dụng nhất.

2. Nội dung của trang phải phù hợp với banner.

Bên cạnh những hình đồ họa được thiết kế tỉ mỉ, thì banner của bạn cũng phải có nội
dung cân bằng với nó. Nội dung trên banner nên ngắn gọn, đơn giản và phải thể hiện
được mục tiêu và hướng đi của trang web. Nhưng trên hết nó phải thu hút được sự chú
ý.

Nội dung trên banner nên trực tiếp và ngắn gọn bởi vì một điều đơn giản là nó không đủ
chỗ cho một bài diễn văn. Hơn nữa, không phải ai cũng muốn đọc hoặc cố gắng đọc
những gì bạn viết trên đó. Cho nên hãy giữ nó ở mức tối thiểu. Hãy nhờ sự giúp đỡ của
bạn bè, gia đình để cùng nhau có một câu ngắn gọn, súc tích chỉ trong 5 chữ. Bạn thậm
chí có thể tạo lên sự khác biệt bằng một câu slogan thật ý nghĩa của bạn.

3. Màu sắc và hình động nên phù hợp

Trang web của bạn nếu có màu sắc và hình động thì nó nên phù hợp và mạch lạc trong
suốt toàn bộ trang. Màu sắc nên bắt mắt và dễ nhìn một xíu, trong khi đó thì những hình
đồ họa nên càng đơn giản nhưng hiệu quả càng tốt và dung lượng nên nhỏ để giảm thời
gian load. Dù cho banner của bạn có là một đoạn intro flash đẹp như mơ và câu slogan
đầy ý nghĩa, nhưng tất cả những điều đó sẽ trở thành vô nghĩa khi một ai đó đã chọn
nút X màu đỏ trước khi nó kịp có cơ hội để thể hiện mình. Hãy giữ cho banner của bạn

load thật nhanh ở cả những người dùng internet tốc độ không cao. Vì không phải ai cũng
có may mắn được dùng đường truyền ADSL như của bạn.

4. Nhận xét từ gia đình và bạn bè

Người ta nói rằng nới tốt nhất để có những lời nhận xét chân thành là từ thành viên gia
đình và bạn bè thân thiết. Họ có thể cho bạn những lời nhận xét cả tích cực và tiêu cực
để bạn chỉnh sửa cho hoàn thiện hơn bởi vì họ là những người mong bạn thành công.
Hơn nữa họ không cảm thấy ngại khi phải nói thẳng ra rằng banner của bạn nhìn thấy
ghớm! Cho nên hãy mở rộng tâm hồn để đón nhận những lời nhận xét cho dù nó là tích
cực hay tiêu cực và hãy đánh giá nó thật nghiêm túc.

© www.vietphotoshop.com - Dịch bởi Bá Tước Monte Cristo


Chọn font chữ thế nào cho đúng


Rất nhiều nhà thiết kế web cứ ngộ nhận sự lựa chọn font chữ. Điều đó là không nên
bởi vì font chữ đóng góp rất nhiều vào diện mạo của trang web và tính dễ đọc của nội
dung trong nó. Nếu phải liệt kê ra thì hiện nay có khoảng hơn 20.000 font chữ, và con
số này không dừng lại ở đó bởi vì ngày nào cũng có người ngồi thiết kế thêm font khác.
Với quá nhiều sự khác biệt như vậy thì bạn phải đánh dấu xuất phát điểm của mình ở
đâu bây giờ?

Điều đầu tiên bạn cần làm là hạn chế sự lựa chọn font lại. Bạn chỉ nên chọn những font
nào hỗ trợ cho những thành phần thiết kết. Font chữ thể hiện tính cách. Nó có thể hạnh
phúc và vui nhộn như những đứa trẻ, nghiêm túc và trang trọng như một người lớn tuổi,
nó u buồn với màu đen, vui tươi với màu vàng. Font chữ có thể ngỗ nghịch, kín đáo, dè
dặt, quỷ quyệt, gian xảo, tự tin và thích thú cho nên bạn phải chọn chúng với tính cách

mà font chữ đó thể hiện. Nếu không trang web của bạn sẽ là một trò hề trên Net.

Đây là một vài điều KHÔNG - KHÔNG:
Như đã nói ở trên bạn có rất nhiều sự lựa chọn cho font chữ và đó cũng là lý do bạn
phải thật sự tỉnh táo khi chọn font chữ cho mình. Đừng dùng chữ VIẾT HOA trong toàn
bộ đoạn văn nếu không chẳng có ai muốn đọc nó đâu. Nó chỉ gây tốn thời gian bởi vì
người đọc thấy chán ngán với font chữ dạng đó. Cuối cùng, ai muốn mắt mình bị đau khi
phải đọc những thứ như thế? Một điều nữa là bạn không nên sử dụng font chữ quá nhỏ
hoặc quá lớn. Kích thước tiêu chuẩn là từ 12-14, nếu hơn hoặc kém mức trên là font của
bạn đang trong vùng "nguy hiểm".

Bên cạnh giá trị thẩm mỹ của font chữ, tính dễ đọc cũng nên được đặc biệt quan tâm
bởi vì font làm ra để đọc được chứ không phải chỉ để trang trí. Người thiết kế font cũng
phải nghĩ rằng font mình làm ra phải để người khác đọc được. Theo sau tính dễ đọc và
giá trị thẩm mỹ là sự cuốn hút độc giả. Nó phải được thiết kế khéo léo sao cho nó thể
hiện được tính cách của font đó. Nếu thiếu nó có thể sẽ là một thiếu sót lớn.

Một điêu quan trọng nữa là bạn không nên sử dụng nhiều hơn 3 loại font trong thiết kế.
Bởi vì nó sẽ làm cho trang web rắc rối và lộn xộn. Khoảng trắng và chữ cũng nên được
quan tâm để tối ưu hoá nội dung của nó.

Nếu bạn vẫn không chắc lắm về sự lựa chọn font chữ cho mình, bạn nên hỏi ý kiến
những chuyên gia về thiết kế để giúp đỡ bạn chọn font. Hãy nhớ rằng font chữ cúng như
những thành phần khác có thể tạo nên sự thành công của trang web cũng như mang
đến thất bại. Và bây giờ bạn muốn thử chọn font đúng cách hay muốn thử thách?

© www.vietphotoshop.com - Dịch bởi Bá tước Monte Cristo


Thế nào thì được gọi là nội dung hấp dẫn

Sau đây là một vài điểm để bạn lấy làm chuẩn cho hai chữ "Nội dung" hấp dẫn.

1. Phù hợp

Nội dung phải phù hợp với trang web của bạn. Tại sao bạn phải đi lấy hoặc viết những
bài chẳng liên quan gì đến trang web của bạn? có lẽ bạn sẽ nghĩ điều đó là tất nhiên,
nhưng tôi thì thấy nhiều trang chẳng liên quan gì đến tin tức nhưng trang chủ cũng trích
dẫn những tin tức nóng hổi đang được đăng ở Vnexpress.net.

2. Chính xác

Thông tin đăng trên trang web của bạn phải càng chính xác càng tốt. Một phần trong
những lý do bạn thêm nội dung cho trang web của bạn là bạn đang muốn cho người đọc
thấy rằng bạn là người khá rành về vấn đề bạn đang viết. Nhưng nếu thông tin của bạn
lại thiếu chính xác thì người ta sẽ nghĩ bạn không phải là một tay cừ như bạn nghĩ.

3. FREE - Miễn phí

Nếu bạn sông bằng nghế bán thông tin thì không phải tất cả những một phần thông tin
của bạn nên được cho miễn phí. Làm sao người ta có thể biết thông tin của bạn giá trị
đến mức nào nếu chưa một lần được xem mà đã phải trả tiền rồi. Ví dụ tôi muốn bán
web host trên vietphotoshop.com thì tôi sẽ viết nhiều bài viết về chủ đề webhost và
domain. Không phải tôi chỉ muốn chia sẻ thông tin về vấn đề đó mà tôi muốn cho bạn
thấy tôi biết về host và domain như thế nào.

Cuối cùng nhưng không kém phần quan trọng là nội dung trên trang của bạn nên là
những gì "độc nhất vô nhị" đừng nên chỉ copy và paste ở những trang khác và lấy làm
của mình. Nếu trong trường hợp bạn hơi yếu về khoản viết lách, thì cũng không cần phải
cố ngồi viết ra một bài nào đó mà lại mong nó mang nhiều thông tin. Nếu trong trường
hợp này bạn có thể "mượn" thông tin của người khác và dùng trong trang của bạn.

Nhưng nên nhớ là phải credit cho họ nhé! Nhưng nếu bạn có thể tự viết ra những bài
viết dựa trên kinh nghiệm của bạn thì sẽ là điều tốt nhất

© www.vietphotoshop.com - Dịch bởi Bá tước Monte Cristo


Chọn màu phù hợp
Bạn đừng nên đánh giá thấp quá trình lựa chọn màu sắc cho trang web của mình. Đừng
chọn màu theo kiểu sai thì sửa. Dưới đây là những kinh nghiệm quý báu nhất liên quan
đến việc chọn màu cho trang web. Đọc nó và hãy bắt đầu công việc thu hút sự chú ý của
người đọc.

Cách sử dụng màu và pattern

Nếu có thể bạn cho phép người đọc trên trang web của bạn có thể lưa chọn màu sắc,
skin tuỳ theo sở thích của họ. Tiếp đến là việc tạo độ tương phản cao giữa chữ và hình
nền, tạo ra độ tương phản giữa chữ và hình nền là điều nên làm, tuy nhiên bạn đừng
nên dung pattern hay là texture background đằng sau chữ. Một màu đặc hoặc không có
gì thường tốt hơn nhiều.

Bạn cũng đừng nên dựa quá nhiều vào ý nghĩa chỉ dẫn của màu sắc cho những đoạn
thông tin quan trọng. Sử dụng màu sắc như là một cách để phân biệt những thành phần
khác nhau trên một trang web có thể khá thú vị và vui mắt. Nhưng tránh lạm dụng màu
sắc khi bạn phải dung nhiều màu cùng một lúc. Nên mạch lạc và đặt giới hạn cho số
lượng màu mà bạn sẽ dung cho trang web.

Lựa chọn màu phù hợp

Màu an toàn nhất, dễ đọc hơn và chuyên nghiệp là sự kết hợp của chữ đen nền trắng.
Theo khả năng trung bình của mắt người - màu đỏ và xanh lá cây sẽ rõ ràng nhất nếu

được đặt ở giữa. Trắng, đen, vàng và xanh dương thì rõ ràng hơn khi được đặt ở vùng
biên. Nếu muốn xác định hai nhóm nội dung, đừng nên sử dụng kết hợp hai màu đỏ và
xanh lá, hãy luôn nhớ rằng hầu hết những người bị bệnh mù màu là mù với hai màu đỏ
và xanh lá. Cũng tương tự như thế với hai màu Xanh dương và Vàng bởi vì có ít nhất 1-
2% số người bị mù với hai mùa Vàng và Xanh dương.

Với mục đích để thu hút sự chú ý của người đọc thì màu đỏ hoặc những màu sặc sỡ
khác có thể giúp ích được cho mục đích của bạn. Những màu sáng khác cũng rất tốt cho
chế độ hiển thị nội dung trên màn hinh fmáy tính mà có thể được xem trong một thời
chế độ hiển thị nội dung trên màn hinh fmáy tính mà có thể được xem trong một thời
gian dài. Những màu này cũng thích hợp với những người dùng lớn tuổi. Nếu bạn muốn
màu sắc trên trang web phải khác biệt với nhau thì những màu xanh đậm, đỏ, màu tía,
màu xám, vàng và da cam là những gam màu tốt.

Sử dụng mùa để nói về công ty hay trang web của bạn

Những màu sáng như vàng để làm hình nền có thể được dùng để highlight cho những
sản phẩm hạ giá. Những màu sắc phù hợp với thương mại là màu be, xanh dương, màu
đỏ tía và màu xanh lá đậm ở trên hình nền trắng hoặc một màu thật nhẹ. Bạn đừng nên
tạo thoi quen cho mình khi sử dụng chữ màu xám, hoặc màu nhạt cho những đoạn văn
quan trọng. Nó cũng không tốt khi bạn sử dụng nhiều tông màu Xanh cùng một lúc. Bạn
đừng tạo cho người đọc cảm giác bạn còn là một amatơ khi sử dụng những màu sặc sỡ
để hihglight một cái gì.

Chọn màu dựa trên chế độ xem
Khi bạn trong điều kiện thiếu ánh sáng, sử dụng chữ nhẹ, mỏng với màu vàng nhạt hoặc
đỏ với màu nền là mùa xanh đậm, xanh lá hoặc đỏ. Nếu bạn làm việc trong môi trường
đủ ánh sáng thì chữ đen, mảnh trên nền trắng là tốt nhất.

Những hướng dẫn ở trên là dựa trên kinh nghiệm của tôi tuy nhiên bạn phải cảmnhận

được những phản ứng của người đọc trên trang của bạn để đưa ra kết luận cuối cùng.
Nếu những hướng dẫn trên không phù hợp với bạn thì đó là lúc bạn phải tìm ra thông tin
hoặc học từ kinh nghiệm của chính bạn để phản ứng lại với nó.

© www.vietphotoshop.com - Dịch bởi Bá tước Monte Cristo



Đường liên kết và các dạng liên kết
Cho nên khi bạn mở trang đó ra, cứ chỗ nào là đường link thì sẽ thành màu đỏ và khi
bạn click vào đó hoặc di chuột qua nó bạn sẽ không thấy có thay đổi gì. Bởi vì tất cả các
bạn click vào đó hoặc di chuột qua nó bạn sẽ không thấy có thay đổi gì. Bởi vì tất cả các
đường link đã được định dạng thành màu đỏ. Chúng ta bắt đầu bằng đoạn code dưới
đây:


< style type="text/css">


< !


a:link { color: red; }


a:visited { color: red; }


a:hover { color: red; }

a:active { color: red; }


>









2. Nếu bạn muốn làm đường link của bạn không có gạch chân khi ai đó di chuột qua bạn
chỉ cần thêm một trạng thái là Text-decoration: none vào chỗ a:hover vào giữa hai dấu
ngoặc {}


a : h o v e r { c o l o r: r e d; t e x t-d ecor ation: non e; }

(Viết liền)

Do vậy nếu bạn không muốn có đường gạch chân ở trên những đường link, bạn chỉ việc
thêm dòng Text-decoration: none vào tất cả 4 trạng thái và những đường liên kết sẽ
không có đường gạch chân nữa.

3. Bạn cũng có thể thêm hình nền vào đường link của bạn khi ai đó di chuột qua nó. Để
làm được vậy bạn phải thêm màu nền là background-color: vào trạng thái di chuột của
nó như sau:

a:hover {
color: red;
text-decoration: none;
background-color: #CCCCCC;
}


4. Bạn cũng có thể thay đổi con trỏ khi ai đó di chuột qua đường link. Bạn thử đổi con
trỏ thành dấu chấm hỏi biểu tượng của giúp đỡ.


a:hover {
a:hover {
color: red;
text-decoration: none;
cursor: help;
}


Một vài trạng thái con trỏ khác bạn cũng có thể dùng:


auto
crosshair
help
move
pointer
text

wait
e-resize
ne-resize
n-resize
nw-resize
s-resize
se-resize


Bạn nên cẩn thận khi sử dụng những trạng thái của con trỏ trên trang web bởi vì nếu
bạn dùng không đúng cách có thể làm cho người đọc nhầm lẫn và khó hiểu.

© www.vietphotoshop.com - Dịch bởi Bá tước Monte Cristo


Những điều nên và không nên khi thiết kế web
Những điều nên và không nên khi thiết kế web
2. Nên giữ cấu trúc trang web của bạn thật mạch lạc



Có một vài webmaster muốn thay đổi cách nhìn của trang web vì họ muốn tránh sự
nhàm chán bằng cách thay đổi cấu trúc của trang web ở những trang khác nhau. Ví dụ ở
trang chủ thì thanh menu nằm dọc, sang đến những trang sau thì lại nằm ngang, hoặc
vài trang khác lại là dạng menu trượt …

Người lướt web thích sự mạch lạc, do vậy trang web của bạn cũng nên như vậy. Hãy thử
xem các bản Window đều hao hao giống nhau về cấu trúc mặc dù tính năng thì khác
nhau một trời một vực.

3. Đừng nên dùng Pop up

Pop up có lẽ là một dạng mã làm cho người lướt web cảm thấy khó chịu nhất. Bởi vì
người ta bị ép buộc phải đọc cái mà người ta không muốn đọc. Giống như bạn đang đi
đường bị ai đó ném một tờ giấy vào mặt bắt bạn phải đọc.

Có một vài lần tôi có dạo qua một vài forum thấy có một bảng pop up hiện ra với lời lẽ
khá lịch sự là yêu cầu tôi đăng ký làm thành viên. Bảng pop up đó cứ lẽo đẽo theo tôi,
khi tôi kéo chuột xuống dưới nó cũng xuống theo, kéo lên trên nó cũng lên theo mà
không sao tắt nó đi được.

Vấn đề đặt ra là nếu nội dung của trang đó hấp dẫn tôi, thì không cần phải nhắc tôi tự
khắc sẽ đăng ký thành viên. Còn nội dung nghèo nàn thì cho dù admin của trang đó
đăng ký nick cho tôi, chỉ cho tôi password và thậm chí login vào giùm tôi. Tôi chỉ việc
post bài thôi cũng chưa chắc tôi đã tham gia chứ huống gì tôi phải đăng ký thành viên vì
cái pop up đó.

Do vậy bạn hãy thật thận trọng khi dung pop up.

4. Nên du`ng hệ thống thanh di chuyển tiêu chuẩn

Có nhiều webmaster muốn cho trang web của mình sinh động nên nghĩ ra nhiều loại
thanh di chuyển (navigation). Có người cho nó xoay mòng mòng quanh một quả cầu, có
người cho nó chạy loanh quanh, có người cho nó trượt lên trượt xuống … những kiểu
này chỉ làm người xem nhức mắt và nhầm lẫn.

Những trang web lớn họ đều dung navigation rất đơn giản là nằm ngang phía trên hoặc
phần trên bên tay trái.

5. Nên để trang web của bạn phù hợp với màn hình 800 x 600 Px

Hiện nay màn hình 800 x 600 không còn chiếm đa số nhưng không hẳn là nó đã biến
mất và vẫn chiếm khoảng 40% tổng số những người online. Cho nên khi bạn thiết kế,
bạn hãy để tâm đến 40% này.

Việc kéo thanh trượt lên hoặc xuống không thành vấn đề vì việc đó khá dễ dàng với con
chuột hỗ trợ con lăn. Nhưng việc kéo thanh trượt sang ngang là cả một vấn đề lớn và vô
cùng khó chịu với người lướt web.

6. Đừng tự động tái định hướng người dung sang một trang khác

Đôi khi có những webmaster muốn người xem chú ý đến một trang đặc biệt nào đó nên
đã đặt đoạn mã tái định hướng mỗi khi ai click vào một trang cụ thể. Việc này có thể làm
người dùng thấy khó chịu và không an tâm. Nếu bạn thực sự phải chuyển người dung
đến một trang nào đó, hãy để một đường link thay vì tự động chuyển họ.

Vấn đề then chốt ở đây là chúng ta tránh áp đặt những gì mình nghĩ cho người dùng,
nên cho họ sự lựa chọn.

7. Nên giữ dung lượng của trang chủ không vượt quá 60Kb

Trang web có thể bao gồm chữ, hình ảnh và những định dạng khác như Flash và hình
động. Nhưng khi bạn cộng tất cả các thành phần đó lại, thì dung lượng của nó không
nên vượt quá 60 K.

Bởi theo các nghiên cứu được tiến hành, nếu trang web của bạn mất hơn 4 giây để load
thì bạn đã mất một nửa sổ người đến thăm, còn nếu hơn 5 giây thì bạn mất trắng. Bạn
thử tự hỏi mình bạn có thực sự kiên nhẫn khi phải chờ một trang nào đó ở kết quả tìm
kiếm của Google khi nó load chưa?

8. Đừng canh giữa tất cả mọi thứ

Canh giữa tất cả chữ vào giữa giống thể thơ lục bát rất khó đọc, hãy tưởng tượng khi
bạn đọc một cuốn sách mà tất cả chữ nghĩa đều được căn giữa.

Quy luật in trên giấy đã xuất hiện từ rất sớm và ai cũng phải công nhận rằng căn lề trái
là cách dễ đọc nhất. Vậy trước khi bạn nên làm gì, hãy nhớ đến những gì ngành in ấn
đang làm.

9. Đừng dùng Javascript cho con trỏ chuột

Tôi cũng có nhiều lần được chiêm ngưỡng những Javascript cho con trỏ chuột như đồng
hồ chạy theo chuột, ánh sao lấp lánh, mũi tên, thanh gươm … nói chung nhìn nó đẹp và
vui nhộn nhưng nó chỉ thích hợp với những trang cho trẻ con dưới 5 tuổi. Với những
người như tôi, tôi chẳng thấy thích một cái đồng hồ hoặc một loạt ngôi sao cứ bám như
đia lấy con chuột của tôi.

Do vậy hãy loại bỏ những thứ đó và chỉ nên dung khi thực sự cần thiết.

10. Tham khảo những “ông kẹ” trên net

“Ông kẹ” ở đây tôi muốn đề cập đến là các trang web lớn với hang triệu người truy cập
một ngày như Yahoo, Google, MSN … bạn nên tham khảo cách thiết kế, trình bày, font
chữ, màu sắc, hiệu ứng của họ.

Vì họ là công ty lớn, làm ăn lâu dài và họ đầu tư cả tấn tiền vào nghiên cứu rồi cho nên
những gì họ dung là kết quả của cả một quá trình đúc rút kinh nghiệm từ những sai lầm.
Cho nên hãy tham khảo cách họ làm và học hỏi ở họ.

© Bá tước Monte Cristo – www.vietphotoshop.com

10 lỗi thường gặp khi thiết kế web
1) Lựa chọn màu sắc nghèo nàn

Một điều quan trọng nhất khi thiết kế website mà bạn luôn phải nhớ đó là giữ nó thật
đơn giản. Càng rườm rà rắc rối càng không cần thiết. Trang web của bạn không nên
nhiều hơn 3 màu và chữ trong bài viết nên là màu có tính tương phản cao với nền.
Không còn gì bực mình hơn khi phải đọc chữ màu vàng trên nền màu hồng, hoặc chữ
màu cam trên nền màu xanh lá cây. Có thể theo bạn là rất đẹp nhưng với độc giả thì lại
là một vấn đề khác và thường là khó chịu.

2) Thanh navigation rắc rối

Nếu độc giả của bạn không thể tìm được họ đang ở đâu và làm thế nào để quay về trang
chủ thì họ cũng sẽ đi mà không từ biệt. Chính vì thế thanh navigation (thanh di chuyển)
của bạn nên được logic và mạch lạc ở tất cả các trang. Theo kinh nghiệm của nhiều
người thì độc giả thích nhất là có thanh navigation dọc ở bên trái, sau đó là thanh
navigation ngang ở dưới banner.

3) Font chữ và màu sắc lộn xộn.

Cũng như là thanh navigation của bạn, bạn cũng nên thiết kế sao cho font chữ và màu
sắc của trang thật mạch lạc. Nếu trang chủ của bạn font là Arial Font, kích thước là 10 thì
những trang sau cũng nên dùng chung một font và kích thước như thế. Tất nhiên những
vùng đặc biệt như là copyright, điều lệ thì bạn nên dùng font phù hợp. Tuy nhiên,
trong hầu hết các trường hợp, bạn nên sử dụng cùng một loại font và kích thước xuyên
suốt toàn bộ trang.

Bạn nên nhớ rằng 90% những người lướt web tìm thông tin bằng cách dùng các Search

Engine để tìm thông tin mình cần và các Search Engine lại tìm keyword (từ khóa) trong
domain của bạn và sau đó quyết định nó sẽ xếp hạng trang web của bạn ntn. Nếu bạn
muốn người đọc tìm được trang của bạn bằng cách gõ keyword "Free web host, Domain
registration" thì bạn nên chọn những domain mà có chứa hoặc dính líu đến mấy từ
domain, host hoặc webhosting.

4) Đoạn văn quá dài

Đây là một lỗi chung hay mắc phải bởi rất nhiều webmaster.

Để cho trang web của bạn đọc được một cách dễ dàng, bạn nên cắt nhỏ đoạn "diễn văn"
đó ra và dùng những câu phụ đề. Hầu hết mọi người thì chỉ đọc lướt qua để dò xem
mình cần cái gì cho nên nếu đoạn văn của bạn nhỏ và sắp xếp logic, nó sẽ giúp cho
người đọc cảm thấy dễ chịu hơn.

5) Không có thông tin liên lạc của webmaster.

Đừng để độc giả của bạn phải tìm thông tin liên lạc, đặc biệt nếu site của bạn về bán
hàng hóa online. Bạn nên để thông tin liên lạc ở mỗi trang. Nếu thông tin liên lạc của
bạn khó có thể tìm thấy hoặc không có thì làm cho khách hàng không muốn buôn bán gì
với bạn hết. Tuy nhiên nếu website của bạn có diễn đàn hoặc một cái gì gần như thế thì
với bạn hết. Tuy nhiên nếu website của bạn có diễn đàn hoặc một cái gì gần như thế thì
thông tin liên lạc lại không thực sự quan trọng. Vì khách hàng có thể liên lạc trực tiếp với
bạn qua diễn đàn, sổ lưu bút

6) Trang load quá lâu

Nếu trang của bạn không được load dưới 10 giây, thì file HTML của bạn là quá lớn. Bạn
hãy kiểm tra lại những hình đồ họa của mình. Liệu bạn sử dụng nhiều hình ảnh quá
không? nó có cần phải định lại dung lượng không? Người ta hay quen dùng định

dạng .JPG cho những file hình nhiều màu sắc và định dạng .GIF cho những hình đặc
hoặc đơn màu. Bạn cũng nên nhớ định dạng độ cao, chiều rộng cho bảng trong khi thiết
kế với HTML bởi vì chữ sẽ được load trước hình ảnh. Những hình GIF động làm giảm
đáng kể tốc độ load của site.

7) Không có META tag

Meta tag là một dạng code ẩn, người đọc không thấy nó hiện trên trình duyệt nhưng nó
lại được nhìn thấy bởi những Search Engine. Thực ra hiện nay các META tag không còn
quan trọng như trước đây nữa, nhưng các công cụ tìm kiếm vẫn một phần nào đó dựa
vào những META tag này để hiển thị thông tin về trang web của bạn.

8) Sử dụng frame

Frame có thể tạo ra rất nhiều phiên toái cho bạn. Nhiều Search Engine không index
những trang dùng frame, frame đôi khi không cho phép người đọc book mark site của
bạn và nó gây khó khăn khi in ấn.

9) Chữ chạy nhảy

Thẻ marquee là một tính năng rất thú vị, nhưng có nhiều người lại lạm dụng nó. Mặc dù
ý tưởng dùng chữ marquee là khá hay và hấp dẫn, nhưng bạn nên nhớ rằng không phải
ai cũng thấy cách này là một cách hay đâu. Nếu bạn quyết định dùng marquee, thì bạn
phải xác định rõ ràng là nó có thực sự mang lại hiểu quả và tăng thêm sức hấp dẫn cho
site của bạn hay không. Có một vài trường hợp dùng marquee khá là hiệu quả như
thông báo thông tin mới, thông tin nóng nhưng có nhiều trường hợp marquee text làm
người đọc thấy khó chịu.

10) Chọn độ phân giải không phù hợp

Hiện nay đa phần người lướt web dùng màn hình với độ phân giải là 800x600. Nếu bạn
thiết kế trang web để phù hợp với độ phân giải là 1024x768 Px hoặc cao hơn, thì bạn
phải nhớ rằng rất nhiều người phải kéo thanh cuộn ngang để xem thông tin. Tôi không
biết bạn nghĩ ntn, nhưng tôi nghĩ nó khá là khó chịu. Tuy nhiên hiện nay những màn
hình 1024x768 đang dần trở lên thịnh hành và bạn cũng không nên quá lo lắng nữa.

Nhưng nếu bạn muốn trang web của bạn có thể hiển thị ở mọi độ phân giải, bạn nên
định dạng bảng bằng chế độ phần trăm thay vì pixel. Ví dụ khi bạn định dạng bảng là
100% width thay vì "800" thì khi màn hình là 800 hay 1024 nó vẫn hiện đầy đủ hết.

© www.vietphotoshop.com - Dịch bởi Bá tước Monte Cristo


Một số cách phá banner và pop up


geocities.com
Ở góc trên bên phải của banner có một dấu "X" nó dùng để đóng cửa sổ lại. Đoạn code
này dùng để gọi một Javascript "yfOC" được ẩn trên server của họ. Để phá cái banner đó
đi bạn chỉ phải gọi một đoạn code có thể đóng nó lại khi người dùng mở trang web.


<BODY onLoad="yfOC(-1)">

Cách thứ hai bạn có thể dùng đoạn code sau

<HTML>
<HEAD>
<TITLE>Your Title Goes Here</TITLE>
<BODY>

</HEAD>
</BODY>
<noscript><noscript><plaintext><plaintext>
</HTML>

hypermart.net


<! #echo banner="" >

Now to get rid of the banner use a no-script tag around the code, like this:

<noscript><! #echo banner="" ></noscript>

.tk Domains

Thêm đoạn code sau vào giữa hai thẻ <head và < /head> ở trang đầu tiên của bạn để
loại bỏ banner popup.

<script>
if (window.top != window.self) { window.top.location=window.self }
</script>
<script>
subwin = window.open("
subwin = window.open("
"subwindow","height=100,width=486");
</script>

<script language="JavaScript">
setup='toolbar=no,location=no,directories=no,status=

no,menubar=no,width=200,height=150'
setup += 'scrollbars=no,resizable=no'
pop = window.open ("","subwindow",setup)
pop.document.write('<head>');
pop.document.write('<Title>');
<! This is the title to change for on the new window you open >
pop.document.write('Iran Hackers');
pop.document.write('</Title>');
pop.document.write('<script language="javascript">');
pop.document.write('setTimeout(');
pop.document.write('"self.close()');
<! This is the line to change for how long the window is open >
<! Its milliseconds , so 5000 is 5 seconds, 1000 is 1 second. >
pop.document.write(';",5000)');
pop.document.write('</');
pop.document.write('script>');
pop.document.write('</head>');
<! This changes the colour of the main background. >
pop.document.write('<body bgcolor=#FFFF80>');
<! This is the actual content of the window you are opening >
pop.document.write('<center><h3>Dont forget to visit</h3></center>');
pop.document.write('<center><h3><a href=""
target="_blank">ghostbone.com</a></h3></center>');
pop.document.write('<center><h6>For all your BannerKillers :)</h6></center>');
pop.document.write('</body>');
</script>


tripod.com

Bạn chỉ việc copy và dán đoạn code này vào

<html>
<script LANGUAGE="JavaScript">
<!
function open () {return true;}
// >
</SCRIPT>
<head>
<title>Your title goes here</title>
</head>
<body>

netfirms.com

<noembed>
<xmp>
<body>
</xmp>
</noembed>

Virtual Avenue

<HTML>
<HEAD>
<TITLE>Your Title Goes Here</TITLE>