1. اگه سایت دینامیک می خواین بسازین با PHP کار کنید و نه با ASP . فکر می کنم سرعت لود شدن PHP بیشتر باشه .
2. اطلاعات یک صفحه به اندازه کافی باشه . مثلا توی بلاگ ها لازم نیست صفحه اصلی 10 - 15 تا پست رو نشون بده . 5-6 تا کافیه و می شه صفحات قبلی رو به صورت لینک گذاشت یه گوشه کناری و یا اگه آلبوم عکس هست و تعداد عکس ها زیاده توی دوتا صفحه تقسیمش کرد . شاید این نکته ساده و بدیهی باشه اما واقعا کم بهش توجه می شه گاهی .
3. این نکته ربطی به کاهش حجم نداره ولی ولی زیادم بی ربط نیست : توی این سایت می تونید سرعت و زمان لود توسط Connection مختلف و ... صفحات وبتون رو آنالیز کنید. قشنگ بهتون می گه چیش زیاده و یا چیش کمه. برای نمونه صفحه اول فروم مجید آنلاین آنالیز شد : اینجا
افزايش سرعت بارگزاري صفحات يکي از مسائل مهم در طراحي صفحات وب مي‌باشد. در صورتي که زمان بارگزاري يک صفحه وب طولاني باشد، معمولا" کاربران از مشاهده آن صفحه صرف نظر مي‌کنند و ديگر به آن باز نمي‌گردند اين به معني از دست دادن کاربران سايت مي‌باشد که براي مديران يک سايت اصلا" خوشايند نيست. در ادامه ده روش موثر براي افزايش سرعت بارگزاري صفحات وب بيان مي‌شود.
1. استفاده از CSS براي ايجاد قالب و طرح صفحه به جاي Table
CSS يا Cascading Style Sheetsها به دلايل زير از Tableها سريعتر بارگذاري مي‌شوند:
مرورگرها قبل از نمايش محتويات يک جدول دو بار آن را مرور مي‌کنند. يک بار براي مشخص شدن ساختار آن و يک بار هم براي تعيين محتويات آن.
جداول (Tables) در يک مرحله بر روي صفحه به نمايش در مي‌آيند. هيچ قسمتي از يک جدول بر روي صفحه ظاهر نمي‌شوند تا اينکه تمام جدول همراه با محتويات آن به طور کامل بارگذاري و پردازش شود.
عمل موقعيت دهي و يا ايجاد يک فضاي خاص در جداول معمولا" با استفاده از تصاوير کوچک خاصي (Spacer Images) صورت مي‌پذيرد.
بطور کلي CSS ها کد کمتري نسبت به جداول نياز دارند.
تمام کدهاي مورد نياز براي ايجاد طرح و نماي صفحه قابليت جايگزين شدن با يک فايل CSS خارجي را دارند. که اين فايل پس از يک بار فراخواني در کامپيوتر کاربر ذخيره (cache) مي‌شود. اما قالب‌هاي ايجاد شده با استفاده از جداول در هر صفحه HTML تکرار مي‌شوند و با درخواست هر صفحه جديد دوباره بايد بارگذاري (Download) شوند.
با استفاده از CSS ها امکان تعيين ترتيب بارگذاري صفحه وجود دارد. يعني مي‌توان محتويات اصلي صفحه را قبل از بارگذاري تصاوير با حجم بالا به نمايش درآورد. اين کار قطعا" کاربران سايت شما را خوشحال خواهد کرد.
براي آشنايي بيشتر با CSS و کارهاي جالبي که مي توان با آن در يک سايت انجام داد مي توانيد از آموزشهاي خوب و مفيد سايت HTML Dog استفاده کنيد.
2. از تصاوير براي نمايش متن استفاده نکنيد
در اينجا نيز CSS به ما کمک خواهد کرد. در مواردي که کار را مي توان با CSS بطور کامل انجام داد از تصاوير استفاده نکنيد. به کد زير دقت کنيد:
با استفاده از اين کد مي‌توانيد يک کليد جذاب ايجاد کنيد که با رفتن موس بر روي آن پايين مي‌رود. اگر به نحوه ايجاد اين گونه کليدها علاقمند هستيد مي‌توانيد مقالات بخش CSS سايت A List Apart را مطالعه کنيد.
3. فراخواني تصاوير تزييني بوسيله CSS
با CSS مي‌توان تصاوير را بصورت قسمتي از يک زمينه (background) نمايش داد. بطور مثال يک تصوير 200x?00 را مي‌توان بصورت زير نمايش داد:
در ابتدا شايد اين کار بي معني به نظر برسد اما اين کار سرعت بارگذاري و نمايش صفحات را افزايش مي‌دهد. بطور کلي مرورگرها تصاوير زمينه را بعد از بقيه اجزا بارگذاري مي‌کنند. با استفاده از اين تکنيک متن درون صفحه فورا" به نمايش درآمده و کاربر مي‌تواند آن را مشاهده و در بين آن گردش کند و در همين هنگام تصاوير با حجم زياد بارگذاري مي‌شوند.
در اين روش نمي‌توان از خصوصيت ALT استفاده نمود اگر واقعا" مي‌خواهيد که از اين خصوصيت استفاده کنيد، کد HTML بالا را بصورت زير تغيير دهيد.
در اينجا spacer.gif يک تصوير 1x1 پيکسل شفاف (transparent) است که 50 بايت حجم دارد. در اين حالت ابتدا محتواي اصلي بارگذاري مي‌شود و بعد از آن تصوير بزرگ و حجيم همراه با خصوصيت ALT بطور کامل بارگذاري مي‌شود. دقت داشته باشيد که اين روش براي نمايش تصاوير تزئيني مناسب مي‌باشد نه براي تصاوير حاوي اطلاعات. همچنين کاربراني که CSS آنها غير فعال است قادر به مشاهده تصوير (يا متن مربوط به ALT) نمي‌باشند.
4. استفاده از انتخاب کننده‌هاي (selectors) مناسب
به کد نامناسب زير توجه کنيد:
<p class="text">This is a sentence</p>
<p class="text">This is another sentence</p>
<p class="text">This is yet another sentence</p>
<p class="text">This is one more sentence</p>
.text {
color: #03c;
font-size: 2em
}
به جاي اختصاص دادن مقدار به هر پاراگراف، مي‌توان همه را در يک تگ <div> قرار داده و مقدار را به آن اختصاص دهيم:
<div class="text">
<p>This is a sentence</p>
<p>This is another sentence</p>
<p>This is yet another sentence</p>
<p>This is one more sentence</p>
</div>
.text p {
color: #03c;
font-size: 2em
}
در ابتدا شايد اين موضوع زياد با اهميت به نظر نرسد اما اگر شما بتوانيد از آن بطور صحيح در تمام صفحه استفاده کنيد به راحتي 20% از حجم فايل شما کم خواهد شد. همچنين شايد توجه کرده باشيد که مقادير مربوط به رنگها کوتاه‌تر از حالت عادي است. 03c# کوتاه شده مقدار 0033cc# است شما مي‌توانيد از اين روش خلاصه کردن در هر جايي که مقادير با اين فرم قرار دارند استفاده کنيد.
5. استفاده از خلاصه نويسي خصوصيات در CSS
در زير روش خلاصه نويسي بعضي المانهاي CSS را مشاهده مي‌کنيد:
اين قوانين بطور عملي براي border و padding نيز قابل استفاده است.
6. استفاده از فراخواني نسبي
سعي کنيد از آدرس دهي مطلق پرهيز کنيد زيرا فضاي بيشتري را اشغال مي‌کند و تغيير دادن آنها در آينده مشکل است. يک مثال از فراخواني مطلق بصورت زير است: <a href="http://www.URL.com/filename.htm"> که بهتر است به اين صورت باشد: <a href="filename.htm">. اما اگر فايل‌ها در فهرست‌هاي مختلف باشند از خلاصه نويسي‌هاي زير استفاده کنيد:
<a href="/filename.html">: فراخواني http://www.URL.com/filename.html
<a href="/directory/filename.html">: فراخواني http://www.URL.com/directory/filename.html
<a href="./">: فراخواني index.html در فهرست جاري
<a href="../">: فراخواني index.html از يک فهرست بالاتر
<a href="../filename.html">: فراخواني filename.html از يک فهرست بالاتر
<a href="../../">: فراخواني index.html از دو فهرست بالاتر
8. حذف تگهاي غير ضروري META و مقادير درون آن
بسياري از تگهاي META غير ضروري هستند و کار زيادي انجام نمي‌دهند. در صورت علاقه مي‌توانيد ليست تگهاي META را در اين آدرس مشاهده کنيد. تگهاي METAي با اهميت براي موتورهاي جستجو تگهاي keywords و description هستند. البته استفاده نادرست و بيش از اندازه از آنها به تازگي باعث کاهش اهميت آنها شده است. در هنگام استفاده از هرکدام از اين تگ‌ها سعي کنيد حجم محتواي آنها براي هر يک کمتر از 200 کاراکتر (حرف) باشد. هر مقداري بيش از اين باعث افزايش حجم صفحه شما خواهد شد. متا تگهاي طولاني براي موتورهاي جستجو مناسب نيستند زيرا کلمات کليدي شما را کم رنگ مي‌کنند.
9. انتقال JavaScript و CSS درون صفحه به فايلهاي مستقل
براي استفاده از CSS که در فايل خارجي قرار دارد از کد زير استفاده کنيد:
هر فايل خارجي يک بار فراخواني شده و بعد از آن در کامپيوتر کاربر (براي استفاده‌هاي بعدي) ذخيره مي‌شود. بجاي قرار دادن JavaScript و CSS در تک تک صفحات HTML آنها را براي يک بار در يک فايل خارجي قرار دهيد و از آن درون صفحات استفاده کنيد. فراموش نکنيد که هيچ محدوديتي براي استفاده از اين فايلهاي خارجي وجود ندارد. براي مثال بجاي ساختن يک فايل CSS بزرگ، يک فايل براي قسمتهاي يکسان در تمام صفحات و چند فايل هم براي قسمت‌هايي که در صفحات خاص استفاده مي‌شوند بسازيد.
10. استفاده از / در انتهاي آدرس فهرست‌ها:
بجاي استفاده از اين کد:
<a href="http://www.URL.com/directoryname" >
از کد زير استفاده کنيد:
<a href="http://www.URL.com/directoryname/" >
زيرا اگر از / در انتهاي آدرس استفاده نکنيد سرور متوجه نخواهد شد که اشاره به فايل شده يا فهرست. اما با اضافه کردن / سرور فورا" متوجه مي‌شود که به يک فهرست اشاره شده و آنرا نمايش مي‌دهد.
