Tăng tốc độ Load trang web để Tối ưu Onpage
Chào Anh chị em đã và đang xem bài của viết của mình. Bài viết hôm nay sẽ giúp mọi người tối ưu hóa website với 1 vài thủ thuật nhỏ cho 2 mã nguồn mở là Blogspot và WordPress . Và đặc biệt, tăng tốc độ load trang web để tối ưu Onpage tối đa giúp quá trình SEO dễ dàng hơn cho mọi người
Chào Anh chị em đã và đang xem bài của viết của mình. Bài viết hôm nay sẽ giúp mọi người tối ưu hóa website với 1 vài thủ thuật nhỏ cho 2 mã nguồn mở là Blogspot và WordPress . Và đặc biệt, tăng tốc độ load trang web để tối ưu Onpage tối đa giúp quá trình SEO dễ dàng hơn cho mọi người
Tăng tốc độ load trang web với PageSpeed Insights cho WordPress
Với sự phát triển SEO cho đến ngày hôm nay, mã nguồn mở chuẩn SEO mà WordPress mang lại đều được mọi người làm SEO khẳng định và gắn cho cái Mác : ” Người làm SEO phải biết WordPress ” . Vậy hôm nay mình sẽ hướng dẫn toàn bộ về mã nguồn này.
Với sự phát triển SEO cho đến ngày hôm nay, mã nguồn mở chuẩn SEO mà WordPress mang lại đều được mọi người làm SEO khẳng định và gắn cho cái Mác : ” Người làm SEO phải biết WordPress ” . Vậy hôm nay mình sẽ hướng dẫn toàn bộ về mã nguồn này.
Cần gì để sử dụng được WordPress
Hiện có rất nhiều cách để cho mã nguồn này hoạt động tùy vào sự hiểu biết của mỗi người. Có người sử dụng Hosting hoặc VPS cùng với 1 domain . Với cách thứ 2, nhiều người chọn WP miễn phí tại WordPress.Com làm Web2.0 hay PBN (dễ hiểu là 1 blog cá nhân ) không tốn phí duy trì cho Hosting cũng như tên miền, dùng subdomain của WP để hoạt động
Hiện có rất nhiều cách để cho mã nguồn này hoạt động tùy vào sự hiểu biết của mỗi người. Có người sử dụng Hosting hoặc VPS cùng với 1 domain . Với cách thứ 2, nhiều người chọn WP miễn phí tại WordPress.Com làm Web2.0 hay PBN (dễ hiểu là 1 blog cá nhân ) không tốn phí duy trì cho Hosting cũng như tên miền, dùng subdomain của WP để hoạt động
Ưu nhược điểm của từng loại WP
- Với WordPress tốn phí với các dịch vụ Domain hay Hosting thì dễ dàng chỉnh sửa CODE nhưng mất phí duy trì
- Với WordPress với cái Mác miễn phí dĩ nhiên sẽ không mất gì và được lưu trữ mãi mãi trừ trường hợp WP bị xóa bỏ. Nhược điểm của WP này là không sửa được CODE
Sau những ý trên có thể hiểu sơ về mã nguồn này. Tiếp theo là những điều cần lưu ý cho WP
- Với WordPress tốn phí với các dịch vụ Domain hay Hosting thì dễ dàng chỉnh sửa CODE nhưng mất phí duy trì
- Với WordPress với cái Mác miễn phí dĩ nhiên sẽ không mất gì và được lưu trữ mãi mãi trừ trường hợp WP bị xóa bỏ. Nhược điểm của WP này là không sửa được CODE
Sau những ý trên có thể hiểu sơ về mã nguồn này. Tiếp theo là những điều cần lưu ý cho WP
√ Install WP
– Hosting : Có thể dùng hosting miễn phí ở hostinger.vn chẳng hạn
– Domain : Cách lựa chọn domain dựa trên 2 loại sau:
→ Domain dựa trên từ khóa chính hoặc từ khóa phụ rất tốt cho SEO .
Ví dụ: tukhoachinh.com hoặc tukhoaphu2016.com
→ Domain thương hiệu ( brand ) : là domain mà bạn cảm thấy có thể duy trì nó lâu dài tạo trust cho người viếng thăm.
Ví dụ : facebook.com hay yamaha.com những thương hiệu lớn với 1 bên là ông trùm MXH 1 bên là ông trùm của xe có tiếng trên TG
√ Địa chỉ truy cập 1 WordPress: domain.com/wp-admin/
√ Các mục quan trọng trong CMS WP:
- Appearance : Là nơi dùng để cài đặt và tùy chỉnh các theme ( giao diện ) cho người dùng nhìn thấy. Bên cạnh đó còn cho sửa code với những người hiểu rõ về WP
- Plugins: là các công cụ tích hợp nhanh cho người quản trị không phải mất thời gian code mà sử dụng trên những cái có sẵn
- Users : Chỉnh sửa, Thêm , Xóa thành viên trong Web
- Tools : Với chức năng chính là cài đặt các công cụ nhập xuất các bài viết
- Settings: Cài đặt ( Config ) một số thứ quan trọng cho WP
- Media: Nơi lưu trữ đồng thời upload các ảnh, video
- Posts: Về các thứ cần thiết cho 1 bài viết
- Pages: Tạo ra các trang cho trang web như Giới thiệu, Liên Hệ, Điều khoản …
– Hosting : Có thể dùng hosting miễn phí ở hostinger.vn chẳng hạn
– Domain : Cách lựa chọn domain dựa trên 2 loại sau:
→ Domain dựa trên từ khóa chính hoặc từ khóa phụ rất tốt cho SEO .
Ví dụ: tukhoachinh.com hoặc tukhoaphu2016.com
→ Domain thương hiệu ( brand ) : là domain mà bạn cảm thấy có thể duy trì nó lâu dài tạo trust cho người viếng thăm.
Ví dụ : facebook.com hay yamaha.com những thương hiệu lớn với 1 bên là ông trùm MXH 1 bên là ông trùm của xe có tiếng trên TG
√ Địa chỉ truy cập 1 WordPress: domain.com/wp-admin/
√ Các mục quan trọng trong CMS WP:
- Appearance : Là nơi dùng để cài đặt và tùy chỉnh các theme ( giao diện ) cho người dùng nhìn thấy. Bên cạnh đó còn cho sửa code với những người hiểu rõ về WP
- Plugins: là các công cụ tích hợp nhanh cho người quản trị không phải mất thời gian code mà sử dụng trên những cái có sẵn
- Users : Chỉnh sửa, Thêm , Xóa thành viên trong Web
- Tools : Với chức năng chính là cài đặt các công cụ nhập xuất các bài viết
- Settings: Cài đặt ( Config ) một số thứ quan trọng cho WP
- Media: Nơi lưu trữ đồng thời upload các ảnh, video
- Posts: Về các thứ cần thiết cho 1 bài viết
- Pages: Tạo ra các trang cho trang web như Giới thiệu, Liên Hệ, Điều khoản …
Install Plugins cần thiết cho WP
- Yoast SEO: Là Plugin hỗ trợ SEO tốt nhất mà mọi người ai cũng sử dụng. Với việc tối ưu các thẻ meta, sitemap , social …
- Digg Digg : hỗ trợ chèn các nút chia sẻ của các mạng xã hội trên thế giới vào các nơi trong website
- W3 Total Cache: Cải thiện về bộ nhớ với việc nén HTML CSS, Javascript mà mình sử dụng
- WP Smush : Nén ảnh cho website hỗ trợ tăng load
- WP Statistics : Đếm view cho Web . Nếu mọi người không cần thì không nên cài
- Yoast SEO: Là Plugin hỗ trợ SEO tốt nhất mà mọi người ai cũng sử dụng. Với việc tối ưu các thẻ meta, sitemap , social …
- Digg Digg : hỗ trợ chèn các nút chia sẻ của các mạng xã hội trên thế giới vào các nơi trong website
- W3 Total Cache: Cải thiện về bộ nhớ với việc nén HTML CSS, Javascript mà mình sử dụng
- WP Smush : Nén ảnh cho website hỗ trợ tăng load
- WP Statistics : Đếm view cho Web . Nếu mọi người không cần thì không nên cài
Cần những gì để cải thiện tốc độ ?
- Phần mềm FileZilla Client
- Phần mềm soạn thảo code: NotePad++, NotePad , JetBrains WebStorm
- Tools kiểm tra: https://developers.google.com/speed/pagespeed/insights/
- Phần mềm FileZilla Client
- Phần mềm soạn thảo code: NotePad++, NotePad , JetBrains WebStorm
- Tools kiểm tra: https://developers.google.com/speed/pagespeed/insights/
Các bước thực hiện để cải thiện những chỉ số PageSpeed Insights
1. Tiến hành cài mã nguồn WordPress
2. Truy cập trang web của mình : domain.com/wp-admin. Sau đó login tài khoản WP của mình vào.
3. Chuẩn bị tài khoản FTP của host dùng FileZilla để truy cập
– Mở FileZilla Client lên tìm đến File => Site Manager rồi cấu hình như bên dưới
- Protocol ( Cổng truy cập ): Chọn FTP ( Port 21)
- Encryption ( Mã hóa ) : chọn Only use plain FTP
- Logon Type: Chọn Normal
- User : Nhập tài khoản FTP của host đang xài vào.
- Password: Pass lúc bạn tiến hành cài WP
-Rồi thế là OK. Vậy là đã vào được FTP của host đang xài
3. Tiến hành Cài Plugins cần thiết như mình đã liệt kê hoặc tiến hành cài thêm những thứ mà website bạn cần.
√ Vào Performance chọn Minify sẽ nhìn thấy 3 mục HTML & XML với JS CSS
- HTML & XML: Chọn toàn bộ cho nó nén lại source code HTML và XML
- JS : Chọn Enable để tiến hành nén ( Minify ) cùng với đó là asyncs Javascript
- CSS: Chọn Enable coi như xong phần CSS
4. Chờ trong 2p rồi tiến hành kiểm tra tốc độ load trang web tại Web của Google trên.
5. Tiến hành xem còn thông báo khắc phục nào thì khắc phục. Chủ yếu là nén CSS, Javascript.
– Với CSS thì bạn có thể search google với từ khóa nén css. Vứt đoạn code đấy vào rồi copy vào lại và chọn Upload files là thành công.
Nén HTML, CSS, Javascript tại đây
– Với Javascript thì đưa toàn bộ các mã được đặt trong <script></script> xuống ở Footer ( Appearance => Editor => Footer.php) rồi thêm asyncs vào <script asyncs></script>
Một lưu ý nữa đó là sau khi sử dụng 1 thời gian thì việc lưu dữ liệu của website cho người dùng sẽ bị thông báo là Nâng cao lưu vào bộ nhớ cache trong trình duyệt nên chúng ta sẽ mở file .htacess ở thư mục public_html bạn click vào đó nó sẽ tự động tải về máy của mình. Lúc này tìm tới thư mục chứa nó lúc tải về copy đoạn code ở đây về
ExpiresActive On
ExpiresByType text/css A31536000
ExpiresByType text/x-component A31536000
ExpiresByType application/x-javascript A31536000
ExpiresByType application/javascript A31536000
ExpiresByType text/javascript A31536000
ExpiresByType text/x-js A31536000
ExpiresByType text/html A3600
ExpiresByType text/richtext A3600
ExpiresByType image/svg+xml A3600
ExpiresByType text/plain A3600
ExpiresByType text/xsd A3600
ExpiresByType text/xsl A3600
ExpiresByType text/xml A3600
ExpiresByType video/asf A31536000
ExpiresByType video/avi A31536000
ExpiresByType image/bmp A31536000
ExpiresByType application/java A31536000
ExpiresByType video/divx A31536000
ExpiresByType application/msword A31536000
ExpiresByType application/vnd.ms-fontobject A31536000
ExpiresByType application/x-msdownload A31536000
ExpiresByType image/gif A31536000
ExpiresByType application/x-gzip A31536000
ExpiresByType image/x-icon A31536000
ExpiresByType image/jpeg A31536000
ExpiresByType application/json A31536000
ExpiresByType application/vnd.ms-access A31536000
ExpiresByType audio/midi A31536000
ExpiresByType video/quicktime A31536000
ExpiresByType audio/mpeg A31536000
ExpiresByType video/mp4 A31536000
ExpiresByType video/mpeg A31536000
ExpiresByType application/vnd.ms-project A31536000
ExpiresByType application/x-font-otf A31536000
ExpiresByType application/vnd.ms-opentype A31536000
ExpiresByType application/vnd.oasis.opendocument.database A31536000
ExpiresByType application/vnd.oasis.opendocument.chart A31536000
ExpiresByType application/vnd.oasis.opendocument.formula A31536000
ExpiresByType application/vnd.oasis.opendocument.graphics A31536000
ExpiresByType application/vnd.oasis.opendocument.presentation A31536000
ExpiresByType application/vnd.oasis.opendocument.spreadsheet A31536000
ExpiresByType application/vnd.oasis.opendocument.text A31536000
ExpiresByType audio/ogg A31536000
ExpiresByType application/pdf A31536000
ExpiresByType image/png A31536000
ExpiresByType application/vnd.ms-powerpoint A31536000
ExpiresByType audio/x-realaudio A31536000
ExpiresByType image/svg+xml A31536000
ExpiresByType application/x-shockwave-flash A31536000
ExpiresByType application/x-tar A31536000
ExpiresByType image/tiff A31536000
ExpiresByType application/x-font-ttf A31536000
ExpiresByType application/vnd.ms-opentype A31536000
ExpiresByType audio/wav A31536000
ExpiresByType audio/wma A31536000
ExpiresByType application/vnd.ms-write A31536000
ExpiresByType application/font-woff A31536000
ExpiresByType application/vnd.ms-excel A31536000
ExpiresByType application/zip A31536000
Hãy chờ đợi trong 5p cho bền và kiểm tra lại. Hãy xem kết quả .Nếu thấy bài viết hay thì chia sẻ cho người khác nữa nhé.
Với Blogspot thì việc tối ưu không cần thiết vì nó là đứa con của GG nên các chỉ số luôn 80 – 90 trở lên. Với 1 vài trường hợp có Javascript và CSS nhiều bạn chỉ cần nén code nó lại là hoàn thành.
Video ( đang cập nhật )
1. Tiến hành cài mã nguồn WordPress
2. Truy cập trang web của mình : domain.com/wp-admin. Sau đó login tài khoản WP của mình vào.
3. Chuẩn bị tài khoản FTP của host dùng FileZilla để truy cập
– Mở FileZilla Client lên tìm đến File => Site Manager rồi cấu hình như bên dưới
- Protocol ( Cổng truy cập ): Chọn FTP ( Port 21)
- Encryption ( Mã hóa ) : chọn Only use plain FTP
- Logon Type: Chọn Normal
- User : Nhập tài khoản FTP của host đang xài vào.
- Password: Pass lúc bạn tiến hành cài WP
-Rồi thế là OK. Vậy là đã vào được FTP của host đang xài
3. Tiến hành Cài Plugins cần thiết như mình đã liệt kê hoặc tiến hành cài thêm những thứ mà website bạn cần.
√ Vào Performance chọn Minify sẽ nhìn thấy 3 mục HTML & XML với JS CSS
- HTML & XML: Chọn toàn bộ cho nó nén lại source code HTML và XML
- JS : Chọn Enable để tiến hành nén ( Minify ) cùng với đó là asyncs Javascript
- CSS: Chọn Enable coi như xong phần CSS
4. Chờ trong 2p rồi tiến hành kiểm tra tốc độ load trang web tại Web của Google trên.
5. Tiến hành xem còn thông báo khắc phục nào thì khắc phục. Chủ yếu là nén CSS, Javascript.
– Với CSS thì bạn có thể search google với từ khóa nén css. Vứt đoạn code đấy vào rồi copy vào lại và chọn Upload files là thành công.
Nén HTML, CSS, Javascript tại đây
– Với Javascript thì đưa toàn bộ các mã được đặt trong <script></script> xuống ở Footer ( Appearance => Editor => Footer.php) rồi thêm asyncs vào <script asyncs></script>
Một lưu ý nữa đó là sau khi sử dụng 1 thời gian thì việc lưu dữ liệu của website cho người dùng sẽ bị thông báo là Nâng cao lưu vào bộ nhớ cache trong trình duyệt nên chúng ta sẽ mở file .htacess ở thư mục public_html bạn click vào đó nó sẽ tự động tải về máy của mình. Lúc này tìm tới thư mục chứa nó lúc tải về copy đoạn code ở đây về
ExpiresActive On
ExpiresByType text/css A31536000
ExpiresByType text/x-component A31536000
ExpiresByType application/x-javascript A31536000
ExpiresByType application/javascript A31536000
ExpiresByType text/javascript A31536000
ExpiresByType text/x-js A31536000
ExpiresByType text/html A3600
ExpiresByType text/richtext A3600
ExpiresByType image/svg+xml A3600
ExpiresByType text/plain A3600
ExpiresByType text/xsd A3600
ExpiresByType text/xsl A3600
ExpiresByType text/xml A3600
ExpiresByType video/asf A31536000
ExpiresByType video/avi A31536000
ExpiresByType image/bmp A31536000
ExpiresByType application/java A31536000
ExpiresByType video/divx A31536000
ExpiresByType application/msword A31536000
ExpiresByType application/vnd.ms-fontobject A31536000
ExpiresByType application/x-msdownload A31536000
ExpiresByType image/gif A31536000
ExpiresByType application/x-gzip A31536000
ExpiresByType image/x-icon A31536000
ExpiresByType image/jpeg A31536000
ExpiresByType application/json A31536000
ExpiresByType application/vnd.ms-access A31536000
ExpiresByType audio/midi A31536000
ExpiresByType video/quicktime A31536000
ExpiresByType audio/mpeg A31536000
ExpiresByType video/mp4 A31536000
ExpiresByType video/mpeg A31536000
ExpiresByType application/vnd.ms-project A31536000
ExpiresByType application/x-font-otf A31536000
ExpiresByType application/vnd.ms-opentype A31536000
ExpiresByType application/vnd.oasis.opendocument.database A31536000
ExpiresByType application/vnd.oasis.opendocument.chart A31536000
ExpiresByType application/vnd.oasis.opendocument.formula A31536000
ExpiresByType application/vnd.oasis.opendocument.graphics A31536000
ExpiresByType application/vnd.oasis.opendocument.presentation A31536000
ExpiresByType application/vnd.oasis.opendocument.spreadsheet A31536000
ExpiresByType application/vnd.oasis.opendocument.text A31536000
ExpiresByType audio/ogg A31536000
ExpiresByType application/pdf A31536000
ExpiresByType image/png A31536000
ExpiresByType application/vnd.ms-powerpoint A31536000
ExpiresByType audio/x-realaudio A31536000
ExpiresByType image/svg+xml A31536000
ExpiresByType application/x-shockwave-flash A31536000
ExpiresByType application/x-tar A31536000
ExpiresByType image/tiff A31536000
ExpiresByType application/x-font-ttf A31536000
ExpiresByType application/vnd.ms-opentype A31536000
ExpiresByType audio/wav A31536000
ExpiresByType audio/wma A31536000
ExpiresByType application/vnd.ms-write A31536000
ExpiresByType application/font-woff A31536000
ExpiresByType application/vnd.ms-excel A31536000
ExpiresByType application/zip A31536000
Hãy chờ đợi trong 5p cho bền và kiểm tra lại. Hãy xem kết quả .Nếu thấy bài viết hay thì chia sẻ cho người khác nữa nhé.
Với Blogspot thì việc tối ưu không cần thiết vì nó là đứa con của GG nên các chỉ số luôn 80 – 90 trở lên. Với 1 vài trường hợp có Javascript và CSS nhiều bạn chỉ cần nén code nó lại là hoàn thành.
Video ( đang cập nhật )
0 nhận xét:
Post a Comment