0

هیچ محصولی در سبد خرید نیست.

طراحی سایت در اصفهان, سئو سایت اصفهان, ساخت سایت اصفهان, طراحی سایت حرفه ای اصفهان, بهینه سازی سایت , بازاریابی و دیجیتال مارکتینگ 09133886881 احمدپور

آموزش ذخیره سازی تصاویر

نویسنده پشتیبانی وب یار
امتیاز مطلب
تعداد بازدید 1016
تاریخ بروزرسانی ۱۵ تیر ۱۳۹۸

فرمت تصاویر در طراحی سایت

با پیشرفت تکنولوژی و همگانی شدن اینترنت اکثر کاربران اینترنت به دنبال سایت های با بارگزاری سریع هستند و اگر سایت شما تصاویری با حجم بالا داشته باشد مدت زمان زیادی برای لود سایت صرف می شود و موجب نارضایتی کاربرای می شود. برای بیشتر شدن سرعت لود و رضایت کاربران بهتر است از تصاویر با حجم کم و فرمت مناسب استفاده کنید. در این مطلب ذخیره سازی تصاویر من شما را تو این زمینه راهنمایی می کنم.

 

انواع فرمت ذخیره سازی تصاویر

فرمت های زیادی برای ذخیره سازی تصاویر از جمله PNG,TIFF.GIF,SVG,HEIC,WebP,JPG وجود دارد که PNG , JPG دو فرمت معروف و اصلی عکس در انواع سیستم عامل ها می باشند اما اگر بیش از حد روی آن ها زوم کنیم کیفیت آن کم می شود و حالت پیکسل پیکسل به خود می گیرد چرا که نوع گرافیک bitmap یا پیکسلی است و نه برداری در گرافیک برداری همه چیز از خطوط و منحنی ها تشکیل می شود. فرمت دیگری از تصویر به نام SVG یا فرمت فکتوری و برداری وجود دارد که با زوم زیاد از کیفیت آن کم نمی شود چرا که با معادله ی خط و منحنی روبه رو هستیم درست مثل بزرگ کردن فونت یا زوم کردن روی خطوط.
شاید برای شما این سوال پیش آمده باشد که تفاوت JPG وPNG در چیست یا اینکه چرا طراحان وب در مواقعی از فرمت JPG و در مواقعی از فرمت PNG استفاده می کنند.

 

تفاوت فرمت های PNG و JPG

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

آموزش ذخیره سازی تصاویر

آموزش ذخیره تصاویر

 

حال همین کار را با فرمتPNG انجام می دهیم و خروجی به صورت زیر در می آید:

آموزش ذخیره سازی تصاویر

فرمت png تصاویر در طراحی سایت

 

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

 

چگونه فایل PNG JPG, , GIF را به پسوند SVG برای ذخیره سازی تصاویر تبدیل کنیم؟

برای انجام این کار می توان از نرم افزار های مختلف تخصصی مانند Adobe Illustrator ,Inkscape photoshop Vectorizer,و نرم افزار draw از آفیس LibreOffice استفاده کرد .همچنین برخی وب اپلیکیشن ها مانند Aconvert نیز به صورت رایگان این کار را انجام می دهند.
برای مثال ما با نرم افزار Aconvert برای ذخیره سازی تصاویر به فایل SVG استفاده می کنیم.

 

تبدیل انواع فرمت ها به فرمت SVG با استفاده از نرم افزار Aconvert:

ابتدا به آدرس aconvert.com مراجعه کنید در صفحه باز شده روی دکمه ی Add files کلیک کنید و فایل مورد نظر خود را با هر فرمتی انتخاب کنید از منوی بازشو Target format فرمت SVG را انتخاب کنید.

 

آموزش ذخیره سازی تصاویر

آموزش ذخیره سازی تصاویر

 

پس از آن گزینه convert now را کلیک کنید.

 

تبدیل فرمت تصویر

تبدیل فرمت تصویر طراحی سایت

 

پس از چند ثانیه نتیجه ی تبدیل فایل در قسمت Conversion Results نمایش داده می شود با کلیک بر روی آن می توان فایل SVG را دانلود کرد.

 

تبدیل فرمت تصویر Aconvert

تبدیل فرمت تصویر

 

نرم افزار Aconvert

آموزش نرم افزار Aconvert

 

تبدیل فرمت فایل به SVGدر فتوشاپ

در فتوشاپ چند روش برای ذخیره سازی تصاویر به فرمت SVGوجود دارد که به سه مورد آن اشاره می کنیم.

 

روش اول برای تبدیل تصویر برای وب:

از منوی file گزینه ی export را کلیک کرده و از زیر منوی باز شده export as…. را انتخاب می کنیم صفحه ای مانند تصویر باز می شود:

 

ذخیره کردن تصویر

ذخیره کردن تصویر در فتوشاپ

 

