نماد وبلاگ کمتر از 100 کیلوبایت. با استفاده از Paint یک آواتار بسازید. صفحه نمایش شبکیه چشم و HiDPI

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


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

DPI، PPI و تغییر اندازه

رایج ترین تصور غلط استفاده از واحدهای DPI (نقطه در اینچ) و PPI (پیکسل در اینچ) است. این واحدها در واقع به ترتیب به چاپگرها و اسکنرها اشاره دارند. آنها همچنین می توانند در مشخصات صفحه نمایش استفاده شوند. اساساً اینها فاکتورهای تبدیل بین ابعاد فیزیکی یک تصویر آنالوگ (به سانتی متر یا اینچ) و ابعاد پیکسل یک تصویر دیجیتال هستند.

به عنوان مثال، یک تصویر 100 پیکسلی که با 100 DPI چاپ می شود، اندازه 1 اینچ خواهد داشت. همه چیز ساده و واضح است.

با این حال، هنگام تغییر اندازه در ویرایشگرهای گرافیکی، از ما خواسته می شود که ابعاد را در ابعاد مناسب برای ما، از جمله DPI نشان دهیم. اینجاست که سردرگمی شروع می شود.

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


فرض کنید یک تصویر 3000 پیکسل (مربع) داریم که دارای مقدار 300 DPI است. ما دریافت می کنیم: 3000 پیکسل / 300 DPI = 10 اینچ. حالا به ویرایشگر (فتوشاپ) بروید و مقدار DPI را به 600 تغییر دهید. چه چیزی بدست می آوریم؟ و این بستگی به چک باکس "Resample" دارد. اگر اینطور باشد، تصویر را نمونه برداری می کنیم 6000 پیکسل ها در غیر این صورت، اندازه در اینچ تبدیل می شود 5 بجای 10 .

بنابراین، برای توسعه وب، تمام ابعاد فیزیکی (DPI، سانتی متر، اینچ و غیره) را می توان با خیال راحت نادیده گرفت و صرفاً به ابعاد پیکسل نگاه کرد.

صفحه نمایش DPI/PPI

در اینجا به موضوع وضوح صفحه نمایش و تراکم پیکسلی می رسیم. این تراکم به درستی PPI (پیکسل در هر اینچ) نامیده می شود و نشان می دهد که چند پیکسل را می توان در یک اینچ از صفحه نمایش نشان داد.

این همان جایی است که معمولاً PPI افسانه‌ای 72 و 96 پدید می‌آید که قرار است تراکم پیکسلی «استاندارد» را برای نمایشگرها نشان دهد. برای کارهای نمایش گرافیک در وب، آنها بی فایده هستند. در عین حال، تراکم پیکسل واقعی صفحه نمایش ممکن است کاملاً متفاوت باشد: معمولاً چیزی در حدود 120 PPI (شما می توانید برای صفحه نمایش خود اندازه گیری و محاسبه کنید).

اما ما به یاد داریم که تصاویر شطرنجی فقط در اندازه گیری می شوند پیکسل هاو دیگر هیچ. چرا ما حتی در مورد PPI صفحه نمایش صحبت می کنیم؟ از آنجا که صفحه نمایش "رتینا" یا "HiDPI" وجود دارد.

صفحه نمایش شبکیه چشم و HiDPI

چنین نمایشگرهایی به طور گسترده ای در دستگاه های تلفن همراهو لپ تاپ های گران قیمت در اصل، این افزایش کمی در پیکسل ها با حفظ ابعاد فیزیکی صفحه نمایش است (به عنوان مثال، 5 اینچ مورب و 330 PPI).

برای ما، به عنوان توسعه‌دهندگان وب، این به معنای ظاهر پیکسل‌های مختلف در مرورگر است: پیکسل‌های CSS (که معمولاً در اندازه عناصر مشخص می‌کنیم) و پیکسل‌های فیزیکی (پیکسل‌های واقعی روی صفحه). فرمول این است: پیکسل های فیزیکی = پیکسل های CSS * DPR.
DPR نسبت پیکسل دستگاه است - نسبت تبدیل پیکسل های CSS به پیکسل های فیزیکی.

هنگام ارسال یک عکس، می توانیم یک برچسب بنویسیم imgبا ابعاد 20 پیکسل و تصویر 40 پیکسل خواهد بود. در این حالت در صفحه ای با DPR=2.0 تمام پیکسل های تصویر را خواهیم دید. اما در این شرایط، ما مطلقاً نگران مقادیر واقعی PPI صفحه نمایش نیستیم.

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

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

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

