Cómo agregar un sitio web iconos para iPhone, iPad y iPod Touch

Favicon.ico - Icono de la Página Web en el explorador

Antes de que se puso en marcha un sitio web y añadir un archivo de gráficos, faviconQue aparecen en el navegador, la barra de direcciones. En la mayoría de las situaciones, el favicon es un logotipo gráfico en miniatura o las iniciales respectivos sitios web. Se añade este favicon para ayudar a los usuarios a identificar una dirección más rápido marcadores web.

favicon Opciones de invisibilidad

favicon Opciones de invisibilidad en Safari

Favicon en Opera

Favicon en Opera

Hasta hace poco, este archivo debe ser de la forma "favicon.ico"Para ser identificado por el navegador web. Chrome, Internet Explorer, Opera, Safari, Firefox, etc.
Desde hace varios años, con el avance de nuevos lenguajes web, HTML5 si CSS3, Favicons puede ser una .png o .jpg. La condición es que la cabecera de la página, antes de </ head>, Sea esta línea:

<Link rel = "icono de acceso directo" href = "/ images / favicon.ico" type = "image / x-icon" />

Icono de página web para iOS - iPhone, iPad y iPod Touch

In iOS Podemos añadir los accesos directos de las páginas web pe pantalla de InicioCPCiPhone, Protectores si iPod Touch.

Cómo agregar un acceso directo sitio web en el iPhone, iPad y iPod de pantalla Inicio

Hacemos esto mediante la apertura de un sitio web en el iPhone (Safari, Chrome, navegador de Internet, etc.), haga clic en el cuadrado con la flecha (el signo de "compartir" en IOS), entonces la opción "Añadir a pantalla de inicio".

Si el sitio se ha fijado favicon para su navegador, pero no se establece sitios icono específico de dispositivos iOS, La pantalla aparecerá un icono que consiste en una previsualización de la imagen página web.

Cómo agregar iconos web para iPhone, iPad y Android.

El primer paso escrear un icono de imagenQue aparecen en pantalla de Iniciocomunidad iDevice CPC. Para icono de la web es compatible en todos los dispositivos y de ver con claridad, hay que crear una imagen para todas las resoluciones de iPhone y iPad.

Resoluciones y tamaños estándar de iconos para el iPhone, iPad, iPod y Android

  • Los modelos clásicos de iPhone / iPod = 57 57 ×
  • IPAD = 76 76 ×
  • iPhone / iPod Retina × = 120 120
  • iPad Retina × = 152 152
  • iPhone 6 / 6S Plus = 180 180 ×

Apple actualizada regularmente tamaño de los iconos recomendadaURL aplicaciones si páginas web pe esta página.

Para el Android dispositivos, los iconos son dos dimensiones:

  • Android × 128 128 clásico =
  • Android de alta resolución (Hi-Res) = 192 192 ×

iconos

Después de hacer las imágenes, subir en el servidor web, el código HTML de la página web antes del cierre </ head>, añada las siguientes líneas:

<link href = "/ apple-touch-icon.png" rel = "icono de apple-touch" /> <Enlace href = "/ apple-touch-icon-76x76.png" rel = "apple-touch-icon" tamaños = "76x76" /> <Enlace href = "/ apple-touch-icon-120x120.png" rel = "apple-touch-icon" tamaños = "120x120" /> <Enlace href = "/ apple-touch-icon-152x152.png" rel = "apple-touch-icon" tamaños = "152x152" /> <Enlace href = "/ apple-touch-icon-180x180.png" rel = "apple-touch-icon" tamaños = "180x180" /> <link href = "/ icon-hires.png" rel = "icono" size = "192x192" /> <link href = "/ icon-normal.png" rel = "icon" sizes = "128x128" />

Para los dispositivos de Apple, y el nombre de la imagen PNG "rel =" debe contener el prefijo "de manzana". Para Android, el nombre del archivo será "icono hires.png"Y"icono normal.png"Con rel =" icono ".

No es absolutamente necesario para crear imágenes para cada resolución por separado. Se puede hacer una imagen de la alta resolución y de los dispositivos con una resolución más baja, se identificarán y establecer el icono.

Sitio web iPhone Icon

El icono del acceso directo se parecerá a la página web de cualquier aplicaciones para iOS.

Cómo agregar un sitio web iconos para iPhone, iPad y iPod Touch

Sobre el Autor

Sigilo

Apasionado por todo lo que significa gadgets y TI, escribo con placer stealthsettings.com de 2006 y me gusta descubrir con usted cosas nuevas sobre computadoras y sistemas operativos macOS, Linux, Windows, iOS y Android.

Deja un comentario

Este sitio usa Akismet para reducir el correo no deseado. Descubra cómo se procesan los datos de sus comentarios.