How to make a favicon Как сделать Избранное

Posted on April 10, 2008 at 5:10 am Опубликованный на 10 апреля 2008 года в 5:10 утра

Looking for a way to create a FavIcon ? Ищете способ создать FavIcon? If you browse the web regularly, you’ve probably noticed that a lot of sites have a small icon that appears in front of the website address in your browser or bookmarks. Если при просмотре веб-регулярно, Вы, вероятно, заметили, что многие сайты имеют небольшой значок, который появляется в глазах адрес веб-сайта в браузере или закладки. Many websites use favicons (aka Favorite Icon) as a way to brand their website, so that when you see that icon, you automatically know which company or product it represents. Многие веб-сайты используют значки (ака Любимый иконы), как способ бренд своего веб-сайта, так что, когда вы увидите, что значок, вы автоматически знаете, какая компания или продукт он представляет.

For example, take a look at your address bar right now and you’ll notice that to the left of URL is a small icon that looks like a grid: Например, взгляните на адресную строку, прямо сейчас, и вы заметите, что в левой части URL является небольшой значок, похожий на сетке:

Also, if I look at my Firefox Bookmarks or IE Favorites, I also see the same favicons next to any websites that are using them: Кроме того, если бы я посмотреть на моем Firefox закладки или избранного IE, я также видеть те же значки рядом с любым веб-сайтам, которые используют их:

Using a FavIcon for your site is a good practice as it helps visitors to quickly identify your site among large numbers of bookmarks, etc. So how do you go about creating a FavIcon for your site? Использование FavIcon для Вашего сайта является хорошей практикой, поскольку это позволяет посетителям быстро найти свой сайт среди большого числа закладок и т.д. Так как же вы идете по поводу создания FavIcon для своего сайта?

How to make a FavIcon Как сделать FavIcon

The first step in creating a FavIcon is to actually find a picture or create a graphic that you want to use as your icon. Первым шагом в создании FavIcon заключается в том, чтобы действительно найти фотографию или создать графическое изображение, которые вы хотите использовать в качестве значка. A FavIcon always has a 16×16 pixel dimension, so you should be very careful when choosing or creating your own picture. А FavIcon всегда имеет 16 × 16 пикселей аспект, так что вы должны быть очень внимательны при выборе или создании собственной картины.

Try to find an icon or graphic that has very little going on with it in terms of design. Попробуйте найти значок или рисунок, что очень мало происходит с его точки зрения дизайна. The simpler graphic you can find, the better your FavIcon will turn out. В простых графических вы найдете, тем лучше будет FavIcon смену. Also, make sure that the graphic is a square, so basically where the length and width are equal. Кроме того, убедитесь в том, что рисунок является квадрат, так что в основном, когда длина и ширина равны. If you have a portrait or landscape picture, it will be resized to 16×16 and therefore become either stretched or squished. Если у вас есть портрет или пейзаж картины, он будет изменен до 16 × 16, и поэтому становятся либо напряжены или squished.

You can also create your own image using Microsoft Paint or similar photo editing software. Вы также можете создавать свои собственные изображения с использованием Microsoft Paint или аналогичные изменения фотографий. When you are done, make sure you save the file into GIF, JPG, PNG, or BMP format. Когда вы закончите, не забудьте сохранить файл в GIF, JPG, PNG или BMP формате.

Now that you have your image, go to Теперь, когда у вас уже есть образ, к DynamicDrive DynamicDrive and let’s use their FavIcon generator to create our FavIcon from the picture. , и будем использовать их FavIcon генератор для создания нашей FavIcon от картины.

Go ahead and browse to the location of your image file and then choose Create Icon . Идем дальше и просматривать сведения о местонахождении вашего графического файла, а затем выберите Создать Икона.

And really that’s it! И действительно, что-то! You’ll now get a preview of how your FavIcon would look in an actual browser and you can either proceed to download the FavIcon or you can simply choose another image. Вы сейчас получите возможность просмотреть, как ваши FavIcon будет выглядеть в реальной браузера, и вы можете приступить к скачать FavIcon или вы можете просто выбрать другой образ.

What I like about this site is that it also gives you instructions on how to install a FavIcon to your website, which is a little bit harder than actually creating the FavIcon itself. То, что я хотел по поводу этого сайта заключается в том, что она также дает инструкции по установке FavIcon на свой веб-сайт, который немного сложнее, чем на самом деле создания FavIcon себя. Here’s what you need to do: Вот что вам нужно сделать:

First, download the file and then upload the FavIcon, which by the way should be named “ FavIcon.ico ” to the ROOT directory of your site. Во-первых, загрузить файл, а затем загрузить FavIcon, который кстати должен называться "FavIcon.ico" к ROOT каталоге вашего сайта. It’s very important that the file be named favicon.ico and that it be located in the root directory on your web server. Это очень важно, что этот файл будет называться favicon.ico, и что он должен находиться в корневом каталоге на вашем веб-сервере. You can verify that you uploaded it correctly by typing Вы можете убедиться в том, что вы загрузили это правильно, введя

http://mysite.com/favicon.ico http://mysite.com/favicon.ico

in the browser’s location, where “mysite.com” is your web site’s Internet address. в окне браузера место, где "mysite.com" является веб-сайт в Интернете по адресу. Now you need to insert one line of code into the <HEAD> section of your web sites pages. Теперь нужно вставить одну строку кода в <HEAD> разделе веб-сайтов страниц. Note that this code has to be on every page that you want the FavIcon to appear for. Заметим, что этот код должен быть на каждой странице, что вы хотите, чтобы FavIcon явки в. This is easy if you have a site that uses templates and pulls in header, footer, and other files individually. Это удобно, если у вас есть сайт, который использует шаблоны и тянет в заголовок, колонтитул, и других файлов по отдельности.

If all of your pages are static and you do not use templates or includes, you’ll have to manually edit the HTML in each page. Если все Ваши страницы статический, и вы не можете использовать шаблоны и включает в себя, вам придется вручную редактировать HTML в каждой странице. The line of code you’re going to want to add is as follows: В строке кода, который вы собираетесь хочу добавить, заключается в следующем:

<link rel=”shortcut icon” href=”/favicon.ico”> <link rel="shortcut icon" href="/favicon.ico">

The icon may not show up immediately, so be patient. Икона не может появиться сразу, так что будьте терпеливы. Also, sometimes it doesn’t appear at all, especially with IE as there is a browser bug. Кроме того, иногда она не появляется вообще, в особенности в IE, как есть браузер ошибка.

Hopefully with this short tutorial you have been able to create a FavIcon and get it up and working on your site. Надеемся, в этот короткий урок вам удалось создать FavIcon и получить его, и работает на Вашем сайте. If you have any questions, feel free to post a comment! Если у Вас есть какие-либо вопросы, не стесняйтесь комментировать! Enjoy! Наслаждайтесь!

If you enjoyed this post, make sure you Если вам понравилась эта должность, убедитесь, что вы subscribe to my RSS feed подписаться на мой канал ! !

» Filed Under »В соответствии с поданной Computer Tips Компьютерные Советы