دسته بندی
-
چگونه سرعت نمایش سایت را بالا ببریم
-
سرعت یکی از مهمترین اجزا یک سایت و یا برنامه تحت شبکه است. در حقیقت، با آنلالیز های مختلفی که گوگل انجام داده است، اغلب مردم تنها ۳۰ ثانیه به یک سایت فرصت می دهند. این به این معنی است که سایت شما باید در ۱۵ ثانیه اول بارگذاری شود تا کابران بیشتری را جذب کند.
-
00
-
بازدید این صفحه : ۱۴۸تاريخ : 18 آذر 1402
بزرگنمایی تصویر
سرعت یکی از مهمترین اجزا یک سایت و یا برنامه تحت شبکه است. در حقیقت، با آنلالیز های مختلفی که گوگل انجام داده است، اغلب مردم تنها ۳۰ ثانیه به یک سایت فرصت می دهند. این به این معنی است که سایت شما باید در ۱۵ ثانیه اول بارگذاری شود تا کابران بیشتری را جذب کند.
ممکن است کمی ناعادلانه به نظر برسد که کاربران سایت را بر اساس سرعت آن مورد قضاوت قرار بدهند، اما این اتفاقی است که گاها اتفاق می افتد و باید فکر چاره ای برای آن کرد.
بهینه سازی سرعت سایت اهمییت زیادی دارد و اغلب اوقات سیستم های مدیریت محتوی از جمله وردپرس امکانات جالبی در این زمینه در اختیارتان قرار می دهند. در اینجا چند نکته در مورد بهینه سازی سایت و بدون در نظر گرفتن هاست شما را توضیح می دهیم.
عکس ها
بهینه سازی عکس ها از موضوعات مهم در این زمینه است، که می توانید آن را از منظرهای مختلفی مورد بررسی قرار دهید. انتخاب فرمت مناسب برای هر عکس و استفاده از ابزارهای مناسب بهینه سازی عکس ها، بهترین کارهایی هستند که می توانید برای عکس ها انجام دهید.
نکته ای که برای بهینه سازی عکس ها باید در نظر داشته باشید، آن است که عکس شما باید این قابلیت را داشته باشد که در همه پلتفرم ها نمایش داده شوند. با در نظر داشتن این نکته در زیر چند نکته در این مورد اشاره می کنیم.
فرمت عکس
فرمت عکس ها، همیشه جز داغ ترین مباحث هر محفل در رابطه با بهینه سازی عکس ها است. به نظر می رسد هر کسی در مورد فرمت عکس ها نظر متفاوتی دارد و برای افزایش سرعت فرمتی را معرفی می کند. اما در یک جمله می توان انتخاب فرمت را اینگونه خلاصه کرد. از JPEG برای تصاویر دوربین ها و مناظر استفاده کنید، GIF برای عکس هایی با تعداد رنگ کم استفاده کنید و هر چیز دیگر را با فرمت PNG ذخیره کنید. فرمتی که اغلب دولوپر های وب می پسندند PNG است. اما وقتی که می خواهید دکمه ای را که در آن از دو رنگ استفاده شده، بهتر است که از GIF استفاده کنید.
تا اینجا چند استاندارد معمولی در مورد عکس ها را مورد بررسی قرار دادیم. اما اگر می خواهید سایتتان سریع تر شود باید موارد بیشتری را رعایت کنید و کارهای دیگری را انجام دهید که در زیر برخی از آن ها را می خوانید.
کد عکس ها
یکی از بدترین کارهایی که در مورد عکس ها می توانید انجام دهید، دادن اندازه مناسب به آن ها در کد است. برای مثال استفاده از width='5px' height=30px' در صورتی که عکس تان در این اندازه نباشد هم پهنای باند بیشتری از شما می گیرد و هم می تواند سرعت بارگذاری سایتتان را کاهش دهد. باید ابتدا عکس هایتان را با نرم افزارهای ویرایش عکس مناسب به همان اندازه ای که نیاز دارید تبدیل کنید و بعد در سایتتان از آن ها استفاده کنید.
ابزارهای بهینه سازی عکس
ابزارها اکثر مواقع مفیدند. گاهی ابزارها تنها باعث پیچیده شدن کارها و نتیجه ای معکوس می دهند. اما در این مورد همه آن ها مفید خواهند بود. اگر شما هم ابزار بهینه سازی خوبی برای عکس می شناسید آن را در قسمت نظرها برای ما معرفی کنید تا هم ما و دیگر کاربران از آن استفاده کنند. اما ImageOptim برای کاربران مک و Riot برای ویندوزی ها عالی هستند. این دو ابزار متفاوتند ولی کارهای مشابه ای انجام می دهند.
می توانید عکس هایتان را به یکی از این برنامه ها دهید، برنامه راه مناسب برای بهینه سازی عکس را پیدا می کند و نتیجه نهایی را در فرمتی که نیاز داشته باشید را می توانید ذخیره کنید.
بهینه سازی سرعت بارگذاری عکس ها در سمت سرور
یکی از مواردی که در مورد ذخیره سازی در حال حاضر در میان صاحبان سایت ها جا افتاده است، ذخیره سازی عکس در CDN ها است. محبوب ترین این سرویس ها در حال حاضر Amazon S3 است. در این سرویس شما فایل خود را آپلود می کنید، پس از آن اگر کاربرتان آن فایل را درخواست کند از نزدیکترین سرور به کاربر فایل به سمت کامپیوتر کاربر ارسال می شود که می تواند سرعت بارگذاری سایت را تا حد چشم گیری افزایش دهد. البته اگر شما هم مثل ما به پرداخت های الکترونیک بین المللی دسترسی ندارید، این داستان مثل یک رویا از هزارن رویای یک طراح وب در ایران می ماند.
بهینه سازی کدهای CSS و جاوا اسکریپت
وقتی در مورد طراحی وب صحبت می کنید، خیلی سخت است که در مورد CSS و جاوا اسکریپت صحبت نکنید، مخصوصا زمانی که می خواهید محتوای داینامیک تولید کنید. فکر می کنم اکثر طراحان یادشان می رود که می توانند محتوای داینامیک شان و همینطور کدهای CSS و جاوا اسکریپت شان را بهینه کنند. بهینه سازی این دو در سایت های کوچک زیاد خودش را نشان نمی دهد، اما در سایت های بزرگ و پر زرق و برق با چند ریکوئست ساده می توان نتیجه آن را نشان داد. در زیر قوانینی در مورد این دو را بازگو می کنیم.
قانون اول در مورد CSS و جاوا اسکریپت
اگر می توانید آن را در CSS اجرا کنید،اگر نشد سراغ راه حل جایگزین بروید
اغلب اوقات فراموش می کنیم که ابزارهای فوق العاده ای در دستانمان داریم. گاهی اوقات خیلی از کارهایی را که به راحتی می توان با CSS انجام داد را به دوش فتوشاپ می اندازیم. که در نتیجه نه تنها باعث کاهش سرعت بارگذاری سایتتان می شود بلکه باعث بیشتر شدن کدهایمان نیز می شوند.
قانون دوم در مورد CSS و جاوا اسکریپت
کدها را فشرده کنید
فشرده سازی کدها از ساده ترین و بهترین کارهایی است که می توانید برای افزایش سرعت سایتتان انجام دهید. به یاد داشته باشید که ما در مورد ثانیه ها صحبت می کنیم، اما باز هم نمی توان از این مورد چشم پوشی کرد. اگر از کتابخانه هایی مثل jQuery استفاده می کنید، به بخاطر داشته باشید که همه ی آن ها یک نسخه از کتابخانه را به صورت فشرده در اختیارتان می گذارند. سعی کنید همیشه از نسخه فشرده کتابخانه ها استفاده کنید. Code Minifier برای کاربران مک، Minify برای ویندوز و JSCompress/CSSCompressor برای کسانی است که به دنبال ابزارهای تحت وب برای این کار هستند.
قانون سوم در مورد CSS و جاوا اسکریپت
از کدهای درون خطی ( in-line) استفاده نکنید
استفاده از کدهای درون خطی بسیار ساده تر است، مخصوصا در مورد CSS. دلیل استفاده نکردن از این موارد تنها به مشکلات مرورگرها ختم نمی شود بلکه اگر از کدهای درون خطی استفاده کنید کد شما به صورت زیر می شود:
HTML/CSS/HTML/CSS/HTML/CSS/HTML/CSS
در صورتی که می تواند اول تمام کدهای HTML و سپس کد های CSS را دانلود و پردازش کند. استفاده از کدهای متفاوت در درون ساختار HTML باعث افزایش زمان بارگذاری سایت می شود.
قانون چهارم در مورد CSS و جاوا اسکریپت
کدها را به پائین منتقل کنید
اگر جایی تنها چاره شما استفاده از کدهای جاوا اسکریپت در درون کد HTML تان است، پس سعی کنید آن ها را در پایین داکیومنت HTML تان قرار دهید. این کار باعث افزایش سرعت بارگذاری سایتتان می شود، چرا که ما تمام توابع و عملکرد جاوا اسکریپت را به بعد از بارگذاری کامل تگ ها و عناصر صفحه منتقل می کنیم. نکته دیگری که در این مورد باید توجه کنید آن است که گاهی اوقات کدهای جاوا اسکریپت به دلیل کامل تشکیل نشدن ساختار صفحه دچار اشکال می شوند که باعث کاهش سرعت بارگذاری سایت می شوند. همچنین به خاطر داشته باشید هر خطایی که در کد جاوا اسکریپت شما ایجاد شود می تواند به سرعت حافظه (RAM) کاربر را پر کند. لازم به ذکر نیست که هیچ کس دوست ندارد که با مراجعه به سایت شما کامپیوترش کرش کند.
قانون پنجم در مورد CSS و جاوا اسکریپت
بهینه سازی ساختار DOM
اگر می توانید ساختار DOM خود را کم کنید. برای مثال شما از جی کوئری برای اشاره به المان های مختلف ساختار DOM تان استفاده می کنید که جی کوئری همه ی ساختار شما را جستجو می کند تا المان مورد نظر شما را پیدا کند، این می توانید کمی سرعت سایت شما را کاهش دهد. یک جلمه جالب است که می گوید: "اگر شما کاری را انجام می دهید به این دلیل که تنها راهی است که شما می دانید، پس احتمالا راههای بهتری هم برای انجام آن وجود دارد."
تحقیق و پیدا کردن شیوه های انجام یک کار، لازمه کار شماست. اگر شما از یک div در HTML تنها به این دلیل استفاده می کنید به این دلیل است که شما تگ های کمی را می شناسید برای انجام کارتان، پس احتمالا می توانید کدهایتان را بیشتر بهینه سازی کنید. احتمالا بیشتر استفاده شما از div ها برای استایل ها است. گاهی می توانید برخی div ها را حذف کنید و به یک استایل کلی تر که زمان کمتری برای پردازش نیاز دارد، دست پیدا کنید.
بهینه سازی های عمومی
موارد زیر کمی به موضوعات کلی تر اشاره دارند که نمی توان آن ها را در موارد بالا گنجاند. اما موارد زیر اهمییت ویژه ای نسبت به موارد قبلی برای افزایش سرعت بارگذاری سایت تان دارند.
فیوآیکون
مرورگرها همیشه در مسیر اصلی سایت به دنبال فایل favicon.ico میگردند، همین حالا بروید و یک فیوآیکون آنجا قرار دهید. حتی اگر فیوآیکون شما موقتی است هم این کار را انجام دهید. اگر این کار را نکنید مرورگرتان خطای 'internal 404' می دهد. لازم به ذکر است که کاهش خطای ۴۰۴ باعث کاهش زمان سرعت بارگذاری سایتتان می شود.
حجم کوکی ها را کاهش دهید
بازگو کردن این مورد شاید برای بیشتر ما کارآمد نباشد. اما اگر شما طراح یک برنامه تحت وب هستید، بنابراین باید بدانید که کاهش حجم و تعداد کوکی ها در سرعت بارگذاری سایت بسیار مهم است. اگر از کوکی ها برای اعتبار سنجی و اعلان هویت کاربرانتان استفاده می کنید، باید بدانید که هر دور اطلاعاتی را در کوکی های کاربرانتان ذخیره می کنید این اطلاعات هر دور به سمت کاربر ارسال می شوند که باعث کاهش سرعت بارگذاری سایتتان می شود. پس سعی کنید که حجم کوکی ها را کاهش دهید.
کش
موضوع کش کردن اطلاعات بحث بسیار گسترده ای است که نمی توان تمام ابعاد آن را در این مطلب مورد بررسی قرار داد. اما به طور ساده، فایل هایی (مثل کدهای HTML/CSS) که بطور مرتب از آن ها بازدید می کنید، در کامپیوتر شما ذخیره می شوند تا در بازدید های بعدی نیاز به بارگذاری مجدد آن ها نباشد.
این تکنولوژی به طرز باور نکردنی مفید است و در سال های اخیر متدها و روش های مختلفی برای آن طراحی شده است. یکی از آن ها کش کردن اطلاعات دیتابیس است که می توانید این کار را با استفاده از Memcached انجام دهید. این برنامه ریکوئست های مختلف را زیر نظر می گیرد و به جای ارسال در خواست های مشابه به سمت دیتابیس آن ها را از حافظه خود ارائه می کند. یعنی چند مرحله پردازش تا پاسخگویی به کاربر را حذف می کند که تاثیر به سزایی در کاهش سرعت باگذاری سایت دارد. جالب است بدانید که سایت هایی مثل فیس بوک، توئیتر، یوتیوب، Zynga، ویکیپدیا و… از آن استفاده می کنند. همچنین CMS های همچون دروپال، وردپرس و جوملا نیز از آن پشتیبانی می کنند.
نظر شما
-
خدمات طراحی سایت
-
ویترین اخبار
- راه اندازی سایت نشریه الکترونیک فرهنگ انقلاب اسلامی
- ملاک شناخت یک شرکت طراحی سایت قوی و توانا برای راه اندازی سایت اینترنتی شما چیست؟
- فرا رسیدن نوروز باستانی، یادآور شکوه ایران و یگانه یادگار جمشید جم بر همه ایرانیان پاک پندار، راست گفتار و نیک کردار خجسته باد
- راه اندازی وب سایت اینترنتی ماشین سازی درستگاههای تولید آرد
- راه اندازی وب سایت اینترنتی ملک آریا
- 7 مورد از قابلیتهای غیرمنتظره در iOS 7
- Apex در برابر Nova: مقایسه دو لانچر اندروید
- پاداش 15,000 دلاری برای شکستن قفل TouchID
- نیکون از AW1، اولین دوربین ضد آب با قابلیت تعویض لنز، پرده برداشت
- لومیا 1520 نوکیا و این بار مشخصات فنی، قیمت و زمان عرضه
- رکورد فروش موبایل در دست 8 مدل
- اپل در حال تست نسخه های 701 و702 و 71 سیستم عامل iOS؟
- علت دقیق سرعت پایین اینترنت را نمیدانیم
- بررسی اکسپریا Z1 سونی
- آموزش ساخت ایمیل یاهو پس از حذف ایران!
- سهام توییتر روانه بازار بورس میشود
- تبلیغات تازه مایکروسافت علیه آیفون شکست خورد
- مدیرعامل اینتل: تبلتهای زیر 100 دلاری در تعطیلات سال نوی میلادی از راه میرسند
- 27 شهریور iOS 7 برای آیفونها و آیپدها منتشر میشود
- کنسول بازی جدید سونی با قابلیت های جذاب و قیمت مناسب معرفی شد: Vita TV
- کمپانی دل برای چینی ها لب تاب لوحی می سازد!!!
- ایسوس فون پد 7 اینچی جدید را معرفی کرد: تبلت/تلفن هیبریدی با اسپیکر دو کاناله
- یاهو لوگوی جدید خود را رونمایی کرد
- ایسوس از لپتاپ لمسی و ارزان قیمت X102BA با پردازنده AMD پرده برداشت
- دوباره Moto X و این بار تصویر رندر شده تبلیغاتی آن [بروز شد]
- ولخرجیهای گوگل در حوزه دیتاسنتر ادامه دارد: 6-1 میلیارد دلار در سه ماهه دوم 2013
- تشکیل گروه جهانی« طراحی فناوریهای پوشیدنی» در موتورولا، با استناد به آگهی استخدام این شرکت
- آشنایی با سیستمفایلها و نحوه فرمتکردن درایوهای خارجی در مک
- سرفیس RT هنوز نمرده است
- دانلود کنید: اپلیکیشن VLC برای کاربران iOS منتشر شد
- بررسی همهجانبۀ شایعات پیرامون ساعتهای هوشمند
- تصاویر واضح از آیفون ارزان قیمت در کنار آیفون 5 فاش شد
- تبدیل تصاویر به فرمت ICO و استخراج آیکونها از فایلهای با فرمت EXE و DLL
- نسخه جدید اندروید در 2 مردادماه معرفی میشود
- ال جی از نام G2 برای پرچمدار بعدی خود استفاده میکند
- مشخصات فنی و بنچمارک گلکسی نوت 3 فاش شد
- تصویر و مشخصات جدید آیفون 5S به بیرون درز کرد: صفحه نمایش IGZO، دوربین 12 مگاپیکسل، پردازنده سریعتر و پردازنده گرافیکی چهار هستهای
- آیا میتوان پس از مرگ اطلاعات با ارزش را در اختیار خانواده، دوستان و آشنایان قرار داد؟
- تصاحب Omek توسط اینتل ممکن است باعث شود هرگز نیاز به لمس کامپیوتر خود نباشید
- نسخه جدید تحت وب نقشه گوگل در دسترس همگان قرار گرفت
- تلفن G2 ال جی مجهز به باتری 2540 میلی آمپر ساعتی است
- جزئیات بیشتر از دوربین 20 مگاپیکسلی هونامی: سنسوری بزرگ ولی نه به اندازهی لومیا 1020
- مرور تاریخچه دوربین در گوشیهای برجسته نوکیا
- دریافت استاندارد و رتبه 6 از 10 گوگل توسط سایت شرکت راوک نگار پارس
- بروزرسانی تعدادی از جدیدترین نمونه آثار طراحی سایت های هوشمند راوک نگار پارس
-
نماد اعتماد الکترونیکی
-
آمار بازدید
- کل (online):۲۹۶۲
- اعضاء (online):۱
- میهمان (online):۲۹۶۱
- بازدید امروز::۳۱۲۸
- بازدید دیروز::۱۴۷۹
- بازدید کل::۲۸۸۶۷۵۸۰
-
تبلیغات