از قسمت format می توان چهار نوع فرمت JPG,PNG,SVG,GIF را برای ذخیره سازی تصاویر انتخاب کرد.
در قسمت image size میتوان طول و عرض عکس را تنظیم کرد ودر قسمت scale به صورت درصدی سایز را تغییر داد. تغییر کیفیت عکس با استفاده از متد resampleهم امکانپذیر است.
Canvas size برای مشخص کردن سایز برای تبدیل عکس می باشد.
همچنین تنظیمات فشرده سازی و کپی رایت را هم میتوان انتخاب کرد. در نهایت گزینه یexport all… را کلیک می کنیم.

 

روش دوم برای تبدیل تصویر برای طراحی سایت:

از منوی file گزینه ی export را کلیک کرده و از زیر منوی باز شده save for web را انتخاب می کنیم صفحه ای مانند تصویر زیر باز می شود:

 

فرمت تصاویر در طراحی وب

فرمت تصاویر در طراحی وب

 

نوع فرمت را از کشوی دوم انتخاب و گزینه هایی همچون پالت رنگ, سایز تصویر , انیمیشن که به ترتیب برای تنظیم تعداد رنگ , سایز تصویر بر اساس pixcell یا درصدی, کنترل و کار برروی تصاویر با فرمتGIF می باشد. ابزارهایی مانند برش, بزرگنمایی, ذخیره رنگ ونمایش رنگ در سمت چپ تصویر می باشد.

 

روش سوم برای تبدیل تصویر برای سایت:

از منوی file گزینه ی save as را کلیک کرده تنظیماتی مانند مسیر و نام را وارد میکنیم و از قسمت save as type که مانند زیر باز شده فرمت دلخواه را انتخاب میکنیم.

 

فرمت ذخیره سازی تصاویر

فرمت ذخیره سازی تصاویر طراحی سایت

 

امیدوارم که این آموزش برای شما کاربردی باشد و بتوانید سایت های با کیفیت خوب و سرعت بالا طراحی کنید.

موفق باشید.

مطالب مرتبط
کسب و کار اینترنتی با وب یار
مطالعه :

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

بهبود ساختار سایت
مطالعه :

بسیاری از وب‌سایت‌ها ساختار گمراه‌کننده‌ای دارند. لینک دادن محتوا‌ها به یکدیگر از هیچ قاعده و قانونی تبعیت نمی‌کند، کاربر را گیج و سردرگم و به مسیر اشتباهی راهنمایی می‌کند. این می‌تواند برای سئوی سایت شما بسیار بد باشد. امروز شما را با استراتژی بهبود ساختار وب‌سایت آشنا می‌کنیم تا بتوانید جایگاه سایت‌تان را در موتورهای جستجو ارتقا دهید. و از طریق آن بتوانیم به افزایش درآمدتان کمک کنیم. با ما همراه باشید. مسیر کاربر(User Flow) مسیر کاربر و ساختار وب‌سایت ارتباط تنگاتنگی دارند. ساختار وب سایت شما مانند نقشه‌ی معماری یک ساختمان است.این ساختار یک طرح کلی از چگونگی پیوند دادن پست‌ها و صفحات سایت‌تان برای شما فرآهم می‌آورد. با استفاده از مفهومی معروف به خوشه‌بندی محتوا می‌توان دید که چگونه ساختار وب‌سایت ‎تان روی سئوی آن موثر است. در ادامه درباره خوشه‌بندی محتوا توضیح خواهیم داد. از طرف دیگر مسیر کاربر مربوط به نحوه و چگونگی جابجایی کاربران در سایت‌تان است و یکی از عوامل مهم و تأثیرگذار روی سئو است. ساختار وب‌سایت سهم بزرگی در این مهم دارد. از دیگر عوامل مؤثر،می‌توان به کیفیت محتواها و لینک‌های‌تان اشاره کرد. بهترین ابزار برای تجزیه و تحلیل سایت قبل از اعمال هر گونه تغییر اساسی در ساختار وب‌سایت‌ تان باید نحوه استفاده کاربران از سایت‌تان را بررسی کنید. دو برنامه‌ی کاربردی و معروف وجود دارد که می‌توانید برای این کار […]

طراحی سایت حرفه ای
مطالعه : 15 دقیقه

طراحی سایت اصفهان |طراحی سایت حرفه ای | سئو تضمینی سایت تیم طراحی سایت و سئو سایت وب یار به آدرس https://www.webyar.net ، بامجوز رسمی از نظام کامپیوتر کشور و دارای نماد اعتماد و نماد ساماندهی و با ۱۶ سال دانش تخصصی در زمینه طراحی وب سایت ,سئوسایت در گوگل و امنیت سرور

خرید رپورتاژ آگهی و بک لینک
مطالعه :

