جهت ورود به تالار گفتمان سایت کلیک کنید


13 نکته جهت افزایش سرعت بارگذاری وب سایت

قطعا یکی از مهمترین دغدغه یک وبمستر , سرعت پایین لود وب سایت می باشد.

مشکلی که بسیاری از وب مستران عزیز با آن درگیر هستند و همیشه کاربرانشان از سرعت لود وب سایت شاکی هستند .

طبیعتا بعد از مدتی , کاربران از وضع وب سایت خسته شده و دیگر وارد آن سایت نمی شوند . در نتیجه روز به روز سایت دچار افت بازدیدکننده شده و کاربران خود را از دست میدهد که این امر بسیار فجیح خواهد بود . چرا که اگر بازدید کننده ای وجود نداشته باشد , وب سایت معنی ندارد .

تجربه نشان داده که هر کاربر به طور میانگین , حداکثر 10 ثانیه منتظر لود شدن سایت شما میشود …

در این پست قصد دارم نکاتی بسیار مهم و اساسی رو در مورد طراحی و پیکربندی یک وب سایت منتشر کنم که با رعایت این موارد میتوانید سرعت بارگذاری وب سایت خود را چندین برابر کنید .

و اما نکات …

1 – انتخاب یک میزبان یا همان سرور خوب :

اولین و بهترین فاکتور برای داشتن یک سرعت بالا در وب سایت , انتخاب یک میزبان یا سرور خوب و حرفه ای هست .

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

2 – استفاده از طراحی مینیمال و بسیار سبک :

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

وب سایت های مینیمال ( دقیقا مانند سایت اسکریپت دات کام ) از جدیدترین شیوه ی طراحی حال روز دنیا می باشد . تابحال فکر کردید چرا آمازون , گوگل , فیسبوک , الکسا و دیگر سایت های پربازدید دنیا ساده و مینیمال هستند ؟؟؟

پس سعی کنید سایت خود را ساده و شیک ( مینیمال ) طراحی کنید . هم دارای سرعت بارگذاری بالا میشود و هم طراحی وب سایت خود را مدرن و بروز میکنید .

3 – استفاده از شیوه ی Gzip :

Gzip باعث میشود که نوشته ها و کدنویسی های یک وب سایت , اععم از html , php , js و css فشرده , و سپس انتقال یابد . این کار باعث میشود تا سرعت انتقال بالاتر رود .

برای این کار کافیست کد زیر را در htaccess. خود کپی نمایید .

<ifModule mod_deflate.c="mod_deflate.c">
 <filesMatch "\.(css|js|html|php)$"=""\.(css|js|html|php)$"">
 SetOutputFilter DEFLATE
 </filesMatch>
 </ifModule>

 4 – استفاده از کشینگ ( ذخیره موقت ) :

کشینگ یا دخیره موقت فایل ها , امکانی هست که به ما کمک میکند که فقط یک بار فایل های تکرار شونده در صفحات متعدد یک وب سایت در حافظه مرورگر ذخیره شوند .

حال اگر صفحات یک وب سایت را مرور کنید , بیشتر عکس ها و دیگر فایل ها از سرور بارگذاری نمیشوند و از حافظه مرورگر بارگذاری میشوند . به همین خاطر باعث میشود تعداد درخواست ها به سرور کم شود و سرعت بالاتر برود .

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

کافیست برای این کار , کد زیر را در htaccess. خود کپی نمایید ..

# Set Expires headers
<ifModule mod_expires.c="mod_expires.c">
ExpiresActive On
ExpiresDefault "access plus 1 years"
ExpiresByType text/html "access plus 1000 second"
ExpiresByType image/gif "access plus 86400 seconds"
ExpiresByType image/jpeg "access plus 86400 seconds"
ExpiresByType image/jpg "access plus 86400 seconds"
ExpiresByType image/png "access plus 86400 seconds"
ExpiresByType image/x-icon "access plus 1000 seconds"
ExpiresByType text/css "access plus 1000 seconds"
ExpiresByType text/javascript "access plus 1000 seconds"
ExpiresByType application/x-javascript "access plus 1000 seconds"
ExpiresByType application/pdf "access plus 86400 second"
</ifModule>

 5 – استفاده از آدرس دهی های داخلی : 

حتما برای عکس , موزیک , فیلم , فلش و … از آدرس دهی داخلی استفاده کنید .

منظور از داخلی به این معنا هست که فایل ها رو در سرور خود قرار داده و لینک به سرور خود بدهید .

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

6 – عدم استفاده یا استفاده کم  از فلش , عکس و تبلیغات :

تا جایی که امکان دارد از فایل های فلش , عکس های زیاد و تبلیغات بنری استفاده نکنید و در صورت لزوم , سعی کنید خیلی محدود از آنها استفاده نمایید .

ضمنا سعی کنید از animation های Css3 و تگ iframe در html , تاجایی که امکان دارد استفاده نکنید …

 7 – عکس هایی با کیفیت استاندارد و نرمالیز : 

عکس های استفاده شده در وب سایت را تا جایی که امکان دارد کم حجم کنید .

برای این کار کافیست در نرم افزار های گرافیکی مانند photoshop , در هنگام خروجی گرفتن , Quality عکس را برروی 70 و گزینه ی optimize را روشن نمایید .

ضمنا سعی کنید کمتر از پسوند png و gif استفاده نمایید و بیشتر از jpg استفاده نمایید .

8 – مشخص کردن width و height هر عکس در html :

حتما برای عکس ها , پهنا و ارتفاع را در کدنویسی html مشخص کنید . گرچه اگر این کار هم نکنید , عکس در همان سایز نمایش داده میشود . اما قرار دادن این دو خاصیت باعث افزایش لود عکس در وب سایت میشود .

به عنوان مثال :

<img src="آدرس عکس" width="400" height="300">

 9 – استفاده کم از پلاگین ها ( در سیستم های مدیریت محتوا ) :

سعی کنید در سیستم های مدیریت محتوا مثل وردپرس , جوملا و … , فقط از پلاگین های مهم و پرکاربرد استفاده نمایید و از نصب پلاگین های بی اهمیت و کم اهمیت اجتناب کنید .

10 – minify کردن فایل های css و js :

در فایل های css و js , این قضیه زیاد اتفاق می افتد که فضاهای زیادی بین سورس کد نویسی و برنامه نویسی ها آشکار میشود .

به چسباندن تمامی این فاصله ها به هم , که باعث کم کردن حجم سورس میشود , minify کردن میگویند .

به عنوان مثال :

نمونه عادی :

#test{
	width:100px;
	height:100px;
	background-color:#069;
	border:1px solid #666;
}

 نمونه minify شده :

#test{width:100px;height:100px;background-color:#069;border:1px solid #666;}

سایت هایی مانند http://javascript-minifier.com برای جاوا اسکریپت و http://cssminifier.com برای Css  میتوانند این کار را برای شما انجام دهند .

11 – استفاده از css  اکسترنال : 

شیوه هایی که میتوان در آن برای Css کدنویسی کرد , به سه قسمت External , Internal و inline تقسیم میشود .

سعی کنید کدنویسی css خود را External انتخاب کنید . یعنی فایلی با پسوند css در هاست خود ایجاد کنید و با تگ link در html , به آن لینک داده و در آنجا شروع به کدنویسی css بکنید .

12 – بهینه سازی دیتابیس :

در سایت هایی که دارای پایگاه داده هستند , مانند وردپرس , جوملا , دروپال و … هرازچند گاهی پایگاه داده را بهینه سازی کنید . برای این کار میتوانید به phpmyadmin هاست خود رفته و پس از انتخاب پایگاه داده ی خود , Table های خود را optimize و repair کنید .

ضمنا برای راحتی کار میتوانید از پلاگین های آماده که برای هر cms ساخته شده است استفاده نمایید . به عنوان مثال برای وردپرس میتوانید از پلاگین wp-optimize استفاده نمایید .

13 – استفاده از کدهای Jquery و جاوا در انتهای صفحه :

حتما سورس های نوشته شده ی جاوا و Jquery خود را در انتهای صفحات ( قبل از تگ <html/> و <body/> قرار دهید . این کار باعث میشود تا ابتدا کل سایت لود شود و سپس فایل های بعضا حجیم جاوا و Jquery لود شوند که طبیعتا باعث افزایش سرعت بارگذاری وب سایت میشود .

نکته : برای تست سرعت وب سایت خود میتوانید از سایت http://gtmetrix.com کمک بگیرید و وب سایت خود را آنالیز کنید.

گرداوری : وحید مجیدی

پخش اختصاصی

جهت تبادل گفتگو و حل مشکلات در باره این موضوع , کلیک کنید

14 پاسخ به “13 نکته جهت افزایش سرعت بارگذاری وب سایت”

  1. سید یوسف هاشمی گفت:

    سلام آقای مجیدی. واقعا ممنون از مطالب مفیدتون. استفاده کردم

  2. مارتین گفت:

    استاد شما
    فوق العاده هستین

    خدا شمارو برای ما بی تجربه ها نگه داره تا حالا خیلی چیزها از شما یاد گرفتم.
    امیدوارم همیشه موفق باشید

  3. ehsan گفت:

    با سلام
    ممنون از سایتتون مطالب مفیدی بودند

  4. حسن گفت:

    ممنون از سایت خوبتون مطالبتون خیلی به دردم خورد

  5. میلاد گفت:

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

    • وحید مجیدی گفت:

      شاید خیلی از متا ها برای گوگل کم اهمین شده باشه , اما بی اهمیت نشده . قطعت گذاشتن آنها در سایت باعث دادان امتیاز مثبت توسط گوگل خواهد شد

  6. میلاد گفت:

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

    البته تا اونجایی که من اطلاع دارم استفاده از متا تگ زیر در مورد کشینگ، تاثیر خیلی ناچیزی بر سرعت بارگذاری داره:

  7. میلاد گفت:

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

    • وحید مجیدی گفت:

      در این صورتی که میفرمایید کاملا درسته . اما دیگه اینا قدیمی شده و به راحتی کاربر میتونه از java به html برشگردونه .

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

  8. میلاد گفت:

    ممنون از راهنمایی هاتون.
    ببخشید اگه ما دسترسی به فایل htaccess. سایتمون نداشته باشیم و نتونیم اونو ویرایش کنیم، راهی وجود داره که این قابلیت کشینگ رو تو قالب وب سایت تعریف بشه؟

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

    • وحید مجیدی گفت:

      میلاد جان فایل htaccess یک فایل بسیار مهم و حیاطی هست و امکان نداره سروری اجازه دسترسی به اون رو نده .

      در مورد سوال دوم هم باید بگم که اولا هیچ اسکریپتی وجود نداره که براش مهم باشه اول لود بشه یا آخر . اما اینم باید بگم که خیر راهی وجود نداره برای آدرس دهی

  9. علی گفت:

    پیج رنک سایت شما Fake (تقلبی) هست

    http://www.seomastering.com/fake-pagerank-checker.php

    • وحید مجیدی گفت:

      من شرکت هم تماس گرفتم و جوابی نگرفتم .
      دوست دارم خودتونو کامل معرفی کنید یا با بنده تماس بگیرین و در مورد اراجیفی که گفتین پاسخگو باشید .
      توی همین سایتی که خودتون معرفی کردین , پیج رنک من 5 و ولید ( واقعی ) هست .
      دوست عزیز فکر نکنم راه خوبی باشه برای تبلیغ کردن سایتتون از این طریق .
      شرکت های دزدی از جمله شرکت های سئو کار , همیشه به دنبال همچنین راههایی برای تبلیغات سایتشون بودن و هستن .
      من خودم سئو رو توی مجتمع فنی تهران تدریس میکنم و یقینا شما و شرکتتون بسیار کوچکنر از این حرف ها هستید که بخواهید حرفی برای گفتن داشته باشید .
      در ماه 3 4 شرکت با من تماس میگیرن که شرکت هایی از قبیل شما ازشون دزدی کردن .
      بسیار براتون متاسفم

دیدگاهتان را بنویسید

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