პროგრამა Favicon-ის შესაქმნელად. უნივერსალური გზა ფავიკონების შესაქმნელად. როგორ მუშაობს ლოგასტერში ხატის შექმნის პროცესი?

დღეს ჩვენ კვლავ ვისაუბრებთ ბლოგის სურათებზე, ანუ პროექტის ხატულაზე, რომელსაც ეწოდება favicon. მოდით განვიხილოთ რა არის ფავიკონი, როგორ გავაკეთოთ ის და დავუკავშიროთ ჩვენს საიტს. ასევე, რა ზომის უნდა იყოს ეს სურათი და რატომ უნდა დააინსტალიროთ თითოეულმა თქვენგანმა. ყოველივე ამის შემდეგ, ამ ხატმაც კი შეიძლება გავლენა მოახდინოს თქვენს ბლოგზე ტრაფიკზე.

რა არის ფავიკონი?

Favicon-ის კონცეფცია საკმაოდ მარტივია და წარმოიქმნება ლათინური ორი სიტყვისგან (ფაქტობრივად, ისევე როგორც ყველაფერი ინტერნეტში) - ფავორიტების ხატულა. ეს თავის მხრივ შეიძლება ითარგმნოს როგორც ხატულა ან ბეჯი. მნიშვნელობა შეიძლება ასეთი იყოს; საყვარელი ხატი ან საყვარელი. რატომ ეს სახელი? ეს მარტივია, რჩეულები მხოლოდ სანიშნეების სახელია ბრაუზერში, ასე რომ, სახელი შეიძლება იქნას ინტერპრეტირებული, როგორც სურათი სანიშნის ან ბრაუზერის ჩანართისთვის. ყოველივე ამის შემდეგ, თქვენ ვერ შეამჩნევდით, რომ როდესაც ხსნით საიტს ან ამატებთ მას თქვენს სანიშნეებში, ჩვენ ვხედავთ არა მხოლოდ მის სახელს, არამედ მის სურათს, რომელსაც ფავიკონი ჰქვია. იმედია შევძელი აეხსნა, როგორი ცხოველია ეს?

რატომ შეიძლება დაგჭირდეთ ფავიკონი?

აქ ყველაფერი ისეთივე მარტივია, როგორც ორთქლზე მოხარშული ტურფა, აუცილებელია ინტერნეტ პროექტის ინდივიდუალიზაციისთვის. ანუ, თქვენი ბლოგის კიდევ ერთი გამორჩეული მახასიათებელი იქნება ეს სურათი, რომელიც არა მხოლოდ უფრო მოსახერხებელს გახდის თქვენი საიტის ბრაუზერში გამოყენებას, არამედ სწორი მიდგომით გაზრდის თქვენი პროექტის ვიზიტორთა რაოდენობას.

პირველ რიგში, ეს შეიძლება იყოს მოსახერხებელი ბრაუზერში, რატომ? მაგალითად, როდესაც მე მაქვს ჩანართების თაიგულები ღია, შემიძლია ნავიგაცია იმ საიტის ხატულაზე, რომელიც ამ მომენტში მჭირდება. ანუ ჩემნაირი ადამიანებისთვის მოსახერხებელია.

მეორეც, ამ სურათს შეუძლია უფრო მეტი ვიზიტორი მიიზიდოს თქვენს რესურსზე Yandex საძიებო სისტემიდან, თუ ის მიმზიდველია და გამოირჩევა სხვათა შორის, მაგრამ ფანატიზმის გარეშე. იმის წყალობით, რომ Yandex ათავსებს ფავიკონს ძიების შედეგების პირველ ცხრა გვერდზე, თქვენი ბლოგი განსხვავდება სხვებისგან. ზუსტად ამ მიზეზის გამო ღირს ფიქრი ფავიკონის თქვენს პროექტთან დაკავშირებაზე. ასე გამოიყურება პირველი საძიებო გვერდები.

გააკეთეთ ფავიკონირთული არ იქნება, რადგან ქსელში არის გენერატორების უზარმაზარი რაოდენობა, რომლებსაც შეუძლიათ ჩვეულებრივი სურათებისგან ფავიკონის გაკეთება და მისი დახატვა საკუთარი თავის ნულიდან. თქვენ ასევე შეგიძლიათ გააკეთოთ სურათი Photoshop-ის გამოყენებით და შემდეგ გამოიყენოთ გენერატორები, რომ გადაიყვანოთ იგი სასურველ ფორმატში.

განსხვავებები ჩვეულებრივ სურათებსა და ხატებს შორის მცირეა, მაგრამ ისინი არსებობს. სურათი უნდა იყოს მარტივი (რთული გრაფიკული ელემენტების დანახვა რთული იქნება), ზომით 16x16 პიქსელი და უნდა იყოს ico ფორმატში. თქვენ, რა თქმა უნდა, შეგიძლიათ გამოიყენოთ png ან gif ფორმატები, მაგრამ ასეთი სურათები არ იქნება ნაჩვენები ყველა ბრაუზერში, ამიტომ საუკეთესო ვარიანტია გამოიყენოთ ico ფორმატი.

მე ვერ ვხედავ აზრს, რომ ყოველ ნაბიჯზე გითხრათ, როგორ გააკეთოთ ეს ხატი, რადგან ყველას შეუძლია გაუმკლავდეს მას. მთავარია გავითვალისწინოთ სურათების მოთხოვნები და ყველაფერი გამოვა. მოკლედ, გადმოწერეთ ან დახაზეთ სურათი და შექმენით ფავიკონი ონლაინ გენერატორების გამოყენებით. ონლაინ გენერატორების ნახვა შეგიძლიათ Google-ის ან Yandex Search-ის აკრეფით - favicon. ან აქ არის სერვისის ბმული, რომლითაც შეგიძლიათ დახაზოთ ნულიდან ან გააკეთოთ ფავიკონი დასრულებული სურათიდან: http://favicon.ru/

როგორ დავაკავშიროთ ფავიკონი ვებსაიტისთვის?

კარგი, ხატულა მზად არის, ახლა როგორ დავაყენო ბრაუზერები საიტის ფავიკონის ჩვენება?

სერვისის გამოყენების შემდეგ, ჩამოტვირთეთ მზა ხატულა თქვენი ბლოგისთვის თქვენს კომპიუტერში. და ატვირთეთ სურათი FTP კლიენტის გამოყენებით ბლოგის ძირეულ საქაღალდეში (public_html/site/your_file_in_ico_format) ან ნებისმიერ სხვა. მაგრამ უმჯობესია გადახვიდეთ root საქაღალდეში, უბრალოდ უფრო ადვილია ფაილის გზის შედგენისას.

ასე რომ, ფაილი აიტვირთა, რა ხდება შემდეგ? ახლა შეგიძლიათ შეამოწმოთ, თუ ეჭვი გეპარებათ, რომ ფაილი ატვირთულია root საქაღალდეში: your_site/favicon.ico. თუ ფაილი ჩამოტვირთულია root საქაღალდეში, მაშინ ის გამოჩნდება ამ მისამართზე. შემდეგ თქვენ უნდა დაწეროთ რესურსის თითოეული გვერდი ტეგებს შორის დაშემდეგი კოდი:

და თუ ხატი სხვა საქაღალდეშია, მაშინ ასე უნდა იყოს:

ეს კოდი ზოგადად მიღებულად ითვლება მრავალი ინტერნეტ რესურსისთვის და იმუშავებს ნებისმიერ ძრავზე. მაგრამ თქვენ შეგიძლიათ დაწეროთ იგი სხვაგვარად სხვადასხვა ძრავისთვის. მაგალითად, WordPress-ისთვის ეს კოდი ასე გამოიყურება:

/favicon.ico" />

მხოლოდ, ამ პარამეტრში, ხატულა უნდა იყოს შაბლონის საქაღალდეში. მაგალითად (public_html/site/wp-content/themes/your-theme/favicon.ico).

ამ ნაბიჯების შემდეგ ფავიკონი საიტისთვისდაიწყებს მუშაობას და მისი ნახვა შეგიძლიათ თქვენი ბრაუზერის ჩანართებში. მაგრამ Yandex-ის ძიების შედეგებში, ფაილი დაუყოვნებლივ არ გამოჩნდება, ჯერ უნდა დაელოდოთ სანამ Yandex რობოტი განათავსებს ხატულას და მხოლოდ ამის შემდეგ გამოჩნდება ძიების შედეგებში, შემდეგ კი მხოლოდ იმ პირობით, რომ თქვენი ბლოგი ჩართულია; ძიების შედეგების პირველი ცხრა გვერდიდან ერთ-ერთი.

Სულ ეს არის. თუ რამე არ არის ნათელი, იკითხეთ და ჩვენ გავარკვევთ. ისევ გნახავ!

გამარჯობა, ბლოგის საიტის ძვირფასო მკითხველებო. დღევანდელ სტატიაში საუბარი იქნება ე.წ Favicon.ico ხატებზე. ჩვენ გავარკვევთ, რა არის ფავიკონი, რატომ უნდა დააინსტალიროთ იგი თქვენს ვებსაიტზე და როგორ შექმნათ საჭირო ზომის ხატი.

პრინციპში, ფავიკონის შესაქმნელად, საერთოდ არ არის საჭირო რაიმე სპეციალური ონლაინ გენერატორის გამოყენება, თუმცა ეს საკმაოდ მოსახერხებელი და მარტივია. შეგიძლიათ სცადოთ მისი გაკეთება Photoshop-ში, მაგრამ სტანდარტულად, სამწუხაროდ, მას არ შეუძლია სურათების შენახვა ICO ფორმატში. ამიტომ, იმისათვის, რომ Photoshop-ს ასწავლოთ ICO-სთან მუშაობა, დაგჭირდებათ სპეციალური დანამატის დაყენება.

მაგრამ თუ თქვენ არ ხართ კომფორტული Photoshop-ით (ისევე როგორც მას), მაშინ ბევრად უფრო მოსახერხებელი იქნება თქვენთვის ქვემოთ ჩამოთვლილი მრავალი ონლაინ სერვისის გამოყენება. უფრო მეტიც, ზოგიერთ მათგანში თქვენ შეძლებთ ახალი ხატის დახატვას სრულიად ნულიდან, ხოლო ზოგიერთში შეძლებთ არსებული სურათის (რომელიც თქვენთვის შესაფერისია) გადაკეთებას ფავიკონის ფორმატში.

უმარტივესი ვარიანტია Favicon-ის კოლექციის ჩამოტვირთვა ზოგიერთი ონლაინ გალერეიდან ან კატალოგიდან. წაიკითხეთ ქვემოთ იმის შესახებ, თუ სად შეგიძლიათ მიიღოთ ისინი.

როგორ შევქმნათ Favicon ონლაინ და სად შეგიძლიათ ჩამოტვირთოთ მათი კოლექცია

ნება მომეცით პირველ რიგში მოვიყვან სერვისების მაგალითებს (ე.წ ფავიკონის გენერატორი), სადაც შეგიძლიათ, ყოველგვარი განსაკუთრებული უნარების გარეშე, შეიმუშავოთ სრულიად ღირსეული მინი ლოგო თქვენი ვებსაიტისთვის, ან თუნდაც ავტომატურად გადაიყვანოთ შესაფერისი სურათი იმ ფორმატში, რომელიც საჭიროა საიტზე ფავიკონის ატვირთვისთვის.

1. Faviсon.cc— საკმაოდ მოსახერხებელი ონლაინ favicon გენერატორი. მისი გამოყენებით, შეგიძლიათ, მაგალითად, შექმნათ თქვენი საკუთარი ხატი ნულიდან (სრულიად ექსკლუზიური), დახატოთ იგი პიქსელ-პიქსელზე. ამისათვის თქვენ უნდა დააჭიროთ ღილაკს "Create New Favcon" სერვისის ფანჯრის მარცხენა მხარეს.

   

   გენერატორის გვერდის ცენტრში არის ადგილი, სადაც თითოეული კვადრატი არის თქვენი მომავალი ფავიკონის პიქსელი. თქვენი ამოცანაა ამ კვადრატების დახატვა სხვადასხვა ფერებით. ერთი კვადრატის ფერით დასახატავად, თქვენ უნდა მონიშნოთ სერვისის ფანჯრის მარჯვენა მხარეს არსებული ველი „Color Picker“ ველში, აირჩიოთ სასურველი ფერი იქ მდებარე პალიტრიდან და დააწკაპუნოთ სასურველ კვადრატზე. არასწორი დაჩრდილვის მოსაშორებლად მონიშნეთ „გამჭვირვალე“ უჯრა და დააწკაპუნეთ კვადრატზე, რის შედეგადაც ის გახდება უფერული (გამჭვირვალე).

   გენერატორის ტილოზე პიქსელის გადასატანად, თქვენ უნდა შეამოწმოთ ველი „გადაადგილება“. თქვენ შეგიძლიათ ნახოთ თქვენი სამუშაოს შედეგი რეალურ მასშტაბში ტილოს ქვეშ მდებარე "Preview" ზონაში. თუ თქვენ მიერ შექმნილი Favicon ჯდება, დააწკაპუნეთ ღილაკზე „ჩამოტვირთვა“ თქვენს კომპიუტერში შესანახად. შედეგად, თქვენ მიიღებთ გრაფიკულ ფაილს, რომელიც შეგიძლიათ ჩამოტვირთოთ და ატვირთოთ ჰოსტინგ სერვერზე.

   ახლა თქვენ იცით, როგორ გააკეთოთ მინი ლოგო თქვენი ვებსაიტისთვის ნულიდან. მაგრამ თუ არ გაქვთ გრაფიკული ნიჭი, მაშინ შეგიძლიათ გამოიყენოთ ონლაინ გენერატორის სერვისი ატვირთეთ ნებისმიერი სურათი მომავალი ფავიკონისთვის, რომელიც იქნება ბლანკის ფუნქცია. სურათი შეიძლება იყოს აბსოლუტურად ნებისმიერი ზომის და ფორმატის. ხატული ფაილის ონლაინ სერვისზე ასატვირთად, თქვენ უნდა დააჭიროთ ღილაკს "იმპორტი სურათი" სერვისის ფანჯრის მარცხენა მხარეს.

   

   ფანჯარაში, რომელიც იხსნება, დააწკაპუნეთ ღილაკზე „დათვალიერება“ და იპოვეთ შესაბამისი სურათი თქვენს კომპიუტერში. შემდეგ აირჩიე რა უნდა გააკეთო შენი სურათის ასპექტის თანაფარდობასთან მისი 16-ზე 16-ზე გადაყვანისას (კვადრატში). ეს მართალია, თუ თქვენ მიერ ატვირთული სურათი არ არის კვადრატული. ამ შემთხვევაში შესაძლებელია ორი ვარიანტი: ასპექტის თანაფარდობის უცვლელი დატოვება (განზომილებების შენარჩუნება) ან სურათის კვადრატულ ხედად გადაქცევა (შემცირება კვადრატის ხატულაზე). მეორე შემთხვევაში, მომავალი ფავიკონის გამოსახულება დამახინჯდება ერთ-ერთი ღერძის გასწვრივ.

   ონლაინ გენერატორზე ატვირთვისა და თქვენი სურათის კონვერტაციისთვის, თქვენ უნდა დააჭიროთ ღილაკს "ატვირთვა". მისგან შექმნილი Favicon.ico რედაქტირებადი იქნება ისევე, როგორც თქვენ მიერ დახატული. როდესაც დაასრულებთ თქვენს შედევრზე მუშაობას, დააწკაპუნეთ ღილაკზე „ჩამოტვირთვა“, რომ გადმოწეროთ იგი თქვენს კომპიუტერში.

   ამ ონლაინ სერვისს ასევე აქვს შესაძლებლობა გამოიყენოს სხვა მომხმარებლების მიერ შექმნილი და საჯაროდ ხელმისაწვდომი ფავიკონების კოლექციები. გალერეაში არსებული ექსპონატების სანახავად, თქვენ უნდა დააწკაპუნოთ ფანჯრის მარცხენა მხარეს ღილაკზე „უახლესი ფავიკონები“ კოლექციების სანახავად დალაგებული შექმნის თარიღის მიხედვით, ან „ყველაზე რეიტინგული ფავიკონების“ სანახავად. გალერეები დალაგებულია რეიტინგის მიხედვით.

2. Favicon.ru- ოდესღაც ეს სერვისი ბევრად უფრო მარტივი იყო, ვიდრე ზემოთ აღწერილი ონლაინ გენერატორი, მაგრამ ახლახან ის თითქმის მისი ანალოგი გახდა, მაგრამ მხოლოდ რუსულ ენაზე. Favicon.ru არა მხოლოდ საშუალებას გაძლევთ გადაიყვანოთ ნებისმიერი სურათი, რომელიც გაქვთ (თქვენს კომპიუტერზე ან ინტერნეტში) ICO ფორმატში 16-დან 16 პიქსელზე ზომით, არამედ შესაძლებელს ხდის მის დახატვას ნულიდან, პიქსელ-პიქსელზე.

   

   ონლაინ favicon გენერატორის ეს ვერსია აღსანიშნავია, ალბათ, მხოლოდ იმიტომ, რომ ის შიდაა. სწორედ ამიტომ დაასრულა იგი ამ სტატიაში. ასე რომ, მასთან მუშაობისთვის, თქვენ უნდა დააჭიროთ ღილაკს "აირჩიეთ ფაილი" მთავარი გვერდის ზედა ნაწილში და მიუთითოთ გზა სასურველი სურათისკენ თქვენს კომპიუტერში. გადმოწერილი და გადაყვანილი სურათი Favicon.ico ფორმატში შეიძლება შესწორდეს და შემდეგ შეინახოს თქვენს კომპიუტერში. ყველაფერი მარტივი და მოსახერხებელია.

3. Logaster.ruარის ონლაინ ლოგოს გენერატორი, მაგრამ ლოგოების გარდა, ის ასევე ქმნის ფავიკონს. ყველა სხვა სერვისისგან განსხვავებით, თქვენ არ გჭირდებათ ფავიკონის დიზაინის დახატვა ან მისი ლოგოდან კონვერტაცია.

   

   ფავიკონის შესაქმნელად ჯერ უნდა შეიყვანოთ საიტის ან კომპანიის სახელი და აირჩიოთ საქმიანობის ტიპი. სერვისი შესთავაზებს რამდენიმე ათეულ ფავიკონის შაბლონს, რომლებიც მზად არიან გამოსაყენებლად. თქვენ შეგიძლიათ წაიკითხოთ მეტი, თუ როგორ უნდა შექმნათ ფავიკონი. Favicon.ico-ს შექმნის შემდეგ შეგიძლიათ ჩამოტვირთოთ ფაილი თქვენს კომპიუტერში ICO ან PNG ფორმატში.

ამის შემდეგ, თქვენ უბრალოდ უნდა დააჭიროთ ღილაკს "შექმნა". გვერდზე, რომელიც იხსნება, ნახავთ ბმულს, რომ გადმოწეროთ მიღებული ფავიკონი.

ონლაინ გენერატორების, ფავიკონების კოლექციებისა და გალერეების შერჩევა

თუ რაიმე მიზეზით არ მოგეწონათ ზემოთ აღწერილი favicon გენერატორი, მაშინ შემიძლია გირჩიოთ სცადოთ თქვენი ბედი ერთ-ერთ შემდეგში უფასო ონლაინ სერვისები:

1. FaviconGenerator - საშუალებას გაძლევთ გადაიყვანოთ თქვენი კომპიუტერიდან გადმოწერილი ნებისმიერი სურათი სასურველ ფავიკონის ფორმატში (შეგიძლიათ ატვირთოთ სურათები).
2. AntiFavicon არის საკმაოდ საინტერესო Favicon გენერატორი. მასზე შეგიძლიათ შექმენით ფავიკონი წარწერით. თქვენ უნდა შეიყვანოთ წარწერის ტექსტი "ზედა ტექსტი" და "ქვედა ტექსტი" ველებში და დაარეგულიროთ ფერის სქემა "ფერები" ზონაში.
3. FavIcon საწყისი Pics არის კიდევ ერთი მარტივი ონლაინ სერვისი - თქვენ მიუთითებთ გზას სურათზე თქვენს კომპიუტერში, გარდაქმნით და ჩამოტვირთავთ შედეგად ფაილს ICO და GIF ფორმატში.
4. Iconj - აღსანიშნავია, რომ თქვენ შეგიძლიათ ჩამოტვირთოთ შექმნილი ხატულა ან დატოვოთ იგი სერვისზე და მიიღოთ ბმული ამ ფაილზე
5. DeGraeve არის საკმაოდ მძლავრი Favicon გენერატორი, ფუნქციონალურად მსგავსი ადრე განხილული Favicon.cc. აქაც შეგიძლიათ ყველაფერი გააკეთოთ ნულიდან, ან ატვირთოთ სურათი, რომელიც მოგვიანებით შეიძლება დარეგულირდეს და გადმოწეროთ შესაბამისი ზომის ICO ფორმატში.
6. გენერატორი - საშუალებას გაძლევთ შექმნათ ფავიკონი ატვირთული სურათიდან და შექმნათ იგი ნულიდან სპეციალურ რედაქტორში.
7. ხატების ონლაინ რედაქტორი favicon.ico - კარგად, ის აკეთებს ყველაფერს - ქმნის ფავიკონებს ნულიდან და ცვლის არსებულ სურათს.
8. Online Favicon არის ძალიან ფუნქციონალური ინსტრუმენტი მინი ლოგოების შესაქმნელად და რედაქტირებისთვის
9. უფასო Favicon გენერატორი - იმ შემთხვევაში, თუ ზემოთ ჩამოთვლილი სიიდან არაფერი მოგეწონებათ.
10. Favicon გენერატორი - მარტივი და გემოვნებიანი...

თუ არ გაინტერესებთ საიტისთვის თქვენი მინი-ლოგოს ექსკლუზიურობა და ვერ შეაფერხებთ რედაქტორებსა და გენერატორებს, მაშინ შეგიძლიათ აირჩიოთ თქვენთვის შესაფერისი ხატი იმ საიტებზე, სადაც ისინი ათეულობით ლარს შეადგენს. ყოველივე ამის შემდეგ, ფაქტობრივად, აბსოლუტურად ნებისმიერი ხატულა 16-დან 16 პიქსელზე, რომელიც შეგიძლიათ ჩამოტვირთოთ ინტერნეტიდან ან იპოვოთ თქვენი კომპიუტერის სიღრმეში, მოგვწონს.

მაგრამ თქვენ უნდა გახსოვდეთ, რომ ფავიკონმა პირველ რიგში უნდა მიიპყროს მომხმარებლების ყურადღება. იდეალურ შემთხვევაში, მომხმარებელს შეეძლება თქვენი საიტის ამოცნობა მხოლოდ Favicon-ის ნახვით, ასე რომ, უკეთესია, თუ ის უნიკალურია, მაგრამ თქვენ ასევე შეგიძლიათ მოძებნოთ რაიმე უაზრო ინტერნეტში.

თუ არ გაქვთ სურვილი ან შესაძლებლობა (არ ხართ მხატვარი და არასოდეს ყოფილხართ), მაშინ უმარტივესი გზა იქნება ეძებოთ გალერეები უფასო ფავიკონების კოლექციებით:

1. Iconj არის ხატების საკმაოდ დიდი კოლექცია, რომელიც შექმნილია სხვა ადამიანების მიერ და ხელმისაწვდომია საზოგადოებისთვის
2. Favicon.cc - 55 ათასი სხვადასხვა ვარიანტი ყველა შემთხვევისთვის. ასევე არის ანიმაციური ფავიკონები, რომლებიც მხოლოდ FireFox ბრაუზერში იქნება ხილული.
3. Favicon გალერეა - კიდევ რამდენიმე ხატი, რომელიც შეესაბამება ზომას

თუ თქვენ იცით რაიმე სხვა მსგავსი რესურსი, მე დავამატებ თქვენს ბმულებს ამ სიაში.

როგორ დააინსტალიროთ Favicon ვებსაიტზე და მიუთითოთ მისკენ მიმავალი გზა

თქვენი ბრაუზერი და Yandex საძიებო რობოტი იქნება მოძებნეთ ფავიკონი პირველ რიგში თქვენი საიტის ძირეულ საქაღალდეში. ამიტომ, შეგიძლიათ უბრალოდ დაუკავშირდეთ საიტს FTP-ის საშუალებით და ატვირთოთ თქვენი Favicon.ico ფაილი მის root დირექტორიაში (ჩვეულებრივ public_htm ან htdocs საქაღალდეებში) (უმჯობესია მისი სახელი დაწეროთ პატარა ასოებით). ახლა გახსენით თქვენი რესურსი რომელიმე ბრაუზერში და ნახეთ, შეიცვალა თუ არა ჩანართზე არსებული ხატულა. შეიცვალა? არა? კარგი, არაუშავს.

თუ თქვენ ვერ შეძელით ამ გზით ფავიკონის განთავსება, მაშინ შეიძლება დაგჭირდეთ, რადგან... ხშირად ხდება, რომ ძველი ვერსია იტვირთება ქეშიდან. შეგიძლიათ სცადოთ, ჩემთვის ის საუკეთესოდ რეაგირებს ქეშის გასუფთავების გარეშე განხორციელებულ ცვლილებებზე. თუ პრობლემა არ არის ბრაუზერის ქეშში, მაშინ ეს ნიშნავს თქვენს საიტს აქვს სხვა მდებარეობა favicon-ისთვის, განსხვავდება ძირეული საქაღალდისგან. როგორ შემიძლია ამის შემოწმება?

გახსენით თქვენი საიტის ნებისმიერი გვერდის საწყისი კოდი. მისი საწყისი კოდის სანახავად, უბრალოდ დააწკაპუნეთ მაუსის მარჯვენა ღილაკით გვერდზე და აირჩიეთ შესაბამისი კონტექსტური მენიუს ელემენტი (მაგალითად, „საწყისი კოდი“ ძველ ოპერაში, ან „გვერდის წყარო კოდი“ Mazila Firefox-ში, ან „გვერდის კოდის ნახვა“ Google Chrome, ან „იხილეთ HTML კოდი“ IE-ში) ან დააჭირეთ კლავიშთა კომბინაციას Ctrl+U. ახლა გადახედეთ გვერდის ზედა კოდს ხაზს, რომელიც განსაზღვრავს გზას favicon.ico-მდე.

შეიძლება ასე გამოიყურებოდეს:

ახლა, როდესაც იცით ეს გზა, შეგიძლიათ კვლავ დაუკავშირდეთ FTP-ის საშუალებით და ატვირთოთ თქვენი ფავიკონი მითითებული ბილიკის გამოყენებით, შეცვალოთ უკვე საიტზე. თუ ბრაუზერის მისამართის ზოლში ცვლილებები კვლავ არ მომხდარა, კვლავ სცადეთ ბრაუზერის ქეშის გასუფთავება.

IN ჯომლა Favicon ჩვეულებრივ ცხოვრობს საქაღალდეში იმ შაბლონით, რომელსაც იყენებთ (მისკენ მიმავალი გზა Joomla 1.5-ში იწერებოდა index.php ფაილში იმავე შაბლონის დირექტორიაში, მაგრამ Joomla 3-ში ყველაფერი ცოტა უფრო გართულდა). იმათ. ჯომლაში favicon-ის შესაცვლელად საკმარისია მიყვეთ ამ გზას და ატვირთოთ თქვენი favicon.ico ფაილი იქ და დადებითად უპასუხოთ კითხვას ჩანაცვლების შესახებ:

/templates/folder_with_the_design_template/favicon.ico

Favicon ფაილი WordPressნაგულისხმევად, ის ასევე შეიძლება იყოს საქაღალდეში იმ თემით, რომელსაც იყენებთ (მისკენ მიმავალი გზა ასევე მითითებულია იქ):

/wp-content/themes/Folder_with_theme_you_are_using/favicon.ico

ზოგადად, თუ გინდა დააყენეთ ან შეცვალეთ გზა თქვენი ფავიკონისკენ, რაც გაგებული იქნება როგორც ბრაუზერებისთვის, ასევე Yandex-ის საძიებო რობოტისთვის, შემდეგ თქვენ უნდა ჩაწეროთ ის შესაბამის შაბლონის ფაილში Joomla-სთვის, WordPress-ისთვის ან ნებისმიერი სხვა ძრავისთვის, გახსნის და დახურვის ტეგებს შორის. HEAD, კოდის შემდეგი ხაზები:

შაბლონის რომელ ფაილში უნდა ჩაწეროთ ეს ხაზები, დამოკიდებულია თქვენი საიტის ძრავზე. მაგალითად, in WordPress-შითქვენ უნდა გახსნათ ფაილის header.php რედაქტირებისთვის: wp-content/themes/Folder_with_your_theme_design. გახსენით header.php რედაქტორში და თავიდანვე იპოვეთ გახსნილი Html HEAD ტეგი. მის შემდეგ ნებისმიერ ადგილას, მაგრამ HEAD-ის დახურვამდე, ჩაწერეთ კოდის ერთ-ერთი ზემოაღნიშნული ხაზი, რომელიც მიუთითებს თქვენი მინი-ლოგოს გრაფიკული ფაილის გზაზე.

Როგორ დავაყენოთ ანიმაციური ფავიკონი? ძირითადად, ზუსტად იგივეა, რაც ჩვეულებრივი. ერთადერთი განსხვავება იქნება თქვენი ვებსაიტის შაბლონში ჩასმული კოდი, რომლითაც ბრაუზერებს და Yandex საძიებო რობოტს მიუთითებთ სასურველი გრაფიკული ფაილის გზას. ფაქტია, რომ ანიმაციურ Favicon-ს ექნება GIF გაფართოება და, შესაბამისად, კოდის ხაზებში მოგიწევთ მსგავსი რამის დაწერა:

ეს არის მთელი განსხვავება ანიმაციურ ფავიკონებსა და ჩვეულებრივებს შორის. მაგრამ უნდა გაითვალისწინოთ, რომ ანიმაციური ხატულა იმუშავებს მხოლოდ სხვა ბრაუზერებში, ის სტატიკური იქნება. Yandex, თქვენი ანიმაციური ფავიკონის ჩატვირთვისას, გარდაქმნის მას სტატიკურ PNG ფორმატში. მაგრამ, ჩემი აზრით, არ ღირს უბედურება - საიტისთვის ჩვეულებრივი მინი ლოგოს ნაცვლად ანიმაციურის დაყენება დიდი აზრი არ აქვს. მაგრამ ეს მხოლოდ ჩემი IMHOა.

Წარმატებას გისურვებ! მალე შევხვდებით ბლოგის საიტის გვერდებზე

შეიძლება დაგაინტერესოთ

ონლაინ FTP კლიენტი Net2ftp და Google Alerts - სასარგებლო სერვისები ვებმასტერებისთვის
ვებსაიტის ანალიზი უფასო ონლაინ სერვისებში Pr-cy, Cy-pr, Be1, Xseo და სხვა
ხატები, სამკერდე ნიშნები, ფონი, სურათები და ლოგოები საიტისთვის (ონლაინ სერვისები IconFinder, Freepik, PSDGraphics და სხვა)
გამოყენებადობა - როგორ გახადოთ თქვენი ვებსაიტი მოსახერხებელი ვიზიტორებისთვის და შეეცადოთ მათ რაც შეიძლება დიდხანს გააგრძელოთ თქვენი სტატიების კითხვა
MegaIndex Tools - ინსტრუმენტების ნაკრები ვებ მასტერებისა და ოპტიმიზატორებისთვის
როგორ შევამოწმოთ ვებსაიტის განლაგების ბრაუზერის თავსებადობა Browsershots-ში და დავაყენოთ პინგის გაგზავნა ახალი მასალების გამოჩენისას
Http - რა არის ეს, როგორ ვნახოთ სათაურები და შევამოწმოთ სერვერის პასუხის კოდი, რას ნიშნავს კოდები 200, 301, 302, 404 და 500?
Crossposting - რა არის ეს და როგორ გავაკეთოთ ეს სწორად

ახლა პირადი საიტის ხატულა - Favicon - ნებისმიერი ვებ რესურსის ერთგვარი სავიზიტო ბარათია. ეს ხატი ხაზს უსვამს სასურველ პორტალს არა მხოლოდ ბრაუზერის ჩანართების სიაში, არამედ, მაგალითად, Yandex-ის ძიების შედეგებში. Favicon, როგორც წესი, არ ასრულებს სხვა ფუნქციებს, გარდა საიტის ცნობადობის გაზრდისა.

საკუთარი რესურსისთვის ხატის შექმნა საკმაოდ მარტივია: თქვენ იპოვით შესაფერის სურათს ან ხატავთ მას გრაფიკული რედაქტორის გამოყენებით და შემდეგ შეკუმშავთ სურათს სასურველ ზომამდე - ჩვეულებრივ 16x16 პიქსელი. მიღებული შედეგი შეინახეთ favicon.ico ფაილში და განათავსეთ საიტის ძირეულ საქაღალდეში. მაგრამ ეს პროცედურა შეიძლება მნიშვნელოვნად გამარტივდეს ინტერნეტში ხელმისაწვდომი Favicon-ის ერთ-ერთი გენერატორის გამოყენებით.

ვებ ხატების რედაქტორების უმეტესობა გთავაზობთ ყველა საჭირო ინსტრუმენტს Favicons-ის შესაქმნელად. ამ შემთხვევაში არ არის აუცილებელი ნახატის ნულიდან დახატვა - შეგიძლიათ გამოიყენოთ მზა სურათი.

მეთოდი 1: Favicon.by

რუსულენოვანი ონლაინ favicon გენერატორი: მარტივი და ვიზუალური. საშუალებას გაძლევთ დახატოთ ხატი ჩაშენებული 16x16 ტილოს და ინსტრუმენტების მინიმალური სიის გამოყენებით, როგორიცაა ფანქარი, საშლელი, თვალის საწვეთური და შევსება. არის პალიტრა ყველა RGB ფერისა და გამჭვირვალობის მხარდაჭერით.

თუ გსურთ, შეგიძლიათ ატვირთოთ დასრულებული სურათი გენერატორზე - თქვენი კომპიუტერიდან ან მესამე მხარის ვებ რესურსიდან. იმპორტირებული სურათიც განთავსდება ტილოზე და ხელმისაწვდომი იქნება დასამონტაჟებლად.

შედეგად, თქვენ მიიღებთ გრაფიკულ ICO ფაილს სახელწოდებით favicon და გარჩევადობა 16x16 პიქსელი. ეს ხატულა უკვე მზად არის გამოსაყენებლად, როგორც ხატულა თქვენი ვებსაიტისთვის.

მეთოდი 2: X-Icon რედაქტორი

HTML5 ბრაუზერის აპლიკაცია, რომელიც საშუალებას გაძლევთ შექმნათ დეტალური ხატები 64x64 პიქსელამდე ზომის. წინა სერვისისგან განსხვავებით, X-Icon Editor-ს აქვს უფრო მეტი ხატვის ხელსაწყოები და თითოეული მათგანის კონფიგურაცია შესაძლებელია მოქნილად.

როგორც Favicon.by-ში, აქაც შეგიძლიათ ატვირთოთ დასრულებული სურათი საიტზე და გადაიყვანოთ ის ფავიკონად, საჭიროების შემთხვევაში სწორად დაარედაქტიროთ.

თუ გსურთ შეინარჩუნოთ სურათის დეტალები, რომლის გადაქცევასაც აპირებთ ფავიკონად, X-Icon Editor შესანიშნავია ამისთვის. 64x64 პიქსელის გარჩევადობის ხატების გენერირების შესაძლებლობა ამ სერვისის მთავარი უპირატესობაა.

Favicon (ინგლ. Favorite Icon) არის პატარა ხატულა (სურათი, სურათი) სპეციალური ფორმატით, რომელიც ნაჩვენებია ბრაუზერის მისამართის ზოლში ვებსაიტის, ბრაუზერის ჩანართის ან მის სანიშნეებში („რჩეულები“) ნახვისას.

favicon არის დამატებითი გაფორმება თქვენი ვებსაიტის, თქვენი მინი ლოგოსთვის. ის ასევე ნაჩვენებია Yandex-სა და Google ძიებებში საიტების სიის ნახვისას და თქვენს საიტს გამოარჩევს დანარჩენისგან.

რატომ გჭირდებათ ფავიკონი ვებსაიტისთვის?

favicon არის თქვენი საიტის სავაჭრო ნიშანი. დღეს ბევრ კომპანიას აქვს გამორჩეული ფავიკონი, რომელიც განასხვავებს მათ კონკურენტებისგან. იმისათვის, რომ ხატი უკეთ დაამახსოვრონ მომხმარებლებს, კომპანიებმა მასში უნდა აჩვენონ თავიანთი ლოგო, რომელიც ასევე უნდა იყოს საიტის სათაურის ერთ-ერთი ელემენტი. Favicon-ის გამოყენების კიდევ ერთი დადებითი თვისებაა ის, რომ ბრაუზერში დიდი რაოდენობით საიტების ნახვისას თქვენ არ ხედავთ გვერდის მთელ სათაურს, არამედ მხოლოდ ხატულას და შეგიძლიათ დაუყოვნებლივ და მარტივად ამოიცნოთ ჩანართი, სადაც გსურთ წასვლა.

