بررسي تاثير جو عاطفي خانواده براعتماد به نفس فرزندان

کد HTML

کد CSS

.pretty-image {
background: url(filename.gif);
width: 200px;
height: 200px
}

در ابتدا شاید این کار بی معنی به نظر برسد اما این کار سرعت بارگذاری و نمایش صفحات را افزایش می‌دهد. بطور کلی مرورگرها تصاویر زمینه را بعد از بقیه اجزا بارگذاری می‌کنند. با استفاده از این تکنیک متن درون صفحه فورا” به نمایش درآمده و کاربر می‌تواند آن را مشاهده و در بین آن گردش کند و در همین هنگام تصاویر با حجم زیاد بارگذاری می‌شوند.

در این روش نمی‌توان از خصوصیت ALT استفاده نمود اگر واقعا” می‌خواهید که از این خصوصیت استفاده کنید، کد HTML بالا را بصورت زیر تغییر دهید.

در اینجا spacer.gif یک تصویر ۱×۱ پیکسل شفاف (transparent) است که ۵۰ بایت حجم دارد. در این حالت ابتدا محتوای اصلی بارگذاری می‌شود و بعد از آن تصویر بزرگ و حجیم همراه با خصوصیت ALT بطور کامل بارگذاری می‌شود. دقت داشته باشید که این روش برای نمایش تصاویر تزئینی مناسب می‌باشد نه برای تصاویر حاوی اطلاعات. همچنین کاربرانی که CSS آنها غیر فعال است قادر به مشاهده تصویر (یا متن مربوط به ALT) نمی‌باشند.

۴- استفاده از انتخاب کننده‌های (selectors) مناسب به کد نامناسب زیر توجه کنید:

This is a sentence

This is another sentence

This is yet another sentence

This is one more sentence

.text {
color: #03c;
font-size: 2em
}

به جای اختصاص دادن مقدار به هر پاراگراف، می‌توان همه را در یک تگ

قرار داده و مقدار را به آن اختصاص دهیم:

.text p {
color: #03c;
font-size: 2em
}
 

در ابتدا شاید این موضوع زیاد با اهمیت به نظر نرسد اما اگر شما بتوانید از آن بطور صحیح در تمام صفحه استفاده کنید به راحتی ۲۰% از حجم فایل شما کم خواهد شد. همچنین شاید توجه کرده باشید که مقادیر مربوط به رنگها کوتاه‌تر از حالت عادی است. ۰۳c# کوتاه شده مقدار ۰۰۳۳cc# است شما می‌توانید از این روش خلاصه کردن در هر جایی که مقادیر با این فرم قرار دارند استفاده کنید.

۵- استفاده از خلاصه نویسی خصوصیات در CSS
در زیر روش خلاصه نویسی بعضی المانهای CSS را مشاهده می‌کنید:

font: 1em/1.5em bold italic serif

font-size: 1em;
line-height: 1.5em;
font-weight: bold;
font-style: italic;
font-family: serif
Font

border: 1px black solid

border-width: 1px;
border-color: black;
border-style: solid
Border

background: #fff url(image.gif) no-repeat top left

background-color: #fff;
background-image: url(image.gif);
background-repeat: no-repeat;
background-position: top left;
Background

margin: 2px 1px 3px 4px (top, right, bottom, left)

margin-top: 2px;
margin-right: 1px;
margin-bottom: 3px;
margin-right: 4px
Margin

margin: 5em 1em 3em (top, left and right, bottom)

margin-top: 5em;
margin-bottom: 1em;
margin-right: 1em;
margin-right: 4em
Margin

margin: 5% 1% (top and bottom, left and right)

margin-top: 5%;
margin-bottom: 5%;
margin-right: 1%;
margin-right: 1%
Margin

این قوانین بطور عملی برای border و padding نیز قابل استفاده است.

۶- استفاده از فراخوانی نسبی
سعی کنید از آدرس دهی مطلق پرهیز کنید زیرا فضای بیشتری را اشغال می‌کند و تغییر دادن آنها در آینده مشکل است.

۷- افهرست های مختلف
.اما اگر فایل‌ها در فهرست‌های مختلف باشند از خلاصه نویسی‌های زیر استفاده کنید:

: فراخوانی http://www.zabet.ir/10-performance-webpage
: فراخوانی
: فراخوانی index در فهرست جاری
: فراخوانی index از یک فهرست بالاتر
: فراخوانی filename از یک فهرست بالاتر
: فراخوانی index از دو فهرست بالاتر

۸- حذف تگ‌های غیر ضروری META و مقادیر درون آن
بسیاری از تگهای META غیر ضروری هستند و کار زیادی انجام نمی‌دهند. در صورت علاقه می‌توانید لیست تگهای META را در این آدرس مشاهده کنید. تگ‌های METAی با اهمیت برای موتورهای جستجو تگ‌های keywords و description هستند. البته استفاده نادرست و بیش از اندازه از آنها به تازگی باعث کاهش اهمیت آنها شده است. در هنگام استفاده از هرکدام از این تگ‌ها سعی کنید حجم محتوای آنها برای هر یک کمتر از ۲۰۰ کاراکتر (حرف) باشد. هر مقداری بیش از این باعث افزایش حجم صفحه شما خواهد شد. متا تگ‌های طولانی برای موتورهای جستجو مناسب نیستند زیرا کلمات کلیدی شما را کم رنگ می‌کنند.

۹- انتقال JavaScript و CSS درون صفحه به فایلهای مستقل
برای استفاده از CSS که در فایل خارجی قرار دارد از کد زیر استفاده کنید:

و برای استفاده از JavaScript که در فایل خارجی قرار دارد از کد زیر استفاده کنید:

هر فایل خارجی یک بار فراخوانی شده و بعد از آن در کامپیوتر کاربر (برای استفاده‌های بعدی) ذخیره می‌شود. بجای قرار دادن JavaScript و CSS در تک تک صفحات HTML آنها را برای یک بار در یک فایل خارجی قرار دهید و از آن درون صفحات استفاده کنید. فراموش نکنید که هیچ محدودیتی برای استفاده از این فایل‌های خارجی وجود ندارد. برای مثال بجای ساختن یک فایل CSS بزرگ، یک فایل برای قسمتهای یکسان در تمام صفحات و چند فایل هم برای قسمت‌هایی که در صفحات خاص استفاده می‌شوند بسازید.

۱۰- استفاده از / در انتهای آدرس فهرست‌ها:

زیرا اگر از / در انتهای آدرس استفاده نکنید سرور متوجه نخواهد شد که اشاره به فایل شده یا فهرست. اما با اضافه کردن / سرور فورا” متوجه می‌شود که به یک فهرست اشاره شده و آنرا نمایش می‌دهد.

مارابا نظراتتان یاری کنید