چرا سرعت بارگذاری یک سایت مهم است؟
بی شک نمایش سریعتر سایت، یکی از فاکتورهای مهم سئو
و همچنین راهی برای فراهم آوردن تجربه کاربری (UX) دلچسب برای
بازدیدکنندگان است. قرار نیست همه مثل شما اینترنت پرسرعت داشته باشند و
سایتتان را در کسری از ثانیه ببینند.
اقداماتی که در ادامه بیان میشود تأثیر زیادی در بهینه سازی سرعت وب سایت شما دارند. علاوه بر آن، از آنجایی که WordPress یکی از سیستمهای مدیریت محتوای محبوب در دنیا به شما میآید که سهم زیادی از بازار CMS
ها را به خود اختصاص داده است، توصیهها و راهکارهای ویژه ای نیز مخصوص
این CMS بیان خواهد شد. البته لازم به ذکر است پلاگینهایی که برای هر بخش
معرفی شده اند، تنها معروفترینهای دنیای وب هستند و لازم است پیش از نصب،
حتما در مورد آنها تحقیق نمایید تا با وب سایت شما تداخل نداشته باشد.
گام صفر – بررسی سرعت وب سایت
اما پیش از هر اقدامی، باید درباره وضعیت سرعت وب سایتتان اطلاعاتی کسب کنید، سایتهای gtmetrix و pingdom و yslow و webpagetest و developers.google گزارشهای نسبتاً جامعی در اختیار شما قرار میدهند.
انتخاب یک هاست خوب
یکی از اولین کارهایی که برای ورود به فضای مجازی باید به آن توجه کنید، انتخاب یک هاست خوب است. فضای میزبانی وب سایت خود را از یک شرکت معتبر و با سابقه تهیه
کنید. اگر جامعه هدف سایت شما را اکثراً کاربران ایرانی تشکیل میدهند
توصیه میکنیم از سرورهای داخل ایران استفاده کنید تا زمان ارسال درخواست
به سایت شما به حداقل برسد و در نتیجه، کاربران داخل ایران سریعتر سایت
شما را ببینند. همچنین اگر با گستره عظیمی از مخاطبان در ارتباط هستید یا
اصطلاحاً یک سایت پربازدید دارید، استفاده از سرورهای مجازی (VPS) یا سرورهای اختصاصی پیشنهاد میشود تا در ساعات اوج بازدید، از دسترس خارج نشوید.
استفاده از شبکههای تحویل محتوا (CDN)
فناوری CDN که مخفف کلمات Content delivery network و به معنای شبکه توزیع
محتوا است. شرکتهای بزرگ اینترنتی، برای کنترل ترافیک سایت و سرویسهای
اینترنتی خود از چندین سرور در نقاط مختلف جهان برای ذخیره سازی و توزیع
اطلاعات خود در سراسر جهان استفاده میکنند. پاسخ به درخواستهای کاربران
از نزدیکترین سرور پاسخ داده شود که این امر باعث افزایش سرعت بارگذاری و
نمایش سریعتر سایت میشود. امنیت، همیشه در دسترس بودن، پخش صحیح فشار بر
روی چندین سرور از مزایای دیگر CDN است.
فعال سازی g-zip
g-zip در حقیقت یک الگوریتم فشرده سازی فایل است. اگر سرور سایت پاسخهای
خود را با الگوریتم gzip compress فشرده سازی کند حجم نهایی سایت کاهش پیدا
خواهد کرد و محتوای سایت در زمان کمتری به نمایش در میآید، همچنین موجب
کاهش پهنای باند مصرفی نیز میشود.
فعال کردن Cache
استفاده از پلاگین های کش باعث
میشود سرعت سایت شما افزایش یابد به طوری که با هر بار Load سایت شما توسط
کاربر محتوای سایت شما به صورت کش شده بارگذاری میشود و عناصر و محتوای
ثابت نیازی به بارگذاری مجدد ندارد.
برای وردپرس: پلاگین های W3 Total Cache و WP Super Cache
از پلاگین های پرطرفدار برای کَش کردن یک سایت وردپرسی هستند. همچنین به
کمک قابلیت browser caching یا کش مرورگر میتوانید با ذخیره کردن فایلها
بر روی مرورگر کاربران، تمامی فایلهای موجود در سایت اعم از تصاویر،
فایلهای جاوا اسکریپت و فایلهای استایل، طبق زمانی که شما برای آن مشخص
میکنید، ذخیره نمایید تا در بازدید بعدی کاربر، با سرعت بیشتری آن صفحه را
مشاهده نماید.
فشرده سازی فایلهای css و js
یکی از آیتمهایی که
ممکن است سایتهای بررسی سرعت بارگذاری وب سایت، در مورد آن تذکر بدهند،
حجم فایلهای CSS و JS است. با فشرده سازی آنها میتوانید حجم این فایلها
را کاهش دهید و گامی دیگر در بارگذاری سریعتر وب سایتتان بردارید.
ابزارهای آنلاینی نظیر csscompressor و jscompress
وجود دارند که با قرار دادن فایلهای CSS و JS سایت خود در آنها، کار
فشرده سازی را انجام میدهند. دقت کنید که این ابزارها همیشه خالی از اشکال
نیستند و ممکن است پس از فشرده سازی فایلها، شاهد بهم خوردن ظاهر و
عملکرد بخشهایی از سایت باشید. پس با احتیاط از آنها استفاده کنید و
حتماً پیش از هر اقدامی یک نسخه پشتیبان از فایلها و وب سایت خود بگیرید.
برای وردپرس: پلاگینهای WP Minify Fix و WP Super Minify و Better WordPress Minify از پلاگین های پرطرفدار برای فشرده سازی فایلهای سی اس اس و جاوا اسکریپت هستند.
بهینه سازی و استفاده درست از تصاویر
حجم تصاویر از مواردی است که تأثیر زیادی در سرعت بارگذاری سایت دارند. با
بهینه سازی تصاویر سایت خود میتوانید تا حد چشم گیری حجم کلی سایت خود را
کاهش دهید و در نتیجه کاربران میتوانند سایت شما سریعتر ببینند. امروزه
تکنولوژیهای طراحی وب به حدی پیشرفت کردهاند که نیازی نیست برای نمایش هر
شکل و ظاهری از تصاویر با فرمتهای JPG و PNG استفاده کنید، بلکه فرمتهای
برداری مثل SVG، کدهای CSS و فونتهای تصویری، بسیاری از نیازهای بصری
سایت شما را برآورده میکنند.
استفاده از تصاویر بزرگ به جای تصاویر
بندانگشتی Thumbnail یکی دیگر از اشتباهی است که برخی از طراحان وب مرتکب
آن میشوند. اگر به جای یک تصویر بند انگشتی ۱۰۰ در ۱۰۰ پیکسل یک تصویر ۵۰۰
در ۵۰۰ پیکسل یا بزرگتر استفاده کنید، عملاً از یک تصویر با حجم بالاتر
استفاده کرده اید که بر سرعت بارگذاری سایت شما تأثیر خواهد گذاشت؛ از این
رو در هر قسمت از سایت خود، از تصاویر با اندازه مناسب بهره ببرید.
همچنین سعی کنید تعداد در خواستها به سرور را برای فراخوانی تصاویر به
حداقل برسانید، استفاده از Sprites یکی از راهکارهای مناسب و اصولی است.
برای مثال به جای ارسال ۵ درخواست به سرور برای نمایش ۵ آیکون میتوانید
این ۵ آیکون را همگی در قالب یک تصویر قرار دهید و با استفاده از css ، فقط
آن یک تصویر را فراخوانی نمایید. این کار ضمن افزایش سرعت بارگذاری، موجب
صرفه جویی در پهنای باند سایت میشود. سایتهای spritecow و spritegen از ابزارهای آنلاینی هستند که برای شما یک Sprite میسازند.
علاوه بر اینها نیازی به آن نیست که کل تصاویر سایت در ابتدا
بارگذاری و نمایش داده شوند؛ با بهره گیری از قابلیت LazyLoad زمانی که
مرورگر کاربر به محلی میرسد که آن عکس قرار دارد، آن عکس ظاهر میشود در
نتیجه سرعت نمایش سایت بیشتر میشود.
تصاویر “Gravatar” (همان تصویر
کوچکی در کنار نام افراد در قسمت نظرات دیده میشود) تا حدی سرعت بارگذاری
صفحه را پایین میآورند توصیه میشود که آنها را به صورت کش شده نمایش
دهید و یا از تصویر پیش فرض استفاده کنید.
برای وردپرس: پلاگین های WP Smush و EWWW Image Optimizer از پلاگین های پرطرفدار برای بهینه سازی و کاهش حجم تصاویر به شمار میآید و برای بارگذاری تصاویر بصورت LazyLoad پلاگین های Lazy Load و BJ Lazy Load محبوب هستند. برای تغییر و مدیریت تصاویر گرآواتار دو پلاگین WP User Avatar و Avatar Manager بیشترین کاربرد را دارند.
بهینه سازی برای دستگاههای مختلف
طراحی موبایل
پسند (Mobile Friendly)، یکی از اصول مهم در طراحی و بهینهسازی وبسایت در
سالهای اخیر است. با طراحی و بهینه سازی سایت خود در دستگاههای گوناگون
نظیر موبایل و تبلت و رایانههای شخصی، تجریهای خوشایند را برای کاربران
خود فراهم کنید؛ آنها دوست دارند در کوتاهترین زمان ممکن، وب سایت شما را
به شیوه زیبا و مناسب در گوشی یا تبلت خود ببینند. میتوانید برای نمایش
سریعتر و زیباتر وب سایتتان در موبایل یا تبلت، برخی از جزییات و عناصر
غیر ضروری در استایل مخصوص موبایل حذف نمایید و یا از قالبهای ریسپانسیو یا واکنش گرا استفاده کنید.
بهینه سازی جداول (ویژه وردپرس)
هر سیستم وردپرسی یک پایگاه داده MySQL استفاده میکند که شامل تمامی
اطلاعات سایت، از نام گرفته تا تمامی نوشتهها است. دیتابیس MySQL تمامی
اطلاعات را در جداول جداگانه ای ذخیره سازماندهی میکند. اگر تغییری در
قالب یا محتوای سایت ایجاد یا افزونه ای حذف شود، با وجود اینکه دیگر اثر
آن افزونه یا قالب در سایت دیده نمیشود، اما ممکن است اطلاعاتی از آنها
هنوز در سایر جداول باقی بماند. به مرور این اطلاعات قدیمی باعث پر شدن
فضای دیتابیس میشود و از سرعت آن میکاهد، در نتیجه درخواستها با سرعت
کمتری پردازش میشوند و سرعت بارگذاری کاهش مییابد. پلاگین های WP-Optimize و WP-DBManager از پلاگین های پرطرفدار برای بهینه سازی دیتابیس وردپرس محسوب میشوند.