Với sự phát triển mạnh mẽ của công nghệ 4.0 thì việc phát triển kinh doanh trên Internet không còn quá xa lạ, và hình thức bán hàng trên Internet phổ biến nhất đó chính là website. Tất cả doanh nghiệp muốn kinh doanh đều phải có website bán hàng cho riêng mình.
Tuy nhiên khi thiết kế website chuyên nghiệp thì kích thước website như thế nào là chuẩn? Vì vậy trong bài viết này của Terus sẽ cung cấp những kích thước website chuẩn, tối ưu nhất.
I. Kích thước website màn hình tốt nhất để thiết kế website
Kích thước website là một trong những tiêu chuẩn tối ưu Onpage quan trọng, giúp tối ưu hiệu suất SEO và tăng trải nghiệm người dùng.
Trong thiết kế web, các trang cần phải chuyển đổi một cách nhạy bén và nhanh chóng ở tất cả các độ phân giải màn hình trên các trình duyệt và nền tảng khác nhau. Trang của bạn cũng cần thân thiện với thiết bị di động. Trước tiên, hãy thiết kế kích thước website cho độc giả của bạn từ 360 × 640 đến 1920 × 1080px.
Tương tự kích thước website:
- Thiết kế cho màn hình máy tính để bàn từ 1024 × 768 đến 1920 × 1080
- Thiết kế cho màn hình di động từ 360 × 640 đến 414 × 896
- Thiết kế cho màn hình máy tính bảng từ 601 × 962 đến 1280 × 800
- Không thiết kế cho một kích thước màn hình hoặc độ phân giải màn hình. Kích thước màn hình và trạng thái cửa sổ trình duyệt khác nhau giữa các khách truy cập.
- Thiết kế phải đáp ứng nhanh chóng. Sử dụng bố cục lỏng hoặc đáp ứng chuyển đổi theo kích thước cửa sổ của người dùng hiện tại.
- Theo dõi các cảnh báo về khả năng sử dụng và thân thiện với thiết bị di động của Google Search Console
- Kiểm tra Google Analytics và tối ưu hóa cho các kích thước độ phân giải phổ biến nhất của đối tượng mục tiêu của bạn
Trang web của bạn vẫn cần đẹp mắt và hoạt động tốt ở mọi kích thước. Đó là lý do tại sao trong dịch vụ SEO, Terus luôn đề xuất với khách hàng một bố cục lỏng để có thể truy cập bằng cách sử dụng phần trăm độ rộng.
Ba tiêu chí chính để tối ưu hóa bố cục trang cho một kích thước website màn hình nhất định là:
- Trang web khả năng hiển thị ban đầu: Tất cả thông tin chính hiển thị trong màn hình đầu tiên để người dùng có thể xem mà không cần cuộn không? Đây là sự cân bằng giữa số lượng mục được hiển thị so với số lượng chi tiết được hiển thị cho mỗi mục.
- Khả năng đọc của trang web: Làm thế nào dễ dàng để đọc văn bản trong các cột khác nhau, với chiều rộng được phân bổ của chúng.
- Tính thẩm mỹ của trang web: Trang của bạn trông đẹp như thế nào khi các phần tử ở kích thước và vị trí thích hợp cho kích thước màn hình này.
Tất cả các yếu tố có xếp hàng chính xác không. Điều này có nghĩa là bạn nên chú thích ngay bên cạnh ảnh? Các nguyên tắc về khả năng sử dụng cũng gợi ý bạn nên xem xét cả ba tiêu chí ở đầy đủ các kích cỡ. Kiểm tra cửa sổ trình duyệt từ độ phân giải màn hình 360 × 640 đến 1920 × 1080px. Trang của bạn sẽ đạt điểm cao trên tất cả các tiêu chí trong toàn bộ phạm vi độ phân giải.
Trang của bạn cũng nên hoạt động ở kích thước nhỏ hơn và lớn hơn. Những người dùng chắc chắn có thể truy cập trang web của bạn nhanh hơn, nhưng việc cung cấp cho họ một hình ảnh kém chất lượng đôi khi là chỉ một sự thỏa hiệp có thể chấp nhận được.
II. Tổng hợp chỉ số 10 độ phân giải màn hình kích thước website phổ biến nhất
Tổng hợp chỉ số 10 độ phân giải màn hình kích thước website phổ biến nhất.
| 1 | 1920×1080 | 104,190(22.62%) |
| 2 | 1366×768 | 51,580(11.20%) |
| 3 | 1440×900 | 44,003(9.55%) |
| 4 | 1536×864 | 39,606(8.60%) |
| 5 | 2560×1440 | 34,152(7.41%) |
| 6 | 1680×1050 | 19,730(4.28%) |
| 7 | 1280×720 | 16,364(3.55%) |
| 8 | 1280×800 | 10,719(2.33%) |
| 9 | 1792×1120 | 9,494(2.06%) |
| 10 | 1600×900 |
III. Google thích các trang web thân thiện với thiết bị di động
Google chỉ yêu cầu bạn cần thiết kế trang hài lòng với trải nghiệm người dùng ở trên nhiều thiết bị nếu bạn muốn xếp hạng cao cho các từ khóa cạnh tranh trong Google. Kể từ ngày 21 tháng 4 năm 2015, trên toàn cầu, một trang web thân thiện với thiết bị di động đã ảnh hưởng đến hiệu suất xếp hạng cho các trang web ở nhiều thiết bị.
Nếu bạn làm một trang web cho các doanh nghiệp nhỏ, thì bạn phải tạo một trang web hoạt động tốt trên Google mà không phải trả tiền chạy quảng cáo. Các bạn biết Google quan tâm đến việc tối ưu hóa công cụ tìm kiếm. SEO hiện nay một phần dựa trên UX trang web tốt, Google định lượng yếu tố này qua người dùng di động.
“Với việc tìm kiếm trên thiết bị di động hiện đã vượt quá tìm kiếm trên máy tính để bàn, điều quan trọng là trang web của bạn phải thân thiện với thiết bị di động. Googlebot hiện sử dụng trình thu thập thông tin di động làm trình thu thập thông tin mặc định cho các trang web ”.
Hiện tại, điều đó về cơ bản có nghĩa là thiết kế trang web đáp ứng và thân thiện với thiết bị di động. Đặc biệt là với Google “ưu tiên lập chỉ mục thiết bị di động”. Tính thân thiện với thiết bị di động là một trong những tín hiệu trải nghiệm trang của Google.
IV. Các thiết kế một trang web giống nhau trong mọi trình duyệt và độ phân giải
Bạn không thể nào thiết kế một trang web giống nhau ở trong mọi trình duyệt và độ phân giải nên hãy thử chọn bố cục linh hoạt mà ở đó sẽ không có một thiết kế quy chuẩn nào cả. Kích thước website có thể thay đổi theo tỷ lệ phần trăm. Do đó, bạn có thể mở rộng hay thu nhỏ để phù hợp với cài đặt của trình duyệt mà người dùng truy cập. Các bạn cũng có thể cân nhắc các giải pháp thiết kế cụ thể khác.
Google ủng hộ các thiết kế cá nhân cho người dùng trang web mà mình tạo ra, đó là một tin tốt cho những ai đã làm điều này trước đây. Các bạn phải suy nghĩ về mức độ thân thiện của trang web mà bạn tạo ra với thiết bị di động mà bản thân đã xác định ngay từ đầu. Do vậy, mọi người nên cố gắng giữ mọi thứ đơn giản nhất có thể khi thiết kế kích thước website.
Tất nhiên bạn cũng cần xác định rằng bản thân sẽ không thể làm ra được một website mà tất cả mọi người đều hài lòng. Vì vậy mà câu hỏi về kích thước website nào là tốt nhất vẫn còn là một chủ đề tranh luận của các nhà thiết kế website có chuyên môn cũng như kinh nghiệm sử dụng UX.
Ngoài ra, một điều nữa cũng rất quan trọng là bạn cần phải xác định được đối tượng tiếp cận của bạn và các thiết bị mà họ sử dụng. Vì đây là điều sẽ giúp cho nhà thiết kế website có thể xây dựng một trang web đảm bảo sự phù hợp và thuận tiện nhất cho các đối tượng đó bao gồm cả Googlebot.
V. Trang web trên điện thoại di động của bạn có chuyển hướng đến một URL và phiên bản khác của trang web của bạn không?
Trang web trên điện thoại di động của bạn có chuyển hướng đến một URL và phiên bản khác của trang không? Trên thực tế, điều này chưa bao giờ xảy ra. Trước đây một số người đã sử dụng phiên bản trang web chỉ có nội dung bằng văn bản truyền tải đến người dùng. Do đó, các nỗ lực để làm cho nội dung của bạn dễ truy cập hơn cũng không có tác dụng cho lắm.
W3C thậm chí còn được sử dụng để thay thế nếu tất cả các cách khác đều không thành công. Một trang chỉ có văn bản, với thông tin hoặc chức năng tương đương, W3C sẽ được cung cấp để làm cho trang web đó tuân thủ các quy định của trang chính. Nếu web đó không thể thực hiện theo thì nội dung của các trang chỉ có văn bản sẽ được cập nhật khi nào trang chính có sự thay đổi.
Đây là một điều lý tưởng để cung cấp một URL cho người dùng truy cập vì mục đích hỗ trợ trang chính. Đặc biệt là không có sự khác biệt khi chia sẻ nội dung trên điện thoại di động hay thiết bị thông minh. vì thế mọi người có thể nghĩ đến việc tạo phiên bản “di động” cho trang web của mình ngay bây giờ.
Nếu bạn có điện thoại thông minh, bạn có thể sử dụng rel = canonical để trỏ đến phiên bản máy tính để bàn của mình. Khi người dùng truy cập phiên bản dành cho máy tính để bàn đó bằng thiết bị thông minh, bạn có thể chuyển hướng họ sang phiên bản dành cho thiết bị di động.
Điều này được thực hiện ở bất kể cấu trúc URL nào, vì vậy bạn không cần sử dụng tên miền phụ hay thư mục con cho các trang web dành cho điện thoại thông minh hoặc di động. Tuy nhiên, tốt hơn nữa là việc sử dụng các URL giống nhau và hiển thị phiên bản phù hợp với nội dung mà không cần phải chuyển hướng.
VI. Người dùng của bạn mong đợi cuộn xuống một trang
Như tiêu chí đầu tiên đã nói, cuộn trang luôn là yếu tố quan trọng cần cân nhắc. Người dùng thường không thích cuộn nếu họ không cần thiết mặc dù qua nhiều năm, điều đó đã thay đổi. Vì vậy, khi bạn thiết kế, bạn nên cân nhắc xem người dùng có thể nhìn thấy bao nhiêu nếu họ chỉ cuộn toàn màn hình hoặc hai màn hình.
Bất kỳ chiều dài hơn 5 màn hình nào cũng có thể là dấu hiệu cho bạn biết rằng có quá nhiều bản sao trên trang. Tất nhiên, điều này được cân bằng với quan điểm rằng một số bài báo có thông tin chuyên sâu và người dùng sẽ chờ đợi lâu hơn một chút để xem một số nội dung trang và loại phần không cần thiết.
Cả khả năng cuộn và khả năng hiển thị ban đầu rõ ràng phụ thuộc vào kích thước màn hình. Nếu màn hình lớn sẽ hiển thị nhiều nội dung hơn trong màn hình đầu tiên và sẽ yêu cầu ít cuộn hơn. Do vậy khi thiết kế về kích thước website các bạn nên cân nhắc đến mục đích cũng như đối tượng trung thành của trang web để tạo trang hợp lý.
VII. Xếp hạng tốt hơn đối với website tương thích với mọi thiết bị
Để tăng thứ hạng bằng việc thay đổi trang web đáp ứng là điều không nhất thiết, nhưng có thể thực hiện nếu muốn. Bạn sẽ có nhiều điều phải làm với việc tối ưu hóa Google. Có một trang web thân thiện với thiết bị di động ít nhiều đảm bảo bạn giữ được lưu lượng truy cập mà bạn đang nhận được, không nhất thiết phải cung cấp cho bạn thêm bất kỳ lưu lượng truy cập miễn phí nào từ Google.
Nếu bạn chưa nhận được nhiều lưu lượng truy cập từ khách truy cập trên thiết bị di động thì có lẽ bản cập nhật này từ Google sẽ là một gợi ý hay. Điều này chưa thể kết luận là có ảnh hưởng đáng kể đến mức lưu lượng truy cập của bạn hay không. Nhưng theo thời gian, đây có thể sẽ là một thách thức cực kỳ quan trọng trong việc điều hướng trang của bạn.
Nếu các bạn muốn cạnh tranh trong các SERP hữu cơ cạnh tranh, hơn bao giờ hết đây lại là một trở ngại khác mà các doanh nghiệp nhỏ cần phải vượt qua. Điều này sẽ giúp cho trang của doanh nghiệp thu hút nhiều bạn đọc hơn. Từ đó mục đích thiết kế của các bạn sẽ đạt được hiệu quả.
Trong dài hạn việc chuyển đổi trên thiết bị di động này có thể là một điều tốt cho người dùng. Nhưng trong ngắn hạn điều này sẽ rất thú vị khi xem trang có ảnh hưởng gì đến tỷ lệ chuyển đổi của các doanh nghiệp nhỏ. Bởi vì tỷ lệ chuyển đổi qua thiết bị di động thường ít hơn trên máy tính để bàn.
Google đã nói rằng thuật toán thân thiện với thiết bị di động này sẽ có tác động lớn hơn đến SERPs so với cả thuật toán Google Penguin và Google Panda. Điều này vẫn chưa thể khẳng định chắc chắn và sẽ được tìm hiểu thêm ở trong thời gian tiếp theo.
VIII. Các kích thước khác
Dưới đây là một số các kích thước khác của website mà bạn có thể tham khảo
Kích thước của ảnh Slide ở trang chủ: Kích thước hình ảnh Slider website được để theo tỷ lệ vàng là 1360 x 540 pixel.
Kích thước hình ảnh trong bài viết: Đối với hình ảnh bên trong bài viết:
- Hình đại diện bên ngoài là 300×188 pixel
- Hình ảnh minh hoạ trong bài viết 600×375 pixel
Kích thước hình ảnh trong sản phẩm: Đối với hình ảnh minh hoạ sản phẩm thì kích thước nên để là 300×400 pixel còn đối với hình ảnh chi tiết sản phẩm thì nên để 600×800 pixel.
Kích thước chia sẻ website lên facebook: Khi share lên Facebook thì bạn cần để ảnh cover là 1200×630 pixel hoặc tối thiểu là 600×315 pixel. Dung lượng ảnh khi tải lên nên nhỏ hơn 8MB. Nếu bạn tải ảnh khác lên từ điện thoại hay máy tính thì tỷ lệ tối thiểu là 600×315 pixel.
IX. Các công cụ thay đổi kích thước website
Để có thể thiết kế website chuyên nghiệp và dễ dàng thay đổi kích thước website bạn có thể sử dụng những công cụ sau đây:
- Adobe Photoshop: đây là phần mềm phổ biến nhất dành cho dân thiết kế đồ hoạ, thiết kế website, chỉnh sửa hình ảnh.
- Paint: Bạn có thể dùng Paint để xử lý kích thước ảnh nhanh chóng, đảm bảo chất lượng
- Chỉnh sửa trực tiếp trên WordPress: Bạn chỉ cần thay kích thước từng ảnh mà mình muốn đăng bài hoặc trong thư viện. Việc tối ưu này sẽ giúp web chạy nhanh, mượt hơn rất nhiều.
- Pixlr: công cụ chỉnh sửa ảnh đa năng, tiện lợi
- Fotor: công cụ chỉnh sửa ảnh trực tuyến miễn phí
- Canva: phần mềm quen thuộc dành cho bạn muốn thiết kế hình ảnh, logo, banner,…
X. Kích thước website có ảnh hưởng đến SEO không?
Kích thước website là một trong những yếu tố gây ảnh hưởng đến SEO. Đây là tiêu chí cơ bản để Google đánh giá website của bạn cũng như tối ưu trải nghiệm người dùng.
Vì thế khi thiết kế website bán hàng, tin tức, giới thiệu,… bạn cần chú ý đến kích thước website chuẩn để tạo sự thân thiện với người dùng, dễ dàng SEO website lên TOP.
Trên đây là những thông tin chi tiết nhất về kích thước website tiêu chuẩn và ảnh hưởng của chúng tới quá trình SEO. Hy vọng bài viết trên đây đã mang lại cho bạn những kiến thức hữu ích nhất. Trân trọng!
FAQ - Giải đáp thắc mắc liên quan đến kích thước website chuẩn
1. Kích thước website chuẩn là gì?
Kích thước website chuẩn hay còn gọi là kích thước được thiết kế cố định chiều rộng của web. Chiều rộng của web thường là 800px, 1000px, 960px hoặc 1260px. Kích thước cố định của website thường được Designer thiết kế là 960px. Kích thước này phù hợp hiển thị trên màn hình có độ phân giải 1024 hoặc lớn hơn.
2. Kích thước website chuẩn có quan trọng không?
Kích thước website là một trong những tiêu chuẩn tối ưu Onpage quan trọng, giúp tối ưu hiệu suất SEO và tăng trải nghiệm người dùng. Trong thiết kế web, các trang cần phải chuyển đổi một cách nhạy bén và nhanh chóng ở tất cả các độ phân giải màn hình trên các trình duyệt và nền tảng khác nhau.
Nhiệm vụ của chúng tôi là đồng hành cùng bạn và doanh nghiệp để ngày càng tạo ra những thương hiệu Việt Nam lớn mạnh.