რა ჯობია ფავიკონზე ჩვენება?

• ხატი უნდა შეესაბამებოდეს საიტის თემას.
• ბრენდი, თუ თქვენი ვებ-გვერდი ასოცირდება ამ ბრენდთან. ამავდროულად, სხვადასხვა ბრენდის ჩვენება შესაძლებელია სხვადასხვა გვერდებზე;
• გამოიყენეთ ფავიკონი, რომელზეც გსურთ დააწკაპუნოთ, ეს გაზრდის დაწკაპუნების კოეფიციენტს Yandex-სა და Google ძიებებში ნახვისას;
• შექმენით რამდენიმე ფავიკონის დიზაინი თქვენი საიტის სხვადასხვა განყოფილებისთვის.
• გააკეთეთ რამდენიმე ფავიკონის დიზაინი სხვადასხვა ღონისძიებებისთვის (მაგ. ახალი წელი, ვალენტინობის დღე ან კოსმონავტიკის დღე, :).

მოათავსეთ მიღებული ფაილი თქვენი საიტის ძირში, სადაც არის მთავარი ინდექსის ფაილი (index.php). ბრაუზერს რომ მიუთითოთ საიტის ფავიკონის მდებარეობა გვერდის თავში, ჩადეთ შემდეგი ხაზი:

როგორ გავაკეთოთ ანიმაციური ფავიკონი?

ICO ფორმატი არ უჭერს მხარს ანიმაციას. მაგრამ თანამედროვე ბრაუზერები საშუალებას გაძლევთ გამოიყენოთ GIF ფორმატი მინიატურებისთვის. შესაძლებელია მიუთითოთ ერთი ანიმაციური ფაილი (favicon.gif) თანამედროვე ბრაუზერებისთვის და მეორე (favicon.ico) ძველი ბრაუზერებისთვის, როგორიცაა Intertet Explorer. ამისათვის დაამატეთ შემდეგი ორი ხაზი სათავის განყოფილებაში:

ბუნებრივია, ჯერ ორივე ფაილი უნდა მოათავსოთ საიტის root საქაღალდეში.

რა უნდა გააკეთოს, თუ ბრაუზერში სურათების ჩვენება აკრძალულია?

თუ თქვენ გააკეთებთ ფავიკონს ჩაშენებული სურათით გვერდის კოდში:

შემდეგ ხატი გამოჩნდება ბრაუზერში მაშინაც კი, როდესაც სურათები გამორთულია. .

როგორ მივიღოთ Favicon ვებსაიტიდან

