آموزش بهینه سازی کل تصاویر سایت با ChatGPT و پایتون (+ سورس کد)

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

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

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

1) استفاده از ابزارهای آنلاین

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

 لیست وب‌سایت‌های معتبر برای بهینه‌سازی تصاویر:

1. imagecompressor.com
2. tinypng.com
3. imageoptim.com
4. kraken.io
5. compressor.io
6. optimizilla.com
7. jpegmini.com
8. squoosh.app
9. picresize.com
10. shortpixel.com

2) استفاده از افزونه های وردپرس

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

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

1. Smush – بهینه‌سازی و فشرده‌سازی تصاویر به‌صورت خودکار.
2. EWWW Image Optimizer – بهینه‌سازی تصاویر در حین آپلود و بهینه‌سازی تصاویر موجود.
3. ShortPixel Image Optimizer – فشرده‌سازی تصاویر با حفظ کیفیت و کاهش حجم فایل‌ها.
4. Imagify – بهینه‌سازی و فشرده‌سازی تصاویر با امکانات مختلف.
5. WP Compress – بهینه‌سازی تصاویر به‌صورت خودکار و بهینه‌سازی تصاویر در ابعاد مختلف.
6. Optimole – بهینه‌سازی تصاویر و ارائه CDN برای افزایش سرعت بارگذاری.
7. Media Optimizer – بهینه‌سازی و فشرده‌سازی تصاویر با توجه به اندازه و کیفیت.
8. Lazy Load by WP Rocket – بارگذاری تصاویر تنها زمانی که در صفحه نمایش داده می‌شوند برای بهبود سرعت.
9. Resize Image After Upload – تغییر اندازه تصاویر به‌صورت خودکار پس از آپلود.
10. Pngj Compressor – فشرده‌سازی فایل‌های PNG به‌صورت ویژه.

2) استفاده از پایتون (تولید شده توسط مدیرشاپ)

تیم مدیرشاپ برای سادگی و سرعت بهتر بهینه‌سازی تصاویر، با استفاده از هوش مصنوعی چت جی‌پی‌تی (chatgpt.com) و زبان پایتون، این ابزار را پیاده‌سازی کرده است که می‌توانید به راحتی تصاویر سایت‌تان را بهینه کنید و در زمان و منابع خود صرفه‌جویی کنید.

اگر وب‌سایت شما شامل 1,000 یا 100,000 عکس غیر بهینه شده است، نگران نباشید! کد طراحی‌شده به‌طور خودکار اندازه اصلی عکس‌های محصولات را به 800×800 پیکسل تغییر می‌دهد و در عین حال اندازه‌های دیگر را دست نخورده باقی می‌گذارد. این فرایند شامل بهینه‌سازی کیفیت تصاویر با حذف نویز و سایه‌هاست که به شما این امکان را می‌دهد تا تصاویری شفاف و باکیفیت ارائه دهید.

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

با این ابزار، می‌توانید سرعت بارگذاری وب‌سایت خود را بهبود ببخشید، که در نهایت تأثیر مثبتی بر تجربه کاربری و رتبه‌بندی سئو خواهد داشت.

ویدئوی آموزشی نحوه عملکرد ابزار روی سایت واقعی

در این ویدئوی آموزشی، ابزار بهینه‌سازی تصاویر را بر روی وب‌سایت https://mccosmetic-iran.com/ اجرا می‌کنیم و به‌طور کامل تصاویر را بهینه‌سازی می‌کنیم. برای مشاهده جزئیات و توضیحات کامل، می‌توانید ویدئو را تماشا کنید.

دانلود فایل فشرده کد پایتون

from PIL import Image, ImageFile
import os
import cv2
import numpy as np
import re

# تنظیم برای بارگذاری تصاویر ناقص
ImageFile.LOAD_TRUNCATED_IMAGES = True

images_folder = 'images/'
output_folder = 'output_images/'
os.makedirs(output_folder, exist_ok=True)

def add_white_background(img):
    if img.mode in ('RGBA', 'LA') or (img.mode == 'P' and 'transparency' in img.info):
        background = Image.new("RGB", img.size, (255, 255, 255))
        background.paste(img.convert('RGBA'), (0, 0), img.convert('RGBA'))
        return background
    else:
        return img.convert("RGB")

def extract_largest_subject(image):
    gray = cv2.cvtColor(image, cv2.COLOR_BGR2GRAY)
    _, thresh = cv2.threshold(gray, 240, 255, cv2.THRESH_BINARY_INV)
    kernel = cv2.getStructuringElement(cv2.MORPH_RECT, (5, 5))
    morphed = cv2.morphologyEx(thresh, cv2.MORPH_CLOSE, kernel, iterations=2)
    contours, _ = cv2.findContours(morphed, cv2.RETR_EXTERNAL, cv2.CHAIN_APPROX_SIMPLE)

    if contours:
        largest_contour = max(contours, key=cv2.contourArea)
        x, y, w, h = cv2.boundingRect(largest_contour)
        return x, y, w, h
    return None

def process_image(image_path, target_size=None):
    try:
        image_pil = Image.open(image_path)
        image_pil = add_white_background(image_pil)
        image = cv2.cvtColor(np.array(image_pil), cv2.COLOR_RGB2BGR)

        subject_box = extract_largest_subject(image)

        if subject_box:
            x, y, w, h = subject_box
            padding_x = int(w * 0.03)
            padding_y = int(h * 0.03)

            start_x = max(x - padding_x, 0)
            end_x = min(x + w + padding_x, image.shape[1])
            start_y = max(y - padding_y, 0)
            end_y = min(y + h + padding_y, image.shape[0])

            cropped_image = image[start_y:end_y, start_x:end_x]

            background_color = (255, 255, 255)
            cropped_image_pil = Image.fromarray(cv2.cvtColor(cropped_image, cv2.COLOR_BGR2RGB))

            if target_size:
                ratio = min((target_size[0] * 0.9) / cropped_image_pil.width, (target_size[1] * 0.9) / cropped_image_pil.height)
                new_size = (int(cropped_image_pil.width * ratio), int(cropped_image_pil.height * ratio))
                resized_image = cropped_image_pil.resize(new_size, Image.LANCZOS)

                final_image = Image.new("RGB", target_size, background_color)
                position = ((target_size[0] - new_size[0]) // 2, (target_size[1] - new_size[1]) // 2)
                final_image.paste(resized_image, position)
            else:
                target_size = (800, 800)
                ratio = min((target_size[0] * 0.8) / cropped_image_pil.width, (target_size[1] * 0.8) / cropped_image_pil.height)
                new_size = (int(cropped_image_pil.width * ratio), int(cropped_image_pil.height * ratio))
                resized_image = cropped_image_pil.resize(new_size, Image.LANCZOS)

                final_image = Image.new("RGB", target_size, background_color)
                position = ((target_size[0] - new_size[0]) // 2, (target_size[1] - new_size[1]) // 2)
                final_image.paste(resized_image, position)

            final_image.save(image_path, 'JPEG', quality=95)
            print(f"Processed and saved {image_path}")
        else:
            print(f"No significant subject found in {image_path}")
    except OSError as e:
        print(f"Error processing {image_path}: {e}")

def get_size_from_filename(filename):
    # پیدا کردن الگوهای عرض x ارتفاع در نام فایل
    matches = re.findall(r'(\d+)x(\d+)', filename)
    if matches:
        # بررسی اینکه آیا آخرین جفت عدد در ۱۰ کاراکتر انتهایی است
        last_match = matches[-1]
        start_index = filename.rfind(last_match[0] + 'x' + last_match[1])
        if start_index >= len(filename) - 10:
            return int(last_match[0]), int(last_match[1])
    return None

def process_images_in_folder(folder):
    for root, dirs, files in os.walk(folder):
        for image_file in files:
            if image_file.lower().endswith(('.png', '.jpg', '.jpeg')):
                image_path = os.path.join(root, image_file)
                target_size = get_size_from_filename(image_file)

                if target_size:
                    process_image(image_path, target_size)
                else:
                    process_image(image_path)

process_images_in_folder(images_folder)

print("All images processed.")

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

امیدوارم با استفاده از این ابزار و تکنیک‌های بهینه‌سازی، شاهد رشد و پیشرفت بیشتری در فعالیت‌های خود باشید و به اهداف خود نزدیک‌تر شوید.

اگر سوالی داشتید در کامنت بپرسید و یا میتواند از طریق شبکه های اجتماعی با ما در ارتباط باشید.