آموزش چندرسانه‌ای - استفاده از تصاویر در وب

این مقاله به شرایط استفاده از تصاویر و متن، چگونه سریع‌تر دانلود تصاویر و انتخاب فرمت مناسب تصاویر می‌پردازد.

وقتی از تصاویر استفاده می‌کنیم

برای اکثر تصاویر، یک تصویر ممکن است بیش از هزار کلمه باشد. اما باید توجه داشت که هیچ کس به کسانی که زیاد حرف می‌زنند، توجه نمی‌کند. اول از همه و مهم‌ترین نکته، این است که باید تصاویر مستند را به عنوان ابزار تجسمی در نظر گرفت، نه به عنوان تزئین بی‌دلیل. آن‌ها باید محتوای متن را پشتیبانی کنند و به خوانندگان کمک کنند تا در مستند جستجو کنند. استفاده از تصاویر می‌تواند محتوای مستند را واضح‌تر کند و می‌تواند برای افزودن توضیحات یا مثال‌ها به مستند استفاده شود. تصاویر پشتیبانی‌کننده از محتوا، نمودارها، منحنی‌ها، نقشه‌ها و تصاویر بسیار طبیعی و مناسب هستند. به عنوان مثال، تصاویر محصولات برای فهرست‌های آنلاین و راهنماهای خرید بسیار بخش‌های کلیدی هستند. همچنین آیکون‌ها و نمادهای چاپی با امکان لینک‌دهی، از جمله تصاویر با اثرات انیمیشنی، می‌توانند به عنوان راهنمای محتوایی یا منابع خارجی بسیار مؤثر باشند. اگر تصویری در مستند هیچ یک از این نقش‌ها را ایفا نمی‌کند، باید آن را کنار بگذاریم!

در حالی که به اضافه کردن تصاویر به مستند فکر می‌کنیم، یک عامل مهم دیگر، تاخیر زمانی که در جستجو از طریق شبکه، به ویژه از طریق اتصال مودم، برای انتقال مستند ایجاد می‌شود است. مستند معمولی می‌تواند حداکثر 10-15 کیلوبایت را نگه دارد، در حالی که یک تصویر می‌تواند به راحتی به اندازه چند صد کیلوبایت برسد. و زمان کل دانلود یک مستند نه تنها مجموع بخش‌های آن است، بلکه باید تأخیرهای ایجاد شده توسط بار شبکه را نیز در نظر گرفت.

بر اساس سرعت اتصال (که به عنوان پهنای باند نیز شناخته می‌شود،bandwidth، معمولاً با bps یا b/s نمایش داده می‌شود) و ممکن است سرعت اتصال را کاهش دهد، برای دانلود یک مستند مجزا شامل 100 KB تصویر، ممکن است در نیمه شب یک دو، وقتی بیشتر مردم هنوز در خواب هستند، با استفاده از یک مودم 57.6 Kbps حدود 15 ثانیه زمان ببرد تا دانلود انجام شود، یا ممکن است در وسط روز با استفاده از یک مودم 9600 bps بیشتر از 10 دقیقه زمان ببرد تا دانلود انجام شود. آیا این تصویر را دریافت کردید؟

البته، استفاده از تصاویر و دیگر رسانه‌های چندرسانه‌ای باعث می‌شود که ارائه‌دهندگان خدمات اینترنت به دنبال روش‌های سریع‌تر، بهتر و قوی‌تر برای ارائه محتوای وب باشند. به زودی، اتصالات 56 Kbps مودم‌ها مانند اسب و کالسکه از دور خارج می‌شوند (مانند مودم‌های 9600 bps)، و جایگزین آن‌ها توسط فناوری‌های جدید مانند مودم‌های کابلی و ADSL خواهد شد. در واقع، اکثر اتصالات به زودی سرعت بیش از 1Mbps را خواهند داشت.

با کاهش قیمت، استفاده از شبکه به طور مداوم افزایش می‌یابد و این باعث مشکلات مسدودسازی می‌شود. اگر سعی می‌کنید به سرورهای اضافه بار دسترسی پیدا کنید، حتی اگر سرعت اتصال شبکه شما بسیار سریع باشد، نمی‌توانید به راحتی به آن دسترسی پیدا کنید.

چه زمانی از متن استفاده کنیم

متن هنوز از دور نیست. برای برخی از کاربران، متن تنها بخشی از مستند است که می‌توان به آن دسترسی داشت. ما پیشنهاد می‌دهیم که در بیشتر موارد، مستند باید قابل دسترسی باشد، از جمله کاربرانی که نمی‌توانند تصاویر را مشاهده کنند یا کاربرانی که برای بهبود عملکرد اتصال اینترنت، امکان بارگذاری خودکار تصاویر توسط مرورگر را غیرفعال کرده‌اند. اگرچه نیاز به افزودن تصاویر به مستند ممکن است بسیار قوی باشد، اما در برخی موارد، مستندات صرفاً متنی واقعاً معنادارتر هستند.

مستندات تبدیل شده از فرمت‌های دیگر به صفحات وب معمولاً شامل تصاویر داخلی نیستند، و منابع و محتوای جدی دیگر نیز معمولاً به صورت متنی کامل قابل استفاده هستند.

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

اگر می‌خواهید مستند شما به راحتی توسط خدمات جستجوی گسترده وب پیدا شود، متن بهترین فرم است - تنها پشتیبانی از تصاویر، بدون زینت و تصاویر غیرضروری. اما این موتورهای جستجو معمولاً وجود تصاویر را نادیده می‌گیرند. اگر محتوای اصلی صفحه از طریق تصاویر ارائه می‌شود، اطلاعات کمتری در فهرست وب آنلاین در مورد مستند شما وجود خواهد داشت.