ابتدا بیایید تصمیم بگیریم که از کدام تصویر آواتار منحصر به فرد خود را بسازیم. این می تواند عکس ما، تصویر زمینه دسکتاپ مورد علاقه ما یا یک عکس زیبا از اینترنت باشد. ما باید یک آواتار با اندازه 100x100 پیکسل بسازیم، این فرمتی است که توسط اکثر چت ها پشتیبانی می شود و سیستم های اجتماعی. با این حال، در صورت تمایل، می توانید هر اندازه تصویر را تنظیم کنید، 64x64 یا 150x150 پیکسل.

اکنون برنامه Microsoft Paint را با کلیک بر روی دکمه "شروع" در پایین دسکتاپ و انتخاب دسته "لوازم جانبی" در منوی "برنامه ها" باز کنید.

در صفحه نمایش می بینیم:

حال باید تصویر انتخاب شده را در برنامه Paint باز کنیم. ما به بخش "File" که در بالای پنجره برنامه است می رویم، سپس روی "Open" کلیک می کنیم و تصویر خود را در لیست پیدا می کنیم.

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

اکنون کار اصلی ایجاد آوا آغاز می شود. در منو، مسیر زیر "طراحی" - "ویژگی ها" را دنبال کنید. تصویر زیر را می بینیم:

بیایید به اندازه تصویر اصلی توجه کنیم. عرض ما 1024 و طول 768 است. بیایید این پارامترها را یادداشت کنیم. سپس بر روی دکمه Ok کلیک کرده و به کار خود ادامه دهید. دوباره به بخش "طراحی" می رویم. در آنجا گزینه Stretch/Tilt را پیدا می کنیم. آن را انتخاب کنید و موارد زیر را روی صفحه نمایش دریافت کنید:

حال بیایید پارامترهای اصلی تصویر خود را به یاد بیاوریم (1024 عرض و 768 طول). این 100٪ هم به صورت عمودی و هم افقی است. ما چند محاسبات کوچک انجام می دهیم و متوجه می شویم که اندازه آواتار تمام شده نباید از 16٪ منبع تجاوز کند. در فیلدهای "افقی" و "عمودی" عدد 16 را وارد کنید. روی "OK" کلیک کنید و ساخته ما را با اندازه 164x123 پیکسل تحسین کنید. ما نباید فراموش کنیم که هدف ما تصویری با ضلع 100 پیکسل است.

ما گرفتیم:

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

با دکمه سمت راست ماوس روی تصویر کلیک کنید. در کادر محاوره ای، "Copy" را انتخاب کنید و منو را دنبال کنید پنل بالاییبرنامه ها. در آنجا گزینه “Create” را انتخاب می کنیم. وقتی Paint از شما می‌پرسد که آیا تغییرات را در فایل ذخیره کنید، نگران نباشید؛ روی No کلیک کنید. پس از ظاهر شدن یک صفحه خالی از سند جدید، بخش کپی شده را در آنجا جایگذاری کنید.

اینجوری انجام میشه ما پارامترهای فیلد را تنظیم می کنیم: طول و عرض را به 100 پیکسل محدود می کنیم. مطمئن شوید که واحدهای اندازه گیری پیکسل یا نقطه هستند. ما همچنین توجه می کنیم که "پالت" رنگی است. اگر نیاز به ایجاد آواتار با پارامترهای دیگر دارید، آنها را در این بخش نشان دهید (80x80، 150x150 یا 64x64 پیکسل).

هر چه اندازه تصویر مورد نیاز کمتر باشد، درصد بیشتری از منبع را باید تنظیم کنیم.

بنابراین، ما یک مربع سفید تمیز با ضلع 100 پیکسل داریم.

← صفحات ← مجموعه ای از تصاویر با عرض و ارتفاع 100 پیکسل، دانلود آواتار

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

تصویر با چشم و مژه از آتش. دانلود آواتار غیر معمول با مژه های آتشین و چشم سبز.

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

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

در تصویر سر یک پرنده سیاه است - یک رخ؛ در avatarko.ru می توانید آواتارهایی را با پرندگان مختلف از جمله روک ها در بخش با پرندگان بارگیری کنید.

در اینجا یک آواتار خنده دار با یک تصویر غیرقابل دسترس است، اما هنوز چیزی بهتر از هیچ است، بنابراین آواتار یک اردک دارد، متاسفم.

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

تصویر یک همستر کشیده را نشان می دهد و متنی هشدار می دهد که فردی که در زیر آواتار جونده پنهان شده است 100٪ یک همستر است. در avatarko.ru می‌توانید این آواتار جالب را با یک همستر واقعی، هرچند کشیده، دانلود کنید.

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

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

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

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

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

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

عکس متحرک با خیار روی چنگال. دانلود آواتار عالی با میان وعده خیار.

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

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

آواتار شیک با یک روح، تصویر با پس زمینه شفافبا فرمت PNG..

آواتار زیبا با آتش کشیده و مردی در آتش. دانلود تصویر 100 در 100 پیکسل از مرد آتشین.

آواتار زیبا با یک خرس قطبی اسباب بازی با یک قلب روی آواتار. دانلود عکس از خرسرنگ سفید در قسمت "عشق" که اندازه آن 100 در 100 پیکسل است.

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

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

یک آواتار متحرک با عنکبوت در حال اجرا در امتداد طرح کلی تصویر و ساختن یک وب در گوشه. دانلود تصویر 100*100 با انیمیشن یک عنکبوت. در Avatarko.ru می توانید آواتارهای جالب با حیوانات را دانلود کنید.

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

شمع متحرک در پس زمینه سبز. دانلود انیمیشن آواتار 100x100 با شمع سوزان با شعله.

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

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

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

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

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

← صفحات ← دانلود بهترین آواتارها با ابعاد 100 در 100 پیکسل

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

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

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

تصویری از بازی کرم ها با کرم هاله ای که قبل از نبرد کرم ها دعا می کند. دانلود آواتار از یک بازی کامپیوتری محبوب.

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

یک آواتار متحرک برای انجمن‌ها با چهره‌ای سبز با چشم‌های پرتاب و پلک‌زن. دانلود تصویر 100x100 با انیمیشن چشمان روی صورت سبز.

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

آواتار که یک اسب آبی صورتی را در حال حمام کردن در آب نشان می دهد. دانلود عکس متحرک با اسب آبی صورتی. آواتار برای پاریس هیلتون عالی است.

عکسی برای کسانی که دوست دارند مشروبات الکلی بنوشند. دانلود آواتار با متن "من الکلی هستم" و یک لیوان.

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

آواتار متحرک باحال با مردی ریشو که به کامپیوتر ضربه می زند. دانلود عکسی که در آن کامپیوتر کار نمی کند و کاربر آن را می زند.

تصویری با کتیبه "I love music" روی پس زمینه مشکی، به جای کلمه "عشق" یک قلب وجود دارد. دانلود آواتار متنی با موضوع موسیقی. و برای کسانی که روندها را دنبال می کنند صنعت موسیقیشما نه تنها به آواتار، بلکه به موسیقی نیز علاقه مند خواهید شد که متأسفانه در سایت وجود ندارد.

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

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

آواتار متحرک با یک پسر با آی پاد و گیتار هوایی. دانلود تصویری با موضوع موزیکال با انیمیشن یک پسر در زمینه زرد.

تصویر گرگ آبی را با سیگاری در دهان و عینک آفتابی نشان می دهد. دانلود آواتار با گرگ آبی.

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

تصویر چهره گربه ای زیبا را نشان می دهد، دانلود آواتار با گربه کرکی سفید.

تصویر یک الاغ سخنگو از کارتون شرک را نشان می دهد. دانلود آواتار با الاغ خندان، حیوان کارتونی مثبت.

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

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

یک آواتار با یک سگ، و بیشتر بینی یک سگ. دانلود عکس با نمای نزدیک از بینی سگ برای دوستداران حیوانات خانگی.

آواتار با آرم مک دونالد، برای دوستداران فست فود و کارگران فست فود. دانلود عکس شیک با لوگوی مک دونالد.

یک آواتار عالی با قلب و کاردیوگرام متحرک آن. دانلود تصویری با موضوع عشق با انیمیشن نبض عشق.

عکس متحرک با موضوع آسمان و سرعت دانلود آواتار با انیمیشن ابرها هنگام پرواز در آسمان.

تصویری با بابونه زیبا در رنگ های ملایم. دانلود آواتار تندرنس برای انجمن با گل در وب سایت

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

آواتار متحرک با کروش از کارتون اسمشاریکا. دانلود عکس خرگوش کارتونی در حال پلک زدن چشمانش.

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

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




بالا