رپورتاژ آگهی و بک لینک شاید تاکنون این سوال در ذهن شما بوجود آمده که چرا اساتید سئو سایت و بهینه سازی سایت همواره خرید رپورتاژ و بک لینک را توصیه می کنند و یا اینکه خرید رپورتاژ آگهی و بک لینک چه تأثیری در کسب و کار شما دارد؟ اگر می‌خواهید به سوال‌های‌تان پاسخ مناسبی بدهید با تیم طراحی سایت اصفهان وب یار همراه باشید. بهتر است بدانید در سال 2017 میلادی خرید رپورتاژ آگهی و بک لینک یکی از موثرترین عوامل شناخته شدن صفحات وب سایت توسط موتور جستجوگر گول شناخته شد. ابتدا توضیح مختصری درمورد خرید رپورتاژ آگهی و بک لینک برای شما همراهان عزیز ارائه می‌دهیم تا با مفهوم آن آشنا شوید. رپورتاژ آگهی و بک لینک چیست؟   رپورتاژ آگهی رپورتاژ برگرفته از کلمه reportage به معنای گزارش می‌باشد. که به صورت یک مقاله شامل 200 تا 500 کلمه و چند عکس با محتوای هدفمند جهت تبلیغ در قالب پست در سایت ها مخصوصا سایت های پربازدید مانند سایت های خبری به کار برده می شود.   ­­­ بک لینک بک لینک یک روش لینک‌دهی مستقیم به صورت بازگشتی است که باعث ارتقا رتبه سایت شما در موتورجستجوگر گوگل می‌شود.     خرید رپورتاژ آگهی خرید رپورتاژ آگهی یک روش برای تبلیغات می باشد و بک لینک دائمی ایجاد می‌کند. با خرید رپورتاژ می‌توانید بطور […]

طراحی سایت چند فروشندگی زودبا
مطالعه :

طراحی سایت چند فروشندگی زودبا یکی از نمونه کارهای فروشگاهی تیم طراحی سایت وب یار، طراحی سایت فروشگاهی زودباست. این سایت فروشگاهی با حفظ اصول سئو طراحی شده است. و یکی از هزاران نمونه از کارهای زیبا و حرفه‌ای تیم طراحی سایت اصفهان وب یار می‌باشد.   آدرس سایت جهت مشاهده تمامی امکانات داخلی و گرافیکی سایت zudba.com طراحی سایت فروشگاه اینترنتی زودبا منجر به افزایش فروش و درآمد افراد در حوزه‌های مختلف کسب و کار می‌شود. در ادامه با هم امکانات سایت زودبا که به‌تازگی توسط تیم طراحی سایت وب یار طراحی شده است رابررسی می‌کنیم. اگر شما هم نیاز به طراحی سایت و طراحی سایت فروشگاهی دارید بهتر است طراحی سایت اختصاصی فروشگاهی زودبا را ببینید. تا آگاهانه، امکانات سایت خود را انتخاب کنید. چرا که ممکن است در میان انتخاب امکانات سایت خود برخی از نیازهای سایت از خاطر شما دور مانده باشد.     ویژگی طراحی سایت چند فروشندگی زودبا از ویژگی های بارز طراحی سایت چندفروشندگی زودبا ، طراحی سایت اختصاصی، طراحی سایت فروشگاهی و طراحی سایت ارزان قیمت با حجم امکانات بالا در مقایسه با طراحی سایت های ارزان قیمت شرکت های غیر معتبر که برگرفته از قالب های آماده و دزدی سایرین است می باشد. فروشگاه اینترنتی زودبا با در نظر گرفتن سئو یوزرفرندلی در مرحله طراحی گرافیک محیطی زیبا و جذاب جهت ارتباطی […]

بهینه سازی داخلی سایت on the page seo
مطالعه :

سئو داخلی سایت on the page seo این بار برای بهینه سازی صفحات سایت با آموزش سئو داخلی سایت on the page seo در خدمت شما هستیم. میدانیم  که برای بهینه سازی وب سایت خود باید سئو داخلی on-the-page-seo و سئو خارجی سایت همانند استفاده از بک لینک ها (مطلب آموزشی فاکتورهای بک لینک و خرید بک لینک  را در خصوص آگاهی از سئو خارجی سایت خود حتما بخوانید) همزمان با هم انجام بدهیم. در واقع سئو داخلی و سئو خارجی سایت مکمل یکدیگرند و باید به هر دو به یک اندازه توجه شود. سئو خارجی سایت بیشتر به منابع خارج از سایت شما برمی‌گردد و می‌توان گفت نتیجه‌ی آن به طور کامل در دست شما نیست. اما سئو داخلی سایت که مربوط به محتوا و کدهای HTML است کاملا وابسته به شماست و قابل کنترل است. بنابراین با سئو سایت اصفهان وب یار همراه باشید تا تک به تک اجزای مورد نیاز سئو داخلی سایت را برای شما نام برده و توضیح دهیم. عنوان های زیر را برای بهینه سازی صفحات داخلی وب سایت به شما معرفی می کنیم. عنوان های بهینه سازی صفحات داخلی وب سایت: نام وب سایت، عنوان سایت، description ،keyword فایل های اصلی سایت بخش بندی درست  وب سایت در زمان کد نویسی ID.(نام دایو ها و مفهوم ها) Id کلاس( حجم و سرعت gtmetrix ) […]

دیدگاه ها

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *