ubiquitour.com

Cómo poner una imagen en el título de una página web usando Dreamweaver

Cómo poner una imagen en el título de una página web usando Dreamweaver

Estrictamente hablando, no es posible incluir imágenes dentro de la sección < title > de un documento HTML. Lo que los usuarios de la web típicamente consideran una foto junto a que un título de la página web es realmente una pequeña imagen llamada un favicon. El término es una versión acortada de "icono favoritos", llamado así porque parece más comúnmente al lado del título de una página web guarda en la carpeta de favoritos de un navegador web. Utilice Adobe Dreamweaver para insertar un favicon en título de su página web.

Instrucciones

1 Seleccione una imagen apropiada. Favicons son muy pequeñas, mide apenas 16 píxeles cuadrados, por lo que la imagen que usted elija debe ser lo suficientemente simple como seguir siendo legibles en tamaño miniatura. Logotipos complejos a menudo aspecto encogidos o parecen haber dentados bordes cuando cambia el tamaño de 16 píxeles. Si esto te ocurre, considerar el uso de una imagen alternativa que no incluye su logotipo pero en cambio refleja bien el tipo de contenido en tu sitio web o la paleta de colores del sitio. En cualquier caso, asegúrese de que su imagen es un cuadrado perfecto para asegurar incluso reducción.

2 Cambiar el tamaño de la imagen. Después de elegir una imagen que reduce bien, abra el archivo en Photoshop. En el menú en la parte superior de la pantalla, seleccione "Imagen" y, a continuación, haga clic en "Tamaño de imagen". En el cuadro de diálogo resultante, cambiar el ancho y la altura de la imagen a 16 píxeles y, a continuación, haga clic en Aceptar.

3 Guardar la imagen como GIF o PNG. Imágenes GIF y PNG problemas el menor al convertirse al formato ICO en el siguiente paso. Para guardar la imagen en uno de estos formatos, seleccione "Archivo" del menú superior en Photoshop, a continuación, haga clic en "guardar como". Darle un nombre a tu archivo favicon, haz clic en el menú desplegable debajo del campo Nombre de archivo y seleccione la opción "Compuserve GIF" o "PNG". Haga clic en "Guardar".

4 Convertir tu imagen en formato ICO. Photoshop no puede guardar archivos de imagen en el formato requerido de ICO por cuenta propia. En cambio, debe descargar un plug-in de Photoshop o use una utilidad de la web. Por ejemplo, utilice el generador de favicon gratis desde la Web de favicon.cc (ver referencias). En la primera página de este sitio, haga clic en el botón "Importar imagen". Busque el archivo GIF o PNG que se creó en el paso 3 y haga clic en "Upload". En unos pocos segundos, la utilidad va a transformar el archivo en una imagen de 16 píxeles cuadrados. Para guardar su ordenador en formato ICO, ubique el título con la etiqueta "Vista previa" en la parte inferior de la página y, a continuación, haga clic en "Download Favicon". Guardar este archivo en la carpeta con el resto de los archivos de la Página Web.

5 Añadir el favicon a su página web. Favicons enlace a páginas individuales de la misma manera como archivos externos, como archivos JavaScript y hojas de estilo en cascada. Abierto su página web en Dreamweaver, luego cambiar a la vista Código seleccionando "Ver" en el menú en la parte superior de la pantalla y haciendo clic en la opción "Código". A continuación, incluir el siguiente código entre las etiquetas de apertura y cierre < head > de la página web y después de las etiquetas < title >:

< link rel = "icono de acceso directo" href="images/favicon.ico" tipo = "imagen/x-icon" / >< link rel = "icono" href="images/favicon.ico" tipo = "imagen/x-icon" / >

Este código supone que el favicon existe en la carpeta de imágenes. Si coloca tu favicon en otro lugar, actualizar la ubicación en cada atributo href. ¿Por qué usted necesita incluir dos enlaces? Compatibilidad entre navegadores. Internet Explorer 7 maneja favicons diferentemente que otros navegadores y requiere una única regla para asegurar la presentación precisa.

6 Guardar tu página web, luego abra en su navegador. Ahora podrás ver tu favicon. Si su navegador ya está abierto, puede que necesite cerrar y reiniciar antes de que aparezca el favicon. También tenga en cuenta que algunos exploradores muestran favicons para títulos de página ubicado en la carpeta de favoritos, no la barra de título del explorador sí mismo.