راهنمای کوتاه ساخت وب‌سایت‌های سریع
چرا ساخت وب‌سایت‌های سریع ؟ وقتی برای اولین بار شروع به طراحی وب می‌کنید احتمالاً مشکل سرعت وبسایت به نظر‌تان مشکل شخص دیگری است. حداقل وقتی مبتدی بودم من یکی که اینطور فکر می‌کردم.
گذشته از این‌ها کار طراحی را بر روی بوم‌های خالی فتوشاپ شروع کردم. نه برنامه‌ای، نه نرم‌افزار‌های مدیریت محتوای. معمولاً حتی نمی‌دانستم می‌خواهم چند صفحه داشته باشم، یا مثلاً قرار است روی این صفحات چه چیزهایی بگذارم. فقط وب‌سایت‌هایی می‌ساختم، بیشتر برای سرگرمی؛ چون تصیمیم گرفته بودم سال‌های نوجوانیم را اینجور سپری کنم. زمانی اولین بار کشف کردم که می‌شود در سرعت بارگذاری وبسایت بهینه‌سازی کرد که برای اولین بار به این کشف بزرگ نائل شدم که چه جور می‌شود یک وب سایت درست و حسابی ساخت. بالاخره، سرعت وقتی مسئله ساز می‌شد که سایت‌های من واقعا عظیم و بزرگ می‌بودند و مردم هم هنوز داشتند از سیستم dial-up استفاده می‌کردند، مگر نه؟
چیزی که به سختی حالی من شد این است وقتی می‌خواهید کاری انجام بدهید، باید از ابتدا شروع کنید. بعضی چیز‌ها هستند که باید آنها را در اولویت اول قرار داد، و این یعنی باید از همان اول وب سایت را جوری ساخت که سرعت داشته باشد.
خوب حالا که داریم در مورد «سرعت» صحبت می‌کنیم منظورمان چیست؟ یعنی با چه سرعتی در مرورگر بارگذاری می‌شود؟ با چه سرعتی اجرا می‌شود؟ بله. منظورم هر دوی این‌ها است. چون همپوشانی زیادی بین این دو نوع سرعت وجود دارد.
باید هر دوی این‌ها را در نظر بگیرید. هنوز هم خیلی از مردم به اینترنت بسیار کند دسترسی دارند. فن‌آوری 3G چندان عالی نیست، کاربران تلفن همراه هم هنوز با داده‌های مزاحم دست و پنجه نرم می‌کنند. همینطور، احتمالاً میلیون‌ها گوشی تلفن همراه وجود دارد که پردازنده‌های سرعت پایین دارند.
همینطور که من دارم در این مقاله چند تا راهنمایی فنی و ترفند بهتان ارائه می‌کنم، یادتان باشد که مهم‌ترین چیزی که باید عوض کنید طرز فکرتان است. سرعت به معنای گفت و شنود، فروش و دوباره سر زدن مردم به وبسایت شما در آینده است برای به دست آوردن اطلاعات بیشتر و مطالب جدید‌تر. وبسایت کند هم به این معنی است که افراد می روند سراغ چیزی که نخواهد صبر و تحمل‌شان را محک بزند. و سایت‌ها حتی زمانی که سریع بارگذاری می‌شود ممکن است به نظر کند بیایند. اینجا اینترنت است. شما باید رقابت کنید. در اینجا یک اینفوگرافی آورده‌ایم به به صورت بصری به شما نشان بدهد چگونه سرعت وبسایت می‌تواند بر نتیجه کارتان تاثر بگذارد. بهینه‌سازی سرعت را باید از جایی شروع کرد که فرایند طراحی آغاز می شود؛ یعنی از محتوا. این احتمال هست که کسی چندان توجهی به طراحی سایت نکند، مگر وقتی که همه بازدید‌کنندگان‌تان از میان همکاران طراح وب‌تان باشند؛ بر عکس، همه حواس بازدید کننده‌ها به محتوای سایت معطوف خواهند شد. اگر این محتوا باشد که باعث کندی سایت شما می‌شود، هر قدر هم به بهینه‌سازی طراحی سایت بپردازید مشکل برطرف نخواهد شد.
معلوم شده که تصاویر بزرگ منجر به فروش بهتر می‌شود. این عالی است. اما لطفاً در استفاده از این تصاویر حجیم مضایقه کنید، مطمئن شوید که به خوبی فشرده شده باشند، یا حتی بهتر است از SVG استفاده کنید. اگر نگاهی به این داده‌ها بیندازید، خواهید دید که اندازه متوسط صفحاتی که روی گوشی‌های تلفن همراه بار گذاری شده اند (افراد که معمولاً سرعت کندتر یا سیستم عامل‌هایی با داده‌های مزاحم داشته‌اند) خیلی سریع دارند به حجم 1MB نزدیک می‌شوند، و تصاویر باعث و بانی نیمی از مشکل هستند. روش هایی هست که می شود مزایای هر دو حیطه را با هم داشته باشید. علاوه بر آن، کم کم به کار بردن تصاویر دارای عکس‌العمل سریع آسان‌تر شده است. گذشته از همه، افرادی که از رایانه رو میزی استفاده می کنند، احتمال بیشتری دارد که برای مقابله با تصاویر حجیم‌تر اینترنتی داشته باشند که به قدر کافی سریع باشد..
آگهی‌ها و دیگر مطالب فرعی
بله، تبلیغات به عنوان جزئی از محتوا حساب می‌شوند، به ویژه وقتی که مخلوط با بدنه و متن سایت آورده می‌شوند. بدتر از همه، گاهی اوقات شبکه‌های آگهی دهنده واقعاً، واقعاً کند هستند. نمی‌دانم چند بار تا بحال پیش آمده که متوجه شده ام فقط بخشی از سایت بارگذاری شده و مرورگر قبل از بارگذاری بقیه مطالب منتظر شبکه آگهی مانده است. اگر می‌خواهید روی سایت‌تان تبلیغات داشته باشید هر کدام از آنها را چند بار بررسی و کنترل کنید، ببینید هر کدام چطور اجرا می‌شود، و مطمئن شوید که اشکالی در بارگذاری پیش نخواهد آمد. این مسئله درباره همه مطالب دیگری که از سرور‌های ثالث بارگذاری می‌شوند مصداق دارد. شما را در حال کشیدن از هر. گذاشتن پیوند فیدهای RSS، رسانه‌های اجتماعی و مانند آن، اگر حواستان نباشد، می‌تواند سایت‌تان را بیش از پیش کند نماید.
زمانی که خود طراحی کند است
البته عکس قضیه هم احتمال وقوع دارد. خیلی از سایت‌ها هستند که سبک بوده و محتوای ساده، مانند متن و یکی دو تا تصویر کوچک دارند که به خاطر طراحی ضعیف و کد نویسی بد سنگین شده اند.
این به این خاطر است که خیلی از افراد فکر می‌کنند باید تا جایی که جا دارد سایت‌شان را فانتزی طراحی کنند. من این میل و رغبت را درک می‌کنم؛ اما روزگار Flash (به یک دلیل) به سر آمده است. نباید تصمیم بگیرید که HTML5، CSS3 و جاوا اسکریپت را جایگزین‌های Flash کنید. کاربران‌تان چنادن دلشان نمی‌خواهد دور و بر صفحه پر از تصاویر متحرکی باشد که بالا و پایین می‌پرند. آنها می‌خواهند مستقیماً بروند سراغ اطلاعاتی که ارائه می‌کنید، یا محصولی که می‌فروشید.
چیزهای فانتزی اغلب باعث کندشدن همه چیز می شوند
وب سایت شما نیازی به گرافیک‌های تصویری مثل شکست نور، یک دسته انیمیشن بی فایده، و یا یک مشت نوشته بی سر و ته براق نیاز ندارد تا بتواند تاثیر گذار باشد. البته نمی‌گویم خیلی ساده، صفحه‌تان را با یک متن سیاه رنگ، با پس زمینه‌ای سفید، بدون طرح و گرافیک رها کنید. می‌گویم هر گونه افزوده قالب بندی را باید از منظر تجربه کاربر و حجیم بودن آن سبک و سنگین کرد. وقتی می‌خواهید انیمیشن و چیزهای زرق و برق دار به اضافه کنید از خودتان بپرسید واقعاً به این چیز‌ها نیاز دارم، یا چیزی می‌خواهم که پیشرفته‌تر از این‌ها باشد. این موضوع نکته مثبت قضیه است که تا وقتی واقعاً نخواهید یک اپلیکیشن بسازید نیازی هم به چیزهای پیشرفته، مثل jQuery نخواهید داشت. این امر به ویژه درباره سایت‌های کوچک تا متوسط مصداق دارد.
بعلاوه مسئله فقط تعداد بایت صفحه نیست. انیمیشن‌هایی در صفحات وب دیده‌ام که سرعت رایانه مختص گیم را هم کند کرده‌اند و این موضوع اصلاً خوب نیست. حالا فرض کنید یکی می‌خواهد با یک گوشی هوشمند یا تبلت سرعت پایین این سایت را مرور کند. تصور کنید چقدر نا امید ککنده خواهد بود. اگر می‌خواهید برای خوش طعم شدن سایت‌تان یکی دو تا عنصر گرافیکی به عنوان چاشنی به آن اضافه کنید، اینجا می توانید کتابخانه‌ای کامل از «پلاگین»های جاوا اسکریپت را پیدا کنید که نیازی هم به jQuery یا دیگر نرم‌افزار‌های مدیریت محتوا ندارید.
صحبت درباره کد‌های بیش از اندازه
این بحث مرا به این موضوع کشاند که درباره نرم‌افزار‌های مدیریت محتوا HTML و CSS صحبت کنم. این امکان وجود دارد که برای ایجاد سایت ساده نیازی به نرم‌افزار‌های مدیریت محتوای حجیم مانند Bootstrap نیاز است. این نرم‌افزار‌ها می‌توانند موجب صرفه جویی در زمان کل توسعه و گسترش سایت بشوند؛ اما ارزش زمان بارگذاری اضافی را ندارند. اگر قصد استفاده از یک نرم‌افزار‌های مدیریت محتوا را دارید، حداقل آن را سفارشی کرده و بخش‌هایی که به دردتان نمی‌خورد را حذف کنید. بسیاری از نرم‌افزار‌های مدیریت محتوای بزرگتر مانند HTML یا CSS راه‌های آسانی برای انجام این کار در اختیارتان قرار می‌دهند.
باز هم درباره تصاویر …
نه، کاری با تصاویر حجیم نداریم. در مورد آنها قبلاً صحبت کردیم. حالا می‌خواهیم درباره جزئیات صحبت کنیم. آیا هنوز هم سایت‌تان دارد از تصاویر شطرنجی، هاشور، سایه‌ها، آیکون‌ها، و چیزهایی شبیه به این‌ها برای رنگ پس زمینه استفاده می‌کند؟ نباید اینطور باشد.
اگر می‌توان این‌کار را با HTML، CSS یا SVG انجام داد، باید همین کار را بکنید. ممکن است مقداری کد نویسی بیشتر لازم داشته باشد، اما هنوز هم در حالت معمول کدها سبک تر از فایل‌های.jpeg و حتی بسیاری از فایل‌های .png هستند.
حالا سایتم سریعتر است، مگر نه؟
خب، خیلی چیزهای دیگر هست که باید یاد بگیرید، مخصوصاً اگر دارید از یک سیستم مدیریت محتوا مانند WordPress یا انواع دیگر تنظیمات میزبانی پیچیده استفاده می‌کنید. این مشاوره فقط به درد وقتی می‌خورد که برای اولین بار می‌خواهید شروع به ساخت وبسایت کنید،… اما خوب، یادگیری چیزهای تازه سرگرم کننده است!
