طراحی سایت ، سئو سایت ، طراحی سایت فروشگاهی
طراحی سایت ، سئو سایت ، طراحی سایت فروشگاهیطراحی سایت ، سئو سایت ، طراحی سایت فروشگاهی
طراحی سایت ، سئو سایت ، طراحی سایت فروشگاهیچگونه سرعت سایت وردپرس را افزایش دهیم
چگونه سرعت سایت وردپرس را افزایش دهیم
آموزش افزایش سرعت سایت وردپرس ۲۰۱۸
یکی از سوالات بسیاری که از من پرسیده میشه این است که چطور سرعت سایت وردپرس را افزایش دهیم؟ یا می‌پرسن نحوه افزایش سرعت سایت وردپرس در gtmetrix چطور هست، یا چگونه به شکل اصولی سرعت سایت وردپرس را بالا ببریم و همچنین آن را حفظ کنیم؟ درحالی که وردپرس یک سیستم مدیریت محتوای شگفت انگیز است، ولی اگر اصول بهینه سازی و افزایش سرعت وردپرس رعایت نشود ، وب سایتی که با این سیستم مدیریت محتوا می‌سازید، کمی آهسته بارگیری می‌شود و این کاهش سرعت باعث کاهش رتبه سئو سایت شما در گوگل می‌شود، به عبارتی باعث افت سئو سایت شما می گردد.
در این مقاله ما به شما می‌آموزیم که چگونه و چطور وب سایت وردپرسی خود را بهینه سازی کنید و به روش های اسرارآمیز سرعت پی ببرید تا جایی که سرعت وردپرس شما به حداکثر برسد. بیشتر وب سایت‌های تجاری جهان به سیستم مدیریت محتوای وردپرس اعتماد کرده‌اند و آن را برای طراحی وب سایت خود استفاده می‌کنند. در سال ۲۰۱۷ بیشتر از ۷۴ میلیون وب سایت از سیستم مدیریت محتوای وردپرس استفاده می‌کنند.
مقاله را دنبال کنید تا وب سایت پر سرعت وردپرس خود را داشته باشید. مطمئن باشید که با اینکارتان بر روی تجربه کاربری وب سایتتان تاثیر به شدت مثبتی خواهید گذاشت و همچنین توجه داشته باشید که افزایش سرعت وردپرس تاثیری مستقیم بر روی سئو داخلی سایت شما نیز دارد پس در سرعت بخشیدن به وردپرس جدی باشید. و همینطور در نظر بگیرید که این آموزش تاثیر مستقیمی بر روی بهبود سرعت وردپرس شما در سایت GTmetrix.com دارد.
استفاده از قالب بهینه
در پشت هر طراحی سایت (طراحی سایت شرکتی، طراحی سایت فروشگاهی) وردپرسی یک پوسته یا فریمورک قرار دارد که ممکن است بهینه و استوار نباشد. در کدنویسی‌ها هرکس روش خاص خود را پیش می‌گیرد و اگر یک توسعه دهنده نیستید پیشنهاد می‌شود که از یک پوسته استوار و بهینه شده استفاده کنید. در حال حاضر پوسته‌های ساده‌ای مثل پوسته ۲۰۱۷ وردپرس یکی از بهترین پیشنهاد ها برای شما می‌باشد زیرا علاوه بر سادگی بسیار سبک نیز می‌باشد.
همچنین توجه کنید که شما میتوانید پوسته‌های معتبر را از فروشگاه‌های معتبر نیز خریداری کنید. فقط توجه داشته باشید ، با اینکه پوسته‌های بسیار زیادی در سراسر وب برای شما موجود است ، بعضی از توسعه دهندگان از اعتماد فروشگاه‌ها سوء استفاده می‌کنند و با اضافه کردن چند امکان به یک پوسته ساده در آمد بالایی از فروش چنین پوسته‌هایی کسب می‌کنند. به هر حال پیشنهاد ما برای خرید قالب وردپرس، فروشگاه‌های فارسی زبان نیست، و همینطور نمی‌توان براساس دمو پوسته سرعت سایت آن را ارزیابی کرد.
استفاده از کش
فعال سازی کش در سایت یک فاکتور بسیار مهم دیگر در افزایش سرعت وب سایت وردپرسی می‌باشد. کش‌ها فایل‌های استاتیک ساخته شده از صفحات و مقالات شما هستند که در مرورگر کاربران ذخیره می‌شوند و باعث کاهش زمان لود وب سایت در دفعات بعدی ورود کاربران می‌شوند. شما میتوانید توسط افزونه‌های کش وردپرس ، کش مرورگر و کش توسط سرور این کار را انجام دهید.
پیشنهاد میکنیم حتما مقاله جامع رفع مشکل leverage browser caching را بخوانید تا بهتر درباره کش و نحوه فعال سازی آن اطلاع داشته باشید، ولی به هر حال ما به شکل خلاصه برای سئو سایت وردپرس به کمک افزونه و یا کد در ادامه مقاله راه‌کاری ارائه میدهیم.
افزونه‌های کش وردپرس
در اینجا ما چند نمونه از افزونه‌های رایگان و تجاری وردپرس را در زمینه کش به شما معرفی میکنیم :
کش توسط مرورگر – اضافه کردن Expire Headers به وردپرس
بیشتر وب سایت‌ها از غیرفعال بودن Leverage Browser Caching در سرور وب سایت خود ناراضی هستند ، با اضافه کردن قطعه کد زیر در فایل htaccess میتوانید کش مرورگر را برای وب سایتتان فعالسازی کنید. این بخش در بعضی از افزونه‌های معرفی شده در بالا نیز موجود است.
کد:
کش سرور
در کنار افزونه‌های وردپرس و کش توسط مرورگر ، سرورها نیز می‌توانند از تنظیمات کش استفاده کنند. برای مثال Varnish cache یکی از قدرتمند‌ترین انتخاب ها با ترکیب یک CDN می‌باشد.
استفاده از Prefetch در دامنه‌های معروفی که کاربران استفاده میکند
در این متد شما برای لود بخشی از قسمت‌های وب سایتتان مانند فایل‌های js معروف که کاربر در بیشتر وبسایت ها مشاهده میکند ، یک تنظیمات در DNS وب سایت ایجاد می‌کنید که هنگام ورود به وب سایت این بخش از وب سایت خیلی سریع‌تر لود شود.
برای استفاده از Prefetch در وردپرس ، شما باید در سربرگ Header.php یک نمونه Syntax در بین تگهای <head> و <head/> اضافه کنید. برای مثال به نمونه‌های زیر توجه کنید :
استفاده از تکنیک Prefetch در فونت‌های گوگل:
استفاده از تکنیک Prefetch در فایل‌های اسکریپتی گوگل (JQuery) :
حذف رشته‌های کوئری از منابع استاتیک (Riove Query Strings from Static Resources) :
حذف رشته‌های کوئری از منابع استاتیک وب سایتتان از هر لحاظ برای وب سایت مفید است، زیرا با حذف این رشته‌ها از احتمال ایجاد مشکلات در وب سایت جلوگیری می‌کنید.
1 – فایل functions.php را باز کنید و کدهای زیر را درون آن قرار دهید :
3 – همچنین شما میتوانید افزونه‌هایی مانند Query Strings Riover و Riove Query Strings From Static Resources در وردپرس خود نصب کنید.
اگر از یک CDN استفاده می‌کنید ، ممکن است که CDN شما امکانی برای حذف کوئری‌ها داشته باشد
استفاده از شبکه تحویل محتوا یا CDN
به هر حال اصلا مهم نیست که وب سایت وردپرسی شما در حال حاضر چقدر سنگین است و چقدر در حال حاضر ترافیک مصرف میکند ، زیرا با سرویس CDN همه این مشکلات حل می‌شود. یک سرویس CDN تمامی فایل‌های JS ، CSS و تصاویر شما را از سرورهای ابری خود در سراسر جهان به اشتراک کاربران می‌گذارد تا کاربران احساس داشتن سرعتی فوق العاده را داشته باشند و زمان دانلود فایل‌ها کاهش یابد.
علاوه بر این با اتصال یک CDN به وب سایت و افزایش سرعت ، به نرخ تبدیل وب سایت شما نیز افزونه خواهد شد و همچنین Bounce Rate شما کاهش خواهد یافت. (شاید بپرسید Bounce Rate چه چیزی هست؟ در مقاله bounce rate چیست به مطالب جذابی پرداختیم حتما مطالعه کنید)
لود تمامی فایل‌ها از CDN
مطمئن شوید که حتی کوچکترین فایل‌های وب سایتتان مانند Favicon ها نیز در CDN قرار بگیرند. اگر تمامی اطلاعات وب سایتتان از یک کانکشن CDN لود شوند سرعت وب سایت شما چند برابر خواهد شد.
برای اینکه favicon را در وردپرس از CDN فراخوانی کنید نیز در فایل header.php کد زیر را نسبت به وب سایت خود تغییر و از CDN لود کنید.
برای مثال در زیر مشاهده می‌کنید که کلیه اطلاعات وب سایت از CDN فراخوانی می شود :
بهینه سازی پایگاه داده وردپرس
اگر پایگاه داده وردپرس را بهینه سازی نکنید ، اندک اندک به مرور زمان وردپرس شروع به کند شدن میکند. راه‌های مختلفی برای نگهداری پایگاه داده به صورت بهینه موجود است که به شما در محدود سازی نسخه‌های پست و حتی غیرفعالسازی آنها کمک میکند.
غیرفعالسازی و یا محدودیت سازی تعداد رونوشت‌های وردپرس
برای رفع این مشکل در ادامه با من همراه باشید.
غیرفعالسازی رونوشت‌ها
برای غیرفعالسازی رونوشت‌ها شما می‌بایست که قطعه کد زیر را در فایل wp-config.php قرار دهید. اینکار باعث می‌شود که ذخیره سازی خودکار از ۶۰ ثانیه به ۵ دقیقه تغییر کند و همچنین به صورت کامل رونوشت‌ها را غیرفعال میکند.
علاوه بر این یک افزونه فوق‌العاده ساده و سبک نیز در این خصوص وجود دارد که میتوانید از آن در وب سایتتان استفاده کنید. نام این افزونه Disable Post Revision است و دقیقا همین‌کاری را که در این مقاله به شما گفته‌ایم را انجام می‌دهد.
محدودسازی رونوشت‌ها
برای محدود سازی رونوشت ها شما باید نمونه کد زیر را در wp-config.php قرار دهید . این کار باعث می‌شود که ذخیره‌سازی خودکار وردپرس به صورت ۵ دقیقه یکبار باشد و حداکثر تعداد رونوشت‌ها به ۳ برسد. همچنین شما میتوانید با تغییر عدد ۳ ، تعداد رونوشت‌ها را کم یا زیاد کنید.
پاکسازی رونوشت‌های قدیمی از پایگاه‌داده
بعد از انجام عملیات محدودسازی یا غیرفعالسازی رونوشت‌ها حالا وقت آن است که رونوشت‌های قدیمی را پاکسازی کنید. برای انجام اینکار پیشنهاد میکنم که حتما از افزونه فوق‌العاده و همچنین رایگان Wp-Optimize استفاده کنید.
با این افزونه شما میتوانید تمامی رونوشت‌های مقالات وب سایتتان را پاک کنید، تمامی مقالاتی که به صورت خودکار پیش‌نویس شده‌اند را پاک کنید ، تمامی نظرات هرزنامه و تایید نشده را پاک کنید و همچنین در نسخه‌های جدید این افزونه میتوانید تمامی عملیات بهینه‌سازی پایگاه داده را به صورت خودکار انجام دهید. قبل از اعمال تغییرات در پایگاه داده بک آپ گرفتن فراموش نشود.
رهایی از محدودیت ۱۰۰ صفحه وردپرس
به طور کلی وب سایت‌های وردپرسی از نظر صفحات بسیار حساس هستند و وبسایتی با بیشتر از ۱۰۰ صفحه را اصلا قابل قبول نمی‌دانند. اگر وب سایت شما از ۱۰۰ صفحه بیشتر شود، شما احساس مصرف بالای رم و همچنین کاهش سرعت در Backend وب سایت خود را احساس خواهید کرد. توجه داشته باشید که این مشکلات در Front end وب سایت وردپرسی شما احساس نخواهد شد و هیچ تاثیری در این بخش ندارد. حتی خود شرکت اتوماتیک نیز در این رابطه اطلاعاتی را در بخش مستندات خود ذکر کرده است.
با توجه به اینکه وردپرس برای وب‌سایت‌های برمبنای محتوا طراحی شده است ولی برخی‌ها نیز به دلیل راحتی این سیستم مدیریت محتوا را در موضوعات مختلف مانند وب سایت‌های شرکتی استفاده می‌کنند که این وب سایت‌ها نیازمند چندین صفحه مختلف می‌باشد و با اضافه شدن صفحات و ایجاد مشکلات در Back End در مدیریت وب سایتشان به مشکل می‌خورند. برای چنین وب‌‌سایت‌هایی پیشنهاد می‌شود که به ساخت چندین صفحه مختلف با یک شکل ، Post Type های مختلف خود را تهیه کنند. همچنین شما میتوانید از افزونه Post Type Switcher برای تبدیل صفحات خود به یک نوع Custom Post Type استفاده کنید و صفحات خود را به مقاله تبدیل کنید و مشکل کندی در Back End را برطرف کنید.
بهینه سازی تصاویر وردپرس
بهینه سازی تصاویر و کاهش حجم آنها یک موضوع کاملا پیچیده است که نیازمند بررسی به صورت کاملا دقیق دارد. هرچه حجم تصاویر استفاده شده در یک صفحه کمتر باشد، آن صفحه نیز سریع تر لود می‌شود.
فشرده سازی Gzip را در وب سایتتان فعال کنید
یکی دیگر از مهم‌ترین بخش‌های بهینه‌سازی وب سایت وردپرسی ، فشرده سازی Gzip می‌باشد که فعالسازی آن باعث کاهش حجم صفحه وب ، فایل‌های CSS و جاوا اسکریپت می‌شود . با فعال سازی Gzip شما از ۵۰ تا ۸۰ درصد در پهنای باند وبسایتتان صرفه جویی خواهید کرد. البته قبلا هم درباره تابع Gzip در پست رفع مشکل Enable gzip compression به شکل مفصل صحبت کرده‌ایم.
آپاچی
برای فعالسازی GZIP در آپاچی قطعه کد زیر را در فایل .htaccess قرار دهید.
انجنیکس :
برای فعالسازی GZIP در وب سرور NGINX قطعه کد زیر را در nginx.conf قرار دهید .
کاهش تعداد افزونه ها در وردپرس
یکی از دلایل رایج کاهش سرعت وب سایت‌ها ، داشتن بیش از حد پلاگین‌های درحال اجرا بر روی وردپرس می‌باشد. تا جای ممکن سعی کنید که از حداقل تعداد پلاگین فعال استفاده کنید. قبل از اینکه شروع به غیرفعالسازی و پاکسازی افزونه‌ها کنید بهتر است که آنها را آنالیز کنید و ببینید که کدام یک از افزونه‌ها باعث کاهش سرعت لود وب سایتتان می‌شوند.
پس از بررسی حالا وقت آن است که ببینید میتوانید مشکل آنها رفع کنید یا خیر. اگر نتوانستید مشکل را حل کنید سپس آنها را غیرفعال یا پاک کنید.
افزونه P3
افزونه P3 یک افزونه رایگان و توسعه داده شده توسط GoDaddy می‌باشد که به شما در حل مشکل کاهش سرعت وب سایتتان کمک میکند. با این افزونه میتوانید :
- زمان اجرای هر افزونه را بدست آورید
- تمامی افزونه‌های فعال و زمان لود هرکدام را بدست آورید.
- چه افزونه‌ای باعث کاهش سرعت وب سایتتان می‌شود.
- تعداد کوئری‌های موجود در MySQL
- ایجاد جداولی از نتایج اسکن
نکته : این افزونه در حال حاضر با PHP نسخه ۷ سازگار نیست.
افزونه WP Performance Profiler
افزونه WP Performance Profiler ، یک افزونه ارزان قیمت است که دقیقا امکاناتی مشابه افزونه رایگان P3 را به شما ارائه میکند. اما اگر کارهایی کمی پیشرفته تر از P3 را بخواهید پیشنهاد می‌شود که این افزونه را تهیه کنید.
همچنین در نظر داشته باشید، با این افزونه‌ها شما میتوانید بعضی از مشکلات را متوجه شوید ولی در بعضی اوقات شما راهی جز حذف افزونه ندارید.
بهینه سازی عملکرد فونت‌های وب
در مطالعات اخیری که در زمینه عملکرد وب فونتها انجام شده است حدود ۵۷ درصد از وب سایت ها از فونت‌های شخصی سازی شده استفاده می‌کنند ، که تعداد این وب سایت‌ها از سال ۲۰۱۱ تا الان حدود ۸۵۰ ٪ افزایش پیدا کرده است.
متخصصین سئو بر این عقیده‌اند که وبمستران می‌بایست تنها فرمت‌های مورد نیاز خود را در وب سایت لود کنند . مثلا WOFF و WOFF2 از این فرمت‌ها هستند. سرویس‌هایی مانند Typekit به علت انکودینگ base64 باعث افزایش زمان دانلود و همچنین کاهش سرعت وب سایت شما می‌شوند، البته نه در ایران. (به دلایل تحریم
افزایش سرعت سایت
افزونه وردپرس
طراحی سایت
طراحی سایت شرکتی
طراحی سایت فروشگاهی
ساخت سایت
سئو سایت
قیمت طراحی سایت
مقاله جامع نحوه بهینه سازی تصاویر برای افزایش سرعت سایت
مقاله جامع نحوه بهینه سازی تصاویر برای افزایش سرعت سایت
سرفصل‌های پست
- 1 نحوه بهینه سازی تصاویر برای افزایش سرعت وب سایت
- 2 مزایای قالب بندی تصاویر
- 3 نحوه بهینه سازی تصاویر برای وب و عملکرد بهتر وب سایت
- 3.1 انتخاب فرمت فایل تصویری صحیح
- 3.2 کیفیت و سایز فشرده سازی
- 3.3 متد بهینه سازی lossy و lossless
- 3.4 ابزارها و نرم افزار‌های بهینه سازی تصاویر
- 3.5 تغییر اندازه تصاویر برای مقیاس بندی
- 4 افزونه های بهینه سازی که میتوانید استفاده کنید
- 4.1 افزونه Imagify Image Optimizer
- 4.2 افزونه ShortPixel Image Optimizer
- 4.3 افزونه Optimus Image Optimizer
- 4.4 افزونه WP Smush
- 4.5 افزونه TinyPNG (همچنین فرمت JPEG را نیز فشرده سازی میکند)
- 4.6 افزونه ImageRecycle
- 5 تاثیر بهینه سازی تصاویر بر روی وب
- 5.1 تصاویر JPEG بهینه سازی نشده
- 5.2 تصاویر JPEG بهینه سازی شده
- 6 استفاده از فرمت SVG
- 7 بهترین روش‌ها
نحوه بهینه سازی تصاویر برای افزایش سرعت وب سایت
هیچ کس به دنبال این نیست که گوگل را نسبت به وب سایتش متنفر سازد، خوشبختانه، شما با بهینه سازی تصاویر میتوانید عملکرد وب سایتتان را بهبود بخشید. یکی از مشکلات موجود در قالب بندی تصاویر و عکس ها، کاهش کیفیت شدید پس از کم حجم کردن تصاویر می‌باشد، که این موضوع به نوبه خود خیلی مهم است و در دید کاربران نسبت به طراحی سایت (طراحی سایت شرکتی، طراحی سایت فروشگاهی،قیمت طراحی سایت) شما تاثیر گذار است. بهینه سازی تا وقتی خوب است که با کم کردن حجم باعث کاهش کیفیت و زشت شدن تصویر نشوید. در این مقاله به شما نکاتی را ارائه میدهیم که اجازه می‌دهد تصاویر و عکسها را به اندازه‌ای کم حجم و بهینه سازی کنید که کیفیت بالای خود را از دست ندهند و بتوانید آنها را با افتخار در وب سایتتان به نمایش بگذارید.
بنابراین بیایید نگاهی به نحوه قالب بندی تصاویر بدون زشت کردن آنها و همچنین نحوه بهینه سازی عکس ها برای افزایش سرعت وب سایت بیاندازیم.
مزایای قالب بندی تصاویر
در ابتدا بهتر است که پاسخ این سوالات را بدانیم : چرا باید تصاویر وب سایتمان را قالب بندی کنیم ؟ مزایای این کار چیست ؟
در سئو عکس چندین مزیت مختلف وجود دارد. با توجه به تاریخچه HTTP مربوط به 15 سپتامبر 2017 به طور میانگین 65 درصد حجم یک صفحه وب به عکسها و تصاویر آن بستگی دارد. بنابراین ، هنگامی که میخواهید وب سایت وردپرسی خود را برای افزایش سئو و سرعت سایت، بهینه سازی کنید ، با توجه به این آمار باید عنصر مهمی به نام تصاویر را در اولین مرحله بهینه سازی قرار دهید. این عنصر نسبت به اسکریپت‌ها و فونتها اهمیت بسیار بیشتری دارد.
و از قضا ، یکی از راحت‌ترین و بهترین راه‌های بهینه سازی سئو سایت ، بهبود حجم تصاویر است ولی بیشتر مدیران وب سایت‌ها به آن توجه نمی‌کنند.
در اینجا نگاهی به مزایای اصلی بهینه سازی عکسها می‌پردازیم:
- سرعت لود صفحه شما را بهبود می‌بخشد و در نتیجه باعث سئوی بهتر و نتیجه ای موفقیت آمیز در موتورهای جستو می‌گردد، البته بارها درباره اهمیت عکس در مقالات اشاره کردیم و در سئو داخلی گفتیم که گوگل چه میزان در سرعت سایت و بهینه سازی تصاویر اهمیت می‌دهد. کم شدن دیدگاه‌ها ، کمتر شدن بازدید کنندگان روزانه و … میتواند به دلیل کم بودن سرعت و بیش از حد منتظر ماندن کاربران برای لود وب سایت باشد. اگ شما قصد دارید سرعت وب سایت خود را بهبود بخشید میتوانید از خدمات منحصربه‌فرد افزایش سرعت سایت سئوراز استفاده نمایید.
- فایل‌های بک آپ (پشتیبان) خیلی سریع تر ساخته می‌شوند.
- باعث افزایش رتبه سایت در گوگل می‌شود. وب سایت شما نسبت به قبل رنک بهتری در صفحات موتور جستجو می‌گیرد. فایل‌های سنگین باعث کاهش سرعت وب سایت شما می‌شوند و موتورهای جستجوگر از وب سایت‌های کند متنفر هستند. گوگل دوست دارد که تصاویر شما را هرچه سریع‌تر در بخش تصاویر خود مرتب و ایندکس کند. تا به حال کنجکاو نشدید که چه مقدار از ترافیک وب سایت شما از طریق بخش تصاویر گوگل می‌باشد ؟ وارد گوگل آنالیتیکس وب سایت خود شده و طبق این آموزش ، ترافیک ورودی از بخش تصاویر گوگل خود را بررسی کنید.
- تصاویر کم حجم ، ترافیک کمتری مصرف می‌کنند که شبکه اینترنت و مرورگرها از همچنین تصاویری استقبال می‌کنند.
- حجم کمتری از سرور شما را اشغال میکند. (بستگی به تعداد تصاویر شاخص بهینه شده شما دارد)
نحوه بهینه سازی تصاویر برای وب و عملکرد بهتر وب سایت
هدف اصلی در بهبود تصاویر سایت ، پیدا کردن تعادل بین کمترین حجم و بهترین کیفیت قابل قبول است. تقریبا برای روش‌های بهینه سازی بیشتر از یک راه وجود دارد. یکی از بهترین راه‌های موجود انجام بهینه سازی در تصاویر ، فشرده سازی عکس قبل از آپلود در سایت می‌باشد که در بیشتر اوقات در نرمافزارهایی مانند Adobe Photoshop و Affinity Photo امکان پذیر است. بعضی از بهینه سازی‌ها نیز توسط افزونه‌ها انجام می‌شوند که در ادامه مقاله به آنها می‌پردازیم.
دو نکته اصلی که در بهینه سازی تصاویر باید به آن توجه کنید ، فرمت فایل و نوع فشرده سازی که استفاده می‌کنید، می‌باشد. با انتخاب بهترین نوع ترکیب بندی فرمت تصویر و بهترین نوع فشرده سازی ، میتوانید به میزان قابل ملاحظه‌ای حجم تصاویر خود را کاهش دهید. شما باید هر تصویر یا هر فرمتی از تصاویر را آزمایش کنید تا متوجه شوید که کدام نوع فشرده سازی بهترین نوع برای آن نوع از فرمت یا تصویر می‌باشد.
انتخاب فرمت فایل تصویری صحیح
قبل از شروع به اصلاح تصاویرتان ، باید بدانید که کدام نوع از فرمت تصویری برای تصاویر شما مناسب است و از انتخاب بهترین فرمت اطمینان یابید. در زیر با فرمت‌هایی که میتوانید در وب سایتتان استفاده کنید آشنا می‌شوید :
- فرمت PNG – با کیفیت‌ترین نوع تصویر را به شما تحویل می‌دهد ولی با حجمی بسیار بالا. برای فشرده سازی تنها از lossless استفاده میکند. البته گاهی فرمت PNG از بقیه فرمت‌ها حجم کمتر و کیفیت بهتری دارد و باید تست کرد، مخصوصا در تصاویری که دارای تعداد رنگ کمتر هستند.
- فرمت JPEG – از فشرده سازی lossy و lossless استفاده میکند . شما میتوانید سطح کیفیت تصاویرتان را تا دریافت کیفیتی خوب و حجمی قابل قبول کنترل کنید.
- فرمت GIF – تنها از 256 رنگ استفاده میکند. بهترین انتخاب برای تصاویر متحرک است و تنها از نوع فشرده سازی lossless استفاده میکند.
فرمت‌های دیگری نظیر WebP و JPEG XR نیز وجود دارد ، ولی متاسفانه توسط تمامی مرورگرها پشتیبانی نمی‌شوند. در حالت ایده‌آل، شما برای تصاویر حجیم و پر از رنگ بهتر است که از فرمت JPG (JPEG) استفاده کنید و برای تصاویر ساده، شفاف (Transparent) و یا عکس هایی با تعداد رنگ کمتر از فرمت PNG استفاده کنید.
کیفیت و سایز فشرده سازی
تصویر زیر مثالی از فشرده سازی بیش از حد می‌باشد. تصویر اول ، تصویری با درجه فشرده سازی بسیار پایین و دریافت بهترین کیفیت (ولی با حجمی بالا) می‌باشد . تصویر دوم ، تصویری با درجه فشرده سازی حداکثر و دریافت کیفیت بسیار نامناسب و کم (ولی با حجم کم) می‌باشد.
نکته : تصویر اصلی قبل از فشرده سازی حجمی بالغ بر 2.06 مگابایت را داشته است.
همانطور که مشاهده می‌کنید، تصویر ابتدایی بیشتر از 540 کیلوبایت حجم دارد. به عنوان یک تصویر ، یک تصویر بسیار زیبا و پر کیفیت است. اگر بتوانید صفحه خود را با بقیه تصاویر کمتر از 1 یا 2 مگابایت نگه دارید، حجم قابل قبولی برای یک تصویر است. همچنین در نظر داشته باشید که 590 کیلوبایت نسبت به تصویر اصلی یک چهارم شده است. تصویر دوم که از نظر کیفیت وحشتناک می‌باشد ولی 39 کیلوبایت حجم دارد. کاری شما باید انجام دهید ، ایجاد کردن تصویری با کیفیت و حجمی میانه بهترین و بدترین کیفیت می‌باشد.
بنابراین ما تصویر را دوباره فشرده سازی کردیم ولی این بار درجه فشرده سازی را در حالت معمولی (Medium در فتوشاپ) قرار دادیم. کیفیت تصویر قابل قبول و حجم آن نیز 132 کیلوبایت شد که برای یک تصویر با چنین کیفیت بالایی قابل قبول است. این تصویر حدودا 4x کوچکتر از تصویر ابتدایی با فشرده سازی کم و 8x کوچکتر از تصویر اصلی می‌باشد.
به طور معمول ، تصاویر ساده PNG باید 100 کیلوبایت یا کمتر باشند تا وب سایت بهترین عملکرد را داشته باشد.
متد بهینه سازی lossy و lossless
یکی از مهم‌ترین مورد‌هایی که باید در بهینه سازی تصاویر به آن توجه کنید، دانستن و انتخاب بهترین متد بهینه سازی عکسها با انتخاب یکی از دو متد lossy و lossless می‌باشد.
Lossy : یک فیلتر می‌باشد که هنگام بهینه سازی بخشی از داده‌های تصویر را حذف میکند. این متد تصویر را ضعیف میکند و باید هنگام بهینه سازی توجه لازم را در کیفیت تصاویر داشته باشید. حجم تصاویر در این متد بسیار کاهش پیدا میکند. در نرمافزارهایی مانند Adobe Photoshop ، Affinity Photo و دیگر نرم افزار‌های موجود میتوانید با انجام تنظیماتی از این متد استفاده کنید و همچنین کیفیت تصویر را کنترل کنید. برای مثال در Adobe Photoshop هنگام گرفتن خروجی JPEG از شما متد خروجی را درخواست میکند که میتوانید از متد lossy compression و lossless compression استفاده کنید.
Lossless : یک فیلتر می‌باشد که هنگام بهینه سازی، داده‌ها را فشرده سازی میکند. این متد کیفیت تصویر را کاهش نمی‌دهد ولی تصاویر نباید از قبل فشرده سازی شده باشد تا به بهترین روش عمل کند. با نرم افزار‌هایی مانند Adobe Photoshop ، Affinity Photo و … و همچنین بعضی از افزونه‌های وردپرس نیز با متد Gzip این کار را انجام می‌دهند.
بهتر است که برای هر تصویر تکنیک‌های فشرده سازی مختلف را بررسی کنید تا بهترین کیفیت و حجم را پیدا کنید. اگر نرم افزار‌های شما گزینه ذخیره سازی مخصوص وب (Save for Web در فتوشاپ منوی File) را دارند ، مطمئن شوید که به صورت وب ذخیره سازی کنید. این گزینه در بیشتر ویراستار‌های تصویر موجود است و به شما اجازه می‌دهد که به اندازه مورد نیاز تصویر را بهینه سازی کنید. شما در فشرده سازی مقداری کیفیت تصویرتان را از دست می‌دهید ، بنابراین باید توجه کنید که این مقدار را کنترل کنید و بهترین را انتخاب کنید.
ابزارها و نرم افزار‌های بهینه سازی تصاویر
ما در اینجا چندین ابزار و نرم افزار را به شما معرفی میکنیم که بعضی‌هایشان پولی و بعضی‌هایشان رایگان است و با آنها میتوانید تصاویرتان را بهینه سازی کنید. بعضی‌هایشان بهینه سازی را به صورت دستی به خودتان می‌سپارند و بعضی‌هایشان به صورت خودکار بهینه سازی را برایتان انجام می‌دهند. بنده به شخصه طرفدار نرم افزار Affinity Photo هستم ، که هم ارزان است و هم بیشتر امکانات نرم افزار Adobe Photoshop را دارد.
بعضی از ابزارها و نرم افزار‌های خوب برای بهینه سازی تصاویر :
- Adobe Photoshop
- Gimp
- Paint.NET
- GIFsicle
- JPEGtran
- JPEG Mini
- OptiPNG
- pngquant
- FileOptimizer
- ImageOptim
- TinyPNG
- Trimage
تغییر اندازه تصاویر برای مقیاس بندی
یکی دیگر از مشکلات موجود در بهینه سازی تصاویر، هنگامی رخ می‌دهد که باید آنها را برای مقایس بندی یا سایز (Scale) اقدام به آپلود کنید و اجازه ندهید که CSS اندازه آنها را تغییر دهد. این بخش به اندازه فشرده سازی مهم نیست، اما نکته دیگریست تا تصاویر شما با حداکثر سرعت ممکن در تمامی دستگاه‌ها اجرا شوند. اگر از وردپرس استفاده می‌کنید ، به صورت پیشفرض تصاویر شما توسط سیستم تغییر اندازه داده می‌شوند. در بخش تنظیمات> رسانه ، میتوانید حداکثر طول و عرض تصاویر را تعیین کنید. با اینکار دیگر CSS تصاویر شما را با کدگذاری‌های خود کوچک نمی‌کند.
بخش رسانه وردپرس به صورت پیشفرض ریز تصویرهایی (thumbnails) با توجه به تنظیمات وردپرستان می‌سازد. با این‌حال ، تصویر اصلی بدون تغییر سایز و به همان شکل باقی می‌ماند. اگر میخواهید در حجم وب سایتتان صرفه جویی کنید و تصاویر اصلی را ذخیره سازی نکنید میتوانید از افزونه رایگانی به نام Imsanity استفاده کنید.
افزونه Imsanity به شما اجازه می‌دهد که تمامی تصاویر وب سایت خود را محدود به یک سایز کنید و تا تصاویر بزرگ‌تر از یک اندازه‌ای در رسانه شما باقی نمانند و حذف شوند. افزونه Imsanity بلافاصله بعد از آپلود تصویر به وردپرس متصل می‌شود، ولی قبل اینکه وردپرس روی تصویر عملیاتی انجام دهد ، تصویر را نسبت تنظیماتی که ایجاد نموده اید، بررسی و تنظیمات را اعمال میکند. بنابراین با توجه به کاری که افزونه انجام می‌دهد متوجه می‌شوید که به صورت پیشفرض وردپرس نیز همین کار را میکند ولی تنها تصویراصلی را قبل از آپلود کامل تغییر سایز نمی‌دهد.
افزونه های بهینه سازی که میتوانید استفاده کنید
خوشبختانه ، در وردپرس نیازی نیست که هیچ یک از فشرده سازی‌ها و تغییر سایزها را به صورت دستی انجام دهید. شما میتوانید با نصب افزونه‌هایی یک سری از کار‌های بهینه سازی تصاویر را به صورت خودکار انجام دهید. در زیر به افزونه‌هایی اشاره میکنیم که بلافاصله پس از دانلود شروع به انجام عملیات بهینه سازی تصاویر می‌کنند و تصاویری مطلوب و بهینه تحویل شما می‌دهند. همچنین، این افزونه‌ها امکان بهینه سازی تصاویری که از قبل آپلود کرده‌اید را نیز دارند.این یک ویژگی بسیار مفید است، به خصوص اگر شما وب سایتی پر از تصاویر آپلود شده داشته باشید. در این مقاله تعدادی از بهترین افزونه‌های تصاویر را به شما معرفی میکنیم که با آنها میتوانید بهترین عملکرد را در وب سایت خود داشته باشید.
فقط توجه داشته باشید که نباید تنها به افزونه‌ها تکیه کنید. به عنوان مثال، در بعضی از سرورهای میزبانی کم کیفیت شما اجازه ندارید که تصاویر و فایل‌هایی بیشتر از 2 مگابایت آپلود کنید و همچنین علاوه‌بر خود در نظر گیری سرورهای میزبانی کم کیفیت ، به طور کلی شما نباید تصاویری بیشتر از 2 مگابایت در بخش رسانه وردپرس آپلود کنید ، زیرا این تصاویر به سرعت حجم وب سایت شما را پر می‌کنند و شما را مجبور می‌کنند که مقدار حجم وب سایت خود را افزایش دهید.
افزونه Imagify Image Optimizer
افزونه Imagify توسط تیم سازنده Wp Rocket ساخته شده است، که افزونه‌هایی بسیار عالی در خصوص بهینه سازی سرعت وب سایت ارائه میکند. این افزونه با Woocommerce ، WP Retina و NextGen Gallery سازگار است. همچنین با ویژگی Bulk (بهینه سازی تعداد بالا) میتوانید تصاویرتان را با 3 سطح مختلف فشرده سازی ، عادی (نرمال) ، خشونت آمیز (aggressive) ، فوق العاده (ultra) فشرده سازی کنید.
این افزونه امکان بازسازی نیز دارد و درصورتی که از بهینه سازی راضی نبودید میتوانید دوباره درخواست بازسازی تصاویر را بدهید تا دوباره تصاویر شما را به حالت اولیه برگرداند و دوباره بهینه سازی کند. این افزونه یک نسخه رایگان و یک نسخه تجاری دارد. با هر اکانت رایگان شما ماهیانه اجازه دارید که 25 مگابایت تصویر را بهینه سازی کنید.
خلاص شدن از تصاویر اصلی و تغییر اندازه تصاویر بزرگ نیز در این افزونه امکان پذیر است.
افزونه ShortPixel Image Optimizer
افزونه ShortPixel Image Optimizer یک افزونه رایگان است که به شما این امکان را می‌دهد که در هر ماه 100 تصویر را بهینه سازی کنید و چندین نوع فرمت مختلف مانند JPEG ، PNG ، GIF ، WebP و همچنین فرمت PDF را پشتیبانی میکند و برای بهینه سازی از هر دو متد lossy و lossless میتواند استفاده کند. این افزونه میتواند تصاویر CMYK را به RGB تبدیل کند و با انتقال تصاویر شما به فضای ابری و سپس بازگرداندن آنها به وب سایت وردپرسی شما در بهینه سازی پردازنده و حافظه RAM هاست شما نیز کمک میکند و همچنین یک نسخه پشتیبان از تصویر اصلی شما نیز تهیه میکند که در صورتی که از کیفیت راضی نبودید ، تصویر اصلی را بازگردانید. در بهینه سازی تصاویر در این افزونه محدودیت حجمی وجود ندارد.
افزونه Optimus Image Optimizer
افزونه Optimus Image Optimizer از متد lossless برای بهینه سازی تصاویر شما استفاده میکند. همانطور که در بالا گفتیم در متد lossless هیچ اطلاعاتی از تصویر شما پاک نمی‌شود. این افزونه از افزونه‌های WooCommerce ، Multi-Site پشتیبانی میکند و یک بخش bulk بسیار خوب دارد تا تصاویر آپلود شده قدیمی را نیز بهینه سازی کند. این افزونه همچنین ازWP Ratina نیز پشتیبانی میکند.
یک نسخه رایگان و یک نسخه تجاری برای این افزونه ارائه می‌شود. در نسخه تجاری که شما می‌بایست سالیانه هزینه اشتراک را بپردازید ، حق بهینه سازی بی‌نهایت تصویر را دارید. اگر این افزونه را با افزونه Catch Enabler ترکیب کنید ، امکان استفاده از فرمت WebP که فرمتی برای بهینه سازی تصاویر می‌باشد و به تازگی توسط گوگل توسعه داده شده است، نیز خواهید داشت.
افزونه WP Smush
افزونه WP Smush شاید یکی از پرطرفدار‌ترین و پراستفاده‌ترین این لیست باشد نیز در دو نسخه رایگان و تجاری عرضه شده است. این افزونه اطلاعات پنهان در تصاویر را کاهش می‌دهد تا تصویر بدون کاهش کیفیت ، کم حجم شود. افزونه smush پس از آپلود تصاویر به سرعت تصاویر را اسکن کرده و آنها را بهینه سازی میکند و همچنین تصاویر قدیمی شما را نیز میتواند بهینه سازی کند.
در نسخه رایگان میتوانید ۵۰ تصویر را در حال عادی بهینه کنید و اگر نیاز به بهینه سازی دستی داشتید نیز میتوانید هر تصویری که دوست دارید را به صورت دستی بهینه سازی کنید. Smush میتواند فرمت‌های JPEG ، PNG و GIF را بهینه سازی کند . در حالت رایگان Smush تصاویر زیر ۱ مگابایت را بهینه سازی میکند.
افزونه TinyPNG (همچنین فرمت JPEG را نیز فشرده سازی میکند)
افزونه TinyPNG که تحت فضای ابری TinyPNG و TinyJPG میتواند ماهیانه ۱۰۰ تصویر را برای شما بهینه سازی کند نیز یکی از بهترین‌های وردپرس می‌باشد و میتواند تصاویر PNG و JPEG شما را بهینه سازی کند.
این افزونه به طور خودکار تصاویر جدید و قدیمی وردپرس شما را بهینه سازی میکند. این افزونه همچنین ساختار CMYK را به RGB تبدیل میکند، به گفته سازنده این پلاگین تصاویر JPEG را تا ۶۰ درصد و تصاویر PNG را تا ۸۰ درصد بهینه سازی میکند و هیچ تغییری در کیفیت اصلی تصویر ایجاد نمی‌شود. این افزونه محدودیتی در حجم تصاویر ندارد صرفا با یک ایمیل میتوانید از خدمات این افزونه استفاده نمایید.
افزونه ImageRecycle
افزونه ImageRecycle ، افزونه ایست که تصاویر و فایل‌های PDF شما را به صورت خودکار بهینه سازی میکند. این افزونه نه تنها که روی بهینه سازی تصاویر بلکه در بهینه سازی فایل‌های PDF نیز تمرکز دارد. یکی از بهترین امکانات این افزونه امکان تعیین کردن کمترین حجم تصویر برای بهینه سازی است. برای مثال ، اگر نمی‌خواهید که تصاویر با حجم کمتر از ۸۰ کیلوبایت بهینه سازی شوند کافیست که ۸۰ کیلوبایت را حداقل حجم بهینه سازی قرار دهید. و این باعث می‌شود که شما از بیش از حد فشرده نشدن تصاویرتان اطمینان یابید. این افزونه همچنین شامل Bulk برای تصاویر قدیمی (امکان بهینه سازی گروهی عکس های از قبل آپلود شده) و همچنین امکان تغییر اندازه خودکار نیز می‌باشد. نکته : این افزونه یک تست ۱۵ روزه به کاربران خود هدیه می‌دهد ولی به طور کلی افزونه‌ای تجاری به حساب می‌آید و برای استفاده از آن باید هزینه ای بپردازید. در این افزونه تصاویر در سرور های واسطه ای سازنده آپلود و بهینه سازی می‌شوند. برای خرید این افزونه نیازی نیست که به صورت اشتراکی هزینه پرداخت کنید ولی باید بسته‌هایی مخصوص خریداری کنید که در آن تعداد تصاویری که شما مجاز به فشرده سازی هستید معین شده است که بسته ها از ۱۰ دلار برای ۱۰ هزار تصویر شروع می‌شود.
تاثیر بهینه سازی تصاویر بر روی وب
بعد از توضیحات کامل نحوه کاهش حجم عکسها وقت بررسی تاثیر آن و تغییرات در سرعت لود سایت می‌باشد. به همین دلیل تصمیم گرفتیم با انجام آزمایش به شما نشان دهیم که بهینه سازی تصاویر چه تاثیری بر روی وب سایت شما می‌گذارد.
تصاویر JPEG بهینه سازی نشده
در ابتدا ما ۶ تصویر بهینه سازی نشده را در وب سایت آپلود کردیم که تمامی آنها سایزی بیشتر از ۱ مگابایت داشتند. این آزمایش را ما ۵ بار تکرار کردیم تا از تصادفی نبودن نتایج اطمینان یابیم. همانطور که در زیر مشاهده می‌کنید ، زمان لود وب سایت ما ۱.۵۵ ثانیه در حالتی که صفحه ما ۱۴.۷ مگابایت حجم دارد می‌باشد.
تصاویر JPEG بهینه سازی شده
حال پس از بهینه سازی تصاویر با استفاده از افزونه Imagify و حالت خشونت آمیز ، همانطور که مشاهده می‌کنید ، زمان لود صفحه ما ۴۷۶ میلی ثانیه و حجم صفحه ۲.۹ مگابایت شده است . ( این بررسی را نیز ۵ بار تکرار کردیم تا اطمینان کامل حاصل کنیم)
پس از مقایسه نتایج متوجه شدیم که زمان لود وب سایت ما ۵۴.۸۸ درصد و حجم صفحه ۸۰.۲۷ درصد کاهش یافته است.
تقریبا هیچ نوع بهینه سازی دیگری وجود ندارد که بتواند زمان لود وب سایت شما را ۵۰ درصد کاهش دهد. برای همین است که بهینه سازی تصاویر خیلی مهم است و کار سختی نیز نمی‌باشد زیرا تمامی این عملیات‌ها با استفاده از افزونه‌ها صورت می‌پذیرد هر چند باید قبول کرد به اندازه کار دست قوی نیست ولی بد هم نیست. این روش یکی از بهترین روش‌های افزایش سرعت وردپرس است. دیگر راه بهینه سازی سرعت وب سایت شما ، استفاده از یک میزبانی وب مخصوص و مربوط به وردپرس می‌باشد.
با بهینه سازی تصاویر شما خیلی راحت میتوانید خطاهای Optimize Images و Serve scaled images در زمان تست سرعت لود صفحه در ابزارهای Google PageSpeed Insights یا GTmetrix را نیز برطرف کنید.
استفاده از فرمت SVG
توصیه دیگری که می‌توانیم به شما بکنیم ، استفاده از SVG ها در کنار تصاویرتان است. SVG ها یک نوع از فرمت‌های وکتور می‌باشند که برای لوگوها ، آیکون‌ها ، فایل‌های تکست و دیگر تصاویر ساده استفاده می‌شوند.
در زیر دلایل استفاده از SVG ها را به شما می‌گوییم:
- فایل‌های SVG در ویرایشگر‌های تصاویر و مرورگرها امکان تغییر مقیاس دارند و برای طراحان وب و گرافیک کاران رویایی طراحی شده است.
- گوگل همانند PNG و JPEG ، فایل‌های با فرمت SVG را نیز ایندکس میکند و این نگرانی شما را بابت سئو برطرف میکند برخلاف تصاویر با تکنولوژی base64 که آنها تا این تاریخ ایندکس نمی‌کند.
- فایل SVG در بیشتر اوقات (نه همیشه) حجمی کمتر از فایل‌های JPEG و PNG دارند. این مهم باعث افزایش سرعت لود وب سایت می‌شود.
در زیر تفاوت ۳ فرمت PNG و JPEG و SVG را در تصاویر وکتور(برداری) می‌بینید.
فرمت JPEG (پس از بهینه سازی 81.4 کیلوبایت)
فرمت PNG (پس از بهینه سازی 85 کیلوبایت)
فرمت SVG ( پس از بهینه سازی 6 کیلوبایت)
همانطور که در بالا دیدید ، تصویر SVG ساده ما حدودا ۹۲.۵۱ درصد از فایل JPG و همچنین حدودا ۹۲.۸۳ درصد نیز از PNGکم حجم تر است.
بهترین روش‌ها
در زیر به برخی از شیوه‌های عمومی در مورد چگونگی بهینه سازی تصاویر وب می‌پردازیم :
- تا جایی که ممکن است از تصاویر وکتور به جای تصاویر PNG و JPEG استفاده کنید.
- از CDN برای افزایش سرعت لود تصاویر توسط کاربران در هرجای جهان استفاده کنید.
- تصاویرتان را با استفاده از فشرده سازی Gzip ، بهینه سازی کنید.
- بخش‌های غیر ضروری تصاویر را حذف کنید.
- بخش‌های سفید تصاویر را پاک کنید و توسط CSS آنها را بسازید.
- از افکت‌های CSS3 تا جای ممکن استفاده کنید.
- تصاویرتان را با ابعاد خودشان در html و css سایت لود کنید (اشاره به خطای serve scaled images).
- برای نوشتن متن بر روی تصاویر از وب فونتها استفاده کنید. (آنها عکس را بهینه تر می‌کنند و امکان تغییر اندازه را در تصاویر و نوشته محیا می‌کنند)
- از تصاویر شطرنجی تنها در بخش‌هایی که اشکال و جزئیات وجود دارد استفاده کنید.
- از bit-depth برای کاهش پلات رنگ استفاده کنید.
- در جاهایی که میتوانید از متد lossy برای فشرده سازی استفاده کنید.
- در صورت نیاز به انیمیشن از GIF استفاده کنید.
- برای پیدا کردن بهترین تنظیم در تصاویر با فرمت‌های مختلف، آنها را آزمایش کنید.
- اگر بهترین کیفیت و بهترین جزئیات را نیاز دارید از فرمت PNG استفاده کنید.
- برای تصاویر اصلی و اسکرین شات‌ها از JPEG استفاده کنید.
- مقیاس تصاویر را نسبت به صفحه نمایش تنظیم کنید تا تعداد پیکسل‌ها کاهش یابد.
- هر Metadata غیر ضروری را حذف کنید.
- عملیات فشرده سازی را تا جای ممکن خودکار کنید.
- در بعضی موارد شما نیازمند لود تنبل برای نمایش تصاویر هستید (مقاله جامع lazy loading چیست را مطالعه نمایید).
- در ابزاری مانند photoshop تصاویر را به صورت Save for Web خروجی بگیرید، این گزینه در سربرگ File موجود است.
هنگامی که شما از بهترین شیوه برای بهینه سازی سازی تصاویر و قالب‌بندی آنها استفاده کردید . سایت شما در مرورگرها ، موتورهای جست‌وجو ، شبکه‌ها و همچنین توسط کاربران سریع‌تر لود می‌شود.
لود تنبل تصاویر و ویدیوهای وردپرس برای افزایش سرعت سایت
لود تنبل تصاویر و ویدیوهای وردپرس برای افزایش سرعت سایت
سرفصل‌های پست
- 1 پیاده سازی لود تنبل برای تصاویر و ویدیوها
- 2 لود تنبل چگونه کار میکند؟
- 3 لود تنبل وردپرس :
- 3.1 آیا تصاویر و ویدیوها واقعا در کاهش سرعت طراحی سایت (طراحی سایت فروشگاهی، طراحی سایت شرکتی) موثر هستند ؟
- 4 بهبود سرعت لود صفحه از طریق افزونه‌های لود تنبل
- 4.1 1 – BJ Lazy Load
- 4.2 2 – Lazy Load XT
- 4.3 3 – افزونه a3 Lazy Load
- 4.4 4 – افزونه Rocket Lazy Load
- 5 نتیجه گیری و توصیه‌ها
پیاده سازی لود تنبل برای تصاویر و ویدیوها
به طور کلی میانگین حجم صفحات وب سایت‌ها به همراه تصاویر و ویدیوها 3376 کیلوبایت می‌باشد که بالای ۷۰ درصد آن راHTTP Archive اشغال میکند. این مقدار حجم در مرورگر بازدیدکنندگان وب سایت برای مشاهده و دانلود بسیار زیاد است و این حجم با پیشرفت وب سایت و افزایش مقالات و تصاویر بیشتر نیز می‌شود و این افزایش در کاهش سرعت و کاهش رتبه سئو تاثیرگذار است. (برای ارزیابی حجم محتوای سایت خود میتوانید از ابزارهای سئو و یا از سایت httparchive.orgاستفاده نمایید.)
به هر حال ، تمامی این منابع سنگین باید توسط صفحه وب دانلود شوند و یک هزینه بسیار بالا برای کاربرانی که باید کلی برای دانلود این منابع حجیم منتظر بمانند، از جمله فایل‌هایی که در ابتدای نمایش صفحه وب قابل نمایش نیستند به وجود می‌آورد مخصوصا در کشور ما ایران با تعرفه‌های بالای اینترنت و حجم و سرعت‌های نامناسب.
اینجا ، جایی است که لود تنبل (Lazy Load) وارد صحنه می‌شود. لود تنبل یک تکنیک بهینه‌سازی صفحات وب سایت است که توسط آن هنگام ورود به یک صفحه وب تنها اطلاعات قابل مشاهده لود می‌شود و بقیه اطلاعاتی که در زیر وجود دارند ، پس از اسکرول کردن شروع به لود شدن می‌کنند.
لود تنبل یا Lazy Load یکی از اقداماتی است که گوگل در صورت مشاهده بسیار هیجان زده می‌شود و به وب سایت شما اهمیت می‌دهد و همچنین از این تکنیک در وب سایتهایی که مقالات و صفحات تعداد زیادی از ویدیوهای ibed شده و تصاویر با رزولوشن بالا را در خود جای داده‌اند، به اجبار باید استفاده کرد.
لود تنبل چگونه کار میکند؟
لود تنبل به شکل زیر کار میکند :
- مرورگر صفحات وب را به صورت DOM در می‌آورد که در این مدل هنگام لود صفحه، تصاویر و ویدیوها لود نمی‌شوند.
- جاوااسکریپت با تکنیکی به نام Determine تصاویر و ویدیوها را براساس محتوایی که پس از لود صفحه مشاهده می‌شود، دانلود و نمایش می‌دهد. تصاویر و ویدیوهایی که در پایین صفحه هستند نیز به همین ترتیب پس از اسکرول دانلود و نمایش داده می‌شوند.
- دانلود و نمایش فایل‌های اضافی را تا زمانی که کاربر به محل مشخص فایل ویدیویی اسکرول نکند ، به تاخیر می‌اندازد و سپس بعد از اسکرول تمامی فایل‌های مشخص شده برای لود تنبل آن قسمت لود می‌شوند.
نتیجه نهایی آن شد که تصاویر در لود اولیه، دانلود نمی‌شوند و همچنین ویدیوها تا زمانی که نیاز نباشد لود نمی‌شوند. اینکار میتواند بهبود قابل توجهی در عملکرد وب سایتهایی که تصاویر با رزولوشن بالا و ویدیوهای ibed شده در خود جای داده‌اند، ایجاد کند و در نتیجه باعث بهبود سرعت ساخت سایت شود اگر از تصاویر حجیم در وب سایتتان استفاده می‌کنید ، لود تنبل به سرعت لود صفحه شما خیلی کمک میکند.
لود تنبل وردپرس :
مانند دیگر مشکلاتی که در وبسایت رخ می‌دهد ، برای ایجاد لود تنبل در وردپرس نیز افزونه‌هایی ارائه شده است که میتوانید از طریق آن لود تنبل را فعال و مشکل کند لود شدن صفحات را از بین ببرید. درواقع ، تعداد خیلی زیادی افزونه‌ی رایگان در مخزن افزونه‌های وردپرس موجود است که شما میتوانید برای لود تنبل تصاویر و ویدیو‌هایتان استفاده کنید.
پس از بررسی 12 افزونه مربوط به لود تنبل و فعال کردن و تست چندین باره ، ما 4 افزونه خیلی حرفه ای را که بهبود قابل ملاحظه ای در عملکرد وب سایت شما ایجاد می‌کنند را شناسایی کردیم و قصد داریم در ادامه معرفی کنیم ولی قبل از آن به سوالی پاسخ دهیم:
آیا تصاویر و ویدیوها واقعا در کاهش سرعت سایت موثر هستند ؟
قصد داریم با یک ارزشیابی کوچک، تاثیر تصاویر و ویدیوها را بر سرعت سئو سایت به شما نمایش دهیم. برای نمایش ارزشیابی، تصمیم گرفتیم که روی هاست سئوراز ، یک وردپرس نصب کنیم. پوسته 2016 وردپرس که بدون هیچ افزونه بهینه سازی و تکنیک ذخیره کش و… در وردپرس موجود بود را فعال کردیم. تصویر زیر نمایانگر نتایج آنالیز و بررسی ارزشیابی سئو و سرعت سایت در ابزار آنلاین pingdom قبل از اضافه کردن تصاویر و ویدیو می‌باشد.
همانطور که مشاهده می‌کنید ، وب سایت بسیار سبک است و حجم صفحه کوچکتر از 155 کیلوبایت است و زمان لود صفحه نیز کمتر از نیم ثانیه است و برای پیدا کردن و حل کردن مشکلات در این وضعیت باید خیلی سخت‌گیر باشیم. به نظر شما هنگامی که یک تصویر حجیم و یک ویدیو ibed شده از یوتیوب را در صفحه قرار دهیم ، در این نتایج چه رخ می‌دهد؟
بله ، کلمه واو بسیار در این وضعیت مناسب است. حجم صفحه به 1.7 مگابایت افزایش یافت و زمان لود نیز 3 برابر شد .
پوسته 2016 وردپرس از هر لحاظ که بررسی کنید سبک طراحی شده است و به همین دلیل است که با اضافه کردن تصاویر حجیم و ویدیوها هنوز هم سریع لود می‌شود. ولی به هر حال ، با این ارزشیابی کوچک متوجه شدیم که تصاویر و ویدیوها در کاهش سرعت لود و افزایش بیش از حد حجم صفحه خیلی تاثیر گذارند.
بهبود سرعت لود صفحه از طریق افزونه‌های لود تنبل
افزونه‌های BJ Lazy Load ، Lazy Load XT ، a3 Lazy Load و Rocket Lazy Load چهار افزونه‌ای هستند که سرعت تحویل صفحات وب را به میزان قابل توجهی افزایش می‌دهند. بیایید بررسی کنیم که هرکدام از این افزونه‌ها به نوبه خود چه کارهایی انجام می‌دهند. چندین افزونه دیگر هم مورد آزمایش قرار گرفتند ولی آن‌طور که باید در سرعت وب سایت تاثیر گذار نبودند.
همانطور که درحال امتحان افزونه‌های لود تنبل هستید ، قبل و بعد از فعالسازی میزان تغییرات را بررسی کنید تا با این کار میزان رضایت خود را بسنجید و اطمینان یابید که به آن سرعتی که در نظر داشتید رسیده‌اید.
1 – BJ Lazy Load
افزونه BJ Lazy Load یک افزونه بسیار محبوب در بین کاربران وردپرسی می‌باشد و در بیشتر از 40 هزار وب سایت وردپرسی نصب شده و فعال است و بر اساس 60 بازخورد منتقدان ، رتبه 4.1 را از 5 دریافت کرده است.
نصب و فعالسازی بی درد سری دارد و کافیست وارد بخش افزودن افزونه در وردپرس شوید عبارت BJ Lazy Load را جست‌وجو کنید ، بعد از یافتن افزونه آن را نصب کنید ، سپس فعالسازی کنید . بعد از فعالسازی در منوی تنظیمات یک زیر منو به نام BJ Lazy Load ساخته می‌شود.
تمامی تنظیمات لود تنبل برای شما به صورت پیشفرض انجام خواهد شد و شما درصورتی که یکی از تنظیمات توسط پوسته شما قابل انجام نبود ، میتوانید مشکل را شناسایی و با غیرفعالسازی آن قسمت مشکل را حل کنید.
یک گزینه که در این افزونه و در دو افزونه‌ی دیگر معرفی شده موجود است امکان اضافه کردن لینک یک تصویر برای قرارگیری هنگام لود تصاویر و ویدیوها می‌باشد که پس از لود تصاویر حذف می‌شود و تصویر و ویدیو اصلی جایگزین می‌شود. البته ، برای استفاده از این گزینه شما باید یک تصویر کوچک و با رزولوشن پایین طراحی کنید که به لود وب سایت آسیب نزند.
برای گرفتن سبک‌ترین و بی‌نظیرترین نتیجه ممکن ، من توصیه میکنم که یک تصویر تک رنگ و هم‌رنگ با پس زمینه پوسته با فرمت png تهیه کنید.
همچنین شما میتوانید بعضی از class های CSS موجود در فایل html صفحه را نیز در لیست عبور (محروم) قرار دهید تا آن class ها به صورت لود تنبل ، لود نشوند. سپس بعد از اینکار شما میتوانید آن class ها را به فیلم ها و تصاویری که قصدندارید به صورت تنبل لود شوند بدهید تا به صورت عادی لود شوند. در نهایت ، شما میتوانید مقدار لازم برای نزدیکی برای نمایش تصاویر قبل از دانلود و نمایش را بشناسید.
بیایید بررسی کنیم که با BJ Lazy Load چقدر سرعت وب سایت ما تغییر کرده است.
این زمان لود فوق‌العاده سریع است. وب سایت را دوازده بار در ساعت های مختلف شبانه روز تست کردم و متوجه شدم که زمان لود وب سایت میانگین بین 300 تا 400 میلی ثانیه است. آزمودن وب سایت بلافاصله بعد از فعالسازی پلاگین ملاک نیست و باید چندین بار تست صورت گیرد.
درحالی که شاهد افزایش سرعت وب سایت شده‌ایم ولی حجم وب سایت 0.3 مگابایت افزایش یافته است و از 1.7 مگابایت به 2 مگابایت افزایش داشته است. برای حجم چه اتفاقی افتاده است ؟ با توجه به نظریه ای که داشتیم ، با فعالسازی لود تنبل باید حجم صفحه کاهش یابد و صفحه سبک تر شود . پس از بررسی وضعیت حال حاضر این نتیجه چیزیست که دست یافتم :
به صورت پیشفرض، وردپرس برای ارائه تعداد زیادی از اندازه یک فایل تصویری در مرورگر ها از ویژگی‌ای (attribute) به نام srcset برای تصاویر در تگ img استفاده میکند. مرورگر از طریق لیستی از اندازه‌ها و لود کوچکترین نسخه از تصویر ، فضای موجود را پر میکند. این بدان معناست که اگر شما یک تصویر بزرگ را آپلود کنید ، وردپرس با تکنیک‌های پیشفرض خود تصویر را به چند نسخه به اندازه‌های کوچکتر تبدیل میکند و سپس نسبت به سایز صفحه نمایش و تنظیمات پوسته سایز کوچک تولید شده را برای مرورگر بازدید کننده ارسال میکند. مرورگر بازدیدکنندگان کوچکترین تصویر مناسب را براساس میزان پیکسل های دردسترس در مکان قرارگیری تصویر دریافت خواهد کرد.
افزونه BJ Lazy Load رفتار پیشفرض وردپرس در مورد تصاویر را به طور کامل تغییر می‌دهد. ویژگی data-lazy-srcset جایگزین ویژگی srcset می‌شود و نتیجه نهایی این است که به جای پایین آوردن اندازه و وضوح تصویر ، تصویر با وضوح و اندازه کامل به صورت تنبل، لود خواهد شد.
این کار ایده‌آل نیست ولی شما با بهینه سازی تصاویر قبل از آپلود میتوانید حجم تصاویر را کاهش دهید تا حجم وب سایت بالا نرود ، گرچه ، در حال حاضر افزونه‌هایی برای بهینه سازی در وردپرس نیز تهیه شده اند که میتوانید جایگزینی برای رفتار تغییر اندازه پیشفرض وردپرس کنید و دیگر این مشکل را نداشته باشید.
با آزمایش دیداری ، شما وب سایت خود را لود می‌کنید و مشاهده می‌کنید که چه رخ داده است . برای مثال اگر از پس زمینه ای غیر سفید در پس زمینه وب سایت خود استفاده می‌کنید ، حتما باید یک تصویر جایگزین برای نمایش قبل از لود تنبل تصاویر قرار دهید. به صورت پیشفرض افزونه یک تصویر gif سفید رنگ برای شما قرار می‌دهد که در تنظیمات میتوانید آن را تغییر دهید.
2 – Lazy Load XT
افزونه Lazy Load XT در آزمایشات ما به خوبی ظاهر شد و یکی دیگر از افزونه های خوب لود تنبل وردپرس به حساب می آید. با آماری حدود 1000 نصب فعال مشخصا به اندازه BJ Lazy Load محبوب نیست ولی از نظر رتبه بندی امتیاز 4.9 از 5 امتیاز را آورده است که تنها یک بازخورد 5 امتیاز را به این افزونه نداده بود.
پس از فعالسازی ، افزونه در منو تنظیمات یک زیر منو Lazy Load XT ایجاد میکند و شما میتوانید از آن طریق افزونه را پیکربندی کنید. پس از اولین بررسی دیداری وب سایت متوجه خواهید شد که این افزونه بیشتر از لود تنبل تصاویر و ویدیوها عمل میکند. شما علاوه بر لود تنبل میتوانید فایل‌های جاوااسکریپت و سی اس اس را Minify کنید. کتابخانه های جاوا اسکریپت و سی اس اس را توسط انواع CDN مانند CloudFlare لود کنید و اسکریپت‌ها را به فوتر وردپرس منتقل کنید.
در این افزونه چند گزینه اضافی وجود دارد که میتوانید با استفاده از آنها باعث بهبود سرعت سایت وردپرس شوید. به هر حال ، از وقتی که شروع به آزمایش لود تنبل کردیم ، من تنظیمات افزونه را به صورت پیشفرض رها کردم، فایل‌های جاوااسکریپت و سی اس اس را Minify و به فوتر منتقل نکردم ، کش سرور را خالی نکردم . با توجه به این موضوع در وب سایت Pingdom ، وضعیت سرعت حال حاضر وب سایتم را آزمایش کردم.
پس از انجام آزمایش توسط pingdom ، حجم وب سایت همان 2 مگابایت باقی مانده بود ولی زمان لود صفحه کمی بیشتر از افزونه BJ Lazy Load شده بود . گرچه با این افزونه در لود صفحه 50 درصد کاهش زمان لود حاصل شد ولی به هر حال این آزمایش بیانگر قدرت کمتر این افزونه نسبت به BJ Lazy Load می‌باشد. بعد از مشاهده منو درختی فایل‌ها متوجه شدیم که دقیقا همان فایل‌هایی که در BJ Lazy Load لود می‌شوند با فعال سازی Lazy Load XT نیز لود می‌شوند و به جای تصاویر بهینه سازی شده ، پس از فعال سازی افزونه‌ها دقیقا همان تصویر آپلود شده با همان کیفیت به صورت تنبل، لود می‌شود.
پس از بررسی این موضوع ، دلیلی برای اینکه چرا لود BJ Lazy Load بهتر از Lazy Load XT یافت نمی‌شد تا اینکه به تصویر پیش‌نمایش قبل از لود تصویر اصلی توجه کردم که این تصویر به علت اینکه به صورت Transparent بود و به همین علت لود تصاویر قبل از نمایش به خوبی صورت نمی‌گرفت و سرور را بیشتر برای لود مشغول می‌کرد. در این افزونه نیز مانند BJ Lazy Load امکان تغییر تصویر پیش‌نمایش وجود دارد و میتوانید با انتخاب یک تصویر بهتر و بهینه تر کمی سرعت لود را کاهش دهید.
3 – افزونه a3 Lazy Load
افزونه a3 Lazy Load یکی دیگر از افزونه های پرطرفدار مخزن وردپرس در حوزه لود تنبل می‌باشد. این افزونه حدودا 10 هزار نصب فعال دارد ، و امتیاز 4.7 را از 5 امتیاز با توجه به 40 بازخورد به دست آورده است.
افزونه را فعال کنید و سپس مشاهده می‌کنید که در منو تنظیمات یک زیر منو به نام a3 Lazy Load اضافه شده است. برای آزمایش افزونه ، من تنظیمات آن را به همان صورت پیشفرض قرار دادم. من از گزینه بارگذاری رنگ پس‌زمینه برای پیش‌نمایش تصاویر استفاده کردم تا رنگ پیش‌نمایش هم رنگ پس‌زمینه صفحه وب من شود. با توجه به این تغییر و قرارگیری تنظیمات به صورت پیشفرض ، عملکرد وب سایت خیلی عالی شد.
زمان لود وب سایت ما دوباره به زیر نیم ثانیه آمد ، این سرعت با توجه به تعداد تصاویر و ویدیو قابل توجه است.
مقایسه نتایج به دست آمده
بی شک ، شما متوجه کاهش درخواست ها و حجم صفحه شده‌اید. چه چیزی این تفاوت دراماتیک را ایجاد میکند؟ در وب سایت pingdom با تهیه اسکرین شات و یا ایمیل کردن نتایج میتوانید هرلحظه که خواستید دو آزمایش را با یکدیگر مقایسه کنید.
در تصویر زیر حجم محتوای وب سایت را هنگامی که افزونه a3 Lazy Load فعال است را مشاهده می‌کنید.
به طور کلی 151 کیلوبایت تصاویر ، حجم صفحه را گرفته اند که این مقدار نسبت به واقعیت کم می‌باشد. دو افزونه BJ lazy load و Lazy Load TX حجم صفحه را 2 مگابایت نشان داده‌اند . تصویر زیر نمایانگر آن است که چطور وب سایت با فعال بودن این دوافزونه 2 مگابایت حجم دارد.
سایز کدهای جاوااسکریپت ، سی اس اس و اچ تی ام ال تقریبا یکسان است. با این حال ، اندازه تصاویر 1.86 مگابایت است، که این اندازه حجم تصاویر با همان رزولوشنی است که آپلود می‌شوند ولی در مقابل در a3 lazy load این حجم 151 کیلوبایت می‌باشد. به نظر شما چه اتفاقی افتاده است؟ همانطور که قبلا گفتم بعد از آپلود تصاویر وردپرس به صورت پیشفرض شروع به بهینه سازی و ساخت اندازه های مختلف از تصویر میکند و کاربران کوچکترین اندازه مربوط به صفحه نمایش خود را دانلود و مشاهده می‌کنند.
در افزونه‌های BJ lazy load و Lazy Load TX ، بهینه سازی پیشفرض تصاویر وردپرس غیرفعال شده است ولی در افزونه a3 Lazy Load تصاویر با توجه به تکنیک بهینه سازی تصاویر پیشفرض وردپرس نمایش داده می‌شوند و در نتیجه تصاویر کم حجم تری را مشاهده می‌کنند.
یکی از جالب‌ترین نکات موجود در این مقایسه ، زمان لود صفحه می‌باشد که با افزونه BJ lazy load زمان لود حدودا 100 میلی ثانیه کمتر از a3 Lazy Load می باشد. به همین دلیل من چندین بار از صفحات وب سایت با فعالسازی و غیرفعالسازی هر 3 افزونه آزمایش تست سرعت گرفتم که مطمئن شوم که این نتایج غیرواقعی نباشد. تنها تغییری که در نتایج ایجاد می‌شد تعداد درخواست‌های HTTP بود . در یک نگاه ، به نظر می‌رسد که تعداد درخواست‌های HTTP افزونه BJ lazy load بیشتر باشد. با این حال ، اگر به منوی درختی فایل‌ها نگاهی بیاندازیم ، متوجه دلیل درخواست ها خواهیم شد.
فایل‌های سایت با فعال بودن افزونه BJ lazy load حدودا 20 درخواست از نوع data:image/gif را تولید میکند.
این‌ها داده‌های URI هستند نه درخواست های HTTP که در واقع ، به مرورگر می‌گوید که فایل Gif را به صورت محلی (با کدهای Base 64) لود کند نه به صورت دانلود از سرور. در نتیجه ، افزونه BJ lazy load برای لود صفحه نیازمند 17 درخواستHTTP می‌باشد که این در مقابل a3 Lazy Load که 27 درخواست HTTP برای لود صفحه نیاز دارد سریع تر لود می‌شود و کاملا دلیل مشخصی برای سریع لود شدن صفحات می‌باشد.
افزونه Lazy Load TX یک مقدار بیشتر از BJ lazy load نیازمند درخواست های HTTP می‌باشد که این تعداد درخواست بیشتر بیانگر دلیل دریافت نکردن همان نتایج است.
4 – افزونه Rocket Lazy Load
و چهارمین گزینه استفاده در صورتی که هیچ یک از افزونه‌های بالا خواسته شما را محیا نکرد ، افزونه Rocket Lazy Loadمی‌باشد. افزونه‌ای رایگان از تولید کنندگان افزونه WP Rocket است. در حال حاضر این افزونه بیشتر از 6 هزار نصب فعال دارد و امتیاز 4.2 از 5 امتیاز را دریافت کرده است. اگر به‌دنبال یک افزونه لود تنبل ساده و با سرعتی خوب می‌گردید ، یکی از بهترین انتخاب‌های شما این افزونه است. این افزونه تنظیماتی را بر روی تصاویرشاخص ، تمامی تصاویر موجود در مقالات و ابزارک‌ها، آواتار‌ها و شکلک‌ها ایجاد میکند.
یکی از مزیت‌های این افزونه نداشتن هیچ کتابخانه جاوااسکریپتی مانند جی‌کوئری در خود می‌باشد و کدهای اسکریپت آن کمتر از 2 کیلوبایت است. هیچ گزینه‌ای برای تنظیم ندارد و خیلی ساده نصب و لود تنبل فعال می‌شود.
نتیجه گیری و توصیه‌ها
هر چهار گزینه‌‌ی بیشترین تلاش را برای بهبود سرعت وب سایت شما، لود تنبل تصاویر و ویدیوها و در نهایت برای سئو عکس انجام می‌دهند. اینکه کدام را برای کار در وبسایتتان انتخاب کنید یک انتخاب شخصی است و براساس عملکرد و همچنین به نوعی که ترجیح می‌دهید تصاویر و ویدیوها لود شوند بستگی دارد.
- اگر شما تصاویرتان را قبل از آپلود بهینه سازی نمی‌کنید و حتما هم به آنها نیاز دارید ، بهتر است که از افزونه a3 Lazy Load استفاده کنید ، زیرا این افزونه به شما تصاویری بهینه شده تحویل خواهد داد.
- اگر شما تصاویرتان را قبل از آپلود بهینه سازی می‌کنید و به دنبال این هستید که با حداقل تلاش بهترین تحویل ممکن را به کاربر ارائه دهید ، با افزونه BJ lazy load به هیچ مشکلی بر نمی‌خورید. افزونه Rocket Lazy Load نیز دیگر انتخاب شما میتواند باشد.
- اگر شما تصاویرتان را قبل از آپلود بهینه سازی می‌کنید و قصد دارید که علاوه بر لود تنبل ، بتوانید گزینه‌های اضافه‌تری مانند کوچکتر کردن فایل‌های جاوااسکریپت و سی اس اس و همچنین تغییر مکان آنها به فوتر را داشته باشید ، بهتر است که از افزونه Lazy Load TX استفاده کنید.
لود تنبل یکی از چندین تکنیک موجود برای افزایش سرعت وب سایت وردپرس شماست. با این حال ، اگر از تصاویر و ویدیوهای زیادی در وب سایتتان استفاده می‌کنید باید بدانید که لود تنبل پتانسیل آن را دارد که تاثیر عمیقی بر افزایش سرعت داشته باشد. علاوه‌بر این ، هنگامی که از لود تنبل استفاده می‌کنید ، چندین تکنیک دیگر نیز وجود دارند که میتوانید آنها را هم در نظر بگیرید و با پیاده سازی آن بهترین سرعت عملکرد را در وب سایت خود حس کنید.
نصب Cloudflare و آموزش تنظیمات کلود فلر
نصب Cloudflare و آموزش تنظیمات کلود فلر
در این مقاله قصد داریم آموزش استفاده از cdn یعنی یکی از بهترین سی دی ان های دنیا به نام کلود فلر را به شما بدهیم در این آموزش بخش‌های مختلف کلودفلیر مورد بررسی قرار گرفته و تنظیمات لازم حتی برای وردپرس هم اشاره شده. و درباره مهم‌ترین دغدغه کاربران یعنی ssl رایگان موجود در Cloudflare.com برای دامنه های ir و سایر دامنه‌ها به شکل کلی آموزش داده شده است. با سئوراز همراه باشید.
سرفصل‌های پست
- 1 Cloudflare چیست و نحوه فعال سازی و آموزش تنظیمات آن
- 2 آموزش نصب کلود فلر (Install Cloudflare)
- 2.1 مرحله اول – اضافه کردن سایت در کلودفلر
- 2.2 مرحله دوم – تنظیم DNS در کلودفلر
- 2.3 مرحله سوم – انتخاب پنل
- 2.4 مرحله چهارم – تنظیمات NameServers
- 2.5 مرحله پنجم – تنظیم IP و DNS
- 2.6 مرحله ششم (اختیاری) – نصب افزونه کلودفلر در وردپرس
- 3 بررسی اجمالی بر روی تنظیمات کلودفلر
- 4 مشکل رایج Cloudflare در طراحی سایت (طراحی سایت شرکتی،طراحی سایت فروشگاهی، قیمت طراحی سایت) ها
- 5 تنظیمات اضافه برای کلودفلر
Cloudflare چیست و نحوه فعال سازی و آموزش تنظیمات آن
کلودفلر یا به انگلیسی Cloudflare یک شرکت ارائه دهنده خدمات شبکه تحویل محتوا (CDN) ، دارای تنظیمات DNSپیشرفته، محافظت کننده از حملات DDOS و خدمات امنیتی می باشد. آنها به علت ارائه SSL رایگان و افزایش سرعت و تنظیمات بهینه DNS ، و ارائه دادن یک شبکه قوی و قدرتمند شامل بیشتر از 100 سرور مختلف در سراسر جهان شهرت بسیار زیادی در جامعه و صنعت شبکه و وب به دست آورده‌اند.
آنها توسط شرکت های نام آشنا و مشهوری مانند گوگل ، مایکروسافت و کوالکام پشتیبانی می‌شوند و از مشتریان معروف آنها می‌توانیم به سیسکو ، zendesk ، Digital Ocean و nasdaq اشاره کنیم.
البته سایت‌های بزرگ ایرانی همانند دیجی کالا و بامیلو هم نیز در مقطعی از زمان از این سرویس CDN قدرتمند استفاده می‌کردند.
برای استفاده از سرویس‌های Cloudflare در وب سایت وردپرسی خود مراحل زیر را با دقت در سئوراز دنبال کنید. ما در وب سایت سئوراز برای افزایش سرعت سایت بیشتر به اکثر کاربرانمان که هاست خارجی دارند استفاده از Cloudflare را پیشنهاد میکنیم و اگر قصد تهیه پنل‌های پولی این شرکت را دارید مکان هاست اهمیت چندانی ندارد. اگر از هاست ایران استفاده می کند و میخواهید کلود فلر را بر روی سایت خود فعال کنید ممکن است ساخت سایت شما با اختلالات لحظه‌ای مواجه شود، اگر سایت شما بر روی هاست ایران است بهتر است از cdn های ایرانی مانند ابر آروان استفاده کنید که با هاست های ایرانی سازگاری کامل دارد.
اگر شما به دنبال یک راه آسان برای بهبود سرعت سایت و افزایش امنیت وب سایت وردپرسی خود هستید، سایت Cloudflare.com با امکاناتی که به شما ارائه می‌دهند یکی از بهترین انتخاب‌های شماست.
بیشتر مشتریان سایت Cloudflare از سرویس رایگان این شرکت استفاده می‌کنند، در سرویس رایگان این شرکت به شما یک پنل با امکان استفاده از CDN با پهنای باندی نامحدود، SSL رایگان ولی با یک سری امکاناتی محدود داده می‌شود.
در این پست آموزش استفاده از سی دی ان cloudflare سعی خواهد شد به جنبه‌های مختلف این ابزار پرداخته شود.
نکته: برای استفاده از سرویس های رایگان Cloudflare شما می بایست DNS مخصوصی که این سایت برای دامنه شما می‌سازد را روی دامنه خود تنظیم کنید و این بدان معناست که شما با استفاده از Cloudflare امکان داشتن DNS اختصاصی با نام دامنه خود را ندارید.
آموزش نصب کلود فلر (Install Cloudflare)
خب به آموزش نصب cloudflare رسیدیم، در آموزش فعال سازی کلود فلیر تصور شده است که شما از قبل یک اکانت کاربری در وب سایت Cloudflare ایجاد کرده اید. اگر تا به حال در این وب سایت ثبت نام نکردید ، وارد وب سایت Cloudflareشوید و ثبت نام کنید چرا که برای استفاده از کلودفلر طبیعتا نیاز به ثبتنام است.
مرحله اول – اضافه کردن سایت در کلودفلر
وارد اکانت کاربری خود در وب سایت Cloudflare شوید و روی “+ Add Site” کلیک کنید. آدرس وب سایت وردپرسی و یا غیر وردپرسی خود را وارد کنید و روی “Being Scan” کلیک کنید. (توجه داشته باشید که نیازی به وارد کردن http/https و www. نیست)
این عملیات 1 تا 2 دقیقه طول می‌کشد ، سپس باید روی “Continue Setup” کلیک کنید.
مرحله دوم – تنظیم DNS در کلودفلر
در مرحله دوم آموزش تنظیمات cloudflare به قسمت مهم DNS ها می‌رویم. کلودفلر برای DNS ها به شما دو خدمت ارائه میکند (On Cloudflare و Off Cloudflare) که اولین خدمت استفاده از CDN و امکانات امنیتی است و دیگری نیز تنها متصل کردن یکی از رکورد ها از طریق کلودفلر به سروری دیگر است و در این خدمت هیچ امکان CDN و امنیتی به شما تعلق نمی‌گیرد و شما مستقیم به سرور مقصد متصل می‌شوید .
بیشتر کاربران بسته به نیازشان سعی می‌کنند که هرچیزی که کلود فلر پیشنهاد میکند را در DNS خود رعایت کنند .
برای اینکه مطمئن شوید که رکورد DNS شما به کلودفلر متصل است و از خدمات CDN و امنیتی آن استفاده میکند به ابر جلوی رکورد DNS نگاه کنید و مطمئن شوید که نارنجی رنگ است و اگر نارنجی رنگ نیست با یک کلیک رو ابر، آن را به ابر نارنجی تغییر دهید (این کار باعث فعال شدن امکانات کلود فلر در رکورد DNS شما می‌شود).
همچنین اگر شما رکوردهای اضافه‌ای مانند رکوردهای MX در دامنه خود دارید سعی کنید که آن رکوردها را از Cloudflare جدا کنید و برای جداسازی باید امکان استفاده از خدمات CDN را در آن رکورد غیرفعال کنید (ابر رنگ طوسی به معنای غیرفعال می‌باشد).
هنگامی که تمامی رکورد ها را وارد کردید روی Continue کلیک کنید . این رکوردها را بعدا نیز میتوانید در هرزمان که خواستید تغییر دهید.
مرحله سوم – انتخاب پنل
در مرحله بعدی آموزش استفاده از CDN وبسایت Cloudflare شما می بایست بسته یا Plan کلودفلر خود را انتخاب کنید که ما در این آموزش بسته رایگان را انتخاب میکنیم، برای هاست‌های داخلی (هاست ایران) پنل رایگان توصیه نمی‌شود.
بعد از انتخاب بسته مورد نظر روی Continue کلیک می کنیم . برای اطلاع بیشتر از امکانات بسته ها به قسمت Plan وب سایت Cloudflare مراجعه کنید.
مرحله چهارم – تنظیمات NameServers
در این مرحله از آموزش cloudflare شما باید نیم سرورهای دامنه (NS) خود را به آنچه Cloudflare تعریف کرده است ، تغییر دهید .
از آنجایی که Cloudflare مانند یک Proxy عمل میکند ، با اتصال نیم سرور های دامنه خود به این شرکت ، کاربر برای دسترسی به سایت شما بعد از وارد کردن URL وب سایت شما مستقیما به نزدیک ترین سروری Cloudflare به منطقه محل زندگی وی دارد متصل می‌شود و این باعث افزایش سرعت بارگذاری وبسایت شما می‌شود.
قابل توجه عزیزانی که ترس از قطع شدن وب سایتشان هنگام تغییر نیم سرورها را دارند: با توجه به تغییر نکردن سرور مبدا شما پس از تغییر نیم سرورهای وبسایت هیچگونه قطعی و یا به اصطلاح DownTime نخواهید داشت.
بعد از تغییر نیم سرورها به آنچه که Cloudflare تعریف کرده است ، روی Continue کلیک کنید.
تغییر نیم سرور ها ممکن است از 1 تا 72 ساعت به طول انجامد مخصوصا در دامنه‌های ir که زمان زیادی لازم دارد.
مرحله پنجم – تنظیم IP و DNS
اگر شما از آن دسته افرادی هستید که برای وب سایتتان دی ان اس (DNS) و ای پی اختصاصی (IP) گرفته‌اید و فراموش کردید که در قسمت DNS کلود فلر وارد کنید ، میتوانید از طریق منو وارد بخش DNS ها شوید و DNS و IP اختصاصی خود را در کلود فلر وارد کنید و یا تغییراتی در DNS هایتان ایجاد کنید.
بخش تنظیمات DNS در کلودفلر یک استفاده دیگر هم دارد و آن اینکه اگر زمانی انتقال هاست صورت گرفت کافی است IPهاست قدیم را در این بخش به IP هاست قدیم تغییر دهید.
حال به ادامه آموزش استفاده از این CDN می‌رویم و اگر تمامی مراحل را انجام دادید . سایت شما به کلود فلر متصل شده.
مرحله ششم (اختیاری) – نصب افزونه کلودفلر در وردپرس
یک مرحله اضافه‌تر از آموزش تنظیمات cloudflare برای کاربران استفاده کننده از وردپرس وجود دارد که اجباری نیست ولی استفاده از پلاگین رسمی Cloudflare در وردپرس جلوی اشکالات را می‌گیرد.
شما میتوانید پلاگین رسمی Cloudflare را از مخزن وردپرس و یا با یک جستجو در قسمت افزودن افزونه بهلیست پلاگین های خود اضافه کنید.
از امکانات این پلاگین می توان به امکانات زیر اشاره کرد :
- رفع بعضی از مشکلات بخش نظرات وردپرس
- پاک کردن حافظه کش خودکار
- نوشتن یک سرصفحه برای جلوگیری از انتقال های غیر قانونی هنگامی که SSL فعال است.
- امکان تغییر تنظیمات اکانت Cloudflare از پلاگین
- امکان تماشای تعداد کلی بازدید کنندگان ، میزان پهنای باند ذخیره شده و تهدید های مسدود شده
- پشتیبانی از HTTP2/Server Push
پس از نصب پلاگین رسمی کلودفلر روی وردپرس ، شما باید ایمیل و API اکانت خود را وارد کنید. (برای دریافت API خود وارد اکانت کلودفلر شوید و روی my profile کلیک کنید .
سپس در بخش API روی View API Key رو به روی Global API Key کلیک کنید و API خود را کپی و در پلاگین وردپرس بارگزاری کنید )
بعد از وارد کردن ایمیل و API رو Save API Credentials کلیک کنید.
بررسی اجمالی بر روی تنظیمات کلودفلر
در زیر تب Home ، بهتر است که روی Apply کلیک کنید تا تنظیمات پیشفرض اعمال شود .
در زیر تب Settings ، اگر از کاربران Pro کلود فلر باشید میتوانید بهینه سازی تصاویر و حالت توسعه را فعال کنید .
همچنین میتوانید سطح امنیتی وب سایت خود را تعیین کنید و از طرفی باعث شوید تمام منابع سایت شما بر روی HTTPSتنظیم شود.
در زیر تب Analytics ، شما میتوانید لیست پهنای باند ذخیره شده ، تهدید های مسدود شده و تعداد کل بازدید کنندگان خود را مشاهده کنید.
مشکل رایج Cloudflare در سایت‌ها
سایت Cloudflare به عنوان هدیه به تمامی دامنه های بین المللی (به جز دامنه ir) یک گواهینامه دو ساله SSL می‌دهد (کلودفلر امکان استفاده https را به طور کلی برای دامنه های ir بسته است و به قولی SSL را برای این دامنه‌ها تحریم کرده است).
مشکل رایج آنجا شروع می‌شود که وبسایت شما قبل از ثبت نام در Cloudflare گواهینامه SSL دیگری داشته باشد که در این صورت به علت ناهمخوانی دو SSL و همچنین تلاش برای جایگزین کردن خود به جای آن یکی وب سایت شما دچار مشکل میکند.
در این مواقع شما می بایست وارد اکانت کلودفلر خود شده و در بخش SSL ، گواهینامه SSL را به شکل Flexible در بیاورید که مشکلات را از بین ببرید و گواهینامه ها را از جنگ با یکدیگر در بیاورید.
تنظیمات اضافه برای کلودفلر
آنچه ما در این آموزش cloudflare گفتیم تنها آشنایی مختصر شما با کلودفلر بود و امیدواریم آموزش استفاده از تنظیمات اینCDN معروف مورد استفاده شما قرار گرفته باشد.
سئو داخلی سایت – On Page Seo
سئو داخلی سایت – On Page Seo
قدم اول در سئو هر سایتی سئو داخلی (On Page SEO) آن سایت است، پس پیشنهاد می‌شود تک تک خط‌های این آموزش جامع دنبال کنید.
برای دسترسی سریع‌تر قسمت‌های مختلف مقاله سئو داخلی سایت یا On Page SEO میتوانید از سرفصل‌های زیر استفاده نمایید، همینطور قبل از خواندن این مقاله کاغذ و قلم برداشته و هر قسمتی را که می‌خوانید، بر روی سایت خود پیاده کرده و مورد ارزیابی دقیق قرار دهید.
این مقاله در سال ۲۰۱۸ چندین بار آپدیت شده است.
سرفصل‌های پست
- 1 آموزش سئو داخلی – On-Page SEO
- 2 سئو داخلی چیست
- 3 Meta Tag (متا تگ ها)
- 4 Title Tag (تگ عنوان)
- 5 Meta Descriptions (متا توضیحات)
- 6 تگ های هدینگ (Tags Heading)
- 6.1 فاکتور سئو داخلی سایت در تگ های هدینگ و عنوان
- 6.2 رابطه هدینگ با زیرهدینگ ها در سئوی داخلی
- 7 تاثیر URL در سئو داخلی سایت
- 8 محتوای کاربرپسند و معتبر
- 9 نسبت به الگوریتم های گوگل آگاه باشید
- 10 کلمات کلیدی هدفمند
- 11 لینک های داخلی و خارجی
- 12 بهینه سازی تصاویر
- 13 واکنشگرا برای موبایل
- 14 سرعت سایت
- 15 تجربه کاربری خوب یعنی بهبود سئو داخلی
- 16 صفحه کاملا بهینه شده برای نرخ تبدیل کاربر به مشتری
- 17 خلاصه هر آنچه که در سئو داخلی (On Page) گفته شد
- 18 اینفوگرافیک سئوی داخلی سایت
آموزش سئو داخلی – On-Page SEO
اینترنت بازار پر سروصدایی است. چگونه باید خدمات اینترنتی خود را بهبود دهیم تا صدایمان شنیده شود؟ در بازاریابی اینترنتی همه چیز از سئو داخلی سایت آغاز می‌شود که باعث رسیدن شما به اوج عملکردتان در وب سایت و دیده شدنتان توسط مخاطبان می‌شود، و بدانید که این فاکتور بسیار مهم در هر زمان که می‌گذرد به اهمیت آن افزوده می‌شود.
درطول چند سال گذشته، قوانین سئو سایت با افزایش تلاش‌های گوگل برای مطمئن شدن از ارائه بهترین نتایج در موتور جستجو به کاربران به‌شدت تغییر کرده است، و این تغییرات همیشه ادامه پیدا خواهد کرد. امروزه نتایج جستجو صفحاتی را نمایش می‌دهند که لزوماً عبارت جستجو شده با کلمه کلیدی موجود در عنوان، تگ‌ها یا توضیحات متا در سایت‌ها مطابقت ندارند و این هوشمندی موتورهای جستجو را نشان می‌دهد.
در حال حاضر با پیشرفت الگوریتم‌های رتبه دهی شامل مرغ مگس خوار (Hummingbird)، پاندا (Panda) و رنک برین (RankBrain)، اهمیت معنایی در صفحات روزبه‌روز بیشتر می‌شود و همچنین هر روز گوگل باهوش‌تر می‌شود و استراتژی سئوی داخلی شما هم نیز باید همینطور شود.
سئو داخلی چیست
اگر عبارت “on-page SEO” را در گوگل جستجو کنید، سایت Moz پاسخ به این جستجو را در قالب یک اسنیپت این‌گونه می‌دهد:
عمل بهینه سازی صفحات اختصاصی سایت در جهت کسب رتبه بالاتر و به دست آوردن ترافیک از موتورهای جستجو.
سئو داخلی (بهینه سازی داخلی) و سئو خارجی (بهینه سازی خارجی) وابسته و مکمل هم هستند ولی فرق این دو در این است که سئوی داخلی سایت شامل محتوا و کدهای HTML می‌باشد و روندی است که نتیجه حاصل از آن کاملا در دست شما می‌باشد و قابل کنترل است ولی سئوی خارجی شامل بک لینک ها و سایر منابع خارجی هستند و روند نتیجه حاصل از آن به شکل کامل در دست شما نمی‌باشد. در سئوی داخلی سایت (بهینه سازی داخلی سایت)، تمام جنبه‌های صفحات سایت در نظر گرفته‌شده و زمانی که تمام آنها در کنار هم قرار می‌گیرند باعث بهبود رتبه در نتایج جستجو می‌شوند. الگوریتم‌های گوگل در حال پیچیده‌تر شدن هستند، یکی از عوامل عمده تأثیرگذار در سئوی داخلی سایت، ارتباطات است. چه مقدار صفحه شما با جستجوی انجام‌شده مرتبط است؟ و سیاست‌های شما در مرتبط کردن مقاله‌های سایت چگونه بوده است؟ این‌ها مواردی هستند که هنگام توسعه سایت و بررسی فاکتورهای سئو داخلی ، باید به آنها بیندیشید و بهترین استراتژی ممکن برای کسب و کار خود را فراهم سازید.
شما حدود 8 ثانیه وقت دارید که کاربر را تحت تأثیر قرار دهید تا با وبسایتتان ارتباط برقرار کند هر چند در گوشی‌ها این زمان بسیار کمتر است و زیر ۵ ثانیه در پلتفرم‌های موبایل فرصت اولیه برای جلب توجه کاربران را دارید (برای تست سرعت سایت خود در گوشی بهترین ابزار thinkwithgoogle است که قدرت گرفته از گوگل می‌باشد و به شما نشان می‌دهد که اگر سرعت پایینی داشته باشید چه میزان باعث ضرر و نرخ دفع کاربری می‌شود، البته در ادامه مقاله به سرعت سایت نگاه کامل‌تری می‌اندازیم). هرچقدر که بستر تعامل با سایت بیشتر باشد، کاربران زمان بیشتری را در وبسایتتان سپری می‌کنند و درنتیجه باعث بهبود تجربه کاربری می‌شود به آن معنا که این تعامل تجربه بهتری برای کاربران و هم برای شما می‌آفریند.
اگر در این زمینه‌های اشاره شده فعالیت بهینه ای داشته باشید، شاهد افزایش بازدید، بالا رفتن ترافیک و گسترده‌تر شدن کسب و کارتان در فضای مجازی خواهید بود. زمانی که در حال خواندن فاکتورهای مربوط به سئو داخلی سایت در این مقاله هستید، قلم و کاغذی بردارید و با فاکتورهای ذیل، سایت خود را بررسی کنید تا مطمئن شوید که اکثر فاکتورها را اجرا کرده باشید. بدنه و ساختمان سایت را تجزیه و تحلیل کنید تا ببینید که چگونه عمل میکند. و دوباره بعد از مدتی به این مقاله سر زده و هم از آپدیت‌های آن آگاه شوید و هم نتیجه حاصل از تغییرات خود را دوباره با فاکتورهای موجود بررسی کنید تا در طول زمان سئوی داخلی سایت شما با کاهش رتبه روبه‌رو نشود چرا که سئوی امروز با سئوی فردا ممکن است تفاوت کند.
Meta Tag ها
شاید یکی از مهم‌ترین فعالیت‌های سئو داخلی، قرار دادن تگ ها می‌باشند. بعضی از تگ ها به‌اندازه گذشته برای سئو سایت مهم نیستند، اما اگر به طرز صحیحی نوشته و بهینه سازی شوند میتواند باعث افزایش ترافیک سایت شما شود.
Meta Tag ها اطلاعاتی درباره صفحات سایت برای موتورهای جستجو فراهم می‌کنند. به‌منظور رسیدن به رتبه بالاتر، این امر باید براساس ارتباطات و رضایت کاربران انجام شود و علاوه براین، متا تگ های نوشته‌شده توسط انسان نسبت به متاتگ‌هایی که CMS ها به شکل پیشفرض و اتوماتیک درج می‌کنند، تأثیر بهتری بر روی کاربران و افزایش نرخ کلیک دارد چرا که انسان حس نزدیک‌تری به هم نوع خود دارد یا یک ربات، و همچنین می‌توان از خلاقیت ذهن انسان در نحوه نوشتن متن‌ها در جهت کسب بازدیدکننده و بهبود نرخ کلیک استفاده کرد.
متاتگ‌های دیگری هم در on page seo وجود دارد مثل متاتگrobots که شما میتوانید با این متاتگ به ربات‌های جستجوگر اعلام کنید که این صفحه یا این آدرس از سایت را ایندکس نکن (ایندکس یعنی در نتایج جستجو نشان نده) یا لینک‌های این صفحه یا این آدرس از سایت را دنبال نکن، البته دستورات بیشتری می‌توان از طریق این متاتگ مورداستفاده قرارداد و تنظیم کردن آن اهمیت بالایی دارد، حتما حتما پیشنهاد میکنم مقاله متاتگ robots حداقل یک بار نگاهی بیندازید.
Title Tag
تگ های مختلفی در صفحات وجود دارند. مهم‌ترین آنها تگ عنوان صفحه می‌باشد. عنوان چیزی است که کاربران در موتورهای جستجو در نتایج طبیعی (SERP) و تبلیغاتی می‌بینند.
تگ عنوان یا تگ تایتل نشان‌دهنده موضوع صفحه می‌باشد. هنگام رتبه دهی صفحات براثر سرچ کاربر گوگل به مقایسه عنوان صفحه با مطالب صفحه می‌پردازد.
کد مربوط به تگ عنوان صفحه در HTML به‌صورت زیر است:
پلاگین Yoast در وردپرس به شما این امکان را می‌دهد تا عنوان های دلخواه ایجاد کنید. توجه داشته باشید که این افزونه صرفاً یادآور برخی نکات در بهینه سازی داخلی سایت است و این هنر وبمستران و مدیران سایت است که چگونه و با چه سیاست‌های هوشمندانه‌ای بتوانند از این افزونه مناسب وردپرس استفاده کنند. برای داشتن عنوان دلخواه بهتر است از تگ های کوتاه و توصیف‌کننده استفاده کنید. اخیراً گوگل تعداد کلمات عنوان صفحه را به 70 کلمه افزایش داده است.
آپدیت (Sep 05 2018): جدا از طول یک تایتل که مهم است باید به طول پیکسلی عنوان های خود هم دقت کنید و سعی کنید عنوان های سایت خود را کمتر از 600PX ایجاد کنید. این ابزارمی‌توانید در این راستا به شما کمک کند.
بهتر است که تعداد کلمات عنوان کمتر از تعداد مجاز تعیین‌شده باشد. اگر از افزونه یوآست سئو استفاده نمی‌کنید میتوانید از Snippet Optimizerبرای شبیه سازی و نحوه نمایش عنوان و توضیحات در نتایج جستجو استفاده کنید.
از عنوان های هوشمندانه، جذاب و مربوط به متن صفحه استفاده کنید تا این نشان‌دهنده (عنوان) صفحات شما در برابر رقبایتان بهترین عملکرد را در جذب بازدیدکننده داشته باشد. مطمئن شوید عنوان تمام اطلاعات مربوطه ازجمله کلمات کلیدی و در صورت نیاز محل کسب‌وکارتان را شامل می‌شود.
درحالی‌که توصیه می‌شود از کلمات کلیدی اصلی در عنوان استفاده کنید، گوگل در حال حرکت به سمت ارتباطات و معناگرایی در نتایج است. کاربران کورکورانه اولین نتیجه را انتخاب نمی‌کنند، بلکه عنوان ها و توضیحات را مطالعه کرده و مناسب‌ترین گزینه را انتخاب می‌کنند، بنابراین نهایت دقت را در نحوه نوشتن عنوان مطالب سایت خود داشته باشید.
Meta Description
متا دیسکریپشن یا متا توضیح، یک متن خلاصه شده از مواردی است که کاربران در صفحه خواهند یافت. درحالی‌که این مورد از فاکتورهای اصلی رتبه دهی و سئوی داخلی نیست ولی موتورهای جستجو تگ متا دیسکریپشن را ایندکس کرده تا موضوع صفحه را بهتر مشخص کنند.
توجه داشته باشید که درست است Meta Descriptions تاثیری به شکل مستقیم در سئو یک سایت ندارد، ولی یکی از اهداف سئو افزایش فروش محصولات در سایت است و یک متا دیسکریپشن خوب، میتواند مزیتی رقابتی در نتایج جستجو و افزایش نرخ کلیک بیشتر با احتمال تبدیل بازدیدکنندگان به مشتری (نرخ تبدیل) ایجاد کند. البته این احتمال وجود دارد که گوگل در آینده توضیحات سفارشی را حذف کند و گزیده‌ای از محتوای صفحه را جایگزین آن کند، همواره توصیه می‌شود تمامی تگهای متا را با اطلاعات مناسب پر کنید.
بهترین راه بررسی اینکه کدام‌یک از صفحات فاقد توضیحات متا دیسکریپشن هستند، این است که وبسایتتان را در Screaming Frogs SEO Spider بررسی کنید. این ابزار تمامی URL های تحت دامنه شما، متا توضیحات و طول آنها را نمایش می‌دهد. همچنین در ابزار سرچ کنسول گوگل شما میتوانید متا دیسکریپشن های تکراری در آدرس های مختلف سایت خود را به راحتی پیدا و رفع کنید.
در اوایل 2016 گوگل طول توضیحات متا را برای دسکتاپ و موبایل افزایش داد. برای دسکتاپ، کاربران تا 200 کاراکتر را می‌بینند، درحالی‌که در موبایل آنها تا 172 کاراکتر را مشاهده خواهند کرد. به‌منظور جذب کاربران در هر دو دستگاه، کاراکترها را بین 165 تا 175 قرار دهید.
آپدیت (Dec 8 2017): چند ساعت پیش از نوشتن این متن در حال آنالیز سایت مشتری سئوراز بودیم که متوجه شدیم طول متادسکریپشن بیشتر شده و گاهی برای برخی سایت ها از ۲۰۰ کاراکتر هم بیشتر در SERP گوگل نشان می‌دهد، طبق تحقیقی که انجام دادیم به این نتیجه رسیدیم که گوگل در حال حاضر در برخی از نتایج، برخی از طول توضیحات سایت را بیشتر قرار می‌دهد که این میتواند کمک بسیاری به کاربر برای انتخاب صحیح مقصد خود نمایید. (عکس زیر مربوط به میانگین طول توضیحات سایت‌ها در SERP است، میانگین طول این متاتگ به 228 کاراکتر می‌رسد.)
آپدیت (July 01 2018): همانطور که در بالا اشاره شده بود گوگل طول متادسکریپشن را افزایش داده بود ولی در این تاریخ که مقاله آپدیت می‌شود ۲ هفته‌ای است به همان روال سابق برگشته و اندازه و طول Meta Description نزدیک به ۱۶۰ کاراکتر است.
آپدیت (Sep 05 2018): هر چند گوگل به تعداد کاراکتر اهمیت می‌دهد ولی طول پیکسلی عنوان و دسکریپشن هم نیز مورد اهمیت قرار دارد. و سعی کنید دسکریپشن سایت شما بیشتر از 930 پیکسل نباشد.
به‌طورکلی آنچه را که کاربران قرار است در هر صفحه بیابند را در این متا به شکل اصولی خلاصه کنید. نام برندتان و مختصری از آن را در یک یا دو کلمه کلیدی قرار دهید. به مخفف سازی و سایر عباراتی که منظور را می‌رسانند توجه کنید و از آنها استفاده کنید. این اولین تعاملی است که بسیاری از کاربران با برند شما خواهند داشت. کاری کنید که خوشایند باشد.
به متا توضیحات مانند متن تبلیغات طبیعی نگاه کنید. به کاربران بگویید با کلیک بر روی لینک به چه چیزی در سایتتان می‌رسند.
به‌منظور رسیدن به ترافیک ثابت سایت، باید از تگهای عنوان و دسکریپشن آغاز کنید. اگر محصولی دارید از تخفیفات و پیشنهادهای وسوسه‌انگیز استفاده کنید و کاربران را به کلیک کردن بیشتر ترغیب کنید. زمانی که به‌اندازه کافی کلیک دریافت کردید یعنی این دو متاتگ (متاتگ عنوان و متاتگ توضیحات) به خوبی کارشان را انجام داده‌اند پس از این مرحله همه‌چیز بستگی به تجربه کاربری (UX) و کیفیت محتوا دارد.
تگ های هدینگ (Tags Heading)
صفحه فرود (لندینگ پیج) یا صفحه هدف باید چندین تگ heading شامل h1 تا h6 داشته باشد. مهم‌ترین تگ h1 است. هیچ‌گاه نباید بیشتر از یک تگ h1 در هر صفحه داشته باشید. اما میتوانید از تعداد دلخواهی از تگهای h2 و h3 استفاده کنید. از این تگ ها به‌عنوان subheading استفاده می‌شود. این نکته را در نظر بگیرید که وقتی می‌گوییم به تعداد دلخواهی میتوانید از تگ h۲ در صفحات استفاده کنید به این معنی نیست که میتوانید ۱۰۰ بار در یک صفحه استفاده کنید، سعی کنید هیچ‌گاه به شکل غیراصولی از فاکتورهای سئو استفاده نکنید چرا که ممکن است باعث بالا رفتن احتمال پنالتی سایت توسط گوگل شود.
از بیش از یک تگ h1 در صفحات استفاده نکنید. این استفاده نادرست باعث آسیب‌های جدی به سئو سایت ها می‌شود مخصوصاً اگر سایت نو پا باشد و ممکن است گوگل در رتبه دهی به صفحات دچار اشتباه می‌شود یا فکر کند در حال دور زدن آن هستید.
از هدینگ ها (heading) به‌منظور نمایش دادن بخش‌های مختلف صفحه استفاده کنید. تأثیر این موضوع را می‌توان هم از نگاه سئو داخلی سایت (بهینه سازی داخلی سایت) برای ربات‌ها در نظر گرفت و هم اینکه این موضوع کاربرپسند است و کاربران راحت‌تر می‌توانند در مقاله به دنبال پاسخ خود بگردند، مخصوصاً اگر مقاله‌ها همانند این مقاله طولانی باشند.
فاکتور سئو داخلی سایت در تگ های هدینگ و عنوان
به‌عنوان یکی از فاکتورهای سئو داخلی ، استفاده از کلمات به‌کاربرده شده در تگ های heading در عنوان صفحه، دید واضحی نسبت به موضوع صفحه برای کاربران فراهم میکند. الگوریتم موتورهای جستجو بخش‌های محتوای زیر هر تگ عنوان را با خوده عنوان مقایسه کرده و بین آنها ارتباط ایجاد میکند. Heading باید به منظور شکل دهی به صفحه استفاده شوند. مطمئن شوید که Heading با محتوا همخوانی دارند.
کلمه کلیدی اصلی، باید در بخشی از صفحه و در تگ h1 گنجانده شود. از قرار ندادن h1 یا مخفی کردن آن در صفحه خودداری کنید، زیرا این تگ به کاربران و گوگل اجازه می‌دهد موضوع صفحه را درک کنند. بسیاری از سایت ها مخصوصا سایت های وردپرسی، به طور خودکار عنوان صفحه را در تگ h1 قرار می‌دهند. برای مطمئن شدن از وجود h1، به کدهای HTML صفحه نگاه کنید. به منظور پیدا کردن تگ h1 بر روی یک قسمت از صفحه سایت کلیک راست کرده و گزینه view-source را انتخاب کنید و سپس با زدن دکمه F3 عبارت h1 را تایپ کنید.
در زمان تعیین heading یک سری فاکتورهایی وجود دارد که بهتر است از آنها پرهیز کنید تا جایگاهتان در موتورهای جستجو حفظ کنید، از جمله می‌توان به استفاده غیرضروری از کلمات کلیدی در تگ های مذکور اشاره کرد.
پلاگین Yoast Seo در وردپرس، در بهینه سازی صفحات به شما کمک میکند. این پلاگین عوامل داخلی صفحه را در جهت بهبود سئو داخلی صفحات، تحلیل میکند. یکی از مزایای این پلاگین هشدار دادن در صورت وجود هرگونه مشکلی از جمله عنوان صفحه، متا توضیحات ، هدینگ ها، تصاویر، محتوا و غیره می‌باشد.
رابطه هدینگ با زیرهدینگ ها در سئوی داخلی
توجه داشته باشید، در صفحات فرود و بعضی سایت ها، کاربران تمام محتوای صفحه را مطالعه نمی‌کنند. آنها مطالب را به‌صورت کلی مرور می‌کنند و به دنبال بخش‌هایی می‌گردند که پاسخگوی سؤال آنها باشد یا برای آنها ارزشمند یا جذاب باشد. تگ های Heading و subheading صفحه را به چندین بخش تبدیل و ارائه مطلب را واضح‌تر می‌کنند.
Subheading به کاربر کمک میکند در میان صفحات حرکت کنند. اگر در نوشته‌ها و مقالات خود در حال تغییر موضوع هستید یا دیدگاه متفاوتی نسبت به آن موضوع را شروع کرده‌اید، از تگ های h2 استفاده کنید. اگر همان موضوع را به چند بخش تقسیم کرده‌اید و به subheading نیاز دارید، از تگ های پایین‌تر مثل h3 استفاده کنید.
تگهای Heading ها نباید نادیده گرفته شوند. آنها بیشتر از یک پاراگراف استاندارد، مفهوم درون خود دارند. همیشه زمانی که در حال نوشتن مطلبی هستید خواننده‌ها را به خاطر داشته باشید. نباید نوشته‌ها این‌گونه باشند که از یک کلمه کلیدی به‌منظور بهینه سازی، بیش‌ازحد استفاده‌شده باشد چرا که این موضوع میتواند سرمایه‌های سایت شما یعنی کاربران را به خسته کند.
به عنوان مثال بنده نیز خود یک بازدیدکننده به شمار میروم، هر زمان که به دنبال مقاله‌ای در سایت‌ها هستم، قبل از خواندن مقاله به عنوان‌ها و زیرعنوان‌های کل صفحه نگاهی کوتاه می‌اندازم و براساس نیازهای خود برآورند میکنم که آیا این همان مقاله ای هست که میخوام یا خیر و اگر عنوان‌ها به خوبی برای رفع نیازهای من قابل فهم نباشد قطعا به دنبال سایت دیگر میگردم.
تاثیر URL در سئو داخلی سایت
URL ها باید کوتاه، مختصر، خوانا و قابل‌فهم باشند. چطور می‌توان URL (آدرس) مناسبی ایجاد کرد؟
در تحقیق درباره اندازه URL به این نتیجه رسیدم که URL های کوتاه‌تر رتبه بهتری می‌گیرند. در این تحقیق طول URL و تعداد فولدرها موردتوجه قرار گرفت. دامنه اصلی به عنوان یک فولدر و هر اسلش بعد از دامنه اصلی نیز به عنوان یک فولدر جدا در نظر گرفته شد.
- http://domain.com (یک فولدر)
- http://domain.com/folder (دو فولدر)
- http://domain.com/folder1/folder2 (سه فولدر)
نتیجه این تحقیق نشان داد URL های با تعداد فولدرهای کمتر رتبه بهتری می‌گیرند. Rand Fishkin از Moz می‌گوید:
[quote arrow=”yes”]فولدرهای زیاد در آدرس برای کاربران و موتورهای جستجو گم‌راهی بیشتر به همراه دارد و همینطور ویرایش URL را پیچیده‌تر میکند.[/quote]
دقت کنید که هر کلمه در URL باید با استفاده از خط فاصله(-) جدا شود. در نام‌گذاری‌ها از (_) استفاده نکنید. URL را کوتاه نگه دارید. هرچه URL کوتاه‌تر باشد راحت‌تر می‌توان آن را به اشتراک گذاشت. با این کار خوانندگان سریع‌تر به موضوع صفحه پی برده و کمتر درگیر اعداد و ارقام، دسته‌ها، نمادها و سایر موارد می‌شوند.
از کلمه کلیدی در URL استفاده کنید. مانند سایر عوامل سئو داخلی در سایت خود، اجازه ندهید URL غیرطبیعی باشد یا با کلمات کلیدی بیش‌ازحد نامناسب شود. سعی کنید حدود 5 کلمه باشد و اطلاعاتی که کاربر به دنبال آنها است را به‌طور خلاصه نمایش دهد. اجازه ندهید که کاربران با این سؤال روبه‌رو شوند که چه چیزی در این صفحه وجود دارد. عنوان، هدینگ‌ها، متا توضیحات وURL باید کاملاً واضح باشند.
محتوای کاربرپسند و معتبر
زمانی که گوگل به خزیدن در صفحات وبسایت شما می‌پردازد، به دنبال تطبیق محتوا با نیاز کاربر می‌باشد. محتوا باید به‌طور واضح توضیح دهد که چه محصول با خدماتی را ارائه می‌دهد و موضوع صفحه را کاملاً برای کاربر مشخص و شفاف کند.
در اینترنت محتوای زیادی وجود دارد، و اطمینان از منحصربه‌فرد بودن محتوایتان امری ضروری می‌باشد. یکی از رایج‌ترین گفته‌ها و تیکه کلام‌ها در دنیای سئو و همچنین در بازاریابی محتوا عبارت “محتوا پادشاه است” می‌باشد. در حقیقت، سئو و بازاریابی محتوا در موارد زیادی باهم ارتباط دارند، آنها یکدیگر را تکمیل می‌کنند. محتوا باکیفیت شامل شده از کلمات کلیدی به شکل اصولی و متنی که برای ارزش‌ها و نیازهای کاربر اینترنت است و همینطور باید مورد رضایت و خشنودی موتورهای جستجو باشد. این نوع عمل پایه سئو و بخش عمده سئو داخلی صفحات را تشکیل می‌دهد.
به محتوا به عنوان مکالمه‌ی با بازدیدگنندگان نگاه کنید. آیا آنها وقتی وارد سایت شما می‌شوند علاقه‌مند می‌گردند یا سایت را ترک می‌کنند؟ آیا نیاز آنها بعد از خواندن مقاله رفع می‌شود یا محتوا صرفا برای پر کردن سایت است؟ باید حدس و پیش‌بینی کنید که چه دیدگاهی کاربران سایت با توجه به سیاست های داخلی سایت شما می‌توانند داشته باشند؛ و همینطور باید شرایطی را فراهم کنید تا از بازدیدکننده‌ها بازخوردهای لازمه را بگیرید. زیرا هر بازخورد میتواند راهی در بی‌راهی‌های نامحسوس شما باشد.
هنگامی‌که محتوایی تولید می‌کنید، باید محتوا نشان دهد که شما در این زمینه متخصص هستید. در نظر داشته باشید که بهترین محتواها میتواند به صورت مستقیم با بازدیدکننده صحبت کند و ارزشی که به آنها توسط محتوا نمایش می‌دهد میتواند آنها را جذب خواندن ادامه مطلب یا خرید محصولی به سرانجام برساند.
به‌منظور بهبود سئو داخلی سایت خود برای افزایش ترافیک سایت، محتوا باید مشکلی را از کاربران برطرف کند و نیاز سرچ کننده، در محتوای شما باشد و درعین‌حال محتوای شما به‌راحتی خوانده شود بدون اینکه ازنظر نوشتاری یا گرامر دچار اشتباهی باشد.
نسبت به الگوریتم های گوگل آگاه باشید
به‌منظور حذف بعضی از وبسایت‌ها در رتبه‌های بالا که دارای محتوای اسپم، تگهای اشباع‌شده با کلمات کلیدی و محتوای ضعیف وکلا از روش‌های اسپم در سئو استفاده می‌کنند، گوگل الگوریتم پاندا را در فوریه 2011 راه‌اندازی کرد و به‌صورت منظم آن را به‌روزرسانی میکند. اگر همچنان محتوای بی‌کیفیت و ضعیف دارید، وبسایتتان در فضای مجازی پیدا نخواهد شد.
فاکتورهای سئو داخلی سایت میتواند تاثیری مستقیم و مهم در پنالتی شدن و یا رفع پنالتی شدن سایت شما داشته باشد، همیشه سعی کنید فاکتورهای موجود در این مقاله را با دقت اعمال کنید، و فکر نکنید که اگر بیش از حد فاکتوری را انجام دهید باعث بهبود سئو شما می‌شود، هر چند هم ممکن است برعکس این موضوع رخ دهد.
در حال حاضر پاندا یکی از مهم‌ترین ابزارهای رتبه دهی است و اگر به‌طور مداوم مطابق انتظارات کاربران پیش بروید رتبه بهتری به دست خواهید آورد. درحالی‌که به‌روزرسانی و گسترش محتوا را ادامه می‌دهید، مطمئن شوید تمرکزتان روی ساخت محتوای باکیفیت است که دارای کلمات کلیدی به شکل بهینه هم باشد و در حین نوشتن همیشه کاربر را در گوشه ذهن‌تان داشته باشید که خود را جای اون قرار دهید و بگوید اگر من به عنوان کاربر باشم چه دیدگاهی نسبت به این مقاله خود پیدا خواهم کرد؟
با افزایش عمر هوش مصنوعی، سئو کارها و بازاریابها تلاش می‌کنند تا از تأثیرات الگوریتم رنک برین (RankBrain) سر دربیاورند. این سیستم در 2015 رونمایی شد و به سومین عامل رتبه دهنده تبدیل‌شده است. نکته اصلی که باید به آن توجه کنید و بارها و بارها گفته‌شده این است که برای انسان بنویسید نه برای ربات. این بهترین راه برای رتبه گرفتن از RankBrain است.
RankBrain عمدتاً به عنوان راهی برای تفسیر جستجوهای مردم به‌منظور یافتن صفحاتی که ممکن است کلمات صفحات مطابقتی با کلمات جستجو شده را نداشته باشند، استفاده می‌شود. بهترین تمرین در نوشتن مقاله بهینه شده، پاسخ به سؤالات کاربران در کوتاه‌ترین زمان ممکن است. گوگل میتواند قصد و نیت کاربران را تشخیص داده و بهترین نتایج را برای آنها بازگرداند.
درحالی‌که کلمات کلیدی نقش مهمی در سئوی داخلی ایفا می‌کنند، گوگل بیشتر و بیشتر به معناگرایی روی می‌آورد تا بهترین تجربه کاربری را برای بازدیدکنندگان فراهم کند.
کلمات کلیدی هدفمند
انتخاب کلمه کلیدی مناسب نه تنها بر روی سئوی داخلی سایت بسیار مورد اهمیت است، بلکه در سئو خارجی هم امری بسیار حیاتی است، درحالی‌که باید محتوا باکیفیت و کاربرپسند تولید کنید، تمرکز روی کلمات کلیدی نیز همچنان حیاتی هست. مثلا در تگ های متا، از کلمات کلیدی برای طرح کلی یک محصول یا خدمات یا متن شاخصی از یک پست از وبلاگ، استفاده کنید.
چرا تعیین کلمات کلیدی مهم است؟ استفاده صحیح از آنها، مستقیماً در بازاریابی دیجیتال تأثیر می‌گذارد. هر چه بیشتر درباره کلمات کلیدی در حوزه کسب و کار خود اطلاع داشته باشید و دایره کلمات خود را گسترده‌تر کنید، استراتژی بهتری میتوانید برای بازاریابی ترسیم کنید.
همیشه مطمئن شوید با تعیین کلمات کلیدی مناسب در جستجو، بیشترین ارزش را برای برندتان فراهم می‌کنید.
برای رسیدن به بهترین نتیجه در سئو داخلی سایت، در میان کلمات کلیدی جستجو کنید و از کلمات کلیدی استفاده کنید که فعالیت سایت شما را بهتر توصیف میکند. قرار گرفتن درنتیجه اول جستجو درحالی‌که هیچ ترافیکی را به وبسایت منتقل نکند، هیچ ارزشی ندارد.
از Google AdWords قسمت Keyword Planner برای جستجو یا تحلیل چیزهایی که رقبایتان هدف قرار می‌دهند استفاده کنید. Keyword Planner انواع گوناگونی از کلمات کلیدی مشابه که میتوانید در صفحاتتان قرار دهید را پیشنهاد می‌دهد. از طریق بازاریابی محتوا، کلمات کلیدی استراتژیک را به کار بگیرید.
به انواع کلمات کلیدی و هر چیزی که به نفع سایت شما است فکر کنید.
- کلمات کلیدی اطلاعاتی: عبارتی شبیه “سئو داخلی سایت” زمانی مورداستفاده قرار می‌گیرد که کاربری قصد یادگیری درباره آن موضوع را داشته باشد.
- کلمات کلیدی تعاملی: کلمات کاربرانی را هدف قرار می‌دهند که قصد خرید محصول یا سرویسی را داشته باشند. اساساً این کلمات شامل صفاتی مثل “بهترین” یا “برترین” هستند.
- کلمات کلیدی مکان محور: زمانی که کاربران به دنبال کسب‌وکاری محلی یا محل فیزیکی هستند مورداستفاده قرار می‌گیرند.
به‌منظور تعیین رابطه برای کلمه کلیدی جستجو شده با صفحات موجود سایت‌ها، به LSI کلمات کلیدی یا مترادف آنها نگاه میکند به‌خصوص گوگل.( LSI چیست ) و الگوهایی را در داخل اصطلاحات، موضوعات و مفاهیم موجود در صفحات ایجاد میکند، هر چه تعداد صفحات بیشتری را ایندکس میکند بانک اطلاعاتی قوی‌تری در LSI ایجادشده و هوشمندتر می‌شود.
هنگامی‌که محتوای بلندی می‌نویسید، میتوانید از LSI کلمات کلیدی نیز در مقالات استفاده کنید. مثلاً میتوانید در مقالات بلند هم از عبارت “سئو داخلی سایت” استفاده کنید و هم از عبارت “بهینه سازی داخلی سایت” .
در LSI گوگل سایت‌ها را بر اساس تعداد عبارات و اصطلاحات کلیدی مرتبط به هم مرتب میکند تا به‌جای تعداد عبارات مجزا.
محتوا نباید فقط روی یک کلمه کلیدی تمرکز کند. هدف شما در سئوی داخلی باید کسب رتبه برای تمام کلمات مترادف و جستجوهای مرتبط باشد.
ازآنجاکه کلمه کلیدی موردنظر شما ممکن است در ماه ۵۰ هزار بار جستجو شود، صفحه شما میتواند رتبه بالاتری برای جستجوهای مشابه که ماهانه هزار بار سرچ می‌شوند داشته باشد.
محتوایی بنویسید که باعث هدایت ترافیک از بسیاری از جستجوهای مشابه به سایت شما شود. هدف از این کار تولید کلیک با استفاده از عوامل بهینه سازی داخلی صفحات به‌منظور افزایش نرخ کلیک می‌باشد.
لینک های داخلی و خارجی
لینک‌ها بیشترین اهمیت را در سئو متحمل می‌شوند. به دست آوردن لینک از سایت‌های مرجع باکیفیت و سایت‌های معتبر باعث افزایش قدرت دامنه شما می‌شود، درعین‌حال لینک های داخلی در تجربه کاربر و افزایش سئوی داخلی مؤثر هستند. پیشنهاد میکنم حتما مقاله 10 ترفند درباره لینک سازی داخلی را به دقت بخوانید.
به دست آوردن لینک برای وبسایت بخشی از استراتژی سئو خارجی می‌باشد. با استفاده از بازاریابی محتوا، بازاریابی ایمیلی و سایر روش‌های خلاقانه دیگر، راهی برای لینک سازی خودکار برای سایتتان ایجاد کنید.
لینک های داخلی به سایر صفحات سایتتان، باعث تقویت کلمه کلیدی می‌شود و گوگل را قادر می‌سازد مشخص کند در چه بخش‌هایی کلمه کلیدی را رتبه دهی کند. لینک سازی داخلی بین صفحات و وبلاگ‌ها به افزایش مرور توسط ربات‌های گوگل در بین صفحات سایت کمک میکند.
اگر پست جدید یا صفحه مهم جدیدی ایجاد کردید لینک آن را در صفحه اصلی قرار دهید، به این شکل گوگل به‌روزرسانی سایت را راحت‌تر مشاهده میکند تا اینکه کل سایت را مرور کند.
مزیت لینک های داخلی سایت، دادن گزینه‌ها اضافی به کاربران برای ماندن در سایتتان است که کمک بسیاری به بهبود نرخ دفع کاربری میکند. هرچه تعامل با صفحات مرتبط بیشتر شود، گوگل بیشتر متوجه می‌شود. در هر جمله یک لینک داخلی قرار ندهید، اما چند لینک را در هر صفحه قرار دهید تا سئو شما بهتر شود.
زمانی که تصاویر را به صفحه اضافه می‌کنید، جدا از آنکه باعث بهبود تجربه کاربری می‌شود، میتوانید با بهینه سازی تصاویر استراتژی سئو را بهبود دهید. کلمات کلیدی را به عنوان متن جایگزین (alt) تصاویر قرار دهید و عنوانی ایجاد کنید که منحصربه‌فرد و درعین‌حال کاربردی باشد. مثلا تصاویر این مقاله دارای عنوان منحصربه‌فرد و متن جایگزینی درباره این مطلب هستند.
بهینه سازی عکسها و تگهای alt به گوگل نشان می‌دهد صفحه و همچنین عکس شما درباره چه موضوعی است. تگ alt باید برای توصیف چیزی که در تصویر وجود دارد مورد استفاده قرار گیرد.
زمانی که تصویر به هر دلیلی بارگذاری نمی‌شود کاربران چه چیزی را مشاهده می‌کنند؟ آنها تگ alt یا همان متن جایگزین را می‌بینند. از کلمات کلیدی در متن جایگزین بیش‌ازحد استفاده نکنید. مطمئن شوید آنها مناسب تصویر باشند.
در مقاله‌ی که در سایت Yoast انتشاریافته، نوشته‌شده: تصویر باید بازتاب‌دهنده موضوع مطلب یا نشان‌دهنده هدف درونی مقاله باشد.
تصویر نقشی حیاتی در بهینه سازی داخلی سایت بازی میکند. به عنوان یکی از اهداف سئو داخلی، مطمئن شوید تصاویر از اندازه مناسبی برخوردارند. هرچه تصویر بزرگ‌تر باشد، بارگذاری صفحه بیشتر طول می‌کشد. اندازه تصاویر را به‌درستی انتخاب کنید و مطمئن شوید حجم آنها کمترین مقدار ممکن باشد.
حتما مقالات مربوط به بهینه سازی عکس را مطالعه کنید چرا که ما در جهانی بصری زندگی میکنیم و درحالی‌که محتوا از اهمیت زیادی برخوردار است، ولی باید مطمئن شوید تصاویرتان نیز به همان اندازه از توجه کافی بهره‌مند است.
واکنشگرا برای موبایل
برای داشتن سئو داخلی مطلوب، وبسایت باید مناسب موبایل باشد. سایت‌های واکنشگرا همان تجربه کاربری را برای بازدیدکنندگان فراهم می‌کنند. مزیت‌های متعددی در واکنش گرا ساختن سایت و جذب کاربران وجود دارد. سایت واکنشگرا یا همان ریسپانسیو رتبه بهتری به دلیل وجود به‌روزرسانی الگوریتم موتورهای جستجو، در موبایل می‌گیرد.
بالای 50% کاربران عمده زمانشان را در حال جستجو و مرور در دستگاه‌های موبایل هستند. با استفاده از ابزار Mobile-Friendly Test میتوانید نحوه عملکرد ربات Googlebot را در صفحاتتان مشاهده کنید.
به‌منظور ایجاد بهترین و سریع‌ترین تجربه کاربری برای بازدیدکنندگان، گوگل شروع به نشان دادن صفحات موبایل سریع یا به انگلیسی Accelerated Mobile Pages در نتایج جستجو کرد. هرچه زمان بارگذاری سریع‌تر باشد، برای کاربران موبایل جذاب‌تر خواهد بود. میتوانید.
به یاد داشته باشید، هنگامی‌که کاربران وارد سایت یا وبلاگتان می‌شوند، احتمال دارد از طریق موبایل واردشده باشند. میتوانید موبایل پسند بودن سایت را از طریق ابزارهای گوگل بررسی کنید. اگر وبسایتتان موبایل پسند نیست، گوگل مختصری از اقداماتی که میتوانید در این رابطه انجام دهید را به شما نشان خواهد داد.
سرعت سایت
در تکنولوژی‌های امروزه سرعت از اهمیت زیادی برخوردار است.کاربران نمی‌توانند صبر کنند تا صفحه‌ی دیر بارگذاری شود، سایت دیگر را پیدا می‌کنند. حال آیا اقداماتتان در راستای تجربه کاربری است یا در جهت مخالف آن هست؟
نزدیک به نیمی از کاربران موبایل، اگر سایتی در کمتر از 8 ثانیه بارگذاری نشود آن را ترک خواهند کرد. طبق تحقیقات Backlinko.com سایتهایی که سریع‌تر بارگذاری می‌شوند رتبه بهتری از گوگل دریافت می‌کنند.
خوشحال نگه‌داشتن بازدیدکنندگان باعث افزایش نرخ تبدیل کاربر به مشتری می‌شود. بر اساس یک اینفوگرافیک از Kissmetrics ، 58% از کاربران موبایل انتظار دارند سایتتان در موبایل سریع‌تر از دسکتاپ بارگذاری شود.
سایتتان را بهینه کنید و از عوامل اساسی که باعث کاهش زمان بارگذاری می‌شوند اجتناب کنید. به سایت نگاه کنید و ببینید که آیا چیزی وجود دارد که باعث کاهش سرعت صفحه می‌شود.
- حافظه کش مرورگر (Leverage Browser Caching)
- بهینه سازی تصاویر
- استفاده از فشرده‌سازی GZIP
- استفاده از هاست سریع‌تر
- کدنویسی مناسب HTML و CSS
- حذف تبلیغات
- کاهش تغییر ریدایرکت
حتما آموزش‌های مربوط به بهینه سازی سایت با GTmetrix مشاهده کنید، البته باید اشاره کنم که نباید در بهینه سازی و بهبود سرعت سایت حساسیت زیادی داشته باشید، انعطاف‌پذیری و خلافیت‌های ذهنی خود را به دست ربات‌هایی همانند سایت GTmetrix یا سایت های تست سرعت نسپارید، هر چند رعایت نکات ذکر شده در این سایت‌ها خوب است ولی بستگی به شرایط و سیاست‌های کاری سایت شما دارد، ممکن است بهینه سازی فلان کاری در یک سایتی خوب باشد ولی در سایت دیگر باعث افت فروش و بازدید آن شود، پس سعی بر آن داشته باشید که همواره از ابزارها به شکل انعطاف‌پذیر استفاده کنید و صرفا به دنبال کسب رتبه‌های A در سایت‌های تست سرعت نباشید، بنده پروژه‌های مختلف زیادی برای افزایش سرعت سایت دریافت کرده بودم ولی متاسفانه کارفرما صرفا به دنبال رتبه A هست درحالی که در بعضی پروژه‌ها کسب رتبه A در ابزارهای آنلاین باعث کاهش سرعت آن در منطقه ایران می‌شود. در نظر داشته باشید که کمتر سایت بزرگی را میتوانید پیدا کنید که دارای امتیاز A در سایت های تست سرعت باشد.
بر اساس گزارشی از Radware ، فشرده سازی و بهینه سازی تصاویر از عوامل حیاتی در سرعت وبسایت هستند. این مطالعه می‌گوید: تصاویر 50 تا 60% از وزن صفحه را به خود اختصاص می‌دهند. اگر تصاویرتان بیش‌ازحد بزرگ هستند، باعث کاهش کارایی سایت می‌شوند. از طرفی اگر در سایت خود تعداد عکسها کوچک و زیادی دارید بهتر هست آنها را ادغام کنید تا باعث کاهش حجم، کاهش تعداد درخواست‌ها و در نتیجه باعث افزایش سرعت سایت می‌شود برای چنین عملی میتوانید پست CSS sprites را مطالعه کنید و نتایج آن بعد از بهینه سازی شگفت‌زده شوید. همچنین مقالات بی‌نظیر ما در حوزه لود تنبل تصاویر ، بهینه سازی نظرات ، بهینه سازی پایگاه داده و تاثیر CDN بر سئو میتواند به شما در سرعت سایت و در نتیجه افزایش رتبه سایت در گوگل کمک شایانی کند.
ابزارهایی وجود دارند که میتوانید از آنها برای مطمئن شدن از عملکرد بهینه سایت استفاده کنید. اگر حساب Google Analytics دارید، میتوانید سرعت سایتتان را در قسمت Behavior در ساید بار سمت چپ مشاهده کنید.
سایر ابزارهای برتر که امکاناتی برای بررسی سرعت و عملکرد صفحات فراهم می‌کنند عبارت‌اند از:
به این نکته مهم توجه داشته باشید که گوگل در این مقاله اعلام کرده که سرعت سایت تاثیر مستقیم بر روی تجربه کاربری و همینطور Crawl Budget می‌شود (Crawl Budget یعنی بودجه خزش، به تعداد صفحاتی که ربات گوگل میتواند خزش را انجام دهد توضیحات بیشتر در مقاله Crawl Budget چیست). و همینطور صریحا موتور جستجوی گوگل در پست Using site speed in web search ranking گفته است که سرعت سایت یکی از فاکتورها برای الگوریتم‌های گوگل در رتبه‌دهی می‌باشد. از بالا بودن سرعت سایت پیامدهای مختلفی را گوگل برای خود استناد میکند، مخصوصا در این چند سال اخر به کاربران موبایل اهمیت بیشتری داده است و پروژه‌هایی مانند AMP را ایجاد کرده است. بنابرین یکی از فاکتورهای مهم در سئو سایت، سرعت سایت می‌باشد. هرچه وبسایتتان سریع‌تر بارگذاری شود، تعامل بیشتری را مشاهده خواهید کرد. هنگامی‌که تمامی عوامل سئوی داخلی سایت را فراهم کردید، تمرکزتان را روی بهبود سرعت صفحه قرار دهید. در این صورت کاربران سایت شما را به سایر وبسایت‌ها ترجیح می‌دهند.
تجربه کاربری خوب یعنی بهبود سئو داخلی
بهبود تجربه کاربری و ایجاد یک حس خوب زمانی که کاربر در حال وبگردی در وبسایت شما است یک موفقیت خوب در سئو داخلی وبسایتی میتواند باشد. راستی تجربه کاربری یعنی چی ؟
اگر بخواهم به عبارتی ساده‌تر تجربه کاربری را تعریف کنم رفتار، خصوصیات و احساسات در استفاده از یک محصول یا خدمات را تجربه کاربری آن محصول یا خدمات می‌گویند.
زمانی که کاربر یک حس و تجربه خوب را در سایت شما سپری کند چه اثراتی را میتواند داشته باشد؟
مثل سپری کردن زمان بیشتر وب سایت شما و یا دیدن صفحات بیشتر و همینطور برقراری تعامل همانند گذاشتن نظر یا تماس با شما شاید بخشی بسیار کوچک ولی تاثیرگذار و مهمی باشد در جهت بهینه سازی سئو داخلی سایت شما ولی جدا از آنکه بر روی سئو تاثیرگذار است بر روی فروش بیشتر و بندسازی شما هم فاکتور تجربه کاربری میتواند اثری مستقیم بگذارد.
همیشه آموزش های تجربه کاربری را جدی بگیرید و نیازی نیست شما متخصص تجربه کاربری باشید، صرفا به درک اولیه آن در کسب و کار خودتان برسید تا حداقل‌ها را رعایت کنید و سپس اگر کسب و کاری بزرگ تر داشتید به فکر جذب نیرو متخصص برای بهبود تجربه کاربری خدمات و یا محصولات خود باشید.
صفحه کاملا بهینه شده برای نرخ تبدیل کاربر به مشتری
تمام سایت را بر اساس فاکتورهای On Page SEO که اشاره کردیم از بالا تا پایین یکپارچه کنید. از ظاهر صفحه گرفته تا بخش فنی و اطلاعات متا، صفحه‌ی که به‌طور مناسبی بهینه شده باشد شامل تمامی جنبه‌های ذکرشده در بالا می‌باشد.
مطمئن شوید که طبق اصول گوگل پیش می‌روید. از تگهای متا سفارشی، تگهای عنوان و heading ها استفاده کنید و همیشه محتوای باکیفیت تولید کنید. ارتباط بین مطالب را فراموش نکنید، لینک سازی داخلی را به شکل بهینه انجام دهید. تلاش برای بالا بردن سرعت سایت فراموش نشود. برای کاربران اطلاعاتی فراهم کنید که نیاز دارند و به‌واسطه ابزارهای تجزیه‌وتحلیل نحوه تعامل آنها با سایت را بررسی کنید.
هنگامی‌که همه‌چیز در جای مناسبش قرار داشت، به گوگل آنالیتیکس و سرچ کنسول گوگل رفته و نحوه عملکرد سایتتان را مشاهده کنید. درحالی‌که موتورهای جستجو صفحات را می‌خزند ، آیا خطایی هم مشاهده می‌شود؟ خطاهای مربوط به لینک های خراب، صفحات پویا، خطای 404، خطاهای سمت سرور و همینطور خطاهای مربوط به سمت کاربر، خطاهای موجود در robots.txt، خطاهای sitiap و غیره را پیدا و در پی رفع آنها باشید. با استفاده از ابزارهای سئو میتوانید عملکرد سایت را امتحان کنید و خطاهای خزش ربات‌های گوگل را مشاهده کنید. این بدان معناست که بعضی از صفحات، با جستجو در موتورهای جستجو قابل‌دسترسی نیستند.
رفع این خطاها و مشکلات در سایت تاثیر بسیار مناسبی بر روی تجربه کاربری و همینطور افزایش رتبه سایت شما دارد، گاهی این خطاها باعث جلوگیری از ارتقا رتبه سایت ما می‌شود و حل این مشکلات از مهم ترین کارها در On Page SEO می‌باشد و جدا از این باعث فروش بالا هم می‌شود که تمام این اهداف میان مدت ما در جهت هدف اصلی یعنی بهبود تبدیل کاربر به مشتری است.
هدفتان باید تبدیل کاربر به مشتری باشد در انتهای هرروز به‌جای اینکه از خود بپرسید چه میزان بازدیدکننده داشته‌ایم، از خود بپرسید به چه تعداد کاربر کمک کردیم، کاربران اگر احساس رضایت در سایت شما داشته باشند تبدیل به مشتری می‌شوند. اجرای این روش‌های ذکرشده در بالا سئو داخلی سایت را با پایه‌های محکمی بنا می‌سازد که برای گوگل مناسب است و منجر به جذب کاربران می‌شود.
صفحه‌ی که به‌طور مناسبی بهینه‌شده باشد، تجربه کاربری به‌یادماندنی را ایجاد میکند و باعث افزایش قدرت برندتان می‌شود. علاوه بر این ترافیک سایتتان را افزایش داده و رتبه دهی به کلمه کلیدی مرتبط با کسب‌وکارتان را بهبود می‌دهد.
خلاصه هر آنچه که در سئو داخلی (On Page) گفته شد
سئو داخلی یا On Page SEO جزو اصول و قواعد پایه در سئو است. در واقع On Page زیرساخت لازم برای رشد و پیشرفت سایت را مهیا می کند. طبق گفته کارشناس کیفیت محتوای گوگل Matt Cutts محتوا پایه و اساس اعتبار و رشد هر سایت است. قواعد سئوی داخلی سایت پیچیدگی خاصی ندارد و در محتوا به اصل کیفیت ، منحصر بفرد بودن ، تازگی و مفید بودن اشاره دارد. پس به فاکتورهای اشاره شده در این صفحه بسیار توجه کنید.
ما برای راحتی شما خلاصه‌ای از مقاله جامع سئو داخلی (On Page SEO) را در پایین تهیه کردیم، ولی اگر مقاله را از اول مطالعه نکرده باشید خیلی از نکات طلایی که هزینه‌هایی زیادی را برای ما دربرداشته را از دست می‌دهید. پس حتما زمان گذاشته و کل مقاله را با دقت بخوانید.
- متا تگ هاشاید برخی از تگ‌ها همانند گذشته در سئو داخلی مهم نباشند، اما استفاده صحیح از آن میتواند باعث ترافیک سایتتان شود چراکه Meta Tag ها اطلاعاتی درباره صفحات هم برای موتورهای جستجو و هم برای کاربران فراهم میکند.
- تگ عنوان
مهم‌ترین تگ در On Page سئو است. از عنوان‌های هوشمندانه، جذاب و مربوط به متن استفاده کنید سعی کنید از کلمات کلیدی به شکل اصولی درون آن بهره ببرید و از 70 کاراکتر بیشتر نشود.
- متا توضیحات
Meta Descriptions تأثیری به شکل مستقیم در سئوی داخلی یک سایت ندارد، ولی یکی از اهداف سئو، افزایش فروش محصولات در سایت است و یک متا دیسکریپشن خوب، میتواند مزیتی رقابتی در نتایج جستجو و افزایش نرخ کلیک بیشتر با احتمال تبدیل بازدیدکنندگان به مشتری ایجاد کند. کاراکترهای متا دیسکریپشن بهتر است بین 165 تا 175 تا باشد.
- تگهای h1 تا h6
مهم‌ترین تگ h1 است. هیچ‌گاه نباید بیشتر از یک تگ h1 در هر صفحه داشته باشید. اما میتوانید از تعداد دلخواهی از تگهای h2 و h3 استفاده کنید. از هدینگ ها به‌منظور نمایش دادن بخش‌های مختلف صفحه استفاده کنید مخصوصاً در مقالات طولانی از این تگ‌ها به‌خوبی استفاده کنید تا کاربران راحت‌تر در بین متن‌ها پیمایش کنند.
- url در سئو داخلی
URL ها باید کوتاه، مختصر، خوانا و قابل‌فهم باشند. URL را کوتاه نگه‌دارید. هرچه URL کوتاه‌تر باشد راحت‌تر می‌توان آن را به اشتراک گذاشت.
- محتوا
محتوا باید کاربرپسند، معتبر، مطابق با نیازهای کاربر و دارای توضیحات شفاف و روشن درباره محصولی که اشاره میکند داشته باشد. محتوا باکیفیت متشکل شده از کلیدواژه‌ها به شکل اصولی و متنی که برای نیاز بازدیدکننده تعبیه‌شده است و البته باید با برگ خریدهای موتورهای جستجو مغایرتی نداشته باشد.
- الگوریتم‌های گوگل
مهم‌ترین خلاصه که می‌توانم دراین‌باره بگویم این است که گوگل از شما باهوش‌تر است و شکی در آن نداشته باشید پس لطفاً برای انسان بنویسید نه برای ربات‌های گوگل. - کلمات کلیدی
سعی کنید در میان کلیدواژه‌ها جستجو انجام دهید و از کلمات کلیدی انتخاب‌شده در متن‌ها، عنوان‌ها، متاتگ‌ها و … به شکلی استفاده کنید که فعالیت سایت شما را بهتر تشریح میکند، هیچ‌گاه در استفاده از کلمات کلیدی زیاده‌روی نکنید، به خدا گوگل خر نیست :)) - لینک‌های داخلی و خارجی
به دنبال بک لینک از سایت‌های مرجع باکیفیت و سایت‌های معتبر که باعث افزایش قدرت دامنه شما می‌شود، باشید و همینطور لینک سازی داخلی را فراموش نکنید چراکه در تجربه کاربر و افزایش سئو مؤثر هستند. - بهینه‌سازی تصاویر
سعی کنید عکسها را بهینه سازی کنید به‌عبارت‌دیگر عکس و تصویر باید دارای تگهای alt و title باشند تا بتوانند به گوگل نشان می‌دهد صفحه و همچنین عکس شما درباره چه موضوعی است. سعی کنید حجم عکسها کم و اندازه آن مناسب باشد تا سایت با کندی سرعت روبه‌رو نشود. - واکنش گرا بودن سایت
ریسپانسیو بودن سایت باعث جذب کاربر، بهبود تجربه کاربری و بالاتر بردن رتبه سایت می‌شود - سرعت سایت
سایتی که سریع‌تر بارگذاری می‌شود رتبه بهتری از گوگل دریافت میکند و خوشحال نگه‌داشتن بازدیدکنندگان باعث افزایش نرخ تبدیل کاربر به مشتری می‌شود چرا کاربر تحمل ندارد منتظر لود سایتی باشد. - تجربه کاربری خوب یعنی بهبود سئو داخلی
تجربه کاربری خوب یعنی تقریبا داشتن سئو داخلی خوب. سعی کنید همیشه در هر لحظه از کسب و کارتان یک چشم به سمت تجربه کاربری داشته باشید، اگر با این نگاه به سمت جلو حرکت کنید جدا از آنکه بر روی سئو اثری فوق العاده مثبت خواهد داشت، باعث می‌شود در زمینه‌های دیگری همانند فروش هم تاثیر مثبت بگذارد. - صفحه کاملا بهینه شده برای نرخ تبدیل کاربر به مشتری
هدفتان باید تبدیل کاربر به مشتری باشد همیشه به‌جای اینکه از خود بپرسید چه میزان بازدیدکننده داشته‌ایم، از خود بپرسید به چه تعداد کاربر سایت کمک کردیم، کاربران اگر احساس رضایت در سایت شما داشته باشند تبدیل به مشتری می‌شوند. اعمال فاکتورهای اشاره‌شده در بالا باعث افزایش بهینه سازی داخلی سایت می‌شود. صفحه‌ی که به‌طور مناسبی بهینه شده باشد، تجربه کاربری به یادماندنی را به ارمغان می‌آورد و باعث بالا رفتن قدرت برندتان می‌گردد و حاصل آنها باعث بیشتر شدن ترافیک سایت و افزایش رتبه در کلمه کلیدی مرتبط با کسب‌وکارتان خواهد شد.
مقالات خوب سایت های دیگر در حوزه سئو داخلی را هم میتوانید مطالعه نمایید: