Trí Tuệ Nhân Tạo

Home Top Ad

Responsive Ads Here

Nếu bạn muốn trình duyệt Chrome của mình cuộn chuột mượt mà trên các trang web thì Google đã trang bị sẳn "Tính năng ẩn" này trên ...

Kích hoạt smooth scrolling cuộn siêu mượt khi duyệt web trên Google Chrome

Nếu bạn muốn trình duyệt Chrome của mình cuộn chuột mượt mà trên các trang web thì Google đã trang bị sẳn "Tính năng ẩn" này trên Google Chrome là Smooth scrolling.

Tuy nhiên hầu hết không phải người dùng nào cũng biết được tính năng ẩn này, nên các Webmaster đã cài đặt 1 đoạn Javascript smooth scrolling vào Website của mình.

Tuy nhiên với 1 vài bước hướng dẫn sau đây sẽ giúp bạn có 1 trãi nghiệm mượt mà khi lướt web.

  1. Khởi động trình duyệt Chrome
  2. Truy cập: chrome://flags/#smooth-scrolling
  3. Kích hoạt phần Smooth-scrolling thành  Enabled 

smooth scrolling cuộn siêu mượt khi duyệt web



Sau đó, trình duyệt yêu cầu bạn khởi động lại trình duyệt Chrome.
Hãy thử duyệt trên một website nào đó bằng cách chuột hoặc dùng các phím điều hướng và tận hưởng.

Ngoài ra nếu bạn muốn sử dụng javascript có thể truy cập website này để lấy code: https://css-tricks.com/snippets/jquery/smooth-scrolling/

Chúc bạn có những trãi nghiệm mượt mà khi duyệt website và đọc tin tức

Quy trình SEO Audit này sẽ hướng dẫn bạn các làm SEO theo hướng mới từ năm 2018. Đây là phiên bản rút gọn trong SEO Audit thiên hướng về SEO...

[Chia sẻ] Quy trình SEO Audit 2018 (by Huỳnh Phụng Blogger)

Quy trình SEO Audit này sẽ hướng dẫn bạn các làm SEO theo hướng mới từ năm 2018.
Đây là phiên bản rút gọn trong SEO Audit thiên hướng về SEO tổng thể, còn các kỹ thuật tối ưu SEO Audit bạn theo dõi trong file để check list các mục cần tối ưu.


Xem trong file SEO Audit
Quy tình SEO Audit 2018

Danh sách các bước trong Quy trình SEO Audit 2018

Chúng tôi sẽ tiếp tục cập nhật thêm thông tin

Tối ưu ảnh là kỹ thuật gọi ảnh vừa với kích thước hiển thị ra ngoài màn hình, nhờ vào kĩ thuật này bạn sẽ gọi ra được ảnh có kích thước phù ...

Kinh nghiệm tối ưu ảnh trên iphone 6/7/8 trên Blogger

Tối ưu ảnh là kỹ thuật gọi ảnh vừa với kích thước hiển thị ra ngoài màn hình, nhờ vào kĩ thuật này bạn sẽ gọi ra được ảnh có kích thước phù hợp vừa làm giảm dung lượng ảnh vừa giúp website tải nhanh hơn.

Vẫn là lời khuyên cũ. Trước khi sử dụng ảnh trên Website bạn phải nén ảnh lại trước khi up lên bằng:
  1. https://compressnow.com/ (với ảnh JPG)
  2. https://gifcompressor.com/vi/ (với ảnh GIF)
  3. https://compresspng.com/vi/ (với ảnh PNG)

Cách 1: Dùng Javascript để cắt ảnh vừa với kích thước hiển thị

Cách này thì thường áp dụng cho gọi bài viết theo nhãn, có sử dụng javascript

Đối với Blogger khi truy cập trên thiết bị có độ phân giải màn hình từ 600px trở xuống sẽ chuyển ngay sang truy cập link trên mobile có dạng...

Hướng dẫn thiết kế 2 giao diện (Mobile/Desktop) cho Blogger

Đối với Blogger khi truy cập trên thiết bị có độ phân giải màn hình từ 600px trở xuống sẽ chuyển ngay sang truy cập link trên mobile có dạng url.html?m=1

Đối với giao diện này các điều kiện trên mobile bắt đầu hoạt động.
<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'><!-- nội dung muốn hiển thị trên di động --></b:if>

<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'><!-- Nội dung không muốn hiển thị trên di động --></b:if>

Do vậy khi khi xem trên máy tính với kích thước màn hình lớn thì không thể nào tự chuyển sang url?m=1 được mà ta phải có button cho chuyển 2 chế độ. Sẽ được thêm ?m=1 vào cuối url.


Như cách mình làm thì ở chế độ Mobile sẽ tự động ẩn Sidebar-wrapper đi và để #main-wrapper{width:100%!important}

Test my site ( https://testmysite.withgoogle.com/intl/vi-vn ) là công cụ mà Google đưa ra để kiểm tra tốc độ của Website khi tải trang trên ...

Sự thật về tối ưu Test my site (Tốc độ Web trên di động 3G)


Test my site (https://testmysite.withgoogle.com/intl/vi-vn) là công cụ mà Google đưa ra để kiểm tra tốc độ của Website khi tải trang trên thiết bị di động dùng kết nối 3G.
Google khuyến cáo tốc độ trang ~3s trên Test mysite là chuẩn nhất.
  • Nếu ~5s bạn sẽ mất 19% lượng traffic truy cập từ Di động.
  • Nếu ~4s bạn sẽ mất 10% lượng traffic truy cập từ Di động.
Song chúng ta có nên tin công cụ  Test my site (Tốc độ Web trên 3G) này của Google hay không?


Thật sự https://www.webpagetest.org/ mới là trang mà Testmysite lấy dữ liệu, nếu bạn check trực tiếp trên Testmysite thì thực sự có thể không chỉnh xác.

Test lần 1 trên Testmysite Google:

Ban đầu mình đã test trên trang chủ của url: https://toilaquantri.com với Test My site là ~5s.
Phiên bản mobile với Test My site là ~4s.
Tiếp theo mình sẽ vào trang nguồn cung cấp https://www.webpagetest.org/ để test lần thứ 2 cho chính xác.

Lần 2: Cấu hình test trên webpagetest như sau:

  1. Chọn máy chủ ở châu á và Hong Kong là gần VN nhất
  2. Chọn trình duyệt Chrome
  3. Chọn 3G tốc độ 1.6Mbps

P/s 3G ở VN có tốc độ mà nhà cung cấp đưa ra là 7.2Mbps tuy nhiên không bao giờ đạt cả nên mình chỉ chọn mức trung mình là 1.6Mbps thôi. 3G ở VN thường không ổn định nên chọn tốc độ như thế là hợp lí.

Kết quả Test lần 2 với webpagetest

  1. Lần đầu 13s
  2. Reload lại 10.8s
Sở dĩ reload lại luôn nhanh hơn lần đầu là một số request đã được lưu cache lại nên chỉ việc lấy lên từ bộ nhớ đệm chứ không tải về từ Server Web nữa.

Kết quả test 3G

Thực tế thì khi xem Video lại cho ra kết quả khác. Chú ý đến trường Watch Video để xem nhé!
Video tải trang thực tế (lần 1)



Cái sai ở đây là chúng ta test trên giao diện trên máy tính mất rồi.
  • Giao diện Mobile: https://www.toilaquantri.com?m=1
  • Giao diện Desktop: https://www.toilaquantri.com
Do vậy nếu Website của bạn có 2 giao diện thì chúng ta nên chọn giao diện Mobile để test trên 3G mới chuẩn nhất. Ta sẽ test lại lần 3 với url https://www.toilaquantri.com?m=1

Kết quả lần 3 trên webpagetest

  • Lần đầu 8.3s
  • Reload lại 3.2s (khá chuẩn)

Video tải trang thực tế (lần 2)


Test lần 4 với Network trên Google Chrome

  1. Cho kết quả DCL là 4.15s
  2. Full load 8.74s
P/s: Thực ra máy tính mình có đời chip (Intel Core i5 thế hệ 2, ổ HDD) từ năm 2011 cho nên khả năng bắt sóng sẽ không bằng chip mạng trên điện thoại được nên sẽ có dấu hiện chậm hơn thực tế, vả lại trên máy tính thì trình duyệt Chrome tải giao diện Web đầy đủ hơn nên có thể sẽ nặng hơn so với Mobile (phần này cũng cực kì quan trọng nhé!) 

Lần test 5 thực tế trên điện thoại 3G.

  • Lần này mình dùng Quay màn hình trên chiếc Smartphone mình đang dùng với kết nối 3G của Vietnammobile và cho ra kết quả thời gian khoảng 4~5s bất ngờ là vừa trùng khớp với Test mysite.
  • Tuy nhiên khi tải lại trang thì thời gian chỉ 2~3s.