Фаворитът е това готино малко изображение до адресната лента в браузъра ви. Това отличава вашия сайт в раздела с отметки и може да се използва за повишаване на информираността за марката. Ако имате сайт, но никога не сте обмисляли създаването на фавикон, трябва да преосмислите решението си. Все по -често разработчиците на софтуер използват икони за различни аспекти на своите приложения, като икони на начален екран на таблети. За щастие, проектирането, създаването и прилагането на фавикон е нещо, което почти всеки може да направи, ако следва правилните стъпки.
Стъпки
Метод 1 от 3: Проектиране на вашия Favicon
Стъпка 1. Създайте фавикон, който представлява вашия уебсайт
Видът на уебсайта, който имате, трябва да определя вида на вашия фавикон. Опитайте се да проектирате нещо, което да се придържа към имиджа на вашата марка и да бъде разпознаваемо и запомнящо се за хората. Вашият фавикон ще бъде първото нещо, което хората ще видят, когато разгледат разделите в браузъра си, а също така ще се появи и в отметките на хората.
- Например, ако имате уебсайт за храна, избирането на фавикон, който има плодове или зеленчуци като дизайн, може да го направи по -запомнящ се.
- Ако вашият уебсайт е за адвокатска кантора или инвестиционна компания, традиционният и елегантен фавикон е най -добрият.
- Ако вашият уебсайт е насочен към по -млади хора, опитайте се да създадете игрив и цветен фавикон.
Стъпка 2. Решете дали искате прозрачен фон
Ако не посочите фон, той ще попълни бяло, което може да не се придържа към вашата марка. Прозрачният фон ще придобие цвета на браузъра на човека и в някои случаи ще изглежда по -опростен. В други случаи наличието на цвят за фона ще накара буквите или графиките на преден план да изскочат. Решете кое би било най -доброто за вашия дизайн и го имайте предвид, докато го правите.
Най -основният фавикон е квадрат 16x16 и има цвят на фона
Стъпка 3. Създайте фавикон, който е лесен за четене
Тъй като изображението за фавикон, което ще използвате, е малко, важно е да можете да разпространите марката си, без да обърквате посетителите си. Труден за четене фавикон оставя отрицателно впечатление и може да създаде въпроси в съзнанието на посетителя за качеството на работата, която можете да предоставите. Прекалено сложните изображения и лога не изглеждат добре, когато са намалени до 16x16 или 32x32 пиксела.
- Ако съществуващото ви лого е твърде сложно, тогава можете да използвате тактики, за да го опростите, така че да може да бъде разпознаваемо с размер на иконата. Използвайте инициали, вместо да показвате цялото име на компанията, или проектирайте проста икона, вместо да използвате картина.
- Ако вече имате просто лого, можете да свиете изображението и да го зададете като свой фаворит. Може да се наложи да го промените, преди да го преобразувате във файл с икони.
- Можете също да използвате картина на обект, която описва общата тема на вашия сайт.
Стъпка 4. Създайте естетически приятен фавикон
Структурата на вашия фавикон се нарича неговата форма. Фавиконите обикновено придобиват форми, като кръг или квадрат. Когато проектирате своя фавикон, като цяло е по-добре, ако той може да се побере в една от тези основни форми, тъй като свободните форми често могат да се объркат или объркат при 16x16 пиксела. Друг важен аспект на вашия дизайн се нарича естетическо единство. Естетическото единство включва детайлите и размерите на различни компоненти във вашия фавикон и как вашият фавикон е балансиран. Колкото по -еднакви са детайлите, толкова по -сплотен ще изглежда вашият фавикон. Например използването на различни типове или размери шрифтове във вашия фавикон не е приятно за окото и може да направи вашия фавикон да изглежда объркан или разхвърлян.
- Друг пример за естетическо единство е поддържането на заоблени ъгли във формите във вашия фавикон.
- Добър пример за икона, която е променила формата си, е иконата на Google. Той се е променил от квадрат в кръг.
Стъпка 5. Използвайте цветове, които са сплотени за вашата марка
Когато създавате своя фавикон, трябва да го създадете в 8 -битова (256 цвята) или 24 -битова (16,7 милиона цвята) дълбочина на цветовете, тъй като това ще работи в съвременните браузъри. Уверете се, че избраните от вас цветове могат да бъдат намерени другаде на уебсайта ви или са свързани по някакъв начин с вашата марка. Фавикон с цветове, които не са на вашия уебсайт, лого или приложения, няма да бъде запомнящ се и хората няма да могат да свържат иконата с вашата марка.
- Някои творчески употреби на цвят favicon включват GitHub, който променя цветовете в зависимост от състоянието на вашата система и Trello, който се променя в зависимост от цвета на фона.
- Най -често срещаните цветове, използвани във фавиконите, са червено и синьо.
Стъпка 6. Помислете за вашата аудитория, когато проектирате фавикон
Освен идентифицирането на вашата марка, вашият фавикон трябва да изглежда привлекателен за вашите посетители. Хората с различни вкусове, интереси и обществени норми ще гледат на различната иконология от различни гледни точки. Културните различия съществуват в нашето общество и могат да объркат или отблъснат аудиторията, която се опитвате да привлечете.
Например, Mac Os X използва печат, който е универсален символ за поща. Използването на пощенска кутия не би било толкова ефективно, защото пощенските кутии варират в различните части на света
Стъпка 7. Получете мнението на приятели и колеги
Въпреки че не е изключително графично интензивен, фавиконът е важна част от вашата марка. Например, помислете за любимите си уебсайтове като Twitter, Gmail, Facebook или wikiHow и колко свързвате фавикона с марката. Ако нямате добро око за дизайн или сте затрупани в това какъв дизайн трябва да имате за вашия сайт, консултирайте се с приятели, които имат склонност към дизайна или които работят в областта на графичния дизайн.
- Попитайте във вашата мрежа от приятели, за да видите дали някой може да предостави безплатни дизайнерски съвети.
- По-големите компании имат вътрешни графични дизайнери, които могат да създадат имидж на фавикон.
Метод 2 от 3: Създаване на вашия Favicon
Стъпка 1. Използвайте софтуер за редактиране на снимки, за да създадете своя фавикон
Можете да използвате софтуер за редактиране на снимки като Adobe Photoshop или Illustrator, за да създадете изображението за своя фавикон. Тези софтуерни приложения също ви позволяват да преоразмерявате и експортирате изображението в правилния формат. Някои софтуери ви позволяват да създадете своя фавикон на ръка.
- Има и специални програми за редактиране, които можете да намерите онлайн.
- Използвайте търсачка и въведете „favicon editors“.
- Направете размера на платното си 512x512 пиксела, защото този брой се разделя на най -приложимите размери на иконите и все още е достатъчно голям, за да можете да редактирате ефективно.
- Друг популярен софтуер за редактиране на снимки включва GIMP, PhotoScape и Paint. NET.
- Когато използвате този софтуер, няма да можете да редактирате директно.ico файловете, но можете да използвате.png,-j.webp" />
Стъпка 2. Преоразмерете и запазете своя фавикон
32x32 px е размерът на елементите на работния плот на Windows, докато 16x16 px е размерът на иконите в раздела на браузъра ви. След като създадете своя фавикон в по -голям формат, важно е да намалите неговия размер, за да можете да видите как ще изглежда в браузърите на хората. Ако е нечетлив или не е естетически приятен, започнете отначало оригиналния си дизайн. Помислете за платформите, на които най -вероятно ще се използва вашият уебсайт или приложение и след това създайте фавикон, който да покрие всичките ви бази.
- Важно е да се отбележи, че различният хардуер и софтуер използва различни размери на символи.
- Някои други размери на иконите включват 57x57px за стандартния начален екран на iOS, 72x72px за iPad, 96x96px за Google TV, 128x128px за уеб магазина на Chrome и 195x195px за Opera Speed Dial.
- Ако искате да покриете всичките си бази, можете да създадете версии на вашия фавикон във всеки от тези размери.
- Запазете отделни версии на вашия фавикон, за да не загубите свършената работа.
Стъпка 3. Комбинирайте вашите файлове с помощта на конвертор
Голямото нещо за.ico файловете е, че можете да комбинирате повече от един файл, за да го създадете. Това е полезно, защото различните браузъри и софтуер ще искат фавикон с различен размер. За да сте сигурни, че вашият фавикон изглежда добре на всички различни платформи, конвертирайте файловете си с помощта на онлайн конвертор. Въведете „конвертор на икони“в любимата си търсачка, за да намерите безплатни онлайн приложения, за да направите това. Запазете обединения файл като "favicon.ico."
- Можете също да използвате програма като GIMP, която има вградена функция, или да изтеглите приставка, наречена ICO FORMAT, в Adobe Photoshop.
- Създайте нова папка, за да можете да съхранявате нови икони или текущи работи.
- Въведете „.ico converter“или „favicon generator“в търсачката, за да намерите различни инструменти, които можете да използвате.
Метод 3 от 3: Внедряване на вашия Favicon
Стъпка 1. Качете своя фавикон, ако използвате редактор на уебсайт
Много редактори на уебсайтове идват с вградена форма, която ви позволява автоматично да качвате своя фавикон на уебсайта си. Ако използвате редактор на уебсайт, който има вграден такъв, потърсете опции, които казват „Качване на Favicon“или „Добавяне на Favicon“в менюто с настройки на вашия уебсайт. Изберете вашия favicon.ico файл и го качете на вашия сайт.
Ако не можете да намерите място, където да качите своя фавикон в редактора на уебсайта си, ще трябва да го направите ръчно
Стъпка 2. Качете файла в главната директория на вашия сайт
Ако вашият уебсайт поддържа протокол за прехвърляне на файлове или FTP, тогава можете да използвате вашия FTP клиент, за да качите новия си файл favicon.icon във вашата основна (индекс) директория. Ако не, тогава ще трябва да отидете на страницата на уеб хостовете си и да качите изображението ръчно. Не забравяйте да замените съществуващия файл favicon.ico с новия си файл.
Стъпка 3. Добавете файла към заглавката си
Намерете мястото, където можете да получите достъп до PHP и CSS файловете за вашия сайт. Отидете на файла header.php на вашия сайт и го редактирайте. Под типа маркер „
-
. Това трябва да свърже вашия сайт с вашия фавикон.
Тъй като използвате PHP, това означава, че всички сайтове, които използват вашия заглавен файл, сега ще имат същия фавикон
Създайте своя собствена икона Favicon Стъпка 14 Стъпка 4. Обновете браузъра си
След като приключите с качването на фавикона, можете да опресните браузъра си, за да видите новото си изображение до адресната лента. За да отидете директно към изображение на актуализирания си фавикон, въведете „https://www.yourdomain.com/favicon.ico“.
- Ако вашият фавикон първоначално не се показва, може да се наложи да нулирате кеша на браузъра си.
- За да изчистите кеша, отидете в настройките на браузъра си и изтрийте временните си интернет файлове, бисквитки и история.
