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

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

ფავიკონი არის ხატულა, რომელიც ასოცირდება კონკრეტულ ვებსაიტთან ან ვებ გვერდზე. ფავიკონის არსებობა საიტზე საშუალებას იძლევა, როგორც წესი, უფრო ცნობადი გახდეს. ეს განპირობებულია იმით, რომ ამ ვებსაიტს (მის თითოეულ გვერდს) ექნება ხატულა, რომლის დათვალიერებისას მომხმარებელი გაიგებს, რა სახის რესურსია. საიტის ფავიკონის ხატულა შეგიძლიათ ნახოთ ბრაუზერის სხვადასხვა ელემენტებში, როგორიცაა ჩანართები, მისამართების ზოლი, დათვალიერების ისტორია (ლოგი), სანიშნეების ზოლი და ა.შ. გარდა ამისა, ფავიკონის ხატულა ასევე შეგიძლიათ იხილოთ Yandex-ის ძიების შედეგებში, საიტის სახელის გვერდით. . ფავიკონის ხატულა ასევე გამოიყენება iOS (Safari), Android (Chrome), Windows 8 და 10 ოპერაციული სისტემების მთავარ ეკრანზე ბმულის (საიტის გვერდის) განთავსებისას.

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

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

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

მოამზადეთ სურათი ფავიკონისთვის

განვიხილოთ ფავიკონისთვის svg ფორმატში გამოსახულების მომზადების ძირითადი ნაბიჯები.

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

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


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

Favicon გენერაცია ყველა პლატფორმისთვის

ჩვენ შევქმნით ფავიკონის ხატულებს ყველა პლატფორმისთვის (iOS, Android, PC, MAC და ა.შ.) ონლაინ მისამართზე http://realfavicongenerator.net/.


ამისათვის დააწკაპუნეთ ღილაკზე „Select your Favicon picture“ და დიალოგურ ფანჯარაში აირჩიეთ მომზადებული სურათი (door.svg).

ამის შემდეგ, თქვენ უნდა დააყენოთ ფონის ფერები და შეიყვანოთ აპლიკაციის სახელი Android (Chrome) ოპერაციული სისტემისთვის.






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

ამ მოქმედების შემდეგ, realfavicongenerator.net სერვისი გამოიმუშავებს favicon ხატულას და HTML კოდს. ამ ოპერაციის შედეგი გამოჩნდება ეკრანზე.


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

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

ძირითადი ნაბიჯები:


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

ვებსაიტის ფავიკონის შემოწმება

საიტის ფავიკონის შემოწმება ხორციელდება მე-4 პუნქტში მოცემული ბმულის გამოყენებით (შეამოწმეთ თქვენი ფავიკონი). ეს მოქმედება ასევე შეიძლება შესრულდეს მთავარი მენიუს მეშვეობით Favicon -> Favicon checker.

საიტის ფავიკონის ვალიდაციის დასაწყებად აირჩიეთ საიტის პროტოკოლი (http:// ან https://) წარმოდგენილი ფორმით, შეიყვანეთ დომენის სახელი და დააწკაპუნეთ ღილაკზე „შეამოწმეთ Favicon“.


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

Favicon ინდექსირება საძიებო სისტემებით

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

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

  • Yandex - https://favicon.yandex.net/favicon/domain_name
  • Google - https://www.google.com/s2/favicons?domain=domain_name

domain_name-ის ნაცვლად, თქვენ უნდა მიუთითოთ დომენის სახელი (მაგალითად, საიტი).

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

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

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

ეს ყველაფერი ბრაუზერზეა დამოკიდებული. ამისთვის Microsoft Explorerმორგებული ხატის ფორმატი ICO. ჩვენ უკვე შევხვდით ამ ფორმატს, როდესაც კურსორი გავაკეთეთ. სხვა ბრაუზერებისთვის დან გუგლ ქრომიადრე Apple Safariნორმალური მორგება gifან PNG. ფავიკონიშეიძლება იყოს გამჭვირვალე. ამისათვის ის უნდა იყოს შენახული გამჭვირვალეში PNGდა შემდეგ გადაიყვანეთ ფორმატში ICO. ამის გაკეთება შეგიძლიათ კარგ პროგრამაში IcoFX.თუმცა, არსებობს მრავალი მესამე მხარის საიტი favicon-ის გენერირებისთვის და მათგან ყველაზე აშკარაა www.favicon.ru

როგორ დავაყენოთ ფავიკონი საიტზე?

როგორ დავრწმუნდეთ ამაში ფავიკონიიმუშავებს? 4 პირობა უნდა შესრულდეს.

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

HTML-ში ასე გამოიყურება:

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

შექმენით ფავიკონი Photoshop-ში

Შექმნა ფავიკონიძალიან მარტივი. გინდაც იგივე გააკეთო ფავიკონიროგორიცაა Vkontakte ან Odnoklassniki? კარგი ფავიკონითქვენ არ შეგიძლიათ ამის გაკეთება დიდი სურათების შემცირებით ფავიკონების ყველა სახის „გენერატორში“, რომელიც უხვად არის ინტერნეტში. ფავიკონი ძალიან პატარაა. სინამდვილეში, ჩვენ ვართ ერთგვარი პიქსელის ხელოვნება, რომელსაც აქვს თავისი მახასიათებლები. თქვენ არ შეგიძლიათ დაწეროთ წერილი და უბრალოდ შეამციროთ იგი 16 პიქსელი .

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

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

დახაზეთ ფონი

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

აირჩიეთ ინსტრუმენტი მომრგვალებული მართკუთხედის ინსტრუმენტი. პარამეტრების პანელზე აირჩიეთ რეჟიმი, რომელიც საშუალებას მოგცემთ დავხატოთ ვექტორში. პანელის ჩამოსაშლელ მენიუში მონიშნეთ - Snap To Pixels. ეს აუცილებელია იმისთვის, რომ ვექტორული ბილიკები პიქსელებს მიეჯაჭვება და არ მიიპყროს მათ შორის.

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

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

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

რატომ გჭირდებათ Favicon ვებსაიტისთვის?

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

რისი გამოსახვა ჯობია ფავიკონზე?

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

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

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

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

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

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

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

როგორ მივიღოთ ფავიკონი საიტიდან

ყველა ვებმასტერი არ ათავსებს 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. "/" .ltrim($favicon, "/"); ) ) ?>

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

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

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

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

სურათის ლინკს რომც არ მიუთითოთ, iphone მაინც დაეძებს ფაილს, სახელწოდებით apple-touch-icon.png, საიტის root საქაღალდეში და თუ იპოვის, გადაიღებს მისგან სურათს. , დაამორგვალეთ იგი კუთხეებში და მასზე ავტომატურად გაბრწყინდება თავისით. ამის თავიდან ასაცილებლად, apple-touch-icon.png-ის ნაცვლად, უნდა დაწეროთ apple-touch-icon-precomposed.png iPhone-ების და წერტილების მფლობელებს, რადგან. მათთვის ჩვენ ვაკეთებთ მშვენიერ ხატს 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 - (ინგლისური FAVorites ICON-დან თარგმანში "ხატი რჩეულებისთვის") - 16x16px ან 32x32px ვებგვერდის ხატულა, რომელიც ნაჩვენებია ბრაუზერის მიერ მისამართების ზოლში ან შენახული სანიშნეს გვერდით. ტრადიციულად, ხატის სახელი და გაფართოება არის favicon.ico.

ჩვენს სერვისს შეუძლია გადაიყვანოს თქვენი არჩეული სურათი (175 კბ-მდე ზომით) ვებსაიტის ხატად (16x16px ან 32x32px ზომით). გენერირების შემდეგ, თქვენ მხოლოდ უნდა ატვირთოთ favicon.ico სასურველი საიტის ჰოსტინგის დირექტორიაში.

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

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

საიდან გადმოვწერო ფავიკონი, რომ ონლაინ იყოს?

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

რატომ მიუთითეთ გზა Favicon-მდე?

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

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

ზოგადად, ყველა საიტს უნდა ჰქონდეს ეს პატარა სურათი.

როგორ შევქმნათ favicon.ico ვებსაიტისთვის

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

ფავიკონიარის გამოსახულება ICO, JPEG, PNG, BMP და GIF ფორმატებში, რომელსაც შეიძლება ჰქონდეს განსხვავებული ზომები, დაწყებული 16x16 პიქსელიდან. ზუსტად ამ ზომის ხატი უნდა აიტვირთოს საიტზე Yandex რობოტის მიერ ინდექსაციისთვის.

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

თუ არსებობს რამდენიმე სხვადასხვა ზომის ფავიკონი, 16x16 px გამოსახულებისკენ მიმავალი გზა ჯერ უნდა განთავსდეს გვერდის კოდში, რადგან Yandex favicon რობოტი კითხულობს მხოლოდ პირველ მისამართს.

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

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

სერვისები ონლაინ favicon გენერატორი - favicon შექმნა ონლაინ

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

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

მარტივი favicon გენერატორები

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

www.favicongenerator.com - ალბათ ყველაზე მინიმალისტური სერვისი. მეტი არაფერი - აირჩიეთ სურათი, დააჭირეთ ღილაკს „გენერირება Favicon! ”და ჩამოტვირთეთ შექმნილი ხატი.

tools.dynamicdrive.com/favicon- მარტივი და გასაგები სერვისი, სადაც შეგიძლიათ გააკეთოთ ფავიკონი სამ ზომებში. მიღებული ფაილების ჩამოსატვირთად, თქვენ უნდა დააჭიროთ ღილაკს "ჩამოტვირთეთ FavIcon" მათ ქვეშ.

www.cy-pr.com/tools/favicon და www.favicon.co.uk წინა სერვისების მსგავსია. პირველში შეგიძლიათ გააკეთოთ ფავიკონის ზომა 16x16 და 32x32, ხოლო მეორეში დამატებით 48x48 და 64x64.

www.genfavicon.com - ხატის შექმნის მთელი პროცესი მოიცავს სამ ნაბიჯს:

  1. აირჩიეთ ფაილი (JPEG, GIF, PNG) კომპიუტერზე ან უბრალოდ შეიყვანეთ სურათის URL და დააწკაპუნეთ “ Სურათის ატვირთვა“;
  2. აირჩიეთ ზომა (16×16, 32×32, 48×48, 64×64 ან 128×128) და გამოსახულების სასურველი არე, თუ ჩვენ გვინდა გამოვამუშაოთ სურათის მხოლოდ ნაწილი დაწკაპუნებით „ გადაღება და გამოსახულება“;
  3. ჩვენ ვუყურებთ შედეგს და, თუ ყველაფერი შეესაბამება, ჩამოტვირთეთ ფაილი.

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

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

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

www.favicon.com.mx არის წინა სერვისის სრულიად იდენტური სერვისი, მხოლოდ ინგლისურ ენაზე.

სად უნდა გააკეთოთ ფავიკონი ნულიდან - ონლაინ ფავიკონის რედაქტორები

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

favicon-generator.org - აქ, გარდა კონვერტორისა, არის ხატის რედაქტორიც. გარდა ამისა, თქვენ შეგიძლიათ ატვირთოთ შექმნილი ფავიკონი საჯარო გალერეაში, სადაც საიტის სხვა მომხმარებლებს შეუძლიათ მისი ჩამოტვირთვა თავისუფლად.

favicon.ru არის პოპულარული რუსული ონლაინ გენერატორი, სადაც შეგიძლიათ შექმნათ ფავიკონები სურათებიდან და დახატოთ ისინი. ასევე შეგიძლიათ შეუკვეთოთ ფავიკონის შექმნა სპეციალისტების მიერ 20 დოლარად. მაინტერესებს ვინმე ხომ არ შეუკვეთავს იქ?

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

შეგიძლიათ ნახოთ ანიმაციური ფავიკონი და გადმოწეროთ გადახედვის ფანჯარაში.

www.degraeve.com/favicon - სხვა ონლაინ favicon გენერატორი. ეს რედაქტორი, ისევე როგორც წინა, საშუალებას გაძლევთ გახადოთ ხატის ფონი გამჭვირვალე.

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

და მაინც, მე შევინახე სხვა ონლაინ ხატების გენერატორი საიტისთვის მოგვიანებით. ეს სერვისი იმსახურებს ცალკე პოსტს, სადაც გეტყვით როგორ გააკეთოთ ფავიკონი iPhone, iPod Touch და iPad ბრაუზერებისთვის და ისაუბროთ საიტზე ანიმაციური ხატების დაყენებაზე. გარდა ამისა, გაგაცნობთ Favicon Validator სერვისს, სადაც შეგიძლიათ შეამოწმოთ და ნახოთ ყველა favicon.ico ხატულა, თუ ეს ფაილი შეიცავს ერთზე მეტ სურათს.. ნახვამდის ყველას!