Фавикон белгішесін жасаудың 3 әдісі

Мазмұны:

Фавикон белгішесін жасаудың 3 әдісі
Фавикон белгішесін жасаудың 3 әдісі

Бейне: Фавикон белгішесін жасаудың 3 әдісі

Бейне: Фавикон белгішесін жасаудың 3 әдісі
Бейне: 5сынып 30сабақ 2024, Мамыр
Anonim

Фавикон - бұл шолғышта мекенжай жолағының жанындағы керемет сурет. Бұл сіздің сайтыңызды бетбелгілер қойындысында ерекшелейді және оны бренд туралы хабардарлықты арттыру үшін пайдалануға болады. Егер сізде сайт болса, бірақ фавикон жасауды ешқашан ойламаған болсаңыз, шешіміңізді қайта қарауыңыз керек. Бағдарламалық жасақтама жасаушылар планшеттердегі үй экраны белгішелері сияқты қосымшалардың әр түрлі аспектілері үшін фавикондарды жиі қолданады. Бақытымызға орай, фавиконды жобалау, құру және енгізу кез келген адам жасай алады, егер олар дұрыс қадамдарды орындаса.

Қадамдар

3 -ші әдіс 1: Фавиконды жобалау

Өзіңіздің сүйікті белгішеңізді жасаңыз 1 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 1 -қадам

Қадам 1. Сіздің веб -сайтыңызды білдіретін фавикон жасаңыз

Сізде бар веб -сайт түрі сіздің сүйікті белгішеңізді анықтауы керек. Сіздің бренд имиджіңізге сәйкес келетін және адамдар үшін есте қаларлықтай нәрсе жасауға тырысыңыз. Сіздің браузердегі қойындыларды қараған кезде адамдар көретін бірінші нәрсе сіздің фавикон болады және адамдардың бетбелгілерінде пайда болады.

  • Мысалы, егер сізде азық -түлік веб -сайты болса, жеміс -жидек немесе көкөніс бар фавиконды таңдау оны есте қаларлықтай етуі мүмкін.
  • Егер сіздің веб -сайтыңыз заң фирмасына немесе инвестициялық компанияға арналған болса, дәстүрлі және сәнді фавикон жақсы.
  • Егер сіздің веб -сайтыңыз жастарға арналған болса, көңілді және түрлі -түсті фавикон жасауға тырысыңыз.
Өзіңіздің сүйікті белгішеңізді жасаңыз 2 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 2 -қадам

Қадам 2. Мөлдір фон қажет пе, соны шешіңіз

Егер сіз фонды белгілемесеңіз, ол ақ түспен толтырылады, ол сіздің брендке сәйкес келмеуі мүмкін. Мөлдір фон адамның шолғышының түсін алады және кейбір жағдайларда жеңілірек көрінеді. Басқа жағдайларда, фонның түсі алдыңғы әріптерді немесе графиканы шығарады. Сіздің дизайныңыз үшін қайсысы жақсы болатынын шешіңіз және оны жасағанда есте сақтаңыз.

Ең негізгі фавикон - 16х16 шаршы және фондық түсі бар

Өзіңіздің сүйікті белгішеңізді жасаңыз 3 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 3 -қадам

Қадам 3. Оқуға оңай фавикон жасаңыз

Сіз қолданатын фавикон кескіні кішкентай болғандықтан, келушілерді шатастырмай өз брендіңізге қол жеткізе алуыңыз маңызды. Оқуға қиын фавикон жағымсыз әсер қалдырады және келушінің санасында сіз бере алатын жұмыстың сапасы туралы сұрақтар тудыруы мүмкін. Тым күрделі суреттер мен логотиптер 16x16 немесе 32x32 пиксельге дейін кішірейтілген кезде жақсы көрінбейді.

  • Егер сіздің логотипіңіз тым күрделі болса, оны жеңілдету үшін тактиканы қолдануға болады, сондықтан оны фавикон өлшемінде тануға болады. Компания атауын көрсетудің орнына инициалдарды қолданыңыз немесе суретті пайдаланудың орнына қарапайым белгішені жасаңыз.
  • Егер сізде қарапайым логотип болса, кескінді кішірейтіп, оны фавикон ретінде орнатуға болады. Сіз оны белгіше файлына айналдырмас бұрын оны өзгертуіңіз қажет болуы мүмкін.
  • Сіз сондай -ақ сіздің сайтыңыздың жалпы тақырыбын сипаттайтын объектінің суретін пайдалана аласыз.
Өзіңіздің сүйікті белгішеңізді жасаңыз 4 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 4 -қадам

4 -қадам. Эстетикалық жағымды фавикон жасаңыз

Сіздің фавиконның құрылымы оның формасы деп аталады. Фавикондар әдетте шеңбер немесе шаршы тәрізді пішін алады. Фавиконды құрастырған кезде, егер ол осы негізгі формалардың біріне сәйкес келсе, жақсы болады, өйткені еркін пішіндер жиі 16x16 пиксельде шатасуы немесе шатасуы мүмкін. Сіздің дизайныңыздың тағы бір маңызды аспектісі эстетикалық бірлік деп аталады. Эстетикалық бірлік сіздің favicon -дағы әр түрлі компоненттердің бөлшектері мен өлшемдерін және сіздің favicon қалай теңдестірілгенін қамтиды. Бөлшектер неғұрлым біркелкі болса, фавикон соғұрлым біртұтас көрінеді. Мысалы, favicon ішінде әр түрлі қаріп түрлері мен өлшемдерін қолдану көзге ұнамайды және сіздің фавиконды шатастырып немесе лас етіп көрсетуі мүмкін.

  • Эстетикалық бірліктің тағы бір мысалы - сіздің сүйікті фигураңыздағы дөңгелек бұрыштарды сақтау.
  • Пішіні өзгерген белгішенің жақсы мысалы - Google favicon. Ол шаршыдан шеңберге айналды.
Жеке Favicon белгішесін жасаңыз 5 -қадам
Жеке Favicon белгішесін жасаңыз 5 -қадам

5 -қадам. Сіздің брендке сәйкес келетін түстерді қолданыңыз

Фавиконды жасаған кезде оны 8 биттік (256 түс) немесе 24 биттік (16,7 миллион түс) түс тереңдігінде жасау керек, себебі бұл қазіргі браузерлерде жұмыс істейді. Сіз таңдаған түстерді сіздің веб -сайтыңыздың басқа жерінен табуға болатынына немесе сіздің брендіңізбен байланыстырылғанына көз жеткізіңіз. Сіздің веб -сайтта, логотипте немесе қосымшаларда жоқ түстері бар фавикон есте қаларлықтай болмайды және адамдар белгішені сіздің брендпен байланыстыра алмайды.

  • Фавикон түстерінің кейбір шығармашылық қолданыстарына GitHub кіреді, ол жүйенің күйіне байланысты түстерді өзгертеді және фон түсіне байланысты өзгеретін Trello.
  • Фавикондарда жиі қолданылатын түстер - қызыл және көк.
Өзіңіздің сүйікті белгішеңізді жасаңыз 6 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 6 -қадам

Қадам 6. Фавикон жасау кезінде аудиторияңызды ескеріңіз

Сіздің брендті анықтаудан басқа, сіздің favicon келушілерге тартымды көрінуі керек. Әр түрлі талғамға, қызығушылыққа және әлеуметтік нормаларға ие адамдар әр түрлі иконологияға әр түрлі көзқараспен қарайтын болады. Мәдени айырмашылықтар біздің қоғамда бар және сіз тартқыңыз келген аудиторияны шатастыруы мүмкін.

Мысалы, Mac Os X поштаның әмбебап белгісі болып табылатын мөрді пайдаланады. Пошта жәшігін пайдалану соншалықты тиімді болмайды, себебі пошта жәшіктері әлемнің әр түкпірінде әр түрлі болады

Өзіңіздің сүйікті белгішеңізді жасаңыз 7 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 7 -қадам

Қадам 7. Достар мен әріптестердің пікірін біліңіз

Бұл графикалық тұрғыдан өте қарқынды болмаса да, фавикон - сіздің брендіңіздің маңызды бөлігі. Мысалы, Twitter, Gmail, Facebook немесе wikiHow сияқты сүйікті веб -сайттарыңызды және брендпен фавиконды қаншалықты байланыстыратындығыңызды ойлаңыз. Егер сізде дизайнға жақсы көзқарас болмаса немесе сіздің сайтыңызға қандай дизайн қажет екенін білмей жүрсеңіз, дизайнды көретін немесе графикалық дизайнда жұмыс істейтін достарыңызбен кеңесіңіз.

  • Достар желісінде кез келген адам дизайн бойынша тегін кеңес бере алатынын сұраңыз.
  • Ірі компанияларда favicon бейнесін жасай алатын графикалық дизайнерлер бар.

3 -ші әдіс 2: Сіздің сүйікті файлыңызды жасау

Өзіңіздің сүйікті белгішеңізді жасаңыз 8 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 8 -қадам

Қадам 1. Фавикон жасау үшін фотосуреттерді өңдеу бағдарламалық жасақтамасын пайдаланыңыз

Фавиконға суретті жасау үшін Adobe Photoshop немесе Illustrator сияқты фотосуреттерді өңдеу бағдарламалық жасақтамасын қолдануға болады. Бұл бағдарламалық жасақтама сонымен қатар кескіннің өлшемін өзгертуге және қажетті форматта экспорттауға мүмкіндік береді. Кейбір бағдарламалық қамтамасыз ету favicon қолмен жасауға мүмкіндік береді.

  • Интернеттен таба алатын favicon арнайы өңдеу бағдарламалары да бар.
  • Іздеу жүйесін қолданыңыз және «favicon редакторларын» теріңіз.
  • Кенептің өлшемін 512x512 пиксель етіп жасаңыз, себебі бұл сан favikon өлшемдерінің көпшілігіне сәйкес келеді және әлі де тиімді өңдеуге жеткілікті үлкен.
  • Фото өңдеуге арналған басқа танымал бағдарламалық жасақтамаға GIMP, PhotoScape және Paint. NET кіреді.
  • Бұл бағдарламалық жасақтаманы қолданған кезде.ico файлдарын тікелей өңдей алмайсыз, бірақ.png,-j.webp" />
Өзіңіздің сүйікті белгішеңізді жасаңыз 9 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 9 -қадам

Қадам 2. Фавиконның өлшемін өзгертіңіз және сақтаңыз

32x32 пиксель - бұл Windows жұмыс үстелінің элементтерінің өлшемі, ал 16x16 пиксель - шолғыш қойындысындағы фавикондардың өлшемі. Фавиконды үлкен форматта жасағаннан кейін, оның браузерлерде қалай көрінетінін көру үшін оның өлшемін азайту маңызды. Егер ол оқылмаса немесе эстетикалық тұрғыдан ұнамаса, бастапқы дизайннан бастаңыз. Сіздің веб -сайтыңыз немесе қосымшаңыз қолданылатын платформалар туралы ойланыңыз, содан кейін барлық базаны жабу үшін фавикон жасаңыз.

  • Айта кету керек, әр түрлі аппараттық және бағдарламалық қамтамасыз етуде әр түрлі favicon өлшемдері қолданылады.
  • Фавиконның басқа өлшемдеріне стандартты iOS негізгі экраны үшін 57x57px, iPad үшін 72x72px, Google TV үшін 96x96px, Chrome интернет дүкені үшін 128x128px және опера теру үшін 195x195px кіреді.
  • Егер сіз барлық базаларды жабғыңыз келсе, осы өлшемдердің әрқайсысында өзіңіздің сүйікті нұсқаңызды жасай аласыз.
  • Фавиконның бөлек нұсқаларын сақтаңыз, осылайша сіз жасаған жұмысты жоғалтпайсыз.
Өзіңіздің сүйікті белгішеңізді жасаңыз 10 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 10 -қадам

Қадам 3. Түрлендіргіш көмегімен файлдарды біріктіріңіз

