Khóa học CI/CD Deploy React, Node, Next mới ra mắt

Kỹ năng SEO cần biết cho mọi Web Developer

Châm ngôn của mình là học để kiếm tiền.

Vì thế mình build các khóa học của mình để giúp anh em tiến bộ nhanh hơn x10 lần , để kiếm được nhiều tiền hơn

  • 🏆 React.js Super: Trở thành React.js Developer trong 7 ngày với mức thu nhập 20 triệu/tháng
  • 🏆 Node.js Super: Giúp bạn học cách phân tích, thiết kế, deploy 1 API Backend bằng Node.js
  • 🏆 Next.js Super: Mình sẽ chia sẻ từ A-Z kiến thức về Next.js, thứ giúp mình kiếm hơn 1 tỉ/năm
  • 🏆 Deploy Super: CI/CD Deploy tự động React, Node, Next lên VPS qua Github Actions kết hợp Telegram Bot

Chào ae, nhiều anh em thắc mắc Web Developer thì có cần biết về SEO hay không? Câu trả lời là CẦN nhé!

💡 Mẹo:

Sản phẩm làm ra mà không có người dùng thì cũng vứt. Vì thế SEO và Marketing là các bước quan trọng để đưa sản phẩm đến người dùng. Team Dev mà làm web như shit thì team SEO cũng khó mà SEO được 😂

Và đây là Checklist SEO cho Web Developer mà mọi người có thể tham khảo để áp dụng cho các dự án của mình.

🥇1. Serverside rendering là người bạn đồng hành.

  • Các Search Engine hiện nay vẫn chưa tối ưu tốt cho Clientside Renderring, vì thế ngay từ lúc chọn công nghệ cho dự án hãy nghĩ đến điều này.
  • Nếu bạn đã lỡ chọn các FW Clientside rendering như React, Angular thì có thể nghĩ đến giải pháp dynamic rendering như Shopee đang dùng.
  • Hoặc muốn đơn giản, chọn ngay Universal SSR. Các tân binh có thể kể như NextJs, NuxtJs. Tiktok, Binance, Twitch đang dùng công nghệ này.
  • Gatsby cũng khá ổn nhưng mình mình không đánh giá cao về tính mở rộng của FW này.

🥇2. Semantic HTML5, Code chuẩn SEO

  • Tuân thủ các nguyên tắc như thẻ heading H1 thì chỉ nên xuất hiện 1 lần trên trang, các thẻ nên làm đúng nhiệm vụ của nó, không nên cheat quá nhiều.

🥇3. Tối ưu tốc độ website

  • Tối ưu tốc độ Server của bạn như áp dụng các công nghệ như Caching, nâng cấp Server lên gói cao hơn.
  • Tối ưu website ở client bằng cách giảm kích thước các tài nguyên xuống.
  • Về JS thì bạn nên quan tâm về vấn đề tree-saking, target js, vì nếu target thấp như ES5 hay các trình duyệt cũ thì sẽ cần polyfilling, điều này cũng gia tăng kích thước file đáng kể.
  • Về CSS thì bạn nên xóa các CSS dư thừa. Nhớ minify JS và CSS cũng như xóa sourcemap đi nhé.
  • Về image thì nên xóa các metadata của ảnh để giảm kích thước, có thể giảm đến 80% dung lượng đó!
  • Có thể dùng PageSpeed Insights để phân tích website bị gặp vấn đề chỗ nào.

🥇4. Image nên có alt

  • Ảnh nên có mô tả alt trong tag, điều này rất tốt cho SEO

🥇5. Thêm các tag Open Graph cho các mạng xã hội như FB, Twitter

  • Việc này giúp việc chia sẽ web của chúng ta lên mạng xã hội dễ nhìn và đẹp hơn, tăng tỉ lệ click.

🥇6. Những chức năng ẩn hiện như tab, nên dùng display-none chứ không nên dùng js xóa luôn khỏi DOM tree.

  • Nếu đó là nội dung quan trọng cho SEO thì bạn nên ẩn hiện bằng display: none, vì nếu xóa hẳn element ra khỏi DOM tree thì search engine có thể không đọc được.

🥇7. Tạo sitemap cho website

🥇8. Tạo file robot.txt

🥇9. Thân thiện với mobile

  • Nhớ responsive đầy đủ các màn hình nhé. Tỉ lệ người dùng dùng mobile để lướt web cao hơn máy tính đó. Các website thân thiện mobile cũng được các search engine đánh giá cao.
  • Các link lỗi, không tồn tại sẽ không được search engine đánh giá cao. Nếu người dùng vào thì cũng sẽ thoát ra ngay, điều này cũng dẫn đến website của bạn bị mất độ uy tín trên rank.

🥇11. Nâng cấp lên SSL (HTTPS), vừa tốt cho bảo mật, vừa tốt cho SEO.

🥇12. Cho phép website hiển thị trên các máy chủ tìm kiếm.

  • Đừng đợi các máy chủ tìm đến bạn. Nếu là google thì bạn có thể cập nhật trên Google Search Console.

Chúc anh em cuối tuần vui vẻ 💻


👉 Kiến thức trong khóa học Next.js này đã giúp mình kiếm hơn 1 tỉ đồng/năm

Phew! Cuối cùng bạn cũng đã đọc xong. Bài viết này có hơi dài một tí vì mình muốn nó đầy đủ nhất có thể 😅

Website bạn đang đọc được viết bằng Next.js TypeScript và tối ưu từng chi tiết nhỏ như SEO, hiệu suất, nội dung để đảm bảo bạn có trải nghiệm tốt nhất.

Với lượt view trung bình là 30k/tháng (dù website rất ít bài viết). Website này đem lại doanh thu 1 năm vừa qua là hơn 1 tỉ đồng

Đó chính là sức mạnh của SEO, sức mạnh của Next.js.

Mình luôn tin rằng kiến thức là chìa khóa giúp chúng ta đi nhanh nhất.

Mình đã dành hơn 6 tháng để phát triển khóa học Next.js Super | Dự án quản lý quán ăn & gọi món bằng QR Code. Trong khóa này các bạn sẽ được học mọi thứ về framework Next.js, các kiến thức từ cơ bản cho đến nâng cao nhất, mục đích của mình là giúp bạn chinh phục mức lương 25 - 30 triêu/tháng

Nếu bạn cảm thấy bài viết này của mình hữu ích, mình nghĩ bạn sẽ thích hợp với phong cách dạy của mình. Không như bài viết này, khóa học là sự kết hợp giữa các bài viết, video, bài tập nhỏ và dự án lớn có thể xin việc được ngay. Học xong mình đảm bảo bạn sẽ lên tay ngay. 💪🏻

Avatar Dư Thanh Được

Dư Thanh Được

Một developer thích nghiên cứu và chia sẻ kiến thức về lập trình, blockchain, marketing. Chuyên code và dạy lập trình website