Archivo categoría Herramientas
Tooltips en javaScript
Por Pablo Viale - Herramientas, Web - 30 Agosto 2007
Aquí encontrarás un buen código para crear Tooltips usando javaScript.
Es gratuito.
Administración remota con Real VNC
Por Pablo Viale - Herramientas, Windows - 2 Agosto 2007
Windows tiene una herramienta para administrar equipos de manera remota, llamada Remote Desktop. Funciona excelentemente con servidores de la familia Windows.
Si encuentras problemas con esta herramienta, o si no logras configurarla, existe una alternativa (no tan confiable pero gratuita) llamada Real VNC.
Puedes encontrar toda la información en esta liga:
Como añadir un icono (favicon.ico) a tu página web
Por Pablo Viale - Herramientas, Web, WordPress - 30 Mayo 2007
Puedes añadir un icono a tu página web, como este:
Para hacerlo, primero necesitas poner esta línea entre los tags head de tus páginas web:
-
<link rel="shortcut icon" href="favicon.ico">
Después necesitas crear una imagen de 16X16 pixeles y exportarla con la extensión .ico. Lo puedes hacer con el programa Microangelo, pero lo tendrías que comprar, descargar e instalar, y no creo que sea algo que estés deseando.
Te doy una alternativa: Utiliza tu editor de imágenes favorito y haz una imagen de 16X16 pixeles y expórtala como gif. Para convertirla a ico simplemente entra a esta página:
http://www.html-kit.com/favicon/
En ella simplemente haz clic en el botón Examinar, escoge tu imagen y la página web te generará el archivo ico.
Después, si quieres revisar que todo está en orden, puedes validar tu página en esta dirección:
http://www.html-kit.com/favicon/validator/
Para WordPress
Si quieres añadir tu favicon a WordPress, inserta el código arriba mencionado en el archivo header.php del tema que estés utilizando. Ejemplo: c:\miblog\wp-content\themes\mitema\header.php
Una búsqueda tipo Firefox para Internet Explorer
Por Pablo Viale - Herramientas - 25 Mayo 2007
La herramienta de búsqueda de Firefox me gusta más que la de Internet Explorer porque viene integrada a la ventana del explorador mediante una barra que aparece en la parte inferior.
La de Internet Explorer (IE) aparece en una ventanita aparte, bastante molesta.
Sin embargo, existe un Add-on para IE que permite contar con una búsqueda al estilo de Firefox.
Se llama InlineSearch (fabricado por IEForge) y lo puedes descargar de aquí.
En este ejemplo, estamos buscando la palabra "ventana".
Crea un doble menú para soportar handhelds
Por Pablo Viale - Herramientas, Web - 12 Mayo 2007
Si utilizas una herramienta de menús desplegables en tu sitio web (como Sothink DHTML Menu), te habrás dado cuenta de que el menú no se despliega en una Pocket PC o Palm, en muchas ocasiones no aparecen ni las opciones principales. La navegación se pierde totalmente.
** Antes que nada, te recomiendo siempre tener un mapa del sitio accesible mediante un link sencillo para evitar este problema.
De cualquier forma, te muestro a continuación de qué manera puedes hacer que el menú se despliegue para estos dispositivos.
La línea que llama a tu menú debe verse como esta:
-
<script type='text/javascript' language='JavaScript1.2' src='menuDesplegable.js'><\/script>
Sustitúyela por estas dos:
-
<script type="text/javascript" src="brwsniff.js"></script>
-
<script type="text/javascript" language="JavaScript1.2" src="SelectorDeMenus.js"></script>
El archivo brwsniff.js es un detector de navegadores, puedes descargarlo de aquí.
Te recomiendo echarle un ojo al archivo adjunto que pongo en este post ya que hice una pequeña modificación al script, añadí una función llamada writit. Bájalo de aquí.
Con tu editor de textos preferido, crea el documento SelectorDeMenus.js y pega lo siguiente:
-
var br=new Array(4);
-
var os=new Array(2);
-
var flash=new Array(2);
-
br=getBrowser();
-
os=getOS();
-
flash=hasFlashPlugin();
-
if(os[0]!="wince" && os[0]!="palmos"){
-
document.write("<script type='text/javascript' language='JavaScript1.2' src='http://www.mipagina.com.mx/menuDesplegable.js'><\/script>");
-
}
-
else{
-
document.write("<table width='100%' border='0' cellspacing='0' cellpadding='2'><tr>");
-
document.write("<td><a href='http://www.mipagina.com.mx/'>Hogar<\/a><\/td><\/tr><tr>");
-
document.write("<td><a href='http://www.mipagina.com.mx/Seccion1.aspx'>Sección 1<\/a><\/td><\/tr><tr>");
-
document.write("<td><a href='http://www.mipagina.com.mx/Seccion2.aspx'>Sección 2<\/a><\/td><\/tr><\/table>");
-
-
}
Si tienes problemas pegando el código, baja el archivo de aquí.
Si te fijas bien estamos detectando el navegador, si no se trata de wince (pocket pc) ni de palmos, entonces manda el menú desplegable completo. De lo contrario, manda una tabla con las ligas en HTML puro, para que estos dispositivos las puedan leer y mostrar correctamente.
Claro, cada vez que modifiques tu menú desplegable, tendrás que recordar modificar este script, pero es una buena opción para no dejar fuera a los navegadores de handhelds.
Generador de Lorem Ipsum (texto de relleno)
Por Pablo Viale - Herramientas - 2 Mayo 2007
Cuando diseñamos un sitio web, u otro proyecto, y el cliente no nos ha dado la información completa, muchas veces necesitamos rellenar los espacios con texto. Lo peor que puedes hacer es poner "Aquí va el texto aquí va el texto aquí va el texto aquí va el texto aquí va el texto aquí va el texto aquí va el texto aquí va el texto". (¡lo he llegado a ver!)
Es más apropiado rellenar esos espacios con el texto Lorem Ipsum, que ha sido un estándar desde los años 1500's.
Para generar varios párrafos de este texto, entra a esta página.
Muestra:
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin dapibus odio at leo. In condimentum pretium eros. Sed odio felis, eleifend id, laoreet mollis, vestibulum at, arcu. Donec viverra sapien. In at lacus vel augue imperdiet iaculis. In faucibus urna eu massa. Vestibulum ipsum erat, blandit ut, eleifend a, semper vitae, justo. Donec ullamcorper magna ut neque. Quisque varius, diam et blandit suscipit, magna velit tempus ante, sit amet semper velit velit vestibulum augue. Nullam vulputate, turpis vel gravida pulvinar, massa sapien lacinia risus, vitae tempor nisl lacus in pede. Sed eget libero in velit mattis viverra. In arcu lorem, pellentesque ullamcorper, pulvinar vitae, iaculis ut, leo. Maecenas sed dui vitae risus auctor aliquet. Donec magna. Etiam rhoncus. Ut risus quam, adipiscing quis, commodo in, porttitor ac, justo. Phasellus egestas velit quis mauris. Nullam feugiat, lectus nec imperdiet venenatis, enim metus imperdiet dolor, at varius nibh sapien non nulla. Sed justo leo, viverra lobortis, consequat at, sagittis non, massa. Vivamus mauris quam, commodo vitae, aliquet eget, iaculis ut, nibh.
Phasellus lacinia. Praesent vestibulum porta neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque nibh. Suspendisse odio velit, auctor id, dictum vel, dictum ac, ipsum. Cras ac est. Integer vestibulum lacus eu augue. Aenean ut nulla vitae sapien vehicula tempor. Nulla elit justo, molestie nec, condimentum eget, venenatis at, sem. Curabitur erat nulla, gravida et, tristique vitae, varius non, orci. Nunc ac mi accumsan augue rhoncus dictum. Fusce consequat. Aliquam et pede. Cras ultricies pede iaculis magna. Nam sit amet purus. Sed semper tortor et orci. In vitae erat. Phasellus eleifend nisi vel dui.
Cómo se ve tu página web desde un teléfono móvil
Por Pablo Viale - Herramientas - 27 Abril 2007
Este emulador te permite teclear un URL y te muestra cómo se ve tu página web desde un teléfono celular. Incluso puedes interactuar con el teclado para navegar tu sitio web.
La herramienta se llama .mobi mobile emulator (Emulador móvil .mobi) y la puedes visitar aquí.
Organiza los botones de la barra de tareas de Windows
Por Pablo Viale - Herramientas, Windows - 25 Abril 2007
Si te gusta guardar un orden en el que aparecen los botones de la barra de tarea de windows, este programa es para ti. Por ejemplo, a mí me gusta tener el Outlook siempre hasta la izquierda (tal vez por manía 
).
Con Task Arrange puedo pasar de esto:
a esto:
sin necesidad de reiniciar los programas.
Así es como se ve la interfase:
Es tan pequeño que no lo tuve que instalar. Solamente lo descargué, lo puse en una carpeta e hice un atajo para accederlo desde mi barra de inicio rápido en cualquier momento.
Color picker
Por Pablo Viale - Herramientas - 24 Abril 2007
Cuando trabajas en diseño web, seguramente en muchas ocasiones necesitas saber el valor hexadecimal o RGB de algún color. Los programas de diseño te permiten hacerlo, pero ColorPic de Iconico es una aplicación que, al correr independientemente, te permite tomar colores de cualquier parte de tu escritorio.
También viene con una lupa y es totalmente gratuito.
Una muestra:
