آیا میخواهید سرعت سایت وردپرس خود را افزایش دهید؟ در این مقاله قصد داریم ترفندهای بهینه وردپرس که در افزایش سرعت لود وردپرس کمک میکند را به شما ارائه کنیم. در این مقاله ما به شما چگونگی سرعت دادن به وردپرس با به اشتراک گذاشتن روشهای بهینه در افزایش عملکرد را نشان میدهیم. شما ممکن است شنیده باشید که سرعت وردپرس برای سئو مهم است. درواقع یک سایت پرسرعت فروش بیشتری نیز دارد. توسعهدهندگان در یک مطالعه دریافتند کم بودن سرعت سایت میتواند از فروش و بازدید شما بکاهد. با دکترگرافیک همراه باشید.
افزایش سرعت لود وردپرس با افزونه کش
همراه با بالا بردن سرعت وردپرس دومین عامل مهم بعد از میزبان وب فاکتور ذخیرهسازی میباشد. بهطور معمول وقتی یک بازدیدکننده به سایت وردپرس میآید سرور شما از درخواست PHP به دادهی MySQL با پیدا کردن صفحهای که بازدیدکننده دارد و در حال درخواست است عبور میکند. این ذخیره باعث صرفهجویی در زمان و منبع میشود.
برای سایت List25 از سایتهای SuperCacher و پلاگینی که خاص مشتری ساختهشده استفاده میشود. بالاتر از آن گزینههای ذخیره پویای پیشرفتهای با استفاده از لاک اضافه کردهاند. اگر شما در سایت نیستید نگران نباشید، میتوانید روی سایت وردپرس خود با استفاده از بسیاری از راه حلهای در دسترس مانند W3 Total Cache و WP Super Cache کش را راهاندازی کنید.
هنچنین برای دریافت اطلاعات بیشتر درباره جذب ورودی ارگانیک گوگل برای سایت خود از کلمات کلیدی خاص ، صفحه خدمات سئو وردپرس را مطالعه نمایید.
CDN
شبکههای تحویل محتوا میتوانند به شما در افزایش دادن سرعت وبسایتتان کمک کنند. List25 از آغاز کار خود از Maxcdn استفاده کرده است. پس این قسمت تغییری نداشته است.
CDN به ما اجازهی خدمت به تمام CSS ها، جاوا اسکریپت و عکسهایی که از محتوای شبکه ارسال میشوند را میدهد. این کار با تعیین موقعیت بازدیدکنندگان از سایت و خدمت به بازدیدکننده از نزدیکترین سرور عمل میکند. اگر شما به دنبال راهحل CDN نیستید میتوانید از Cloudflare استفاده کنید.
ترکیب فایلها برای کاهش درخواستهای HTTP
همانطور که شما افزونههای بیشتری اضافه میکنید، اغلب آنها به سایت شما جاوا اسکریپت و فایل CSS اضافه میکنند. هر فایل اضافه یک درخواست HTTP جدید است. ما جاوا اسکریپتها و فایلهای CSS را درون یک فایل تکی برای کاهش درخواست و افزایش سرعت زمان بارگیری ترکیب میکنیم.
درحالیکه ما در هر حال در حال بارگذاری برخی قابلیتهای کوچک هستیم ممکن به بخشهای خاصی از سایت نیاز نداشته باشیم. این کد روی CDN ذخیرهسازی شده و نتایج نشان میدهد که درخواستهای کمتری برای فراهم کردن عملکرد بهتر نسبت به بارگذاری چندین فایل JS وجود دارد. اینها کارهایی است که باید بهطور منظم انجام دهید؛ زیرا افزونهای که استفاده میکنید در طول زمان تغییر میکند.
استفاده از یک تصویر ترکیبی
ما از جداکننده تصویر استفاده میکنیم و تصویر همه آیکونهای شبکه اجتماعی را در یک تصویر ترکیب کنیم.
هر زمان نیاز به نمایش یک آیکون خاص را داریم نیز از CSS استفاده میکنیم.
1. بارگذاری تصویر مانند پسزمینه تصویر
2. تعریف عرض و ارتفاع از این عنصر برای نیاز آیکون
3. تنظیم موقعیت پسزمینه برای عکسهای ما در بارگذاری آیکونهای ضروری
برای مثال، برای بارگذاری آیکونهای اجتماعی نوار کناری از کد زیر استفاده میکنیم:
li.widget_social_icons ul li { float: left; width: 36px; height: 36px; margin: 0 10px 10px 0; padding: 0; background: url(../images/sprite.png) no-repeat; } li.widget_social_icons ul li.twitter { background-position: 0 -50px; } li.widget_social_icons ul li.facebook { background-position: -36px -50px; } li.widget_social_icons ul li.pinterest { background-position: -72px -50px; } li.widget_social_icons ul li.google { background-position: -108px -50px; } li.widget_social_icons ul li.rss { background-position: -144px -50px; } li.widget_social_icons ul li.youtube { background-position: -180px -50px; }
عرض و ارتفاع و پسزمینه CSS به ما در هدف قرار دادن بخش خاصی از تصویر در خروجی کمک میکنند. در نتیجه فقط اولین درخواست برای فایل تصویری استفاده میشود. درخواستهای CDN برای تصاویر منجر به ذخیرهسازی نسخه بارگیری میشود و تنها نیاز به یک تصویر واحد در مقابل آیکونهای مختلف اجتماعی میباشد.
فراموش نکنید که ترکیب جاوا اسکریپت و CSS و تصاویر با یکدیگر درخواستها را کاهش میدهد.
Minify کردن CSSها
کد کوچکسازی شامل برداشتن فضای خالی و پرش خطها بهمنظور کاهش سایز فایلها برای بارگذاری سریعتر هنگام درخواست میباشد. برای List25 از SCSS و شیوه مبتنی بر نحو استفاده میکنیم. این موضوع به ما اجازه میدهد تا ساختار فایل CSS را در مناطق مختلف توسعه دهیم.
از CodeKit برای گردآوری فایلهای SCSS در یک فایل CSS استفاده میکنیم. همچنین CodeKit فضاهای خالی را برای اطمینان از کوچکی فایل حذف میکند. درنتیجه ما قادر به کاهش سایز فایل CSS تا 28% هستیم.
بهینهسازی تصویر
تصاویر را در دو حوزه بهینه میکنیم: تم وردپرس و محتوای آپلود شده.
برای تم وردپرس، از CodeKit استفاده میکنیم که مطمئن شویم تمام تصاویر فشرده شدهاند. CodeKit تضمین میکند که سایز فایلها تا حد ممکن بدون از دست دادن کیفیت کوچک میشود.
ما همچنین تمام نویسندگان را در مورد اهمیت صرفهجویی بهینه کردن تصاویر آموزش میدهیم.
استفاده نکردن از اشتراکگذاری در شبکههای اجتماعی بهصورت جاوا اسکریپت
اشتراکگذاری اجتماعی برای سایت شما مانند هر سایتی بسیار مهم است. با این حال افزونههای اشتراکگذاری اجتماعی که از جاوا اسکریپت استفاده میکنند. میتوانند به نسبت قابلتوجهی سرعت سایت شما را کاهش دهند.
درحالیکه یکپارچهسازی این 4 شبکه اجتماعی در زمان بارگذاری تأثیری ندارد؛ سرعت سایت را زمانی که آن را در دستگاه تلفن همراه میبینیم کم میکند. دکمههای اشتراکگذاری با وجود اسکریپت بارگذاری ناهمگام زمان کوتاهی برای ظاهر شدن صرف میکنند. در نتیجه در محتوای پست بهعنوان دکمه بارگذاری به اطراف حرکت میکند. برای مقابله با این مشکل، به سراغ راهحلهای رایگان جاوا اسکریپت میرویم.
پس پیشنهاد ما این است که بهجای استفاده از افزونه، با چند کد ساده شروع به ساخت یک باکس اشتراکگذاری در شبکههای اجتماعی کنید.
ما بهطور قابل توجهی سرعت سایت را بهبود بخشیدیم. این موضوع در کاهش زمان مصرفی در دانلود یک صفحه توسط ربات گوگل مؤثر است. نرخ Bounce Rate کاهشیافته است. زیرا این سایت بهسرعت بارگذاری میشود و با تعویض میزبان قادر به کاهش خطاهای سرور شدیم. میتوانید ببینید با افزایش سرعت سایت، کاربران بیشتر در سایت ما میمانند و سایت ما را ترک نمیکنند.
نتیجهگیری نهایی
همانطور که میبینید بارگذاری سریع وب میتواند تعامل بازدیدکنندگان را بهبود بخشد. این تکنیکهایی که طیف وسیعی از بهبود اولیه هستند را میتوانید برای بهبود سایت وردپرس خود پیادهسازی کنید. یادتان باشد بهبود سرعت سایت در سئو سایت شما هر به طور غیر مستقیم تاثیر دارد.
منابع: wikipedia – wordpress.org – mihanwp – youtube