شاید یکی از مهمترین اصولی که خیلی از طراحان، چه آنهایی که طراحی سایت بهروز دارند و چه گرافیستهای چاپی و چهمهندسان پرتال نصب کن! توجهی به آن ندارند حجم سایت است. ناگفته پیداست که یک وبسایت سنگین چه زیانهایی می رساند: بسیاری از کاربران را خسته و پشیمان می کند، آمار بازدیدکنندگانی که برای چندمین بار به سراغ سایت ما می آیند کم می کند، تعداد بازدید از صفحات داخلی را کم می کند، حوصله موتورهای جستجو را برای ایندکس کردن سر می آورد و رتبه ما را در موتورهای جستجو می کاهد. البته سبک یا سنگین بودن حجم یک سایت نسبی است و بستگی به میانگین سرعت مخاطبانمان دارد. قطعا برای کاربر عادی ایرانی 100 کلیوبایت وزن قابل توجهی است ولی برای یک نفر در جایی که اسمش خارج است! شاید یک مگابایتش هم چیز زیادی نباشد.
طبق تجربه، طراحی کم حجم می تواند یکی از خصوصیاتی باشد که مشتریان را به سوی طراحان وب جذب کند. اما چه عواملی در سرعت سایت تاثیر گذار است؟ اول اینکه شیوه کد نویسی استاتیک بسیار مهم است: اینکه تا چه حد از CSS استفاده مفید بکنید. کدهای داینامیک نظیر php و asp معمولا به خاطر سرعت بالای سرورها در کمتر از یک ثانیه اجرا می شوند که زیاد به حساب نمی آیند! پس روی کدهای استاتیک که تر و تمیز باشند، و تمام CSS ها بیرون از محتوا و در یک یا چند فایل جدا ذخیره شوند تاکید بیشتری باید داشت. زیرا این باعث می شود در بارگزاری مجدد، این فایل از روی Cache کامپیوتر کاربر لود شود و در سرعت تاثیر مثبت دارد. در مورد فایلهای جاوا اسکریپت نیز وضع به همین منوال است. کدها را ترجیحا در فایلهای جدا باید ذخیره کرد و در هدر سایت فراخوانی کرد. در مواردی که ناچاریم کدها را در فایل اصلی بیاوریم، ترجیحا همه را به پایینترین خطوط کدهای استاتیک انتقال دهیم تا حوصله موتورهای جستجو از سر و کله زدن با این کدها سر نرود، و اگر برود چیز زیادی از دست نداده باشیم! ضمنا در استفاده از افکتهایی که با کتابخانههایی نظیر jQuery اجرا می شوند، باید حواسمان باشد که آیا استفاده از هسته جی کوئری (حدود 80 کلیوبایت) به اضافه کدهای آن افکت به صرفه هست یا نه! زیرا معمولا این کدها را اجنبی های کافر می نویسند که سرعت اینترنتشان خیلی بالاست و ممکن است به فکر سرعت اینترنت در برخی کشورهای دیگر (اسم نمی برم!) نباشند!
مساله مهم و حیاتی دیگر حجم و تعداد تصاویری است که در طراحی به کار می بریم. باید تا جای ممکن از تصاویر کمتر و کم حجمتر استفاده کنیم، و از ساختارهای پر عکس بپرهیزیم (باز هم قابل توجه گرافیستان چاپی). برای ذخیره تصاویر نیز حتما از بخش Save for web در فتوشاپ استفاده کنید. تصاویری که تعداد رنگهای محدودتری دارند، با پسوند gif و تصاویری که سایه روشن یا تنوع طیف رنگی بیشتری داند با پسوند jpg کم حجمتر میشوند. پسوند جدیدتر png-24 نیز که از قابلیت شفافیت آن نیز در مرورگرهای جدیدتر می توان استفاده کرد، معمولا از دو نوع قبلی پر حجم تر اما بسیار با کیفیت تر است. چاره دیگر استفاده از تصاویر کوچکی است که تکرار (repeat) می شوند. این روش برای سایه روشنها (gradient) و بافتها (patterns) بسیار کاربردی است.
عوامل دیگری نظیر میزان محتوا (متن و تصویر) در هر صفحه و نیز سرعت سرور، در سرعت بارگزاری صفحات وب موثرند. برای فشرده کردن فایلهای CSS و js و... از قابلیت gzip کردن در فایل htaccess می توان استفاده کرد. برای این منظور می توانید به بخش Compression در کنترل پنل (Cpanel) مراجعه نمایید.
شاید بد نباشد این را هم بگویم که قالبهای از پیش طراحی شده اکثر پرتالهای آماده (از جوملا گرفته تا تالارهای گفتگو) معمولا بسیار سنگین هستند و ساختارهایشان نیز پر از فایلهای خارجی و کدهای اضافه است.منبع : طراحی سایت ، طراحی وب سایت ، بهینه سازی سایت ، طراحی لوگو، طراحی آرم
طبق تجربه، طراحی کم حجم می تواند یکی از خصوصیاتی باشد که مشتریان را به سوی طراحان وب جذب کند. اما چه عواملی در سرعت سایت تاثیر گذار است؟ اول اینکه شیوه کد نویسی استاتیک بسیار مهم است: اینکه تا چه حد از CSS استفاده مفید بکنید. کدهای داینامیک نظیر php و asp معمولا به خاطر سرعت بالای سرورها در کمتر از یک ثانیه اجرا می شوند که زیاد به حساب نمی آیند! پس روی کدهای استاتیک که تر و تمیز باشند، و تمام CSS ها بیرون از محتوا و در یک یا چند فایل جدا ذخیره شوند تاکید بیشتری باید داشت. زیرا این باعث می شود در بارگزاری مجدد، این فایل از روی Cache کامپیوتر کاربر لود شود و در سرعت تاثیر مثبت دارد. در مورد فایلهای جاوا اسکریپت نیز وضع به همین منوال است. کدها را ترجیحا در فایلهای جدا باید ذخیره کرد و در هدر سایت فراخوانی کرد. در مواردی که ناچاریم کدها را در فایل اصلی بیاوریم، ترجیحا همه را به پایینترین خطوط کدهای استاتیک انتقال دهیم تا حوصله موتورهای جستجو از سر و کله زدن با این کدها سر نرود، و اگر برود چیز زیادی از دست نداده باشیم! ضمنا در استفاده از افکتهایی که با کتابخانههایی نظیر jQuery اجرا می شوند، باید حواسمان باشد که آیا استفاده از هسته جی کوئری (حدود 80 کلیوبایت) به اضافه کدهای آن افکت به صرفه هست یا نه! زیرا معمولا این کدها را اجنبی های کافر می نویسند که سرعت اینترنتشان خیلی بالاست و ممکن است به فکر سرعت اینترنت در برخی کشورهای دیگر (اسم نمی برم!) نباشند!
مساله مهم و حیاتی دیگر حجم و تعداد تصاویری است که در طراحی به کار می بریم. باید تا جای ممکن از تصاویر کمتر و کم حجمتر استفاده کنیم، و از ساختارهای پر عکس بپرهیزیم (باز هم قابل توجه گرافیستان چاپی). برای ذخیره تصاویر نیز حتما از بخش Save for web در فتوشاپ استفاده کنید. تصاویری که تعداد رنگهای محدودتری دارند، با پسوند gif و تصاویری که سایه روشن یا تنوع طیف رنگی بیشتری داند با پسوند jpg کم حجمتر میشوند. پسوند جدیدتر png-24 نیز که از قابلیت شفافیت آن نیز در مرورگرهای جدیدتر می توان استفاده کرد، معمولا از دو نوع قبلی پر حجم تر اما بسیار با کیفیت تر است. چاره دیگر استفاده از تصاویر کوچکی است که تکرار (repeat) می شوند. این روش برای سایه روشنها (gradient) و بافتها (patterns) بسیار کاربردی است.
عوامل دیگری نظیر میزان محتوا (متن و تصویر) در هر صفحه و نیز سرعت سرور، در سرعت بارگزاری صفحات وب موثرند. برای فشرده کردن فایلهای CSS و js و... از قابلیت gzip کردن در فایل htaccess می توان استفاده کرد. برای این منظور می توانید به بخش Compression در کنترل پنل (Cpanel) مراجعه نمایید.
شاید بد نباشد این را هم بگویم که قالبهای از پیش طراحی شده اکثر پرتالهای آماده (از جوملا گرفته تا تالارهای گفتگو) معمولا بسیار سنگین هستند و ساختارهایشان نیز پر از فایلهای خارجی و کدهای اضافه است.منبع : طراحی سایت ، طراحی وب سایت ، بهینه سازی سایت ، طراحی لوگو، طراحی آرم