ყველა ვებმასტერი არ ათავსებს favicon.ico-ს საიტის ძირში. ფავიკონის მისამართის მისაღებად გამოიყენეთ შემდეგი სკრიპტი:

]*)ბმული([^>]*)(rel="icon"|rel="shortcut icon")([^>]*)>/iU", $html, $out)) ($link_tag = $out if (preg_match("/href([s]*)=([s]*)"([^"]*)"/iU", $link_tag, $out)) ($favicon = trim($out) if (strpos($favicon, "://")==false) $favicon = $url "/" ?>

საძიებო სისტემები Google, Yandex და favicon

საძიებო სისტემის რობოტების ქეშირება ვებგვერდის ხატულები. ქეშირებული ხატები ხელმისაწვდომია შემდეგი მოთხოვნებისთვის:

გარდა ამისა, Yandex-ს შეუძლია გაგხადოთ „სპრაიტი“ სხვადასხვა საიტების ხატებიდან:

ხატები iPhone-ისა და iPad-ისთვის

მაშინაც კი, თუ თქვენ არ მიუთითებთ სურათზე ბმულს, iPhone მაინც დაეძებს ფაილს, სახელად apple-touch-icon.png, საიტის ძირეულ საქაღალდეში და თუ იპოვის, გადაიღებს სურათს მისგან, მრგვალად. ის კუთხეებში და ხაზს უსვამს მას ავტომატურად. ამის თავიდან ასაცილებლად, apple-touch-icon.png-ის ნაცვლად უნდა დაწეროთ apple-touch-icon-precomposed.png iPhone-ების და iPad-ების მფლობელებს, რადგან მათთვის ჩვენ ვაკეთებთ მშვენიერ ხატს 57x57 (სხვათა შორის, ის შეიძლება იყოს უფრო დიდი, მაგრამ ეს არის ლანჩის ეკრანზე ხატის სტანდარტული ზომა), ვაკავშირებთ მას ასე:

როგორ შევცვალოთ დინამიურად ფავიკონი?

თუ ცდილობთ შეცვალოთ ტეგის თვისების მნიშვნელობა DOM-ის მეშვეობით, სასურველ შედეგს ვერ მიიღებთ. გვერდის ხატის დინამიურად შესაცვლელად, ჯერ უნდა ამოიღოთ ბმულის ტეგი ძველი ხატით გვერდის სათაურიდან, შემდეგ კი დაამატოთ ახალი შინაარსით. ეს კეთდება ასე: // ბმული ახალ ხატულ ფაილზე var icon="new_favicon.ico"; var head = document.getElementsByTagName("head"); // იპოვეთ და წაშალეთ ძველი ხატულა HEAD ტეგიდან var links = head.getElementsByTagName("ბმული"); for (var i = 0; i< links.length; i++) { var lnk = links[i]; if (lnk.rel=="shortcut icon") { head.removeChild(lnk); } } // Добавить новую иконку var link = document.createElement("link"); link.setAttribute("href",icon); link.setAttribute("type","image/x-icon"); link.setAttribute("rel","shortcut icon"); head.appendChild(link);

HTML5 და ფავიკონი

ზომის ატრიბუტი დაემატა HTML5-ს, რაც საშუალებას გაძლევთ გამოაცხადოთ ერთი და იგივე ხატის რამდენიმე განსხვავებული ვერსია და ეს შეიძლება იყოს PNG ფაილები:

როგორ გამოვაცხადოთ ფილა ტაბლეტებისთვის Windows 8-ზე?

Windows 8.0-ის რეკლამა ასე გამოიყურება:

Windows 8.1 და IE 11 ელოდება სურათის მრავალ ვერსიას, რომელიც გამოცხადებულია browserconfig.xml-ში. Მაგალითად:

თქვენ არ გჭირდებათ ამის განცხადება, თუ ფაილის სახელი არ არის შეცვლილი:

#2b5797

დღეს ძალიან საინტერესო თემას შევეხებით. თქვენს ვებსაიტზე მუშაობისას ადრე თუ გვიან მოგიწევთ ფავიკონის შექმნა. მარტივი სიტყვებით, favicon არის თქვენი ვებსაიტის ხატულა, რომელიც გამოჩნდება ბრაუზერის ჩანართზე. თქვენ ასევე შეგიძლიათ მისი ნახვა თქვენი ბრაუზერის სწრაფი წვდომის ზონაში, თუ თქვენი საიტი დაემატა რჩეულებს.

ყველაზე პოპულარული საიტების ფავიკონები

ვფიქრობ, აზრი არ აქვს იმის თქმას, რომ ფავიკონი კარგი ხარისხის უნდა იყოს, რადგან ის გარკვეულწილად თქვენი საიტის სახეა. ამ სტატიაში ჩვენ ვისწავლით თუ როგორ შევქმნათ ფავიკონები, რომლებიც აკმაყოფილებს ჩვენს საჭიროებებს და ასევე გავეცნობით მათ კონვერტაციის სერვისს. წაიკითხეთ მეტი ქვემოთ.

ვიდეო ვერსია:

როგორი უნდა იყოს ფავიკონი?

სანამ თავად ფავიკონის შექმნას დავიწყებდეთ, კარგი იქნება, ვიფიქროთ იმაზე, თუ როგორი უნდა იყოს ისინი იდეალურად. ასე რომ, იდეალური ფავიკონი:

• გასაგები და გასაგებია
• დამზადებულია კარგი ხარისხით
• გადმოსცემს თქვენი საიტის მნიშვნელობას
• აქვს საერთო სტილი თქვენს საიტთან
• გამოირჩევა სხვა საიტების ხატებიდან

ზემოაღნიშნული პარამეტრები შეიძლება კლასიფიცირდეს, როგორც იდეალური ფავიკონი. და ჩვენ უნდა შევქმნათ სწორედ ასეთი ხატი ჩვენი საიტისთვის. თუმცა, მიმდინარეობს კამათი იმაზე, თუ რა უნდა იყოს გამოსახული ფავიკონზე. მე მჯერა, რომ ამ საკითხში თქვენ უნდა გააგრძელოთ თქვენი საიტის ზოგადი სტილი და თემა. ის შეიძლება შეიცავდეს სურათს ან ტექსტს. თუ ტექსტი მოთავსებულია ფავიკონზე, ის უნდა შედგებოდეს არაუმეტეს 2 ასოსგან. წინააღმდეგ შემთხვევაში, ვერავინ შეძლებს წაიკითხოს ასეთი ტექსტი, რადგან ფავიკონის ზომები ძირითადად 16*16 პიქსელია.

რა ზომისაა ვებსაიტის ხატები?

მოგეხსენებათ, ახლა არის ბრაუზერების, მონიტორების და მოწყობილობების უზარმაზარი მრავალფეროვნება. და მათი მოთხოვნები ფავიკონის ზომებზე განსხვავებულია. გასათვალისწინებელია ზომების შემდეგი ვარიანტები:

• 16*16px - სტანდარტული ფავიკონის ზომები, შესაფერისი ბრაუზერებისა და მოწყობილობების უმეტესობისთვის
• 32*32px - გამოიყენება ზოგიერთ შემთხვევაში Internet Explorerდა Safari
• 57*57px - გამოიყენება ჩვენებისას iPhone
• 72*72px - გამოიყენება ჩვენებისას iPad
• 114*114px - გამოიყენება ბადურის ეკრანებზე ჩვენებისას (57*2=114)
• 144*144px - გამოიყენება ბადურის ეკრანებზე ჩვენებისას iPad (72*2=144)

რა ფორმატის უნდა იყოს ფავიკონები?

ადრე ბრაუზერები იღებდნენ მხოლოდ ფავიკონებს ფორმატში "იკო". ახლა მათ ისწავლეს სხვა ფორმატების გაგება, მათ შორის "png". ჩვენს შემთხვევაში ერთი ქვით მოვკლავთ 2 ჩიტს. ჯერ შევქმნით ფავიკონს ფორმატში "png"და შემდეგ გადააკეთეთ იგი "იკო".

ფავიკონების შექმნის რამდენიმე გზა

დღეს ფავიკონების შექმნის ორი ძირითადი გზა არსებობს:

1. სპეციალური ონლაინ სერვისების საშუალებით
2. შექმენით იგი საკუთარ თავს სპეციალური პროგრამების გამოყენებით, როგორიცაა Photoshop და Adobe Illustrator

თითოეულ მეთოდს აქვს საკუთარი მახასიათებლები. ონლაინ სერვისების საშუალებით ფავიკონის შექმნის უპირატესობა ის არის, რომ ამისათვის არ გჭირდებათ რაიმე განსაკუთრებული უნარები. თქვენ უბრალოდ ატვირთავთ საჭირო სურათს, შეცვლით მას და ჩამოტვირთავთ მზა ფავიკონს. ან უბრალოდ მუშაობთ ტექსტთან და ხატავს ონლაინ სერვისის ინსტრუმენტების გამოყენებით. ზოგადად, ამ მეთოდის მთავარი უპირატესობა მისი სიმარტივეა. თუმცა, მონეტის მეორე მხარე ის არის, რომ ასეთი ვებგვერდის ხატების ხარისხი სასურველს ტოვებს. თქვენ არ მიიღებთ უნიკალურ ფავიკონს იმ მარტივი მიზეზის გამო, რომ ონლაინ სერვისების ხატების გალერეა არ არის უსაზღვრო. ხოლო საკუთარი სურათების გამოყენებისას, სერვისის ხელსაწყოების გამოყენებით, არც ისე ადვილია მაღალი ხარისხის პროდუქტის შექმნა. ონლაინ სერვისის ინსტრუმენტების გამოყენებით ხატის ხელით დახატვის შემთხვევაში, შედეგი არის „რაღაც წარმოუდგენელი“.

ამიტომ, ჩვენ ვირჩევთ მეორე, უფრო რთულ, მაგრამ წარმატებულ გადაწყვეტას. ფავიკონის შესაქმნელად ჩვენ გამოვიყენებთ პროგრამას Photoshop. თუ არ გაქვთ გამოცდილება ამ პროგრამით, მაშინ ეს კარგია. ჩემი ინსტრუქციების მიყოლებით თქვენ მარტივად დაასრულებთ დავალებას.

ფავიკონის შექმნა

როგორც უკვე აღვნიშნე, ფავიკონის შექმნა შესაძლებელია გამოსახულების ან უბრალოდ ასოების გამოყენებით. ჩვენს შემთხვევაში გამოვიყენებ რაიმე სახის სურათს. მაგალითად, წარმოვიდგინოთ, რომ გვაქვს საავტომობილო ვებგვერდი. ამიტომ, ჩვენ უნდა ვიპოვოთ სურათი ავტო ზონიდან. მე გთავაზობთ ჩვენი საიტის ხატის გაკეთებას ბორბლის სახით.

სურათის შერჩევა

სურათების გადაღება შეგიძლიათ ნებისმიერი ადგილიდან. მაგალითად, იმავე გზით Yandex-ის სურათები. მთავარი პირობაა, რომ გამოსახულება იყოს მარტივი, ჩრდილებისა და მოცულობის გარეშე. ეს გამოწვეულია იმით, რომ როდესაც ის 16 პიქსელამდე შემცირდება, მას ბევრი დეტალი არ ექნება. ჭარბი მოცულობისა და ჩრდილების გამო, სურათი შეიძლება ბუნდოვანი გახდეს.

მე ვპოულობ შესაფერის სურათს ძიების გამოყენებით გუგლიმოთხოვნით "ბორბალი". ყველაფერი რაც მე უნდა გავაკეთო არის მისი შენახვა მაუსის მარჯვენა ღილაკით და არჩევით "Save Image As".

შესაბამისი სურათი გუგლის სურათებზე

შემდეგი, ჩვენ ვხსნით ამ სურათს გამოყენებით Photoshop. ძალიან მნიშვნელოვანია, რომ ფავიკონს ჰქონდეს გამჭვირვალე ფონი. ჩვენს შემთხვევაში ეს ასე არ არის. ფონის მოსაშორებლად ვიყენებთ Magic Wand ინსტრუმენტს. მისი მუშაობის არსი ძალიან მარტივია. ამ ხელსაწყოს საშუალებით ჩვენ შეგვიძლია შევარჩიოთ გამოსახულების იმავე ფერის უბნები. ვინაიდან ჩვენი სურათის ფონი აშკარად ეწინააღმდეგება თავად ბორბალს, ამის გაკეთება ძალიან ადვილი იქნება. ერთხელ დაწკაპუნებით ვირჩევთ ერთფეროვან ზონას. კლავიატურის მალსახმობის დაჭერით CTRL + წაშლაჩვენ ამ ზონას ვხსნით.

ჩვენი ბორბლის ფონის მოხსნა

ჩვენ ამას ვაკეთებთ სურათის ფონის ყველა ნაწილით. ამრიგად, ჩვენს სურათზე ბორბალი არის გამჭვირვალე ფონზე, რაც ჩვენ გვჭირდებოდა. ასე რომ, ჩვენი ვებსაიტის ხატის შაბლონი მზად არის.

შექმენით ფავიკონი 2 სხვადასხვა ზომის

მე გთავაზობთ 2 ფავიკონის დამზადებას 64 პიქსელი და 16 პიქს ზომით. ჯერ უნდა შევქმნათ უფრო დიდი ხატულა (64 პიქსელი). ამისათვის ჩვენ ვაჭერთ კლავიატურის მალსახმობს CTRL+N. ფანჯარაში, რომელიც გამოჩნდება, ჩვენ ვირჩევთ სურათის სიმაღლეს და სიგანეს 64 პიქსელზე.

მომავალი ფავიკონის ზომების დაყენება

შემდეგი, ჩვენ უნდა გადავიტანოთ ჩვენი ბორბალი ახლად შექმნილი სურათის არეალში. ამისათვის ჩვენ ვუბრუნდებით სურათს საჭით და ვირჩევთ ხელსაწყოს "გადაადგილება". შემდეგი ნაბიჯი არის ბორბლის სურათზე დაწკაპუნება და მაუსის მარცხენა ღილაკის დაჭერისას გადაიტანეთ იგი ახალი სურათის ზონაში. გადაადგილებისას დარწმუნდით, რომ ბორბლიანი ფენა არჩეულია. წინააღმდეგ შემთხვევაში ტრანსფერი ჩაიშლება.

ბორბლის გადატანა ახალ სურათზე

ბორბლების ახალ სურათზე გადატანის შემდეგ, ჩვენ ვხედავთ, რომ ისინი არ ჯდება. საჭე უნდა შევამციროთ 64 პიქსელამდე. ამისათვის ჩვენ ვაჭერთ ღილაკს SHIFTდა სურათის დიაგონალურ წერტილზე დაწკაპუნებით ვამცირებთ მას. ასე რომ, ჩვენ შევქმენით პირველი ფავიკონი ჩვენი ვებსაიტისთვის. შეგახსენებთ, რომ ჩვენი ზომაა 64*64 პიქსელი. ახლა ჩვენ უბრალოდ უნდა შევინახოთ იგი ჩანართში "Save for Web" ფუნქციის არჩევით. ჩვენ ვირჩევთ ფორმატს PNG-24და საქაღალდე სურათები. ჩვენ ასევე ვუწოდებთ თავად ფავიკონს, მხოლოდ ლათინური ასოებით - "ფავიკონი".

შეინახეთ ფავიკონი

დიდი. ახლა ყველაფერი რაც უნდა გავაკეთოთ არის უფრო პატარა ფავიკონის შექმნა. ამისათვის ვაწკაპუნებთ ჩანართზე „გამოსახულება“ და ვირჩევთ „სურათის ზომა“ ფუნქციას. აქ ჩვენ დავაყენეთ სიგანე და სიმაღლე 16 პიქსელზე. ახლა ყველაფერი რაც უნდა გავაკეთოთ არის ეს სურათი ვებისთვის შენახვა. მას შეგვიძლია ვუწოდოთ „ფავიკონ-2“.

ასე რომ, აქ ვართ, ვქმნით 2 ფავიკონს ჩვენი ვებსაიტისთვის ფორმატში "png". ჩვენ ჯერ შევქმენით ვარიანტი 64 პიქსელის ზომით, რათა შემდეგ ადვილად შევამციროთ იგი 16 პიქსამდე. თუ პირველად შექმნით ოფციას 16 პიქსელით, მაშინ ვერ შეძლებთ მის გაზრდას 64 პიქსელამდე ხარისხის დაკარგვის გარეშე. ამიტომ, გაითვალისწინეთ ეს, რომ არ გააკეთოთ ორმაგი სამუშაო.

ფავიკონის დაყენება საიტზე

ფავიკონის დაყენება ტეგის შიგნით საიტზე ჩვენ ვწერთ:

თუ გვაქვს ფავიკონი ფორმატში " იკო"მაშინ ჩვენ ნაცვლად" png"დაწერე " იკო". Მაგალითად:

როგორც ხედავთ, საიტის ხატულა ნაჩვენებია ისე, როგორც ჩვენ გვინდოდა.

საიტის ხატის კონვერტაცია "ico" ფორმატში

თანამედროვე ბრაუზერებს შეუძლიათ ადვილად ამოიცნონ და აჩვენონ ფავიკონები ფორმატში "png". თუმცა, შეიძლება დაგჭირდეთ მისი კონვერტაცია "იკო". ამ ფორმატის ერთ-ერთი უპირატესობაა ყველა ზომის ფავიკონის ერთ ფაილში შენახვა. დამეთანხმებით, რომ ეს ძალიან მოსახერხებელია. ასე რომ, ჩვენი ხატების კონვერტაციისთვის გამოვიყენებთ მაგარ სერვისს - xiconeditor.com. მასთან მუშაობა ძალიან მარტივია. ყველაფერი ხდება 4 ნაბიჯში:
1. პირველ რიგში, ჩვენ უნდა ავტვირთოთ ჩვენი ფავიკონები. ამისათვის ჩვენ დააჭირეთ ღილაკს "იმპორტი".

ფავიკონების ატვირთვა xiconeditor.com სერვისში

3. სურვილის შემთხვევაში შეგიძლიათ დააჭიროთ ღილაკს "გადახედვა"და ნახეთ, როგორ გამოჩნდება ისინი. ჩამოტვირთეთ ჩვენი ფავიკონები ფორმატში "იკო"ჩვენ დააჭირეთ ღილაკს "ექსპორტი".

ასე რომ, აქ ჩვენ ვისწავლით, თუ როგორ შევქმნათ ფავიკონები "png"და გადაიყვანეთ ისინი ფორმატში "იკო". მე კონკრეტულად არ განვიხილავდი ფოტოშოპში გამოსახულების დეტალურ დამუშავებას, რადგან ბევრისთვის ეს ზედმეტი იქნებოდა. საჭიროების შემთხვევაში, შეგიძლიათ, რა თქმა უნდა, კიდევ უფრო გააუმჯობესოთ ფავიკონის ხარისხი Photoshop-ში პიქსელებთან მუშაობით. შევეცადე გამარტივებული სახით წარმომედგინა ყველა აუცილებელი. და ეს ყველაფერი ჩემთვის. იმედი მაქვს, რომ ეს გაკვეთილი თქვენთვის სასარგებლო იყო. თუ მართალია:

1. განაახლეთ ეს სტატია სოციალურ ქსელებში, რათა მეტმა ადამიანმა ისარგებლოს მისგან;
2. გამოიწერეთ ჩემი ბიულეტენი, რათა არ გამოტოვოთ სასარგებლო და საინტერესო ბლოგის პოსტები.

აქ მე არ გემშვიდობები. გმადლობთ ყურადღებისთვის და გნახავთ შემდეგ პუბლიკაციებში!