. Ico файлдарының артықшылығы - оны жасау үшін бірнеше файлды біріктіруге болады. Бұл пайдалы, себебі әр түрлі браузерлер мен бағдарламалық қамтамасыз ету басқа өлшемдегі фавиконды қажет етеді. Сіздің favicon әр түрлі платформаларда жақсы көрінетініне көз жеткізу үшін файлдарды онлайн түрлендіргіш көмегімен түрлендіріңіз. Мұны істеу үшін ақысыз онлайн қосымшаларды табу үшін сүйікті іздеу жүйесіне «белгі түрлендіргішті» енгізіңіз. Біріктірілген файлды «favicon.ico» ретінде сақтаңыз.

  • Сіз сондай -ақ GIMP сияқты бағдарламаны қолдана аласыз немесе Adobe Photoshop -қа ICO FORMAT деп аталатын плагинді жүктей аласыз.
  • Жаңа қалта жасаңыз, сонда сіз жаңа белгішелерді сақтай аласыз немесе жұмыс істеп жатыр.
  • Әр түрлі құралдарды табу үшін іздеу жүйесінде «.ico түрлендіргіші» немесе «фавикон генераторы» деп теріңіз.

3 -ші әдіс 3: Сіздің сүйікті бағдарламаңызды енгізу

Өзіңіздің сүйікті белгішеңізді жасаңыз 11 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 11 -қадам

Қадам 1. Егер сіз веб -сайт редакторын қолдансаңыз, фавиконды жүктеңіз

Көптеген редакторлар веб-сайтқа фавиконды автоматты түрде жүктеуге мүмкіндік беретін кіріктірілген пішінмен келеді. Егер сіз кірістірілген веб -сайт редакторын қолдансаңыз, веб -сайтыңыздың параметрлер мәзірінде «Favicon жүктеу» немесе «Фавикон қосу» деген опцияларды іздеңіз. Favicon.ico файлын таңдап, оны сайтқа жүктеңіз.

Егер сіз веб -сайтыңыздың редакторында фавиконды жүктеуге орын таба алмасаңыз, оны қолмен жасауға тура келеді

Өзіңіздің сүйікті белгішеңізді жасаңыз 12 -қадам
Өзіңіздің сүйікті белгішеңізді жасаңыз 12 -қадам

Қадам 2. Файлды сайтыңыздың түпкі каталогына жүктеңіз

Егер сіздің веб -сайтыңыз File Transfer Protocol немесе FTP протоколын қолдайтын болса, онда сіз FTP клиентін пайдаланып, жаңа favicon.icon файлын түбірлік (индекстік) каталогқа жүктеу үшін пайдалана аласыз. Олай болмаған жағдайда, сіз веб -хосттар бетіне өтіп, суретті қолмен жүктеуіңіз керек. Бар favicon.ico файлын жаңа файлмен алмастыруды ұмытпаңыз.

Жеке Favicon белгішесін жасаңыз 13 -қадам
Жеке Favicon белгішесін жасаңыз 13 -қадам

Қадам 3. Файлды тақырыпқа қосыңыз

Сайттың PHP және CSS файлдарына кіруге болатын орынды табыңыз. Сайттың header.php файлына өтіп, оны өңдеңіз. Тегтің астында «

  • «. Бұл сіздің сайтыңызды фавиконға қосуы керек.

    Сіз PHP қолданатындықтан, бұл сіздің тақырыптық файлды пайдаланатын кез келген сайттар енді сол фавиконға ие болады дегенді білдіреді

    Өзіңіздің сүйікті белгішеңізді жасаңыз 14 -қадам
    Өзіңіздің сүйікті белгішеңізді жасаңыз 14 -қадам

    Қадам 4. Браузерді жаңартыңыз

    Фавиконды жүктеуді аяқтағаннан кейін браузерді жаңартуға болады, сонда мекенжай жолағының жанында жаңа сурет пайда болады. Жаңартылған фавиконның кескініне тікелей өту үшін «https://www.yourdomain.com/favicon.ico» теріңіз.

    • Егер сіздің фавикон бастапқыда пайда болмаса, браузердің кэшін қалпына келтіру қажет болуы мүмкін.
    • Кэшті тазарту үшін шолғыштың параметрлеріне өтіп, уақытша интернет файлдарын, cookie файлдарын және тарихты жойыңыз.

Ұсынылған: