• آموزش ها (0)
  • مقالات (0)

فصل دهم – ابزار Google Lighthouse ( کد: OL14 )

تولید شده توسط: داریوش ببریان
من داریوش ببریان هستم. نزدیک به 16 سال در زمینه طر...
  • آموزش ها77
  • Following0
  • Follower4

  • مدت زمان آموزش 3 ساعت و 26 دقیقه
  • حجم فایل آموزش 1.5 GB
  • زبان آموزش فارسی
  • تعداد فصل ها 4 فصل
  • سطح آموزش (متوسط)
  • تاریخ بروزرسانی 1398 /08 /19
  • دانلود سیلابس
برای مشاهده لینک دانلود و یا خرید آموزش ابتدا باید ثبت نام نمایید و یا وارد حساب کاربری خود شوید.

توضیحات بیشتر

در این فصل به صورت کامل با ابزار Google Lighthouse جهت تست و آزمایش وب سایت استفاده خواهیم نمود.

برای کسب اطلاعات بیشتر, سیلابس ها را مشاهده فرمایید.

+ بیشتر

لیست فصل ها

زمان آموزش
  • درس اول : (Google Lighthouse (Progressive Web App 1:03:50

     

    سیلابس:

    1. آشنایی با (Progressive Web App (PWA و اهمیت آن در جذب بازدید کنندگان و سئو
    2. بررسی نقش ابزار Google Lighthouse در تشخیص و بهتر کردن PWA
    3. بیان تفاوت های PWA با ریسپانسیو بودن سایت
    4. بررسی و کنترل وب سایت آزمایشی dariush.pro از نگاه PWA
    5. معرفی کامل بخش Page load is fast enough on mobile networks همراه با نکات مهم و ارائه 2 راهکار
    6. معرفی Service Worker در ابزار Chrome Dev Tools
    7. بررسی راهکارهایی که در صورت Offline بودن کاربر, سایت در دسترس باشد
    8. بررسی سایت گوگل و استفاده از دستورالعمل های آن برای راه اندازی Service Worker در سایت
    9. بررسی پشتیبانی مرورگرها از Service Worker و راهکارهای آن
    10. معرفی چند منبع دیگر برای راه اندازی Service Worker در سایت
    11. معرفی کامل بخش کنترل SSL همراه با نکات مهم
    12. معرفی کامل SSL و نقش مهم آن در امنیت و سئو سایت
    13. معرفی یک شرکت ایرانی معتبر برای خریداری گواهی SSL
    14. بررسی مراحل نصب گواهی SSL بر روی سرور و با استفاده از CPanel
    15. بررسی کارهایی که قبل از خرید SSL باید انجام دهیم
    16. کنترل و بررسی SSL خریداری شده توسط یک ابزار آنلاین و کسب اطلاعات بیشتر در رابطه با SSL خریداری شده
    17. نحوه کنترل و بررسی SSL خریداری شده توسط ابزار Chrome Dev Tools و کسب اطلاعات بیشتر در این زمینه
    18. بررسی مشکلات احتمالی در زمان استفاده از SSL و بیان راهکارهای آن برای حل مشکل
    19. تعریف دقیق مشکل Mixed Content در زمان خریداری و نصب SSL و راهکار خروج از مشکل و حل شدن آن
    20. بررسی وب سایت ایرانی که SSL آن مشکل دارد جهت روبرو شدن با این نوع از مشکلات و بررسی دقیق سورس آن جهت رفع مشکل
    21. معرفی کامل بخش Current page does not respond with a 200 when offline و ارتباط آن با Page load is fast enough on mobile networks و Service Worker
    22. معرفی کامل بخش Start_url does not respond with a 200 when offline  و ارتباط آن با Page load is fast enough on mobile networks و Service Worker
    23. معرفی کامل بخش Does not register a service worker that controls page and start_url  و ارتباط آن با Page load is fast enough on mobile networks و Service Worker
    24. معرفی کامل بخش Web app manifest does not meet the installability
    25. کاربرد Manifest و اهمیت آن برای شبه سازی محیط اپلیکیشن برای وب سایت
    26. آشنایی کامل با دستورات Manifest و مراحل راه اندازی آن در سایت
    27. مشاهده نمونه های اجرای Manifest در سایت گوگل
    28. تست و آزمایش وب سایتی که بر روی آن Manifest نصب شده باشد و بررسی قابلیت های آن
    29. معرفی کامل بخش Does not redirect HTTP traffic to HTTPS و نقش فایل htaccess برای حل مشکل
    30. معرفی کامل بخش Is not configured for a custom splash screen و ارتباط آن با بخشی از تنظیمات Manifest
    31. معرفی کامل بخش Does not set an address-bar theme color و ارتباط آن با بخشی از تنظیمات Manifest
    32. معرفی کامل بخش Content is not sized correctly for the viewport و توضیح کامل Meta Viewport
    33. معرفی کامل بخش Contains some content with JavaScript is not available
    34. غیر فعال کردن جاوااسکریپ مرورگر و بررسی سایت درج آگهی برای راستی آزمایی گزینه Contains some content with JavaScript is not available
    35. غیر فعال سازی جاوااسکریپت مرورگر از 2 روش و استفاده از ابزار

     

    در این درس حتما در مورد قابلیت های موبایلی که هیچ ارتباطی هم به ریسپانسیو بودن سایت ندارد به صورت جامع صحبت خواهیم نمود و بخش (Progressive Web App (PWA که در ابزار Google Lighthouse میباشد را به صورت 100% مورد بررسی قرار خواهیم داد.

    یکی از بهترین قابلیت هایی که در این درس یاد خواهید گرفت این خواهد بود که چگونه وب سایت به صورت آنلاین و بدون نیاز به اینترنت میتواند برای کاربران قابل دسترس باشد که امروز با استناد به سایت گوگل به این هدف مهم و خاص خواهیم رسید.

    اگر در مورد manifest و قابلیت اپلیکیشن بودن مطالب دقیق را نمیدانید و یا دوست دارید بدون اینکه اپلیکیشن سایت خود را طراحی کنید و برای آن هزینه کنید, ولی سایت شما قابلیت App بودن را داشته باشد حتما درس امروز را مشاهده نمایید.

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

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

  • درس دوم : (Google Lighthouse (Best Practices 1:08:38

    سیلابس:

    1. معرفی کامل بخش Does not used HTTP/2 for all of its resources  و نقش کلیدی HTTP/2 در سرعت لود و سئو سایت
    2. تعریف دقیق پروتکل HTTP/2
    3. بررسی دلایل ایجاد شدن HTTP/2
    4. مقایسه پروتکل HTPP 1.1 با HTTP/2
    5. قابلیت های برتر HTTP/2
    6. معرفی سازمان (Internet Engineering Task Force (IETF
    7. نمایش 2 مثال از سرعت لود صفحات و تصاویر با استفاده از HTTP/2 و مقایسه آنها
    8. نحوه نصب کردن HTTP/2 بر روی سرور لینوکس و با استفاده از CPanel
    9. بررسی سایت dariush.pro برای پشتیبانی HTTP/2 توسط مرورگرها
    10. معرفی کامل بخش Does not use passive listeners to improve scrolling performance
    11. نمایش 2 ویدئو در سایت Youtube از درک بهتر مشکل پیش آمده در سایت با استفاده از این موضوع
    12. ارائه راهکارهای حل مشکل Scrolling
    13. معرفی کامل بخش Links to cross-origin destinations are unsafe
    14. تعریف Site Isolation و ارائه راهکار برای حل مشکل
    15. معرفی noopener و noreferrer برای حل مشکل
    16. معرفی وب سایت های معتبری که بخش Google Lighthouse از آنها برای کنترل زبان های سایت و مشکلات استفاده میکند
    17. معرفی کامل بخش Includes front-end JavaScript libraries will known security valunerablities
    18. معرفی کامل بخش Avoid Application Cache و استفاده نکردن از این روش قدیمی و از بین رفته برای عملیات caching
    19. معرفی کامل بخش Avoid document.write به عنوان روشی غیر منطقی در نوشتن کدهای جاوااسکریپت
    20. معرفی کامل بخش Avoid requesting the geolocation permission on page load و روش هایی که بیهوده بخواهیم موقعیت جغرافیایی کاربر را بپرسیم
    21. معرفی کامل بخش Page has a HTML doctype
    22. بررسی کار Doctype و معرفی انواع آن
    23. معرفی کامل بخش Detected JavaScript Libraries برای اینکه مستقیما از دستورات جاوا اسکریپت استفاده نکرده اید
    24. معرفی کامل بخش Avoid requesting the notification permission on page load
    25. معرفی کامل بخش Avoid deprecated APIs  و توضیح جایگاه API در طراحی سایت و ارتباط بین سیستم های مختلف
    26. معرفی کامل بخش Allow users to paste into password fields و بیان باورهای غلطی که در این زمینه وجود دارد
    27. مزیت های استفاده از Password Managerها
    28. معرفی کامل بخش No browser errors logged to the console
    29. معرفی کامل بخش Displays images with correct aspect ratio
    30. نکات بسیار مهم در زمینه ابعاد تصاویر و جلوگیری از بروز مشکلات و ایرادات Google Lighthouse

     

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

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

    در بخشی دیگر از درس امروز مشکلات Touch شدن صفحات در موبایل ها و تبلت ها را مورد بررسی قرار خواهیم داد تا بتوانیم جلوی برخی از مشکلات را بگیریم. برای بهتر درک کردن این موضوع , ویدئوهایی هم از سایت Youtube نیز استفاده خواهیم نمود.

    در مورد Doctype و API و بسیاری دیگر از موارد که در بخش Best Practice در ابزار Google Lighthouse اشاره شده است نیز به تفضیل صحبت خواهیم نمود.

  • درس سوم : (Google Lighthouse (Accessibility 32:06

    سیلابس:

    1. تعریف Web Accessibility و اهمیت آن برای کاربران و موتورهای جستجو
    2. معرفی نرم افزارهای صفحه خوان (Screen Reader)
    3. آشنایی کلی با بخش های Accessibility ابزار Google Lighthouse
    4. دسته بندی معلولیت ها
    5. بررسی بخش Web Accessibility سایت W3C
    6. بررسی 2 سایت به لحاظ قابلیت های Web Accessibility که در اختیار کاربرانشان قرار می دهند
    7. بررسی خصوصیت tabindex و کارکرد آن در سایت
    8. معرفی یکی از نرم افزارهای خوب صفحه خوان (Screen Reader) در دنیا و بررسی وب سایت آن
    9. نصب نرم افزار Screen Reader و آشنا شدن با قابلیت های آن
    10. بررسی چند وب سایت با نرم افزار Screen Reader
    11. معرفی Extension داخل مرورگر کروم برای Web Accessibility و قابلیت هایی که در اختیار کاربران قرار میدهد
    12. معرفی یکی از وب سایت های مرجع در زمینه Web Accessibility که شرکت گوگل هم از اطلاعات آن در Google Lighthouse استفاده میکند
    13. آشنایی با خصوصیت arial-* و ارتباط آن با Web Accessibility
    14. آشنایی با تمامی بخش های Google Lighthouse در بخش Web Accessibility
    15. بیان نکات بسیار مهم در Web Accessibility
    16. نقش alt در تصاویر برای Web Accessibility
    17. استفاده درست از Tableها در Web Accessibility
    18. استفاده از تگ های پیشفرض در زبان HTML
    19. بررسی استفاده از زیرنویس ها در فیلم ها و ارتباط آن با Web Accessibility
    20. بررسی استفاده از تگ Title درست در طراحی صفحات وب

     

    امروزه Web Accessibility  نه فقط در حد یک حرف بلکه باید در وب سایت ها و طراحی ها و برنامه نویسی ها نیز لحاظ شود, چرا که برخی از افراد به دلایلی و مشکلات فیزیکی و ناتوانی های جسمی نمیتوانند از صفحات وب سایت بهره خوبی را ببرند.

    بنابراین در درس امروز کاملا در مورد Web Accessibility و نحوه پیاده سازی و رعایت استانداردهای آن و با استناد به وب سایت های مرجع که خود گوگل هم دائما به این وب سایت ها اشاره مینمایند نیز صحبت خواهیم نمود.

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

    بنابراین منتظر مطرح شدن مواردی باشید که شاید تا به الان در حد یک صحبت و نه یک کار عملی شنیده بوده باشید.

  • درس چهارم : (Google Lighthouse (SEO 32:11

    سیلابس:

    1. نگاه کلی به تمامی آیتم هایی که در بخش SEO ابزار Google Lighthouse وجود دارد
    2. اشاره به برخی از آیتم هایی که در فصل های قبلی در مورد آنها کامل صحبت نموده بودیم
    3. معرفی کامل بخش Links have descriptive text  همراه با توضیحات و بیان نکات مهم در این زمینه
    4. معرفی کامل بخش Document has a valid hreflang  همراه با توضیحات و بیان نکات مهم در این زمینه
    5. بررسی چند زبانه بودن سایت و استفاده درست از تگ link در این زمینه
    6. معرفی کامل بخش Document uses legible font sizes  همراه با توضیحات و بیان نکات مهم در این زمینه
    7. معرفی کامل بخش Document avoids plugins  همراه با توضیحات و بیان نکات مهم در زمینه نرم افزار فلش

     

    درس امروز آخرین بخش از قابلیت Google Lighhouse به نام SEO میباشد که این کلمه چنانچه تمامی فصل ها را به صورت مرتب مشاهده نموده باشید آشنا است.

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

    بنابراین منتظر یادگرفتن موارد جدید در SEO باشید که این درس را بهترین بهانه برای یاد گرفتن این مطالب میدانیم.

سوالات متداول ( 7 ) سوال مطرح شده
  • ابزار Google Lighthouse چیست؟

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

  • آیا یادگیری این ابزار ضرورتی دارد؟

    مطمئنا بله. به دلیل اینکه هم برای گوگل است و مطمئنا این شرکت در آینده برای این ابزار برنامه های خوبی خواهد داشت و احتمالا با ابزارهای دیگر خود مانند Google Search Console مرتبط خواهد نمود و هم اطلاعاتی از سایت در اختیار شما قرار میدهد که به جرات میتوان گفت هیچ ابزار دیگری تا به الان این کار را نتوانسته انجام دهد

  • آیا در دوره های آموزشی سئو سایت الگوها کاملا این ابزار مورد بررسی قرار گرفته است؟

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

  • آیا خود گوگل به استفاده از این ابزار تاکید کرده است؟

    خود گوگل به صورت مستقیما نگفته است که اگر از این ابزار استفاده نکنید در سئوی سایت شما تاثیر منفی خواهد گذاشت بلکه شما خودتان اگر سری به بخش های تکنیکی و فنی سایت گوگل و همچنین منابع معتبر در دنیا بزنید متوجه خواهید شد که این ابزار جایگاه بسیار ویژه ای در بین webmasterها دارد

  • آیا ابزار Google Lighthouse برای طراحان سایت و برنامه نویس ها هم مورد استفاده قرار میگیرد؟

    مطمئنا بله. هم در بخش تست و آزمایش وب سایت طراحان و برنامه نویسان میتوانند از آن استفاده نمایند و هم از بخش های دیگر آن مانند Web Accessibility و گرفتن SSL برای سایت و نحوه لود شدن محتویات وب سایت و بسیاری دیگر از بخش ها. حتی مدیریت جاوااسکریپت ها هم میتواند یکی از بخش های هیجان انگیز ابزار Google Lighthouse باشد

  • آیا درس های این فصل به صورت جداگانه قابل تهیه میباشد؟

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

  • چگونه میتوانم این آموزش را تهیه کنم؟

    شما میتوانید در کسری از ثانیه با شماره موبایل خود در سایت الگوها ثبت نام نمایید و هر آموزشی که مد نظرتان بود را تهیه نمایید

ثبت نظر ( 2 ) نظر ثبت شده
برای ثبت نظر ابتدا وارد حساب کاربری خود شوید و یا ثبت نام نمایید...
  • 1398/08/08
    reza

    تو این آموزش به طور عملی رفع مشکل های که گذارش میده را نشون میدهید؟

    • 1398/08/11
      مدیر سایت

      بله حتما، یکی از دلایلی که این آموزش تهیه شده است توضیحات کامل مشکلات به وجود آمده برای وب سایت ها در پنل Google Search Console می باشد

  • 1398/08/22
    علی اکبر رستمی یازینا

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

    • 1398/08/22
      مدیر سایت

      خوشحالیم که راضی هستید جناب رستمی

من داریوش ببریان هستم. نزدیک به 16 سال در زمینه طراحی و برنامه نویسی و سئو وب سایت در حال فعالیت میباشم و 14 سال هم در زمینه تدرس دروس مختلف اشاره شده مشغول به تدریس...
  • آموزش ها77
  • Following0
  • Follower4