تغییرات اخیر

در اینجا اطلاعیه‌ها، نسخه‌ها و تغییرات جدید لیارا فهرست می‌شوند.

    بهبود SEO برنامه‌های تک صفحه‌ای (SPA)

    بهبود seo برنامه‌های تک صفحه‌ای (spa)

    طی چند سال گذشته، فناوری وب یک جهش بزرگ در بخش فرانت‌اند و بک‌اند داشته است. امروزه ما فریم‌ورک‌های مختلفی برای کار در زمینه مورد نظر خود در اختیار داریم. به‌خصوص در فرانت‌اند گزینه‌های زیادی برای انتخاب وجود دارد، برای مثال می‌توان به فریم‌ورک‌ها و کتابخانه‌های تخصصی اشاره داشت.

    در میان نسل جدید رابط‌های وب، وبسایت‌های تک صفحه یا همان SPA (Single Page Application)ها بسیار محبوب هستند. وبسایت‌های SPA در پیمایش، اسکرول و طراحی تعاملی صفحه بسیار خوب عمل کرده‌اند اما SEO این دسته از وبسایت‌ها روند مشخصی ندارد.

    همه ما می‌دانیم ساخت یک برنامه یا برنامه‌های بسیار پیشرفته به‌تنهایی تاثیری بر دریافت ترافیک بالا از طرف کاربران ندارد، نیاز است برنامه‌تان را بسیار هوشمندانه به بازار عرضه کنید. برخلاف برنامه‌های وب ساده که از تکنیک‌های ساده و مرسوم SEO استفاده می‌کنند وقتی صحبت از وبسایت‌های تک صفحه‌ای در میان باشد، تفاوت‌های زیادی وجود دارد و باید SEO را به‌صورت تخصصی‌تر در این وبسایت‌ها دنبال کنید. در ادامه این مقاله با جزئیات درمورد عنوان‌های زیر صحبت خواهیم کرد.

    1. وبسایت تک صفحه‌ای چیست؟
    2. مزایا و معایب وبسایت‌های SPA
    3. GoogleBot چیست و چگونه وبسایت‌های تک صفحه‌ای را مشاهده می‌کند؟
    4. مسائل و مشکل‌های اساسی در SEO وبسایت‌های SPA
    5. بررسی بهترین روش‌های SEO وبسایت‌های SPA
    6. سایر بهینه‌سازی‌های مورد نیاز
    7. سخنان پایانی

    وبسایت تک صفحه‌ای چیست؟

    SPA یک نوع بسیار تعاملی از وبسایت‌های مدرن به شمار می‌آید که دارای رابط کاربری با زبان جاوااسکریپت است. در این نوع وبسایت‌ها به‌جای بارگیری یک صفحه جدید برای هر سرویس، با بازنویسی پویای صفحه‌ی فعلی، می‌توان گفت که همه صفحه‌ها را در یک صفحه قرار داده شده‌اند. این حالت به کاربر کمک می‌کند تا تمام ویژگی‌ها و خدمات را در یک صفحه در اختیار داشته باشد و از ایجاد اختلال نیز جلوگیری می‌شود، درنهایت تجربه تعاملی کاربر افزایش می‌یابد.

    اغلب توسعه‌دهندگان برای ساخت وبسایت‌های تک صفحه‌ای تمایل دارند تا از فریم‌ورک‌های زبان جاوااسکریپت، از جمله VueJS، Angular، React و سایر موارد استفاده کنند. البته به‌دلیل اینکه کار با فریم‌ورک Vue آسان‌تر از سایر موارد است و ویژگی‌های داخلی بسیار خوبی را برای ساخت وبسایت‌های تک صفحه‌ای پیشرفته در اختیار توسعه‌دهندگان قرار می‌دهد، می‌توان گفت که رایج‌تر است.

    مزایا و معایب وبسایت‌های SPA

    مزایا

    دلایل زیادی وجود دارند که کاربران را عاشق استفاده از طراحی‌های تک صفحه‌ای می‌کنند. بارزترین آنها سهولت دسترسی به همه مطالب وبسایت در یک صفحه است. این مورد به کاربران کمک می‌کند تا به سرعت در وبسایت پیمایش کنند زیرا همه سرویس‌ها در یک صفحه تعریف شده‌اند و نیازی به بارگیری صفحه‌ جدیدی نیست.

    در بخش سازگاری وبسایت‌های تک صفحه‌ای با موبایل‌ها نیز شاهد مراتب بهتری از وبسایت‌های چندصفحه‌ای هستیم. زیرا طراحی SPAها واکنش‌گرا بوده و به‌خوبی با صفحه‌ نمایش گوشی‌های هوشمند تناسب پیدا می‌کند. درنهایت می‌توان گفت که وبسایت‌های تک صفحه‌ای برای تلفن‌های هوشمند و کاربرانشان بسیار مناسب‌تر است زیرا افراد همیشه به دنبال تعامل با برنامه‌هایی هستند که پیمایش سریع و آسانی را به ارمغان می‌آورند.

    معایت

    تمام تکنولوژی‌ها در کنار مزایایی که در اختیار ما قرار می‌دهند، معایبی نیز با خود به همراه دارند و برنامه‌های تک صفحه‌ای از این قاعده مستثنی نیستند. اگرچه پیمایش آنها آسان است اما برای بارگیری آنها به زمان بیشتری احتیاج داریم، این یکی از دلایل اصلی از دست دادن ترافیک برای وبسایت‌ها است. از آنجا که برنامه‌های تک صفحه‌ای با زبان جاوااسکریپت برنامه‌نویسی شده‌اند، به همین دلیل برای بارگیری در مرورگرهای تلفن همراه به زمان بیشتری نیاز است.

    همچنین اگر از Google Analytics برای ردیابی میزان بازدید و عملکرد هر صفحه از وبسایت استفاده می‌کنید، پیاده‌سازی آن در برنامه‌های تک صفحه‌ای دشوار می‌شود. حتی اگر وبسایت SPA خود را به درستی پیکربندی کرده باشید، هیچ اطلاعاتی در این زمینه که کدام محتوا، عملکرد و بازخورد بهتری از طرف کاربران داشته است، در اختیار شما قرار نمی‌گیرد. بنابرین با نداشتن این اطلاعات و عدم توانایی بررسی بازخورد کاربران ممکن است میزان علاقه کاربران به وبسایت کاهش پیدا کند.

    GoogleBot چیست و چگونه وبسایت‌های تک صفحه‌ای را مشاهده می‌کند؟

    گوگل از یک ابزار به خصوص برای crawl کردن محتوا و صفحه‌های وبسایت با نام GoogleBot استفاده می‌کند. این ربات به گوگل کمک می‌کند تا داده‌ها را از وبسایت‌ها جمع آوری کرده و در موتور جستجوی خود ایندکس کند، به همین دلیل یکی از فاکتورهای اصلی برای SEO وبسایت است و همچنین در رتبه‌بندی وبسایت‌ها در موتورهای جستجو، اهمیت قابل توجهی دارد.

    GoogleBot معمولا صفحه‌های وبسایت را با رندرکردن فایل‌های HTML و CSS انجام می‌دهد، اما این مسئله در برنامه‌های تک صفحه‌ای که تماما توسط فریم‌ورک‌های جاوااسکریپتی مانند VueJS و دیگر موارد ساخته می‌شوند، کمی متفاوت است.

    GoogleBot برای crawl کردن برنامه‌های VueJS از روش متفاوتی استفاده می‌کند، به این صورت که جاوااسکریپت‌های درون صفحه مانند فراخوانی‌های ajax را اجرا کرده و علاوه‌براین، قبل از ثبت هر صفحه مدت زمانی بین 5 الی 20 ثانیه صبر می‌کند. این تکنیک پیشرفته اجازه می‌دهد تا برنامه‌های تک صفحه‌ای را به درستی crawl کند، در مرحله آخر محتوای وبسایت را برای SERP (Search engine results page) ایندکس کرده و این محتوا در اختیار موتورجستجو گوگل برای بهینه‌سازی نتایج قرار داده می‌شوند.

    مسائل و مشکل‌های اساسی در SEO وبسایت‌های SPA

    معمولا وبسایت‌های تک صفحه‌ای برای SEO نامناسب هستند. مشکل اساسی در زیرساخت این نوع وبسایت‌ها، یعنی زبان جاوااسکریپت قرار دارد، GoogleBot وبسایت‌هایی که HTML و CSS هستند را به‌خوبی crawl می‌کند زیرا رندر این صفحه‌ها آسان‌تر است.

    یکی دیگر از مبحث‌های مهم، صفحه یا صفحه‌های وبسایت است. این یک واقعیت است که موتور جستجو همیشه صفحه‌های وبسایت را رتبه‌بندی می‌کند، نه خود وبسایت. این صفحه‌ها با دقت و با کلمه‌های کلیدی خاصی طراحی و نوشته شده‌اند تا بتوانند در موتورهای جستجو رتبه دلخواه را بدست بیاورند. محتوای صفحه دارای حجم قابل توجهی از کلمه‌های کلیدی تعریف شده و تعداد کمی پیوند داخلی است که به موتور جستجو اجازه می‌دهد آن صفحه‌ها را بر اساس کلمه‌های کلیدی خاص رتبه‌بندی کند.

    همان‌طور که در ابتدای مقاله گفتیم، همه صفحه‌های وبسایت‌های SPA در یک صفحه قرار گرفته‌اند و هیچ تفکیکی بین محتوا وجود ندارد. درنتیجه، این فقط یک صفحه منحصربه‌فرد برای کل برنامه محسوب می‌‌شود و با این نوع وبسایت، به شدت شانس خود را برای رتبه‌بندی در کلمه‌های کلیدی مختلف به حداقل می‌رسانید.

    وقتی نوبت به پیوندهای داخلی برسد، SEO وبسایت‌های SPA بدتر می‌شود. از آنجا که بخش زیادی از پیوند‌های داخلی در کدهای HTML قرار ندارند، ممکن است crawler تعداد محدودی از URLها را پیدا کند. crawlerها برای دسترسی به دیگر URLها باید مسیر طولانی‌تری را طی کنند. در این مرحله باید کدهای جاوااسکریپتی اجرا شوند تا بتوان به پیوندها دسترسی پیدا کرد که درنهایت باعث تاخیر در موتورهای جستجو می‌شود.

    بررسی بهترین روش‌ها برای SEO وبسایت‌های SPA

    خوشبختانه هنوز راه و تکنیک‌هایی برای SEO وبسایت‌های تک صفحه‌ای وجود دارد که توسعه‌دهندگان می‌توانند برای بهینه‌سازی برنامه‌های تک صفحه‌ای از آنها بهره برده و رتبه‌بندی وبسایت خود را در موتورهای جستجو افزایش دهند.

    Server-Side Rendering

    Server-Side Rendering (SSR) فرایندی است که در آن صفحه‌های وبسایت با توجه به نیازهای درخواست از سمت سرور ارائه می‌شوند. این قابلیت در رندر شدن و تسهیل روند ایندکس صفحه‌های وبسایت بسیار کمک می‌کند.

    برای اجرای SSR در برنامه‌های تک صفحه‌ای ابتدا می‌بایست به صورت DOM مجازی اجرا و به HTML تبدیل شوند. سپس HTML به صفحه اضاف شده و توسط جاوااسکریپت اجرا می‌شوند تا با کدهای فعلی صفحه جایگزین شوند.

    به این صورت SSR به برنامه‌های تک صفحه‌ای کمک می‌کند تا مناسب crawlerها باشند و به موتورهای جستجو این امکان را می‌دهد تا با وجود ساختار پیچیده جاوااسکریپت، آن وبسایت را به درستی ایندکس کنند.

    Pre-Rendering

    Pre-Rendering تقریبا مشابه SSR است، به جز روش آن که به صورت pre-deployment rendering است. در Pre-Rendering رندر قبل از استقرار پروژه انجام می‌شود و مانند SSR که به‌صورت live در سرور انجام می‌شود، عمل نمی‌کند.

    برای انجام Pre-Rendering، ابتدا باید برنامه تک صفحه‌ای خود را در هر مرورگری مانند Chrome، Firefox و … اجرا کنید. سپس باید از صفحه خود یک snapshot تهیه کرده و متناسب با آن فایل‌های HTML را در پاسخ به درخواست سرور جایگزین کنید.

    سایر بهینه‌سازی‌های مورد نیاز

    URL

    توصیه می‌شود که از URLهای متناسب با SEO در وبسایت خود استفاده کنید. همین مورد برای برنامه‌‌های تک صفحه‌ای صدق می‌کند. برای نتایج بهتر توصیه می‌شود دو ساختار برای برنامه تک صفحه‌ای خود در نظر بگیرید. یکی از آنها باید ID URL باشد و دیگری Slug URL باشد.

    URL Slug باید به‌طور واضح با کلمه‌های واقعی که توسط - از هم تفکیک شده‌اند، تعریف شود و پیچیده نباشد. کلمه‌ها باید حاوی کلیه کلمه‌های کلیدی مرتبطی باشد که می‌خواهید در آن رتبه‌بندی شوند و از حداکثر طول آن بیشتر نباشد.

    Meta Tags

    صفحه باید شامل همه متاتگ‌های مهم مانند عنوان صفحه، توضیح‌ها، تگ‌های متعارف، hreflang و … باشد. همچنین توصیه می‌شود که همه این متاتگ‌ها را مستقیما در سورس کدها صفحه قرار دهید تا SSR شما قوی‌تر شود.

    Internal Linking

    تمام پیوندهای داخلی باید به خوبی در محتوا قرار بگیرند و باید با تگ‌های <a> ادغام شده باشند تا Googlebot بتواند به راحتی صفحه را crawl کند. همچنین توصیه می‌شود تمام عناصر اصلی ناوبری را در سورس‌کد تعریف کنید و در بالای صفحه قرار دهید.

    سوال‌های متداول

    آیا برنامه‌های تک صفحه‌ای، مناسب SEO هستند؟

    به این دلیل که crawl کردن و رندر محتوای برنامه‌های تک صفحه‌ای یا همان SPAها برای Googlebot دشوار است، این نوع تکنولوژی را زیاد مناسب SEO نمی‌دانند.

    آیا Vue، مناسب SEO است؟

    همچنین وبسایت‌هایی که با Vue.js ساخته شده‌اند را نمی‌توان مناسب SEO دانست زیرا بسیاری از مشکلات مانند سرعت بارگیری صفحه، متاتگ‌ها، نقشه سایت (sitemap)، به‌روزرسانی URL هش شده و … را با خود به همراه دارند.

    آیا React درمقایسه با Vue، عملکرد بهتری در SEO دارد؟

    ذاتا هر دو این تکنولوژی‌ها برای SEO مناسب نیستند اما روش‌ها و ترفند‌های خاصی وجود دارد که می‌توانید از آنها برای بهبود SEO برنامه خود استفاده کنید.

    سخنان پایانی

    برنامه‌های تک صفحه‌ای (SPA) بسیار تعاملی و در طراحی منحصربه‌فرد هستند اما محدودیت‌هایی هم در بهینه‌سازی موتور جستجو با خود به همراه دارند. در این مقاله همه مواردی را که ممکن است در هنگام بهینه‌سازی هر برنامه تک صفحه‌ای برای رتبه‌بندی در موتورهای جستجو با آنها مواجه شوید را بررسی کردیم. همچنین برخی تکنیک‌های تخصصی SEO و چگونگی بهترین نحوه SEO در وبسایت‌های SPA را برای شما قرار داده‌ایم. امیدوارم از این به بعد وبسایت SPA خود را بهتر از قبل SEO کرده و رتبه وبسایت‌تان را در موتورهای جستجو افزایش دهید.

    منبع: https://www.cloudways.com/blog/single-page-website-spa-seo

    خدمات رایگان لیارا

    ۲.۵ گیگابایت فضای ذخیره‌سازی ابری رایگان

    ۲.۵ گیگابایت Object Storage سازگار با پروتکل S3 با دیسک‌های SSD به‌صورت رایگان دریافت کنید.

    هاست رایگان برای دیتابیس‌

    دیتابیس‌های MariaDB، PostgreSQL و Redis را فقط با یک کلیک و به‌صورت رایگان تهیه کنید.

    سرویس DNS رایگان

    به سادگی دامنه‌تان را اضافه کنید و به صورت رایگان رکورد‌های آن را مدیریت کنید.

    ۱۰۰ هزار تومان اعتبار اولیه

    بعد از ثبت نام در لیارا مبلغ ۱۰۰ هزار تومان اعتبار هدیه دریافت می‌کنید که با توجه به ساعتی بودن هزینه سرویس‌ها، می‌توانید تمامی خدمات پولی را برای چندین هفته رایگان استفاده کنید.

    ارسال ۱۰۰ ایمیل تراکنشی رایگان در هر ماه

    در سرویس ایمیل لیارا شما می‌توانید تا ۱۰۰ ایمیل رایگان در هر ماه ارسال کنید و فقط برای بیش از آن هزینه پرداخت کنید. (به‌همراه دسترسی SMTP)

    هاست رایگان برای انواع وبسایت

    تفاوتی ندارد برای وبسایت خود از Node استفاده می‌کنید یا Laravel و Django، در لیارا می‌توانید به صورت کاملا رایگان آن را میزبانی کنید.

    توسعه‌دهندگان درباره‌ی ما چه می‌گویند

    تجربه کار باliara_cloud@امروز خیلی خوب بود. یکی از سرویس هام رو منتقل کردم روش و راضیم. انقد سریع و جذاب کارم راه افتادم اصن باورم نمیشد! برعکس سرویس های PaaS دیگه با اون همه پیچیدگیشون. دمتون گرم
    ...

    MohammadReza
    liara testimonial
    keikaavousi

    بعد از بسته شدن @fandoghpaas و ناراحتی همه‌مون از اینکه یه سرویس خوب و صادق نمی‌تونه از پس هزینه‌ها بر بیاد، سرویسم رو منتقل کردم به پاس لیارا (https://liara.ir @liara_cloud) . تجربه راحت و خوب. تفاوت‌هایی داشت که کمی کار می‌خواست ولی تا الان کاملا راضی.

    jadi
    liara testimonial
    jadi

    یه خسته نباشید باید به تصمیمliara_cloud@بگم،
    بعد از چندین روز سرکله زدن با سرویس های مشابه بالاخره تصمیم گرفتم لیارا رو امتحان کنم و باور نمیشه ۱۰ دقیقه بیشتر وقت نبرد،
    دمتون گرم.

    Arch
    liara testimonial
    EbadiDev

    واسه سرویس PaaS با اختلاف لیارا بهترین رابط کاربری داره و یکی از مزیت‌های سرویس دیتابیس‌شون اینه که خودشون به صورت دوره‌ای بکآپ میگیرن.
    ...

    Ali Najafi
    liara testimonial
    me_ali_najafi

    یکی از کارهای خوبی که جدیداً میکنم اینه که یه دیتابیس روی لیارا میسازم و به پروژه وصل میکنم اینطوری هم خونه و هم محل کار دیتابیس بروز رو دارم و راحت میتونم ادامه بدم کار روliara_cloud@

    Navid
    liara testimonial
    1navid

    عاشقliara_cloud@شدم درسته در حد AWS نیست ولی خب تجربه خوبی واسه پروژه های داخل ایران ارائه میده، میتونم رو CD هم اجراش کنم

    Amir H Shekari
    liara testimonial
    vanenshi

    همراه شما هستیم

    در خصوص سفارش یا استفاده از سرویس‌ها سوالی دارید؟
    تلفن واحد فروش:
    ۰۲۵-۳۳۵۵۷۶۱۹ (روزهای کاری ۹ الی ۱۷)
    تلفن واحد فروش: ۳۳۵۵۷۶۱۹-۰۲۵ (روزهای کاری ۹ الی ۱۷)