افزایش سرعت بارگذاری تصاویر

به جز انتخاب دقت در محتوایی که باید در مستند قرار گیرد، بسیاری از روش‌ها برای بهبود بار و تأخیر ناشی از تصاویر وجود دارد:

سادگی را حفظ کنید

یک تصویر 24 بیتی رنگی تمام‌صفحه، حتی اگر اندازه آن با استفاده از فرمت‌های استاندارد (مثل GIF یا JPEG و غیره) به صورت دیجیتال کوچک‌تر شده باشد، همچنان بخش بزرگی از پهنای باند شبکه را اشغال می‌کند. بنابراین، بهترین کار این است که از ابزارهای مدیریت تصویر مختلف برای بهینه‌سازی اندازه تصویر استفاده کنید و تعداد رنگ‌ها را به حداقل تعداد پیکسل‌های ممکن کاهش دهید. طراحی خود را ساده کنید و از عکس‌های منظره‌بندی خودداری کنید و از پس‌زمینه‌های خالی بزرگ و حاشیه‌های غیرضروری و عناصر فضای‌گیر دیگر پرهیز کنید. همچنین از اثرات لرزش (مخلوط کردن دو رنگ نزدیک برای به دست آوردن رنگ سوم) خودداری کنید، زیرا این تکنیک می‌تواند قابلیت فشرده‌سازی تصویر را به طور قابل توجهی کاهش دهد. به جای آن، از رنگ‌های یکدست بزرگ استفاده کنید، زیرا می‌توان آن‌ها را به راحتی با استفاده از فرمت‌های GIF یا JPEG فشرده کرد.

از تصاویر مجدداً استفاده کنید

این نکته برای آیکون‌ها و انیمیشن‌های GIF به ویژه مناسب است. اغلب مرورگرها اجزا مستند را در حافظه محلی به صورت کش (cache) ذخیره می‌کنند، به این ترتیب در زمان دریافت داده‌ها سریع‌تر عمل می‌کنند و از ارتباط شبکه کمتری استفاده می‌کنند. برای فایل‌های GIF کوچک، باید هر تصویر پیاپی را آماده کنید تا تنها بخش‌هایی که در انیمیشن تغییر کرده‌اند به‌روزرسانی شوند، نه اینکه کل تصویر را به‌روزرسانی کنید (این کار می‌تواند نمایش انیمیشن را نیز سریع‌تر کند).

مستندات بزرگ را تقسیم کنید

این یک اصل کلی برای شامل تصاویر است. بسیاری از بخش‌های کوچک مستند با استفاده از پیوند‌های فرامتنی (البته با استفاده از آن!) و فهرست‌های مؤثر سازماندهی می‌شوند، که این کار به کاربران کمک می‌کند تا مستندات بزرگتر را بهتر تحمل کنند. به طور کلی، مردم ترجیح می‌دهند بین چندین صفحه سرکش کنند تا اینکه زمان خود را برای بارگذاری یک مستند بزرگ هدر دهند (این مشابه تشنج شبکه تلویزیون است). یک تجربه خوب این است که هر مستند را در اندازه‌ای حدود 50 کیلوبایت نگه دارید، به این ترتیب حتی اگر خواننده از ارتباط کند استفاده کند، خسته نمی‌شود.

تصاویر بزرگ را در صورت نیاز جدا کنید

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

مشخص کردن اندازه تصویر

در نهایت، یکی از روش‌های بهبود عملکرد این است که ارتفاع و عرض حاشیه تصویر را در برچسب آن شامل کنیم. با مشخص کردن این اندازه‌ها، می‌توان برخی از مراحل اضافی را حذف کرد، بنابراین مرورگرهای با قابلیت‌افزودنی نیازی به انجام مراحل اضافی برای بارگذاری، بررسی و محاسبه اندازه تصویر در مستند ندارند. با این حال، این روش یک نکته منفی نیز دارد. اگر کاربر قابلیت بارگذاری خودکار تصاویر را غیرفعال کند، مرورگر همچنان فضای اختصاص داده شده به تصویر را با اندازه مشخص شده نمایش می‌دهد. به این ترتیب، چیزی که به خواننده ارائه می‌شود معمولاً یک قابلیت خالی است، اگرچه برای این مشکل هنوز راه حلی وجود ندارد، اما ما به شما توصیه می‌کنیم که از این ویژگی‌های اندازه‌گیری استفاده کنید زیرا ما از هر رفتاری که می‌تواند عملکرد شبکه را بهبود بخشد، حمایت می‌کنیم.

JPEG یا GIF؟

اگر منبع تصویر یا نرم‌افزار ابزار شما به یکی از این فرمت‌ها تمایل دارد، ممکن است تنها بتوانید از یکی از تصاویر JPEG یا GIF استفاده کنید. اکنون، هر دو این فرمت‌ها از سوی مرورگرها به طور گسترده‌ای پشتیبانی می‌شوند، بنابراین مشکلی در دسترسی کاربران وجود ندارد.

با این حال، ما هنوز پیشنهاد می‌دهیم که از ابزارهای مناسب برای ایجاد یا تبدیل این دو فرمت استفاده کنید تا از قابلیت‌های هر کدام به بهترین شکل استفاده کنید. به عنوان مثال، می‌توانید ویژگی شفاف GIF را در آیکون‌ها و نشانه‌های کوچک استفاده کنید. و از JPEG برای فشرده‌سازی تصاویر رنگ‌های غنی بزرگتر استفاده کنید تا سرعت بارگذاری سریع‌تر شود.

برچسب <img>

برچسب <img> مجاز به ارجاع به یا قرار دادن تصاویر در جریان فعلی مستند است. برای اطلاعات بیشتر در مورد این برچسب، لطفاً به: مراجعه کنید: