سئو و بهینه‌سازی تصاویر سایت

آموزش سئو ۵: سئو درون صفحه: بهینه‌سازی تصاویر

Picture of رضا توکلی

رضا توکلی

نویسنده علاقه‌مند به داستان | سازنده فوربو

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

[megadesc]پیش‌نیاز این مقاله: اصول سئو و بهینه سازی موتور جستجو[/megadesc]

[megadesc]

مقالات بخش آموزش سئو توسط آقای رضا شیرازی مفرد مدیر سایت وب۲۴ حمایت شده‌اند

ما فقط برای شما یک سایت طراحی نمی‌کنیم، وب۲۴ به دنبال ارائه خدمات کامل و متمایز به مشتریان خود است. ما در شرکت وب۲۴ سعی می‌کنیم که هر آنچه یک کسب و کار اینترنتی برای بهبود وضعیت خود در فضای مجازی نیاز دارد را به او ارائه دهیم.

[/megadesc]

سئو و بهینه‌سازی تصاویر سایت

آموزش سئو ۵: سئو درون صفحه: بهینه‌سازی تصاویر

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

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

وقتی چیزی به ساختار اصلی یک سایت اضافه می‌شود. باید به اهمیت داد. در سئو و بهینه‌سازی سایت ما همه‌چیز را بررسی می‌کنیم. آن‌ها را بهینه و نسخه بهتری از آن‌ را ارائه می‌دهیم. چه یک مقاله یا کد باشد و چه یک تصویر.

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

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

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

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

انواع فرمت‌های تصویر

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

اول) فرمت تصویر JPEG

از این فرمت تصویر می‌توانید برای تصاویر اصلی در مقاله خود استفاده کنید. یکی تصاویر مهم در بین مقاله سایت شما، بهتر از نوع JPEG باشند. این فرمت، رایج‌ترین فرمت تصویر در بین سایت‌ها بوده و اکثرا از این فرمت استفاده می‌کنند. حجم مناسب و قابلیت فشرده‌سازی از ویژگی‌های این فرمت است. برای خروجی گرفتن با این فرمت در فتوشاپ می‌توانید در قسمت Save as، آن را انتخاب کنید. برای تبدیل فرمت همچنین می‌توانید از ابزارهای آنلاین مانند https://image.online-convert.com هم استفاده کنید.

دوم) فرمت تصویر PNG

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

سوم) فرمت تصویر GIF

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

فرمت‌های تصویر خاصی مانند SVG برای وکتورها و همچنین WEBP برای تصاویر با حجم بالا هم دو فرمت دیگری هستند که در اینترنت استفاده می‌شوند. اما سه فرمت رایج، JPEG، PNG و GIF هستند.

شروع سئو کردن و بهینه‌سازی تصویر

آموزش سئو ۵: سئو درون صفحه: بهینه‌سازی تصاویر

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

نام فایل عکس

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

در عنوان عکس‌های خود لازم نیست همه‌چیز را به‌صورت کامل ذکر کنید. کلمه کلیدی مقاله خود را به‌یاد بیاورید. عکس در مورد چیست؟ مقاله در مورد چیست؟ آن کلمه کلیدی را بدون حروف اضافه‌ای مانند a، The و کلماتی دیگری مانند With، to و… ذکر کنید. برای مثال ممکن است عنوان مقاله شما این باشد. «چگونه تصاویر سایت خود را بهینه‌سازی کنیم؟» حال قرار نیست نام فایل عکس خود را به شکل How to optimize our photos website ذخیره کنید.! تنها یک Optimize photo یا به‌بیان درست‌تر Photo Optimization کافی است.

نکته مهم در ذخیره کردن نام فایل عکس، این است که از _ (زیر خط – Underline) استفاده نکنید. این مورد توسط گوگل رد شده و توصیه کردن است برای شناسایی بهتر عنوان فایل از – (خطر تیره – Dash) استفاده کنید. برای مثال عنوان فایل عکس شما به شکل Photo-Optimization باشد نه Photo_Optimization.

متن جایگزین

خب به اصلی‌ترین قسمت مربوط به سئو و بهینه‌سازی تصاویر رسیدیم. اگر هیچ‌ نخواستید هیچ یک از موارد مربوط به بهینه‌سازی تصاویر را انجام ندهید، ندهید! اما باید روی این قسمت کار کنید. در واقع متن جایگزین (Alternative Text) کلیدی‌ترین ویژگی یک تصویر بهینه‌شده است. به این تگ، تگ آلت – ALT نیز می‌گویند.

متن جایگزین توسط قسمت تصاویر گوگل (Google Image) شناسایی می‌شود. در واقع تصویر شما توسط این متن به گوگل شناسانده می‌شود که در مورد چیست. پس بسیار اهمیت دارد. در واقع این قسمت، بیرون از سایت شما هم اهمیت دارد. یعنی یک سری کاربران شاید تنها به دنبال عکس باشند! و اصلا به سایت شما مراجعه نکنند. به همین خاطر است که به این مورد اشاره کردیم که اگر می‌خواهید هیچ قسمت را انجام ندهید ولی متن جایگزین را حتما استفاده کنید.

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

<”img src=’your-file-name.jpg” alt=”your alt information” />

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

در هنگام آپلود تصویر در وردپرس، لازم است که از کلمه کلیدی اصلی خودتان در قسمت تعیین شده برای «متن جایگزین» استفاده کنید.

توضیحات تصویر

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

این تگ به‌صورت مستقیم با سئو و بهینه‌سازی تصاویر شما ارتباطی ندارد. اما به‌صورت غیر مستقیم به سئو سایت شما کمک می‌کند. بگذارید شفاف این موضوع را توضیح دهم.

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

از همین رو اگر متن جذاب و مرتبطی را زیر عکس‌های خود بنویسید، می‌توانید کاربر را بیشتر در سایت نگه دارید. نگه داشتن کاربر در سایت باعث می‌شود که او دیر تر از سایت شما خارج شود. دیر تر خارج شدن کاربر از صفحه نرخ خروج (بانس‌ریت – Bounce Rate) سایت شما را کاهش می‌دهد و از این جهت برای سایت شما مفید واقع می‌شود. پس نه به‌صورت مستقیم اما غیر مستقیم، توضیحات تصویر می‌تواند برای سئو سایت شما موثر باشد.

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

کپی‌رایت تصاویر

عکس کپی شده کاملا توسط گوگل، مروگر و کلا هر چیزی! شناسایی می‌شود. عکس باید در در هاست شما آپلود شده باشد و URL آن با آدرس سایت شما شروع شود. این از اولین مورد.

مورد دوم در خصوص این است که با توجه سرویس‌های جستجو با تصویر گوگل، محتوا خود تصویر هم شناسایی می‌شوند، (البته این قابلیت به‌صورت کامل ارائه نشده و همچنان در حال تست است، اما حتما به‌زودی نسخه ۱۰۰% کامل و عملی آن ارائه خواهد شد.) بهتر از از تصاویر منحصر به فرد خود استفاده کنید.

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

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

بهینه‌سازی تصاویر از لحاظ سایز

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

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

برای بهینه‌سازی تصاویر سایت از لحاظ سایز ابتدا بخش‌های مختلف سایت خود را بشناسید. با استفاده از ابزار Inspect مرورگر کروم، می‌توانید یک تصویر را باز کرده و سایز نمایش داده شده آن را مشاهده کنید. سپس تصاویر خود را با همان سایز آپلود کنید. برای تغییر سایز عکس خود نیز می‌توانید از نرم‌افزار فتوشاپ و یا ابزارهای آنلاینی مانند http://www.picresize.com استفاده کنید.

فشرده‌سازی

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

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

فشرده‌سازی تصاویر با استفاده از پلاگین‌های وردپرس

یکی از ویژگی‌های وردپرس، افزونه‌های بسیار کاربردی آن است. برای هر چیزی یک افزونه وجود دارد! اما برای فشرده‌سازی کلی افزونه در دسترس است. افزونه‌هایی مانند WP Smush، Compress JPEG & PNG images و Imagify برای این کار آماده شده‌اند.

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

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

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

یکی از بهترین سایت‌های ارائه دهنده سرویس فشرده‌سازی و کم کردن حجم عکس به‌صورت رایگان سایت https://compressjpeg.com است. اما تعداد این سایت‌ها از انگشتان دو دست هم بیشتر است! و تنها کافی است عبارت‌هایی را با Compress و Optimize در گوگل جستجو کنید.

فعال کردن حالت Lazy Load

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

حالتی تحت عتوان Lazy Load وجود دارد که با فعال کردن آن می‌توانید جلوی لود شدن تصاویری که هنوز کاربر به آن‌ها نرسیده است را بگیرید. این قابلیت نرم‌افزاری به‌صورت پیش‌فرض بر روی وردپرس نیست اما می‌توانید با نصب افزونه‌هایی مانند WP Rocket و Optimole آن را برای سایت خود فعال کنید.


مقالات بخش آموزش سئو توسط آقای رضا شیرازی مفرد مدیر سایت وب۲۴ حمایت شده‌اند

ما فقط برای شما یک سایت طراحی نمی‌کنیم، وب۲۴ به دنبال ارائه خدمات کامل و متمایز به مشتریان خود است. ما در شرکت وب۲۴ سعی می‌کنیم که هر آنچه یک کسب و کار اینترنتی برای بهبود وضعیت خود در فضای مجازی نیاز دارد را به او ارائه دهیم.


پایان

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

 

[megadesc]

حامی این مقاله سایت فوربو شوید

در صورتی که این مقاله برای شما مفید بود، می‌توانید با انتخاب یکی از آیتم‌های زیر، به‌صورت کاملا اختیاری از فوربو حمایت کنید.

۲ هزار تومان | ۵ هزار تومان | مبلغ دلخواه

یا ما را در رسانه‌های زیر دنبال کنید

اینستاگرام | توییتر | تلگرام

[/megadesc]
اشتراک در
اطلاع از
guest

1 دیدگاه
قدیمی‌ترین
تازه‌ترین بیشترین رأی
بازخورد (Feedback) های اینلاین
مشاهده همه دیدگاه ها
Alex
Alex
5 سال قبل

For compressing or resizing images I recommend you also jpegreducer.com