Cách để Thiết kế website

Cùng viết bởi Jear Keokham

Trong bài viết này, wikiHow sẽ hướng dẫn bạn cách thiết kế một website chuyên nghiệp và hiệu quả. Dù rút cuộc thì thiết kế như thế nào chủ yếu là ở bạn, nhưng vẫn có một số điểm then chốt mà bạn cần lưu ý trước khi tiến hành.

Phần 1

Phần 1 của 2:

Thiết kế website của bạn

1
Xác định liệu bạn có muốn sử dụng công cụ dựng website hay không. Để tự làm hoàn toàn, bạn cần có kiến thức kha khá về lập trình HTML. Trong khi đó, bạn có thể sử dụng các dịch vụ máy chủ miễn phí như Weebly, Wix, WordPress hay Google Sites. Với người mới, việc sử dụng công cụ dựng website thường dễ dàng hơn rất nhiều so với HTML.
- Nếu muốn tự lập trình để tạo website, bạn nên học cả HTML và CSS.
- Nếu không mặn mà với việc đầu tư thời gian và công sức vào việc tự tạo website, bạn cũng có thể sử dụng dịch vụ thiết kế website. Chi phí phải trả cho các nhà thiết kế web làm việc tự do có thể dao động trong khoảng từ 600.000 đồng cho đến hơn 2.000.000 đồng một giờ.
2
Phác thảo trang của bạn. Trước cả khi mở công cụ dựng web, bạn cần hình dung được số trang mà bạn muốn, nội dung của chúng cũng như bố cục chung của những trang quan trọng như trang chủ và trang "Giới thiệu".
- Thay vì chỉ quyết định nội dung nên được hiển thị thế nào, việc phác thảo sơ lược ra giấy có lẽ sẽ giúp bạn dễ hình dung giao diện của từng trang trong website hơn.
3
Sử dụng thiết kế trực quan. Sáng tạo hẳn là có nhiều ưu điểm, nhưng thiết kế cơ bản của website vẫn nên tuân theo những chỉ dẫn đã được công nhận như:
- Tùy chọn điều hướng (ví dụ như thẻ mở trang) nên được đặt ở đầu trang.
- Nếu sử dụng biểu tượng trình đơn (☰), bạn nên đặt nó ở góc trên bên trái của trang.
- Nếu dùng thanh tìm kiếm, bạn nên để nó ở gần phía trên bên phải của trang.
- Những liên kết hữu ích (ví dụ như liên kết đến trang "Giới thiệu" hay trang "Liên hệ") nên được để ở cuối mỗi trang.
4
Hãy nhất quán. Dù chọn phông chữ, màu sắc, giao diện và thiết kế thế nào, bạn cũng cần nhất quán với những lựa chọn đó. Sẽ rất khó chịu khi vừa làm quen với một phông chữ hay lựa chọn màu sắc ở trang chủ rồi lại bắt gặp một phông chữ hay lựa chọn màu sắc hoàn toàn khác biệt ở trang "Giới thiệu".^{[1]
X
Nguồn nghiên cứu}
- Ví dụ, nếu trang chủ đã dùng toàn tông màu lạnh thì bạn đừng nên dùng màu sáng, sặc sỡ cho trang tiếp theo.
- Nhớ rằng dùng màu nổi hay tương phản, đặc biệt là màu động, có thể kích hoạt chứng động kinh ở một số nhỏ người dùng web. Nếu muốn dùng những màu đó cho trang của mình, bạn cần thêm cảnh báo về động kinh trước mọi trang liên quan.
5
Thêm tùy chọn điều hướng. Đặt liên kết trực tiếp đến những trang quan trọng ở đầu trang chủ để “chỉ đường” đến những nội dung thiết yếu cho người lần đầu ghé thăm. Hầu hết công cụ dựng website đều mặc định thêm những liên kết này.
- Mọi trang trên website cần phải truy cập được không chỉ qua địa chỉ trang mà còn qua các tùy chọn có trong website.
6
Sử dụng màu sắc bổ trợ cho nhau. Cũng như mọi loại hình thiết kế khác, thiết kế website dựa trên sự kết hợp các màu sắc dễ nhìn. Do đó, việc chọn các màu giao diện có thể bổ trợ cho nhau là rất quan trọng.
- Nếu bạn chưa biết bắt đầu từ đâu thì đen, trắng và xám là một sự kết hợp không tồi.
7
Xem xét sử dụng thiết kế tối giản. Chủ nghĩa tối giản khuyến khích sử dụng tông màu lạnh, các trang văn bản màu đen nền trắng và càng tiết chế thêm thắt càng tốt. Bởi cần ít yếu tố hoa mỹ nên chủ nghĩa tối giản là cách dễ dàng để có được một website chuyên nghiệp và hấp dẫn mà không tốn quá nhiều công sức.
- Nhiều công cụ dựng website có giao diện "tối giản" để chọn khi thiết lập.
- "Thô mộc" là một lựa chọn khác thay thế cho tối giản. Phong cách này sử dụng những đường dứt khoát, màu sắc tươi sáng, chữ in đậm và rất ít hình ảnh. Thô mộc ít được dùng hơn tối giản nhưng tùy vào nội dung website, có thể phong cách này sẽ phù hợp hơn với yêu cầu thiết kế của bạn.
8
Có những lựa chọn độc đáo. Bố trí nội dung thẳng hàng hay thành từng ô là lựa chọn an toàn. Tuy nhiên, một vài chi tiết mang tính cá nhân độc đáo sẽ đem lại cho website nét chấm phá cá nhân cũng như trở nên nổi bật.^{[2]
X
Nguồn nghiên cứu}
- Đừng ngần ngại đi ngược xu hướng với việc bố trí bất cân xứng các yếu tố web hay sử dụng phép chồng lấn để có được giao diện nhiều lớp.
- Dù trang nhã nhưng những góc sắc nét và các thiết kế đối lập (còn được gọi là "card-based" – thiết kế theo phong cách thẻ) ít được dùng hơn những thiết kế tròn, mềm mại.
Quảng cáo

