Una parte integral de los sitios web modernos es el ícono FAVICON, que le permite identificar rápidamente uno u otro recurso en la lista de pestañas del navegador. También es difícil enviar un programa de computadora sin su propia etiqueta única. Al mismo tiempo, los sitios y el software en este caso combinan un artículo no obvio, ambos usan los iconos en formato ICO.
Estas pequeñas imágenes se pueden crear como un programa especial, por lo que con la ayuda de los servicios en línea. Por cierto, es el último para tales fines que son una popularidad mucho mayor, y consideraremos una serie de recursos de este tipo en este artículo.
Sin embargo, trabajar con gráficos no es la categoría más popular de servicios web, en términos de generar iconos, definitivamente hay que elegir. Según el principio de operación, tales recursos se pueden dividir en aquellos en los que usted mismo dibuja una imagen, y los sitios que le permiten convertir una imagen ya lista en ICO. Pero en su mayoría todos los iconos generadores ofrecen ambos.
Método 1: Editor de Icono X
Este servicio es la solución más funcional para crear una imagen de ICO. La aplicación web le permite dibujar el icono en detalle manualmente o aprovechar la imagen terminada. La principal ventaja de la herramienta es la capacidad de exportar una imagen con una resolución de hasta 64 × 64.
Por lo tanto, si necesita crear un conjunto completo de iconos de tamaño simple dimensional, nada es mejor que el editor de X-Icon para estos fines que no encuentra.
Método 2: FAVICON.RU
Si es necesario, para generar el icono FAVICON con una resolución de 16 × 16 para un sitio web, una excelente herramienta también puede servir como un servicio en línea de idioma ruso favicon.ru. Como en el caso de la solución anterior, aquí puede dibujar el ícono independientemente, pintando cada píxel por separado y cree favicon de la imagen terminada.
Como resultado, un archivo de extensión de ICO que representa una imagen de 16 × 16 píxeles se guarda en su PC. El servicio es perfecto para aquellos que solo necesitan convertir la imagen en un pequeño icono. Sin embargo, y para mostrar la fantasía en favicon.ru no está en absoluto prohibido.
Método 3: FAVICON.CC
Similar a la anterior como el nombre y en el principio de operación, pero incluso un icono de generador más avanzado. Además de crear imágenes convencionales de 16 × 16, el servicio facilita el dibujante de un favicon.ico animado para su sitio. Además, el recurso contiene miles de iconos personalizados disponibles para descarga gratuita.
Si la interfaz de habla inglesa no te molesta, entonces no hay absolutamente ningún argumento a favor del trabajo con el servicio anterior. Además del hecho de que FAVICON.CC puede generar iconos animados, el recurso también reconoce correctamente la transparencia en las imágenes importadas, que es un análogo de habla rusa, desafortunadamente, privada.
Método 4: FAVICON.BY
Otra opción del generador de iconos FAVICON para sitios. Es posible crear iconos desde cero o basado en una imagen específica. De las diferencias, es posible resaltar la función de importar imágenes de los recursos web de terceros y una interfaz concisa bastante elegante.
En general, sin embargo, no hay diferencias en el trabajo con los servicios que ya se consideran en este artículo, sin embargo, con la conversión de imágenes en la OIC, la favicon. El recurso se va a mejorar significativamente, y es bastante fácil de notar.
Método 5: Convertir en línea
Es probable que ya conozca este sitio como un convertidor de archivos en línea casi omnívoros. Pero no todos saben que esta es una de las mejores herramientas para convertir las imágenes en ICO. A la salida, puede recibir iconos con una resolución de hasta 256 × 256 píxeles.
Como puede ver, cree un icono de ICO usando el sitio con convertencia en línea es completamente simple, y se realiza literalmente para un par de clics del mouse.
Los editores en línea de los iconos, muchos no se perciben en serio, pero de hecho, tales herramientas facilitan enormemente el flujo de trabajo. El total de los clics de pareja puede ahorrarle las horas de búsqueda, las vistas o el autodesarrollo. Además, no tiene sentido usarlo completo cuando hay servicios especiales con funciones afiladas para estas tareas específicas.
Los editores de sitios similares los iconos son muy efectivos. Te permiten:
- crear fácilmente y rápidamente crear nuevos materiales;
- poseer la finalización existente en el sitio;
- guarde el resultado en diferentes formatos (SVG, ICO y PNG);
- crear iconos para.
En el artículo, recogimos los cinco mejores íconos de editores gratuitos en línea y para que la comparación intentó crear un conjunto en cada uno de ellos.
Iconsflow.
Iconsflow.com - Vector Icons + Editor le permite crear conjuntos personalizados y exportarlos de buena calidad (SVG, ICO y PNG). La principal ventaja del servicio es la presencia de dos editores:
- el principal en el que se seleccionan la paleta, estilo, efectos;
- el editor del formulario donde puede cambiar el formulario actual o dibujar uno nuevo.
Si ya ha creado iconos en Illustrator, simplemente descargue los archivos SVG y el experimento con diferentes fondos. En los iconos, hay ciertas restricciones con uso gratuito, así que asegúrese de que se haya familiarizado antes del inicio. Para los usuarios novatos, hay lecciones y sección de ayuda, además, es posible trabajar en el editor de los iconos en ruso.
Editor de vectores Iconsflow:
Ejemplos de trabajo:
FRACIONES
Con FLATICONS.NET, puede crear su propio icono plano (en un estilo plano) basado en patrones listosizados. Establezca las dimensiones, elija el dibujo y el fondo principal (círculos, anillos, rectángulos), cambie el color. Este editor del icono es gratuito, pero tiene dos inconvenientes:
- Primero, puede descargar archivos solo en formato PNG.
- En segundo lugar, tendrá que crear cada objeto por separado, porque Es imposible desarrollar un conjunto completo inmediatamente.
A pesar del hecho de que el pico de popularidad ya ha pasado, muchos los usan en sus diseños. Como ejemplo, los desarrolladores le permiten descargar un conjunto gratuito de iconos planos sociales. Resultado del trabajo en el editor de Flashones:
Generador de iconos de launcher.
El Proyecto Generador del icono de launcher es gratuito y, como creemos, es más adecuado para usuarios avanzados. Este editor de iconos en línea le permite cargar imágenes / imágenes y agregar texto. Puede descargar un icono a la vez en 5 tamaños (48 x 48; 72 x 72; 96 x 96; 144 x 144; 192 x 192).
Como clip básico, se utiliza un conjunto de gráficos en el estilo de diseño de material de GitHub. El servicio contiene tales configuraciones como: antigas, formas, color o fondo de transparencia, escalado + efectos adicionales. Resultado:
El generador de iconos de material de Android es otra herramienta para crear iconos planos. El servicio del servicio es definitivamente el efecto en forma de una larga sombra. Si necesita tales soluciones, este editor de iconos será la opción perfecta.
Comience por seleccionar una imagen de la galería, luego determine el color, la forma del fondo posterior (círculo o cuadrado), la longitud de la sombra, la saturación, la atenuación, y su icono está listo. Todo es extremadamente simple. Para uso personal, el sitio es completamente gratuito.
Después de descargar en el archivo, encontrará 6 tamaños diferentes PNG y un archivo SVG vectorial. En Illustrator, el icono SVG será borroso, pero afortunadamente, se ve bien en el navegador. Como resultado, resulta algo como:
Simunity Site es un generador base HTML5, donde puede crear un icono y luego copiar el código para mostrarlo en sus proyectos web. Los materiales de origen utilizan los iconos increíbles de fuente para los cuales se seleccionan diferentes parámetros: color, marco, tamaño y estilo de sombras.
Este servicio es útil si necesita crear rápidamente iconos simples originales para el sitio. Resultado de la aplicación Simunity:
TOTAL. Los editores en línea de los iconos considerados anteriormente son excelentes herramientas para optimizar a los diseñadores. No tiene sentido descargar algunos programas cuando todo se pueda hacer fácil y rápidamente en la red. De esta selección, quizás pueda seleccionar el flujo de iconos. Contiene la cantidad más grande de funciones: Iconos de la galería, Cargando SVG, código para incrusta, vista previa, creación de sus propios plantillas, exportación PNG, ICO y SVG, adaptación de tamaño, estilos de moda y editor de vectores incorporado. Además, este es el único editor gratuito de los iconos en ruso, si es importante para usted.
Si conoce algún otro servicio similar, envíe opciones en los comentarios.
Nueva lección en el estilo del taller y esta vez comprenderemos los secretos del favicon. FAVICON. - Icono pequeño, que se muestra en marcadores y cadena de navegadores. Si tiene su propio sitio web y desea que seas diferentes de los demás, incluso en cosas pequeñas, fAVICON. Somos necesarios. Es más rentable, por supuesto, se ve entre los marcadores, en el contexto de una lista desvanecida de direcciones sin ninguna identificación gráfica. Sin embargo, nuestra lección no es tanto sobre cómo adjuntar favicon a la cadena del navegador, cuánto acerca de cómo, cómo hacer su propio favicon en el programa Photoshop.
¿Qué formato para salvar favicon?
Todo depende del navegador. Para Microsoft Explorer. Iconos de formato. ICO.. Con este formato, ya nos enfrentamos cuando hicieron el cursor. Para otros navegadores de Google Chrome. antes de Apple Safari. Traje ordinario Gif. o PNG.. FAVICON. Puede ser translúcido. Para hacer esto, debe mantenerse en translúcido. PNG.y luego convertir a formato ICO.. Puedes hacerlo en un buen programa. ICOFX.Sin embargo, para la generación de FAVICON, hay una masa de sitios de terceros y los más obvios de su www.favicon.ru
¿Cómo poner favicon en el sitio?
Cómo estar seguro de que fAVICON. ¿trabajará? Necesitas cumplir con 4 condiciones.
- Faila debe ser llamada - fAVICON..
- Tamaño favicon 16 sobre el 16 px.
- El lugar óptimo para el favicon es la carpeta raíz del sitio.
- Iconos de dirección para registrarse en las etiquetas meta. heder-a. En el índice del sitio.
En la expresión de HTML se ve así:
Puede crear varios iconos para diferentes navegadores, por ejemplo, uno en el formato ICO., y el otro en PNG. Y todo esto indica a través de la etiqueta. eNLACE. . Los navegadores modernos más a menudo buscados en la raíz de la falla llamados fAVICON.Sin embargo, para la confianza, no le dolerá a especificar y enlaces precisos.
Crea Favicon en Photoshop
Crear fAVICON. muy simple. quieres hacer lo mismo fAVICON.como vkontakte o compañeros de clase? Bien fAVICON. No debe hacer, lo que reduce imágenes grandes en todo tipo de "generadores" de Favonov, que están llenos de su totalidad en Internet. Favon es muy pequeño. De hecho, somos amables arte de pixel.Quien tiene sus propias características. No se puede escribir la letra y simplemente reducirla a 16px .
Como fAVICON. Las cocheras se borrarán, ya que los bordes de la letra al cambiar el tamaño será en unos pocos píxeles. Será amable anti-alias., que suele ser bueno, pero en el caso de Pixel-Art, tales transiciones no son necesarias. Por otro lado, vale la pena evitar y los "alentadores" excesivos en las rondas, de lo contrario, obtendrán HI GIFKI 1999.
Crea un tamaño de archivo 16 H. 16px . Crearemos un translúcido muy simple. fAVICON. Con la letra, con una herramienta de profundidad. La profundidad se creará debido a la sombra y gradiente.
Dibujar fondo
¿Por qué en el protector de pantalla de esta lección ves un enorme suave y lamido? fAVICON.? Porque lo incrementé para un protector de pantalla a la lección. ¿Cómo mejoré ampliar la imagen? 16px? Muy simple, siempre trabajo en el vector si es posible usarlo y si esto tiene sentido. Y el vector transfiere fácilmente cualquier transformación y no pierda como.
Seleccione una herramienta Herramienta de rectángulo redondeado. En el panel Configuración, seleccione el modo, lo que permitirá dibujar en el vector. En el menú desplegable del panel de garrapatas - A presión a los píxeles. Esto es necesario para que los contornos vectores se vinculen a los píxeles y no se dibujen "entre".
Tenemos una superficie favica, y los bordes translúcidos crearán una suavidad de redondez. Ahora es el momento de deshacerse del fondo de la espalda blanca, no es necesario. Desconecta su visibilidad. O haga un doble clic en la capa, girándola en una capa regular y luego retírela.
Un elemento muy importante del diseño del blog es Favon, una imagen pequeña (16x16 píxeles). Pequeños tamaños, pero un gran efecto! Este artículo está dedicado a cómo crear FAVON.ICO para el sitio en línea, con la ayuda de servicios especiales. Leerá más detalles con el hecho de que es el icono de Favon, para el cual se usa, qué tipo de funciones tienen, cómo agregarla al blog y crear en línea. También aprenderás donde descarga la colección de FAVICON ICO para el sitio..
En general, el POST es muy informativo e interesante, le aconsejo encarecidamente que se familiarice con él, nadie no tiene Favonki.
Primero, veamos más con más detalle lo que es Favon y para el que se usa.
Favicon es una reducción de dos palabras (Ing. Icono de favoritos), que se traduce como un ícono (imagen muy pequeña) para "Favoritos". Favoritos - Llamados marcadores en el navegador de Internet Explorer. Apariencia Favicon es de aproximadamente esto:
Hacer un fijador para el sitio se ha vuelto muy simple, por lo que esta mini popularidad adquirida adquirida. Además, puede descargar el icono Listo de la ICO FAVICON para el sitio, que solo se agregará. Al elegir desde la galería, puede decorar su sitio y admirarlo en el navegador (aquí se ve esta imagen de Mini-Chromium):
Por lo tanto, FAVICON es una imagen pequeña de tamaño 16 × 16 px, con una extensión.ico (expansión de los iconos). Porque El icono ha ganado una amplia popularidad, es prácticamente todos los sitios, y esta es otra razón para crear un favy para el sitio en línea. No importa qué tipo de alojamiento utilice, en qué motor funciona su blog, en ningún caso, puede crear en modo en línea, y luego instalar FAVICON o descargar el sitio de fijación terminado para el sitio. Gracias a los modernos generadores de iconos, su creación no toma mucho tiempo, uno o dos minutos, y todo está listo.
¿Todavía no tienes favonki? ¡Vuelo pronto!
Por lo que se usa esta mini-foto. Primero, Favon para el sitio es como un logotipo para una empresa comercial, esta es una forma de destacar de la masa total. Los visitantes reconocerán su sitio mirando la imagen FAVICON. En segundo lugar, Yandex también utiliza las imágenes de Favon, lo muestra junto a los resultados de la emisión, lo que permite que los sitios con Favicon se vean mejor en el fondo de otros. Esto significa que los usuarios irán más a menudo a su sitio, porque el icono los "atraerá". En otras palabras, esta mini imagen lo ayudará. Así es como se ve todo:
Bueno, ¿ahora quieres saber cómo hacer favicon? Siga leyendo y puede elegir FAVICON para su sitio de numerosas colecciones.
Por cierto, el motor de búsqueda YANDEX incluso tiene un robot especial que indexa estos iconos y los carga en la base de datos del motor de búsqueda. Después de crear un FAVON e instalarlo en el sitio, Yandex después de un tiempo (generalmente no más de un mes) se indexa y comienza a mostrar en los resultados de la emisión. Puede verificar en cualquier momento si su MINI-LOGO ya está en la base de motores de búsqueda. Esto se puede hacer con una de las 3 formas:
- Marque su sitio en la ventana de búsqueda de Yandex, y verá si hay favicon junto a él.
- Marque el enlace http://favicon.yandex.net/favicon/ en el navegador sitio.ru.Donde reemplace el sitio.ru a su sitio. Si el FAVA está indexado, puedes verlo.
- Ve al panel de Yandex.Vebmaster, también hay un Favon.
Y ahora vamos a descubrir dónde puede descargar la estación para el sitio.
2. Generadores en línea y colecciones FAVICON.
Ahora sabemos lo que es Favon, y por qué necesita un sitio. Recordamos que su tamaño en los píxeles debe ser estrictamente igual a 16 a 16, y la extensión es solamente. Ahora aprendemos cómo hacer un mini:
- Descargar ya prepara Fava de la galería.
- Cúbralo usando un generador FAVON.
- Hacer de la imagen terminada (de nuevo usando el generador FAVICON)
2.1 Colecciones y galerías Favon.
- http://www.thefavicongallery.com/ - Aunque una pequeña colección, pero útil. Aquí encontrarás iconos en una variedad de temas. Hay alrededor de 300 de ellos unas 300 piezas. Para descargar el FAVICON ICO favorito para el sitio, presiónelo con el botón derecho del mouse y guárdelo en su computadora.
- http://www.iconj.com/favicon-gallery-page1.html - Otra colección FAVICON para un sitio que contiene más de 3 mil mini-imágenes. Puedes guardar tu favorito en dos formatos (ICO o GIF). Pero también hay una desventaja: solo puede ver solo 30 iconos para ver lo siguiente, debe ir a una nueva página.
- http://www.favicon.cc/?action\u003dicon_list&order_by_rating\u003d1 - Gracias a esta galería, no tiene que crear Favon usted mismo en línea. Simplemente seleccione y descargue la imagen que desea. Una vez más, a la vez puede ver 20 Favon, que ralentiza el proceso de elección.
- http://www.favicon.co.uk/gallery.php: este sitio permite no solo hacer un favorito para el sitio, sino que también descargue las opciones preparadas. A la vez, puede picotear más de 144 iconos, lo que es mucho más conveniente que en las dos opciones anteriores. Favi para una variedad de temas.
- http://favicon-generator.org/gallery/ - Aunque la pequeña, pero útil colección de 84 piezas de favonok. ¡Elige a cualquiera!
2.2 Cómo hacer favon para el sitio desde cero
Por supuesto, puede descargarlo para su sitio y listo para FAVA, pero mucho mejor: haga sus propias manos. En este caso, los llamados generadores FAVICON (generadores FAV) nos ayudarán, lo que le permite crear hermosas mini-imágenes en línea.
2.2.1 Logaster.RU.
Inicia nuestra lista en línea Favonok Generator
La principal ventaja del servicio es que no tiene que dibujar un phawacon ni la convertirla del logotipo.
Todo lo que necesita hacer es ingresar al nombre del sitio o la empresa y elegir el tema.
Después de eso, el servicio creará diseños de favicon confeccionados. Elige el icono deseado, la fuente, el color.
Es muy conveniente para aquellos que no pueden dibujar y trabajar con programas gráficos.
Descargue archivos FAVICON en formatos ICO o PNG.
En más detalle, cómo crear un favy con un logoter se puede leer
Además de Favicon, el servicio también crea logotipos, tarjetas de visita, sobres y espacios en blanco.
2.2.2 FAVICON.CC - FAVONOK Generator
Este simple alternador es uno de los usados \u200b\u200bmás fáciles y populares para crear FAVICON en línea para el sitio. Podrás dibujar todos los píxeles del futuro FAVA (son 256 de todos). Ir al sitio, estará disponible la ventana de trabajo en la que pueda experimentar.
Azul en la captura de pantalla de arriba muestra el espacio de trabajo: aquí creará directamente un favy para el sitio. Baja a continuación, puede ver cómo se ve la FAVA en la escala original (resaltado en negro).
Trabajar con este generador es tan simple que es poco probable que tenga preguntas sobre cómo hacer FAVICON ICO para el sitio. En general, en este sitio puede crear colecciones completas de FAVICON ONLINE, y luego, por ejemplo, venderlos.
Cada cuadrado en el espacio de trabajo es un píxel. Debes pintarlo en el color deseado. Puede elegir el color en la paleta ubicada a la derecha del espacio de trabajo. Puede pintar el píxel presionando la tecla izquierda y borre el pintado a la derecha.
La imagen se puede mover y mover a lo largo del área de trabajo, para la cual usar el artículo moverse..
Para descargar el Favon resultante, que hizo para el sitio, haga clic en el enlace Descargar Favicon (resaltado en rojo).
2.2.3. Amichurin.appspot.com
Otro generador hermoso favicon, en el que en modo en línea puede crear una imagen hermosa. Todo el generador en ruso, pero su funcionalidad será más fácil que en el caso anterior. Por cierto, las firmas hechas por los Bordeee no son mías.
Por desgracia, pero no encontré en esta colección FAVICON FAVICON, que se podría descargar para el sitio, así que solo lo use como un generador.
2.2.4 favicon-generator.org generador
Muy buen generador de favonok. Es muy similar a la segunda opción, pero un poco inferior a él. En general, como ya ha notado, el principio de operación en todos estos sitios es el mismo. Por lo tanto, los problemas con ellos no deben surgir. Elige y trabaja con el que te gustó.
2.3 FAVICON DE LA IMAGEN TERMINADA
Si no desea crear un fijador usando generadores en línea desde cero, y la galería y la colección FAVICON ICO para el sitio no son adecuadas para usted, intente hacer una imagen mini desde la imagen terminada. Incluso puedes usar tu foto. Estas imágenes también se crean en modo en línea utilizando generadores de favicones especiales.
Prepare una imagen que quiera tomar como base.
2.3.1 Servicio FAVICON.RU.
Uno de los servicios más populares que ayudan a hacer un FAVY para el sitio (por cierto, el sitio de habla rusa). Sencillo y fácil de usar, ayuda a hacer un mini-logo de la imagen terminada.
Agregar imagen o foto (base) Puede:
- Haga clic en el botón" elija el archivo"Y descarga la foto deseada.
- Ingrese la imagen URL en el campo Blanco (haga esto si el archivo está almacenado no en su computadora, sino en Internet).
Después de agregar la imagen, haga clic en " CrearfAVICON.¡ICO! " Y espere un poco, el generador da forma al icono. Después de eso, descargue la imagen a su computadora. Por cierto, además del generador en este sitio, hay una gran colección de FAVICON ICO para su sitio.
2.3.2 Servicio FAVICON.CC.
Generador similar, pero con una funcionalidad más poderosa. Para crear una fama de la imagen terminada, primero vaya a la pestaña "Importar imagen".
Ahora haga clic en "Seleccionar archivo" y agregue un archivo de descarga. Sobre su base y será creado por FAVICON ICO para su sitio. Por cierto, es posible que necesite una función de estirar la imagen:
- Mantenga las dimensiones, con una disminución en la relación de aspecto de la imagen, seguirá siendo la misma
- Encoger al icono cuadrado: los lados de la imagen se mostrarán al tipo cuadrado (la imagen puede estar distorsionada).
Al descargar el archivo, podrá editarlo en modo en línea con este generador FAVICON. Cuando se organizará el resultado resultante, descargue FAVA a su computadora.
3. Cómo agregar favicon a WordPress Blog
Con dónde descargar el FAVICON terminado para el sitio o cómo hacer el suyo, pensamos. Ahora vamos a discutir cómo agregar un FAVA al blog de WordPress.
Como regla general, Favicon se encuentra en la raíz del sitio (en la carpeta raíz), la navegaremos. Si su FAVA no está en la raíz, solo transflozca allí.
FAVICON.ICO se agrega en dos pasos.
PASO UNO
En primer lugar, debe encontrar en su tema ese código de línea que sea responsable de la retirada del favicon. Abierto para editar el archivo de encabezado (encabezado) y encontrar una ubicación (o similar):
Si no hay nada similar y que contiene la palabra favicon.ico, luego agregue estas dos líneas en algún lugar entre las etiquetas
y.Segundo paso
Ahora necesita agregar favona a su alojamiento, está en la carpeta raíz del sitio (de lo contrario, no se mostrará). Venga al alojamiento y descargue el FAV a la raíz del sitio (se requiere el nombre del archivo favicon.ico., Se requieren dimensiones 16 × 16 píxeles).
Eso es todo, pronto los favonka indexan los motores de búsqueda y entregará los resultados de la emisión de Yandex. Y tu sitio tendrá tu propio favicon.
Al final, le doy un tutorial de video sobre cómo crear un FAVY para el sitio.
Favon: el término se traduce literalmente como un "icono favorito", se considera uno de los elementos más complejos del diseño web moderno. Esta es una imagen pequeña que se encuentra en la pestaña del navegador, en la barra de búsqueda y otros lugares, y juega un papel importante en la personalización del sitio.
Debido al formato no estándar y al tamaño pequeño, la creación de un favon puede asociarse con dificultades, tanto con punto de vista técnico como de diseñador.
Una tarea igualmente difícil es garantizar la compatibilidad de la FAVON con varios navegadores.
En este artículo, aprenderá cómo hacer favon, daremos consejos sobre el diseño y le informaremos sobre los servicios para crear un favicon y cómo agregar Favon al sitio.
¿Qué es Favon y por qué necesita?
A pesar de que Favon es un objeto gráfico muy pequeño, es extremadamente importante en el diseño del sitio y en general.
Presiona para agrandar la imagen.
primeramente, Favon hace que su sitio sea más personalizado y resistido en un solo estilo con otros elementos gráficos, como el logotipo.
en segundo lugar Favono destaca su sitio, entre otros recursos web en la lista de resultados de búsqueda. El sitio sin este mini icono se desvanecerá para mirar y perder a los competidores. En resumen, Favon es simplemente "debe tener" para sitios.
En tercer lugar Favon le permite al usuario encontrar su sitio en el catálogo de marcadores u otros iconos en el escritorio.
Creando un diseño favicon
Favon debe reflejar la esencia y la marca en un pequeño signo del tamaño del emoticon. Una solución simple será una versión simplificada del logotipo de la compañía, pero considere: Un logotipo completo con texto y marcas registradas no es adecuado para este propósito.
Estos sitios web utilizan el signo gráfico de su marca (o al menos algo similar a él).
No use texto
Debe abandonarse del uso del texto, porque debido al pequeño tamaño de la inscripción Favon será ilegible. Coloque en el ícono 1, el máximo de 2 letras, por ejemplo, el primero en nombre de su empresa o recurso web; En este caso, todavía se pueden distinguir.
PIXELIZACIÓN FAVICON
Los fávonos son tan pequeños que cada píxel es importante en ellos. A menudo, con una disminución en el logotipo de tamaño completo, la imagen se obtiene vago.
Este es un fragmento de un logotipo de Facebook de tamaño completo después de que disminuye a 32 × 32. Es fácil ver que la imagen "flota" en los bordes. Para evitar tal defecto, editando en un nivel de píxel.
Cuando trabaje con los iconos, prefiero usar programas de edición de imágenes raster (por ejemplo, Photoshop o Pixelmator). Al principio, reduciendo el logotipo de tamaño completo a 64 × 64 píxeles, porque es el favon más grande, que necesitaré. El trabajo es muy doloroso, puede tardar una hora entera, o incluso dos, pero el resultado es excelente.
Si no tiene tiempo y habilidades en tales operaciones, es mejor utilizar servicios en línea, como Logotizador.ru.
Tamaño favicon
Habiendo recibido un icono con un tamaño de 64 × 64, también creo un icono con un tamaño de 32 × 32, 24 × 24 y 16 × 16 píxeles. Cada uno de ellos tiene su propio destino:
- 64 × 64 - "Lista de lectura" en Safari y Windows
- 24 × 24 - Sitios fijos en IE9.
- 32 × 32 - para pantallas de alta resolución.
- 16 × 16 - se usa generalmente en los navegadores como IE, Safari, Chrome, etc.
Pero la creación de Favonov más pequeña no se limita a la creación: a menudo se requiere una edición adicional en el nivel de píxeles. También puede agregar un canal alfa si lo encuentra necesario. Si antes causaba dificultades, ahora casi todos los navegadores apoyan la transparencia en las faniques.
Formatos FAVICON
Anteriormente, solo los archivos de formato ICO de Windows fueron compatibles, podríamos ahorrar tiempo ahorrando una phavique 16 × 16 en formato GIF y le damos una extensión .ico. ¡Tal recepción funcionó sin problemas! Pero ahora, en este método, no hay necesidad, ya que las herramientas para crear archivos ICO se pueden encontrar fácilmente en Internet. Además, ahora para que Favonov se utiliza, pero los dos más comunes son aún comunes.
ICO.
El campeonato de Palm pertenece al formato IPO. A diferencia de los archivos PNG, los archivos ICO pueden tener una resolución diferente y una profundidad de bits (que es excelente para Windows). Internet Explorer Browser utiliza los diferentes tamaños de Favon (por ejemplo, los iconos de 32 píxeles para la barra de tareas de Windows 7), y por lo tanto, en este caso, el formato de ICO es la única opción.
Los archivos PNG se distinguen por gran conveniencia, ya que no necesitan herramientas especiales para crearlas. Este formato admite el canal alfa y le permite crear los archivos de las dimensiones más pequeñas. Quizás el único inconveniente del formato PNG es que no es compatible con el navegador de Internet Explorer.
Hay otras opciones:
- Los formatos gif generados y gif animados no tienen ninguna ventaja, además de la compatibilidad con los navegadores muy antiguos.
- No se recomienda el formato JPG, incluso si la imagen se presenta como una foto. Este formato carece de la claridad de PNG, y la única dignidad es una transición más suave entre los colores, un matiz, que está completamente inmaculado en una imagen muy pequeña.
- SVG podría ser una excelente opción si más navegadores apoyaron la favona de este formato. Hasta ahora hay compatibilidad solo con ópera.
- También está el llamado "conformat" PNG - ApnG (PNG animado), que se apoya en Firefox y Opera. Sin embargo, la conveniencia de su uso permanece en cuestión. Favon animado puede distraer la atención e incluso molestar al usuario.
Crea Favon Online - Herramientas y servicios en línea
Hemos elegido para usted los servicios más útiles que ayudarán a crear Favon Online.
Logotizador.
Logotizer es un servicio nuevo, simple y conveniente para crear un favon y logo para su sitio.
Con este constructor en línea, puede crear un fijador desde cero. El servicio se centra en los recién llegados, por lo que no es difícil desarrollar un buen diseño.
Cómo crear un favy con un generador de logotizador en línea
El área de trabajo principal se encuentra a la izquierda. Puede ver el derecho de ver que Favon analizará varios medios: la pestaña del navegador, la barra de tareas de la computadora o la pantalla del teléfono inteligente. Muy cómodo y claramente.
Inicialmente, debe elegir un formulario para un favon. Hay muchos de ellos, más de 50. Le recomendamos que usted elija formularios simples y sin complicaciones para que sea fácil de percibir y memorizar un favin.
En esta etapa, también define el color del formulario, que va como fondo del Favonki y seleccione un marco. Vea de qué color domina en su logotipo (si corresponde), qué colores son los principales en su sitio. Está dentro de este gamma que le recomendamos que cree un diseño FAVICON.
Debajo del bloque "Formulario" es una colección de figuras (caracteres). No son tanto, es una pena que no pueda cargar sus opciones; Pero la elección sigue siendo bastante interesante.
Cambio de color, tamaño, ubicación de las figuras! En resumen, el experimento, bueno, el servicio le permite hacerlo.
Después de seleccionar la figura, puede agregar su texto. Como escribí anteriormente, es mejor usar 1 o 2 letras, no más.
Hay una amplia selección de fuentes. Esto es definitivamente más. Como en el caso de las figuras, puede cambiar el color, el tamaño, el diseño del texto.
Si decides que algún tipo de capa del favicon interfiere temporalmente con o no en absoluto, solo puede ocultarlo.
Después de crear un favon, el servicio ofrecerá guardarlo. Registre una cuenta (en 2017 sin registro de ninguna manera), y luego puede descargar archivos con un pequeño pago: 199 rublos.
Todavía hay una pequeña instrucción en el sitio, cómo agregar Favon al sitio, por lo que con la adición de FAVICON al sitio que no debe tener problemas. A continuación, en este artículo también proporciona recomendaciones similares.
Después del pago, el usuario recibe 10 correcciones de diferentes tamaños a la vez en todos los dispositivos necesarios hasta la fecha (icono de Apple Touch, los iconos de la aplicación de Microsoft y otros).
FAVICON.ICO El archivo en sí mismo es de tamaño múltiple y contiene 4 iconos de tamaños en 1 archivo (16px, 24px, 32px, 64px). En consecuencia, si agrega un sitio para marcar el navegador o abrir una historia, puede ver los iconos de diferentes tamaños, pero se mostrarán claramente y sin borrón.
En general, el servicio es bueno. Simple, cómodo, nada superfluo.
Realfavicongenerator.net.
- Este es un generador de favon-generador más simple que le permite crear fávonos para cualquier plataforma. Además, el recurso puede ser probado por Favon. Ingrese la URL de su sitio, y verá cómo se ve su fijador en cada navegador y en cada sistema operativo. El verdadero generador de favicon también le pedirá cómo solucionar las deficiencias y mejorar su phavicon.
Favicon.by.
Favicon.by.- otro generador de favon gratis y fácil de usar, que convierte archivos PNG, JPG y GIF para formatear.ico. Cargue la imagen de su computadora, seleccione Tamaño (16x16px o 32x32px) y haga clic en el botón "Crear". Para guardar el FAVON recibido en su sitio web, siga las instrucciones.
Además, el servicio hace posible dibujar logo en los píxeles, pero, para ser honesto, no es para todos. Por ejemplo, no pude. Aquí soy crucial :)
Cómo agregar favon al sitio
Puede agregar favon al sitio haciendo varias ediciones en el código de página HTML - Site.
Paso 1: Descargue el archivo "favicon.ico" a su servidor de alojamiento.
Para hacer esto, vaya a su servidor FTP en este enlace:
Ftp: // [Correo electrónico protegido]
Ingrese su nombre de usuario y contraseña. Se pueden obtener en el Panel Administrador de su empresa de alojamiento.
Cargue archivos con favoks en el directorio raíz. El directorio raíz generalmente se llama "public_html" o "www".
Paso 2: Añadir Favon a HTML.
Abrir la ventana del servidor FTP Abrir, descargue el archivo "index.html" o "encabezado.php".
Entonces necesitas subir el código. El código descargable depende de su sitio web.
Si su sitio está en HTML, encuentre el área de la cabeza en el archivo index.html e inserte el siguiente código:
Si su sitio está en WordPress, busque el área de la cabeza en el archivo Header.php e inserte el siguiente código:
/Favicon.ico »/\u003e
Con estos códigos, los navegadores podrán encontrar su Favo.
Entonces, ¿instalaste tu favon!
Cómo agregar Favon a WordPress y otras plataformas
Si su recurso se basa en WordPress u otro CMS, agregue FAVON al sitio es muy simple. En general, el algoritmo para la adición de favicon para diferentes plataformas será la misma.
1. Necesitas ir a la consola del sitio.
2. Encuentre la sección "Diseño" o "Apariencia".
3. Vaya a la sección "Configuración temática" y encuentre "Favon" allí.
4. Descargue FAVON desde su computadora.
5. Guarde y actualice la página.
Cómo crear una favona más compleja.
Este artículo analiza formas simples y rápidas de crear FAVONOV compatible con prácticas cualquier navegador y sistemas operativos. Pero cuando se trata de diseño web y desarrollo, no hay límite para la perfección. Si desea aprender cómo hacer favon más complejos, toque los iconos para las pantallas principales de iOS, los iconos de la interfaz de metro en Windows, los iconos de Google TV y mucho más, le recomiendo que se familiarice con estos materiales: hoja de trucos favicon. Hay información completa sobre el tema y se les da buenas fuentes. Esta es una gran opción para aquellos diseñadores y desarrolladores (incluido ME), que están buscando constantemente ampliar su conocimiento.
Usando favico.js, puedes crear su favorón dinámico con números.
También puede necesitar un favon dinámico, que tiene un icono de Dígito cambiante. Para crear dicho favonov, le aconsejo que use el servicio. favico.js.Disponible en GitHub. Mientras que las correcciones dinámicas son compatibles con todos los navegadores. Pero para aquellos navegadores que los apoyan, estos iconos pueden ser una adición interesante y útil.
Si desea reponer este artículo por otro consejo o hacer una pregunta, ¡deje los comentarios a continuación!
Cómo crear un favy para un sitio web - Consejos y servicios Actualizado: 7 de febrero de 2018 por el autor: administración.
