نشانه گذاری دوستانه جستجوگرها با HTML5 ، CSS3 و Javascript

thumbnail

جلسه اول در سریال های سه قسمتی اولیه ما SEO برای توسعه دهندگان: با Land Engine Land زندگی کنید ما شروع به پوشش سئو فنی و برقراری ارتباط بین متخصصین و توسعه دهندگان کردیم. برای یک مکالمه کاملاً دور ، میزبان سخنرانان با دیدگاه هایی از طرف طرف تمرین کارها و همچنین اثربخشی عملی با SEO In-House به عنوان بخشی از یک تیم سازمانی بودیم. میهمانان ما:

  • کیتی میورین از دانشگاه جنوبی نیوهمپشایر جنوبی
  • آنتونی مولر از ZenSEM

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

جلسه در بخش دوم با تمرکز بر JavaScript بنیادی کامل با مثال های کد برای React و Vue ادامه یافت تا بتوانید شروع کار خود را با آن پروژه ها آغاز کنید. بیاموزید که برخی از مشکلات نمایه سازی را با این کتابخانه های محبوب JavaScript (چارچوب) حل کنید و نکاتی را که برای الزامات لازم برای اجرای SEO در پروژه های جاوا اسکریپت به طور مشابه داربست یا بویلر پیدا می کنید ، پیدا کنید.

برقراری ارتباط نیازهای فنی SEO به توسعه دهندگان

بسته به وضعیت شما ، برقراری ارتباط سئو با توسعه دهندگان می تواند از احساس این باشد که همیشه بر روی پوسته های تخم مرغ راه می روید و بسیار مراقب باشید که به سمت نفس و قلمرو خود خز نشوید ، به حالت افراطی دیگری که در آن شما ناامیدی محض را تجربه می کنید ، هرچند اهمیت یک استرس را تأکید می کنید. به نظر می رسد که ناخواسته تغییر کنید ، مثل اینکه انگار فریاد می زنید ، ناامید به نظر می رسد.

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

آنتونی و کیتی داستانهای مختلفی را درباره اینكه چگونه ، با شروع دیدگاه تند ، توانستند در نهایت با همکاری با توسعه دهندگان موفق شوند یا به هر حال موفق می شوند ، به اشتراک بگذارند. می توانید بفهمید که هر دو با استفاده از همه چیز از کیک خانگی و بطری ودکا همه متوقف شده اند. اگرچه اینها معمولاً به عنوان تاکتیکهای مفید ذکر شده اند ، اما در عمل این ایده ها برای آنها مؤثر نیست.

تغییرات عمده سایت

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

من یک کارآزمایی پزشکی قانونی انجام دادم و مشکلات فنی پیدا کردم. طرح اصلی مانند این بود: “چگونه می دانیم كه این چیز دیگری نیست؟” پاسخ این است ، شما واقعاً نمی دانید. شما فقط یک غریزه روده و تجربه زیادی دارید تا بتوانید از آن طریق سعی کنید و آن را راهنمایی کنید. ما تغییرات را درست کردیم و درست قبل از شلوغ ترین زمان سال ، شاهد 40 امتیاز در صعود به صعود با میلیون ها درآمد اضافی بودیم. جنرال موتورز گفته بود: “من ترسیده ام. می دانید ، این عالی است. ” در آن مرحله ، سرب توسعه تصمیم گرفت تا دوباره به سیستم React بپردازد.

آنتونی مولر

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

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

مشکلات انتخاب فناوری همیشه مسائل مربوط به توسعه دهنده نیست. در فیلم سوم ما ، مارتین اسپلیت از توسعه یک برنامه بانکی با Angular صحبت کرد. زاویه ای ، متأسفانه ، پس از آن تبدیل به فناوری مسح شده ای شد که برای همه چیز استفاده می کند. این یک اشتباه از رهبری بود که فرض کنیم انتخاب یکپارچه فناوری در یک حوزه از تجارت یک شرط مطمئن در همه جای دیگر است.

مطالب مرتبط  کنسول جستجوی Google پشتیبانی از داده های ساختار یافته مجوز تصویر را اضافه می کند

کارها هرگز به این آسانی نیست.

مشکل با React این است …

ReactJS یک سازنده فوق العاده کاربر-رابط (UI) فوق العاده برای ظاهر است. سردرگمی وقتی ایجاد می شود که توسعه دهندگان بخواهند مفهوم یک صفحه وب را به یک UI ساده کنند وقتی این تنها نباشد. یک صفحه وب به روشهایی که نیازی به رابط کاربری ندارد ، با جاوا اسکریپت تعامل دارد. استفاده از React در شرایط خاص منجر به مهندسی بیش از حد خواهد شد با این نتیجه ما سابقه وب سایت های برنامه یک صفحه (SPA) را داریم که به طور معمول رتبه خوبی ندارند.

از این گذشته ، فن آوری زیربنایی قدرت بخش React برای وب سایت های استاتیک مناسب نیست ، حتی اگر مطمئناً می تواند برای آنها استفاده شود. به عنوان مثال ، گتسبی ، یک ژنراتور سایت استاتیک (SSG) وجود دارد که روی React و قراردادهای آن ساخته شده است. باور کنید یا نه jQuery ساده و خسته کننده ساده هنوز هم انتخاب بسیار مناسب تری برای اکثر سایت های استاتیک نسبت به گاتسبی است.

React قطعاً یک نوآوری مهم است. وقتی به عناصر صفحه واکنشی به عنوان بخشی از عملکرد سایت نیاز دارید ، به عبارت دیگر عناصری که هنگام تغییر داده های جهانی یا کاربر خاص تغییر می کنند ، این زمانی است که React به انتخاب عالی تبدیل می شود! شما از مزایای تغییر پارادایم از jQuery به یک کتابخانه واکنشی مبتنی بر مؤلفه برای ایجاد تعامل برش استفاده می کنید. به عنوان مثال: اگر می خواهید چت خود را بچرخانید ، به React نگاه کنید.

توسعه دهندگان فقط در مواردی که جی کوئری یا وانیلا جاوا اسکریپت همان چیزی است که در واقع خواستار آن هستند ، باید از استفاده از React خودداری کنند. مشکل در آنجا نهفته است ، زیرا آنها مایل نیستند از بزرگترین نوآوری کتابخانه سمت مشتری پس از جی کوئری استفاده کنند. همه آنها می خواهند دانش خود را از آخرین بزرگترین چیز برای اشتغالزایی تیز کنند. شغل های باز زیادی برای برنامه نویسان React وجود دارد. ما می خواهیم نحوه درست تنظیم کردن را بیاموزیم.

ارائه سمت سرور

یک راه حل جزئی برای این مشکل ، معروف به سرور Side Rendering (SSR) ، احتمالاً به بهترین شکل بعنوان “هک” نصب شده پس از بازخوردی که بخاطر بازخوانی این کتابخانه ها مناسب موتور جستجو نبوده است ، توصیف شده است. راس توصیف می کند که React چگونه تمایل دارد داربست یا دیگ بخار را که به طور پیش فرض به Client-Side Rendering (CSR) ارائه می شود ترویج کند. او به ما نشان می دهد که چگونه با React و Vue خود را برای سئو راه اندازی کنید.

یادداشتی درباره Evergreen Chromium

Chromium همیشه سبز ، Googlebot را با جدیدترین نسخه Chrome به روز می کند. اکنون Google می تواند محتوای CSR را به راحتی دریافت کند ، اما مطمئناً گلوله نقره ای ندارد. ممکن است توسعه دهندگان فکر کنند این بدان معنی است که SSR غیر ضروری است ، اما برای Googlebot محتوای مهم شما فوراً در دسترس نیست و ممکن است بدون انجام اقدامات دقیق برای اطمینان از وجود این اصلاً در دسترس نباشد.

مطمئناً برای SEO نیز ایده آل نیست. حتی وقتی ممکن است نسبت به گذشته کمی بهتر از Google کرایه کنید ، باید خزنده های رسانه های اجتماعی را در نظر بگیرید. بینگ به Evergreen Chromium تغییر یافت ، اما فیسبوک و توییتر هنوز این کار را نکرده اند و چه کسی می داند آیا آنها همیشه این کار را می کنند؟

در مورد عملیاتی کردن سئو چطور؟

کیتی که از درون یک سازمان کار می کند و با یک تیم قابل توجه توسعه ، کیتی دریافت که پرونده سازی در پروسه بلیط فروشی به اندازه کافی سریع برای تغییر SEO فنی کار نمی کند. علاوه بر این ، هیچ راهی برای او وجود ندارد تا اهمیت نسبی درخواست های سئو خود را نسبت به سایر مواردی که تیم توسعه روی آن کار می کرده ، ارزیابی کند.

پس از حضور در پیام اصلی بازاریابی جستجو (SMX) غربی با جسیکا بومان (جستجوگر در خانه) ، کیتی الهام گرفت تا رویکرد دیگری را امتحان کند.

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

کیتی مورین

کیتی هم تیمی های توسعه دهنده خود را به محتوای جلسه SMX بیشتر منتقل کرد ، جایی که پس از بازگشت به محل کار ، آنها شروع به پرسیدن سؤالات وی در مورد چگونگی تغییراتی که فکر می کردند ممکن است بر سئوی وب سایت تأثیر بگذارد. این همان موفقیت بزرگی بود که وی برای رفتن به بیرون در یک سیلوی جداگانه به کار در داخل با تیم توسعه نیاز داشت.

مطالب مرتبط  SMX در دسامبر سال 2020 به شما می آید: بخشی از آن باشید!

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

توسعه دهندگان او با آنها در مورد استفاده از ابزارهای جستجوگرها آموخت و استفاده از برخی از آنها را مستقیماً در گردش کار خود شروع کرد. آنها شروع به آزمایش نسخه های شعبه توسعه با استفاده از ابزارهای خط فرمان SEO کردند تا اطمینان حاصل کنند که با لایت هاوس و اکنون وب ویتال ها نمرات خوبی را تحقق بخشید. هرگونه اختلاف نظر درباره اطلاعات سؤال برطرف می شود زیرا معمولاً فقط اسناد تیمی به کلام کمک می کند تا به شفاف سازی کمک کند.

از طریق این تجربیات بود که کیتی توانست تیم اولویت بندی SEO فنی خود را با تیم توسعه که اعضای آن واقعاً درک کردند از دانستن ارزش تأثیر تجارت در کاری که انجام می دادند ، قدردانی کنند. این یک تغییر بزرگ تغییر در دریایی بود از عدم آگاهی از اینکه آیا بلیط های فنی فنی او در بالای صفحه رمز و راز وظایف کاری به توسعه دهندگان که به سئو علاقه دارند ، هر اندازه که ممکن است جزئیات طراحی را در اولویت قرار دهند ، اولویت داشتند.

ارائه سمت سرور (SSR)

بنابراین ، چه اتفاقی برای مشتری آنتونی افتاده است که قبل از انتشار نسخه Chromium همیشه سبز Googlebot به React تغییر داده اند؟ فقط تصور کنید که 80٪ از درآمد به دلار به دلار به رده بندی های نفتکش وصل شده است. آنتونی سعی کرد همه چیز را قانع کننده باشد ، از جمله آوردن یک توسعه دهنده خارجی برای پیاده سازی SSR.

برای برآورده کردن الزامات سئو ، شما به استراتژی های SSR نیاز دارید که کد ارسال شده را با محتوای خارج شده و بهینه شده ارسال کند ، یا رتبه بندی شما نشانگر ارزش صفحات وب سایت شما نخواهد بود.

توسعه دهنده سرب (به درستی) از شنیدن توصیه ای برای پیاده سازی SSR ناامید شد و در وهله اول تمام مزیت عملی استفاده از یک کتابخانه واکنش پذیر را نفی کرد. ناموجه ترجیح فن آوری برای React با یک سایت ثابت به طور ناگهانی یک مانع تکنولوژیکی بود که شروع به تعقیب آنها به عنوان بدهی فنی که نمی خواستند بدهی کنند.

توسعه دهنده اصلی اصرار داشت که توضیحات بدیل را برای آنچه اتفاق افتاده ارائه دهد و به یک دلیل غیر قابل توضیح کاملاً در برابر توصیه به انتقال به SSR مقاومت کرد. در این زمان ، Google ابتکار عمل Chromium Evergreen را آغاز کرد و نمایه سازی جدید Googlebot منجر به بالابردن 7٪ ترافیک شد که به توسعه دهنده این امکان را می دهد تا اجتناب ناپذیر را به تأخیر بیندازد.

برای بازپرداخت درآمدهای از دست رفته کافی نبود و در نهایت به طور فزاینده ای روشن شد React انتخاب بد فناوری برای ایجاد وب سایت استاتیک بود. سرانجام توصیه SSR آنتونی عملی شد و تصور کنید چه اتفاقی افتاده است که 60٪ ترافیک جستجو به سرعت افزایش یابد. تصور کنید که اختلاف درآمد حاصل نشده برای مدت زمان صرف شده از چنین مسئله اساسی و واضحی برای ارائه صرف شده است.

JavaScript SEO برای React و Vue

توسعه دهندگان برای اجرای SSR برای SEO با این کتابخانه محبوب JavaScript (چارچوب ها) باید با مهارت و نگرش کافی انعطاف پذیر باشند. راس یک شیرجه مقدماتی عالی در اختیار ما قرار داد تا بتوانیم با React و Vue همراه با راهنمایی های سریع در مورد چگونگی استفاده از سئو ضروری برای دستیابی به آن ، در مورد آن جستجو کنیم. ما قبل از انتقال به scrap کردن با اسکریپت کردن با Puppeteer ، آن را با تمام جزئیات موجود در قسمت بعدی خود پوشش خواهیم داد.

نکات توسعه بیشتر برای SEO

  • ستون جستجوگرها برای توسعه دهندگان
  • چگونه SEO می تواند داشبورد ورود به سیستم سرور رایگان ایجاد کند تا ترافیک ورودی به وب سایت شما را بهتر بشناسد
  • راهنمای اصلی ویتامین های اصلی برای SEO و توسعه دهندگان
  • SEO و توسعه دهندگان: چرا آنها در کنار هم بهتر هستند [Video]

The post نشانه گذاری دوستانه Power SEO با HTML5 ، CSS3 و Javascript برای اولین بار در موتور موتور جستجو ظاهر شد.

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

Back To Top