Phần 2

Phần 2 của 2:

Tối ưu hóa hiệu suất hoạt động của website

1
Tận dụng những tùy chọn tối ưu hóa cho các thiết bị di động. Lưu lượng truy cập web đến từ thiết bị di động nhiều hơn máy tính, nghĩa là phiên bản dành cho di động của website cần được quan tâm ít nhất là ngang bằng với phiên bản dành cho máy tính. Hầu hết dịch vụ dựng website đều tạo phiên bản di động tự động. Tuy nhiên, với phiên bản này, bạn vẫn nên lưu ý những điểm dưới đây: ^{[3]
X
Nguồn nghiên cứu}
- Đảm bảo các nút (chẳng hạn như liên kết trang) lớn và dễ bấm.
- Tránh sử dụng tính năng không hiển thị trên di động (chẳng hạn như Flash, Java, v.v.)
- Cân nhắc tạo ứng dụng di động dành cho website của bạn.
2
Tránh dùng quá nhiều hình trong một trang. Cả trình duyệt dành cho máy tính và trình duyệt di động đều có thể phải vật lộn để tải các trang hiểu thị quá nhiều hình ảnh và video. Dù hình ảnh là yếu tố quan trọng trong thiết kế web, nhưng việc sử dụng nhiều hơn một vài hình ảnh trong một trang có thể kéo dài thời gian tải một cách không cần thiết và khiến người dùng không muốn vào trang đó.
- Nhìn chung, các trang của website nên có thời gian tải dưới 4 giây.
3
Thêm trang "Liên hệ". Hầu như website có tiếng nào cũng có trang "Liên hệ", trình bày thông tin liên hệ (chẳng hạn như số điện thoại và địa chỉ email). Một số thậm chí còn có bảng câu hỏi tích hợp sẵn. Trang "Liên hệ" cho phép người dùng trao đổi trực tiếp với bạn, và do đó giúp bạn có thêm giải pháp khi người sử dụng cảm thấy không hài lòng.
4
Tạo trang báo lỗi 404 riêng. Khi có người vào trang nào đó chưa được thiết lập hoặc không tồn tại trên trang của bạn, trang báo lỗi "404 Error" sẽ được hiển thị. Hầu như trình duyệt nào cũng có trang 404 mặc định. Tuy nhiên, có lẽ bạn vẫn có thể tùy chỉnh trang báo lỗi của mình từ phần thiết lập của công cụ dựng web. Nếu vậy, dưới đây là những chi tiết cần có:
- Một thông báo lỗi vui vẻ (chẳng hạn như "Xin chúc mừng: bạn vừa tìm được trang lỗi của chúng tôi!")
- Một liên kết đến trang chủ
- Một danh sách các liên kết thường được truy cập
- Một hình ảnh hay logo dành cho website của bạn
5
Nếu được, hãy dùng thanh tìm kiếm. Nếu phương pháp dựng web của bạn có hỗ trợ việc thêm thanh tìm kiếm vào website, bạn hãy tận dụng điều này. Khi đó, người sử dụng có thể nhanh chóng tìm đến một trang hay một mục nhất định mà không phải thao tác qua nhiều nút điều hướng.
- Thanh tìm kiếm cũng rất hữu dụng trong trường hợp người đọc muốn tìm một thuật ngữ chung nào đó và không muốn mò mẫm.
6
Dành nhiều thời gian nhất cho trang chủ. Khi truy cập vào website của bạn, người dùng cần mường tượng được ngay chủ đề của nó. Thêm vào đó, mọi nội dung trong trang chủ, bao gồm tùy chọn điều hướng và mọi hình ảnh, cần được tải một cách nhanh chóng. Trang chủ của bạn nên có:^{[4]
X
Nguồn nghiên cứu}
- Một lời kêu gọi hành động (ví dụ như một nút để bấm hoặc một mẫu để điền thông tin)
- Một trình đơn hoặc thanh điều hướng
- Một lời chào mời bằng hình ảnh đồ họa (ví dụ như một bức hình xuất sắc, video hay một nhóm nhỏ hình ảnh đi kèm chú giải)
- Từ khóa liên quan đến dịch vụ, chủ đề hay nội dung trung tâm của website
7
Thử website bằng nhiều trình duyệt trên nhiều nền tảng. Bước này đặc biệt quan trọng bởi trình duyệt khác nhau có thể sẽ có cách thức xử lý các thành phần của website khác nhau. Trước khi bắt đầu quảng bá website của mình, hãy thử truy cập và sử dụng nó trên những trình duyệt dưới đây với nền tảng Windows, Mac, iPhone và Android:
- Google Chrome
- Firefox
- Safari (chỉ dành cho iPhone và Mac)
- Microsoft Edge và Internet Explorer (chỉ với Windows)
- Trình duyệt tích hợp sẵn trên một số điện thoại Android (ví dụ như Samsung Galaxy, Google Nexus, v.v.)
8
Tiếp tục cập nhật website qua thời gian. Theo thời gian, xu hướng thiết kế, liên kết, hình ảnh, ý tưởng và từ khóa đều thay đổi. Do đó, để không bị lỗi thời, bạn cần không ngừng đổi mới website. Việc này đòi hỏi bạn phải kiểm tra hoạt động của website cùng những trang tương tự ít nhất ba tháng một lần (thường xuyên hơn nếu có thể).

Quảng cáo

Lời khuyên

Khả năng tiếp cận là khía cạnh quan trọng khác của việc phát triển website, bao gồm phụ đề dành cho người khiếm thính, mô tả bằng âm thanh cho người khiếm thị và cảnh báo cảm quang nếu website sử dụng hiệu ứng có thể gây co giật.
Hầu hết công cụ dựng web đều cung cấp bộ giao diện mẫu để bạn củng cố thiết kế và bố cục trang trước khi thêm những nội dung mà bạn yêu thích.

Cảnh báo

Nghiên cứu luật bản quyền và tránh đạo ý tưởng: đừng thêm hình ảnh ngẫu nhiên từ mạng hay thậm chí là những thiết kế kết cấu khi chưa được phép.
Hầu hết dịch vụ dựng web đều miễn phí. Tuy nhiên, nếu muốn dùng tên miền riêng (chẳng hạn như "www.tên_của_bạn.com" thay vì "www.tên_của_bạn.wordpress.com"), bạn sẽ phải trả phí tháng hoặc năm.