WorldjamBlog

SLIDE-5-TITLE-HERE

viernes, 29 de abril de 2011

Como incluir un favicon en tu sitio web



A lo mejor te has preguntado alguna vez que hay que hacer para incluir un icono que aparece en los navegadores cuando estan visualizadon tu web. Pues bien, para ello, lo que hay que hacer es lo siguiente:
  • En primer lugar debes crear un icono a partir de la imagen que quieres mostrar como favicon, para ello, puedes utilizar la herramienta online del siguiente enlace: http://www.htmlkit.com/favicon/
  • Una vez tenemos el icono creado, debemos subirlo a un servidor para poder tener acceso a el. Para ello tenemos dos posibilidades, una subirlo directamente al servidor donde está alojada nuestra web, o bien subirlo a un servidor de imágenes (hay que tener cuidado a la hora de elegirlo, ya que no todos los servidores admiten archivos con extensión .ico)
  • En nuestra página web hacemos referencia al favicón con las siguientes sentencias: <link href='URL_icono' rel='shortcut icon' type='image/x-icon'/>  <link href='URL_icono' rel='icon' type='image/x-icon'/> sustituyendo donde pone "URL_icono" (las dos veces) por la dirección de alojamiento de nuestro archivo .ico.
  • Si en vez de una web, queremos cambiar el favicón en nuestro blog, debemos insertar estas sentencias después de la línea <b:include data='blog' name='all-head-content'/> Recuerda realizar una copia de seguridad de tu plantilla antes de realizar ningun cambio. 

By worldjam with No comments

Logotipos basados en tipos de letra que te pueden servir de inspiración

Que un logo sea recordado y se guarde en la retina de quien lo visualiza es el primer paso para el exito de tu empresa ya que el cliente potencial puede imaginar o preveer que se esconde detras de ese logotipo. Si estás pensando en el diseño de tu logotipo, aqui te mostramos una colección de ellos que te pueden ayudar a encontrar la inspiración necesario. Estos logotipos están basados en el juego que se hace con la tipografía para crear formas que construyen el logo.

By worldjam with No comments

30 texturas de marmol de alta calidad

Colleccion gratuita y de alta calidad de 30 texturas de marmol para poder emplear en cualquier tipo de diseño gráfico. Las puedes descargar desde el siguiente enlace de la página naldzgraphics.net
30-free-high-quality-marble-textures

By worldjam with No comments

Galería de imágenes que rotan con JQuery

Hoy os traemos este tutorial que explica como implementar una galería fotográfica con un efecto rotativo mediante JQuery y CSS. El efecto resultante es bastante bueno y supone algo original para mostrar tus mejores fotografías.
rotating-image-slider

By worldjam with 1 comment

jueves, 28 de abril de 2011

Como usar la Herramienta Selección Rápida de Photoshop

 dzoom.org nos trae este ilustrativo tutorial que nos muestra la forma de usar la herramienta de selección rápida de Photoshop. Esta herramienta nos permite seleccionar objetos de una fotografía de forma sencilla para manipularlos a nuestro gusto como nos muestra en el ejemplo.
Herramienta_Selección_Rapida

By worldjam with No comments

Como realizar diagramas con Javascript


En este articulo se explica mediante código como utilizar la librería "Raphael" de javascript para poder codificar dinámicamente diagramas de datos dando un aspecto e interactividad realmente buenos dentro de una web por su animación.
animated-skills-diagram

By worldjam with No comments

Diseño-Experimento de una web de un restaurante con JQuery


Me he topado con la presentación de este diseño-experimento de una web de un restaurante y me ha fascinado todo lo que se puede hacer, usando los plugins adecuados y un gran conocimiento sobre CSS para logar con pocas líneas de codificación esta gran web, que visualmente me parece sencilla y espectacular. Gracias a Mary Lou y su enorme talento para la programación y diseño web podemos disfrutar de esta maravilla.

By worldjam with No comments

90 tarjetas de visitas inspiradoras


Cuanto mas paginas de este estilo es la que se muestran diseños de tarjetas de visita veo, mas me asombro de las posibilidades de comunicación que tienen esos pequeños trozos de papel. En esta ocasión me ha sorprendido esta colección de 90 tarjetas de todo tipo en la estoy seguro podrás sacar alguna que otra inspiración para tus diseños.
90-newly-arrived-business-cards-that-will-inspire-you

By worldjam with No comments

miércoles, 27 de abril de 2011

Guía de Introducción a la optimización de Motores de Búsqueda (SEO)



Tras el lanzamiento el pasado 2010 de la conocida como Guía para Principiantes sobre Optimización para Motores de Búsqueda (Search Engine Optimization Starter Guide), Google acaba de lanzar la versión en español para cualquier interesado.
 

Es interesante señalar que este documento se centra en recopilar las principales practicas recomendadas con las que lograremos mejorar la forma en que Google rastrea, indexa y entiende el contenido de nuestro site. 

Esta nueva versión de la Guía para Principiantes sobre Optimización para Motores de Búsqueda incluye junto a la oportuna actualización de contenidos, una nueva sección sobre recomendaciones SEO dirigidas a páginas webs para dispositivos  móviles.

Este documento SEO dirigido a webmasters y usuarios con menos experiencia está disponible tanto de forma online como a través de un PDF desde:


guia_optimizacion_motores_busqueda

By worldjam with No comments

Tutorial para maquetar un texto con un estilo profesional en tu web usando CSS


Muchas veces en programación web hemos topado con la dificultad de formatear texto para mostrar una pagina de una forma muy similar a como se muestra en un periódico y hemos tenido que recurrir a tablas que a veces no nos daban el resultado esperado. Ahora con CSS puedes dar un aspecto muy profesional a tus textos de una forma sencilla, mediante este tutorial de Matt Ward que describe paso a paso y con ilustraciones como van actuando los distintos comandos CSS para llegar a un resultado fascinante.
create-beautiful-css3-typography

By worldjam with No comments

18 nuevas fuentes gratuitas de alta calidad


Las fuentes tipográficas son un elemento imprescindible en cualquier diseño y siempre están en constante evolución. En esta ocasión os mostramos una selección de 18 nuevas fuentes que pueden encajar perfectamente en multiples proyectos.
free-fonts-18-new-high-quality-fonts

By worldjam with No comments

Herramienta online para crear botones CSS


En alguna ocasión hemos mostrado el tutorial paso a paso de como implementar un botón mediante CSS. Esta vez traemos una herramienta web para diseñar y configurar nuestros botones mediante una serie de opciones en una interfaz web que da como resultado el código CSS para introducirlo en nuestras páginas.

By worldjam with No comments

Fuente "Inspiration"

Descubrí el otro día esta fuente en una web que me impacto su diseño y hoy la quería compartir con todos vosotros. Está disponible en la siguiente URL:
http://www.urbanfonts.com/fonts/Inspiration.htm#

By worldjam with No comments

Ejemplos de web con estilo retro


designm.ag nos trae esta compilación de webs con look retro muy actuales que nos pueden servir de inspiración a la hora de diseñar web, tanto comerciales, como de caracter personal. Se nota mucho la influencia en estas webs de las nuevas posibilidades que nos trae CSS3, ya que mediante estas técnicas podemos dar estilo a nuestras webs sin tener que pasar obligatoriamente por abrir el Photoshop. Pinchando el enlace podreis encontrar esta colección de web. Espero que es gusten.

By worldjam with No comments

Como crear un menú horizontal con CSS

 Cada vez se están viendo mas menús en las páginas web realizados completamente con código CSS. Si quieres saber como realizar un menú horizantal desplegable, sin tener que realizar o diseñar las imágenes por un lado con Photoshop y por otro lado codificar un script con javascript, aqui tienes un enlace que te explica pasa a paso como realizarlo para tus futuros diseños.
create-a-rocking-drop-down-navigation-menu-using-css3/

By worldjam with No comments

martes, 26 de abril de 2011

Tutorial de como crear una web de estilo grunge con Photoshop desde cero


Excelente tutorial de como realizar una página web partiendo desde cero mediante Photoshop. En esta ocasión se trata de un diseño de página estilo grunge muy atractiva.
how-to-create-a-grunge-web-design-using-photoshop

By worldjam with No comments

Como contruir un formulario usando CSS3 y HTML5


El siguiente enlace muestra una recopilación de tutoriales orientados a la construcción de formularios web usando CSS3 y en algunos casos sin usar tan siquiera imágenes ó código javascript.
top-10-css-3-forms-tutorials

By worldjam with No comments

Ejemplos de Tarjetas de visita de madera

Una buena tarjeta de visita no debe pasar desapercibida y a veces es la única imagen que habla de ti ante un cliente potencial. Para ello os mostramos esta colección de tarjetas de visitas realizadas en madera, que a parte de ser duraderas, son impactantes a pesar de la sencillez que atesoran algunas de ellas.
29-creative-and-durable-wooden-business-cards

By worldjam with No comments

Efecto sombra con CSS3

 Gracias a las nuevas técnicas CSS vamos a poder ahorrar mucho tiempo en diseñar mediante Photoshop las sombras de los elementos que aparecen en pantalla para darles cierto relieve. Con este tutorial, daremos sombras de varios tipos a los distintos elementos que tenemos en pantalla.

how-to-create-slick-effects-with-css3-box-shadow

By worldjam with No comments

25 increibles pinceles efecto luz para Photoshop


Increible colección de pinceles (brushes) para Photoshop de efectos de luz con lo que poder conseguir efectos muy bonitos en todos tus diseños.
25-stunning-photoshop-brush-packs-for-light-effects

By worldjam with No comments

10 herramientas online para generar logotipos


En este enlace podeis encontrar un conjunto de herramientas online gratuitas para generar logotipos de una forma rápida, sencilla y profesional.
10-free-web-based-logo-generators

By worldjam with No comments

20 tipos de letra muy útiles para usar en titulares


Conjunto de fuentes profesionales gratuitas muy útiles para usar en los titulares de tus diseños como cabecera de página de estilos muy diferentes, entre las que podrás encontrar la que mejor se adapte para tus diseños.
20-beautiful-fresh-and-free-fonts

By worldjam with No comments

martes, 19 de abril de 2011

Vectores de letras de periódico recortadas


Recursos2d.com nos trae estos vectores de letras de periódico recortadas para utilizar en tus diseños web y darle un aire collage y vintage a tus creacciones.
letras-de-periodico-recortadas

By worldjam with 1 comment

30 texturas de papel para tus diseños web


30 texturas de papel de todo tipo listos para descargar y utilizar gratuitamente en todos tus diseños web y retoques fotográficos. Estas texturas son de altísima calidad y puedes encontrarlos en la web creativecloseup.com 

By worldjam with No comments

Herramienta online para crear Font-Face Kit a partir de una fuente instalada


En esta web, podemos encontrar esta fantástica herramienta para generar kits de font-faces a partir de cualquier fuente que tengas instalada en tu ordenador para ser utilizada en tus diseños web a partir de una hoja de estilos CSS. Esta heramienta te genera el kit, que contiene entre otros, el fichero CSS y un ejemplo en HTML para que veas el resultado y sepas como usar el kit en tus diseños.

By worldjam with No comments

17 plugins JQuery que te permitirán mejorar el aspecto de tu sitio web


Colección de 17 plugins mediante JQuery que te permitirán dar un aspecto diferenciador y muy profesional a tus diseños web. Hay plugins para mostrar una galería de imágenes y otros muy útiles para menús y formularios de contacto.
17-useful-jquery-plugins-to-improve-the-look-and-feel-of-your-website

By worldjam with No comments

Conjunto de Iconos para iPhone


Colección de conjuntos de iconos especialmente diseñados para iPhone, que puedes descargar de forma gratuita y darle a tus diseños un look apple!!

collection-of-free-amazing-icon-sets-for-your-iphone

By worldjam with No comments

40 texturas de alta calidad de cristales rotos


Hoy os traemos de la mano de designerterminal.com una coleccion de texturas de cristales rotos de alta calidad muy utiles para tus retoques fotográficos y para inventar diseños de todo tipo.
broken-glass-textures

By worldjam with No comments

lunes, 18 de abril de 2011

Como crear un menú con efecto Overlay


En esta ocasión si estás buscando un recurso en forma de menú para tu diseño web, sin duda te tienes que detener un momento en este que te muestro en el siguiente enlace. Se trata de un menú con un impresionante efecto overlay conseguido mediante JQuery en el que al posicionar el cursor sobre el menú el resto de la pantalla se vuelve distorsionado.

By worldjam with No comments

Como crear un efecto profesional a un texto añadiendo textura

Sin duda añadir, una textura como base de un texto, puede hacerlo resaltar mucho mas y dar la sensación de profundidad y profesionalidad a tus diseños, a la par que atraer mas visitas de calidad a tu sitio. Mediante este tutorial designm.ag te explica paso a paso como hacerlo.
create-a-cool-text-effect-in-photoshop-with-a-single-texture

By worldjam with No comments

450+ pinceles de pintura acrílica para Photoshop

designm.ag nos trae esta recopilación de los mejores pinceles para Photoshop efecto "pintura acrílica" para que tus diseños web parezcan "recien pintados"
450-free-acrylic-and-paint-photoshop-brushes

By worldjam with No comments

Diseño web basado en el comic a partir de un archivo PSD


Tutorial para diseñar una web a partir de un archivo PSD basado en el aspecto de un comic en el que paso a paso te va quiando para convertir un archivo en blanco de photoshop a una web totalmente operativa con HTML y CSS 
create-a-comic-book-themed-web-design-photoshop-to-html-css

By worldjam with No comments

Sitios que emplean texturas de papel que te pueden servir de inspiración


La colección de sitios que te muestro a continuación tienen en común que todas ellas emplean el papel cómo elemento estrella de sus diseños. Todas ellas se basan en este material para dotar al diseño de una textura propia de un formato en papel de toda la vida y en la que el usuario se siente plenamente identificado.
 
Colección de sitios web que tienen en común el uso de texturas de papel en sus diseños y que pueden servir de inspiración en tus proyectos. 

By worldjam with No comments

10 tutoriales de como convertir tus diseños en PSD a XHTML

psdvibe.com nos trae esta estupenda colección de tutoriales que nos ayudan a comprender mejor el proceso de convertir nuestros diseños desde un archivo PSD a XHTML paso por paso y que nos permitirán crear diseños web de una forma muy profesional.
10-awesome-psd-to-xhtml-tutorials

By worldjam with No comments

viernes, 15 de abril de 2011

30 acciones para Photoshop que permiten transformar tus fotografías en un sólo clik


designm.ag nos trae esta selección de acciones para Photoshop que nos permiten mediante un sólo click transformar de una manera profesional nuestras fotografías. Las acciones para todos aquellos que no estéis familiarizados son un conjunto de acciones que se realizan sobre una imagen en Photoshop sin tener que realizar todas ellas paso por paso y por tanto nos permite ahorrar mucho tiempo de post-procesado. Tan sólo tenemos que descargar la acción instalarla en Photoshop y elegir la que mas nos convenga para nuestra fotografía.

By worldjam with No comments

jueves, 14 de abril de 2011

Excelentes menús con JQuery y CSS


Ejemplos de menús animados realizados con JQuery y CSS explicados paso a paso y cuya descarga resulta gratuía gratuitos para poder incorporarlos y modificarlos a tu gusto en tus diseños web y así dar un aspecto profesional a cada una de tus creacciones dando la importancia que se merece a un elemento tan destacable como es el menú de navegación.


By worldjam with No comments

Texturas para dar un toque a tus fotografías

Excelente coleccion de todo tipo de texturas muy recomendables para dar ese toque a tus fotografias en tus trabajos de post-procesado que puedes encontrar en la web www.thedphoto.com
fresh-new-beautiful-useful-free-textures-to-add-flair-to-your-photos

By worldjam with No comments

25 fuentes creativas de alta calidad gratuitas

 Colección de 25 fuentes creativas que te ayudarán a mejoras tus páginas web dando ese toque de estilo que sólo una buena elección de fuente te puede proporcionar.
high-quality-free-fonts

By worldjam with No comments

miércoles, 13 de abril de 2011

40 conjuntos gratuitos de iconos de redes sociales

En designmodo.com podemos encontrar esta coleccion de conjuntos gratuitos de iconos sobre redes sociales de todos los los tipos y formatos para que se adapten a tu diseño web. En total 40 colecciones diferentes que hace que si estás buncando una colección de iconos sociales para tus diseños seguramente encuentres mas de uno que encaje a la perfección y tendrás el problema de decidirte por uno de ellos.


By worldjam with No comments

Recopilación de las mejores aplicaciones gratuitas para windows

 makeuseof.com nos trae una recopilación de las mejores herramientas gratuitas para windows ordenadas por categorías. best-windows-software

By worldjam with No comments

10 trucos esenciales para CSS que siempre debes tener presente


www.red-team-design.com nos trae esta estupenda coleccion de trucos y consejos que hay que tener siempre en cuenta a la hora de programar correctamente tus CSS. Esta serie de consejos ademas os puede ahorrar mucho tiempo y demostrar que somos unos buenos programadores.
css-tips-and-tricks-you-should-always-use

By worldjam with No comments

martes, 12 de abril de 2011

150+ Tutoriales de CSS3 con ejercicios prácticos


tutorialshock.com nos trae esta excelente colección de tutoriales CSS3 con ilustrativos ejemplos prácticos.
/css3-tutorials-exercises-experiments/

By worldjam with No comments

Herramienta online para probar un texto con todas las fuentes que tienes instaladas

Con esta herramienta online podrás probar un texto en cada una de las fuentes que tienes instaladas en tu equipo, todas a la vez y elegir cual de ellas se ajusta mejor a tu diseño.


By worldjam with No comments

lunes, 11 de abril de 2011

Solución al problema de nvlddmkm.sys de NVIDIA en windows 7

Pasos a seguir


Paso I

  • Vamos a la carpeta NVIDIA => C:\NVIDIA
  • Buscamos un archivo llamado "nvlddmkm.sy" => C:\NVIDIA\DisplayDriver "numero de la versión del controlador (ej.: 186.81)" InternationalDisplaynvlddmkm.sy_
    • Nota: la ruta de acceso puede variar dependiendo del PC.
  • Copiamos el archivo en la raíz de C: =>C:\nvlddmkm.sy_


Paso II

  • Vamos a la carpeta system en la que están almacenados los drivers => C:\Windows\System32\drivers
  • Una vez en esta carpeta, buscamos el archivo nvlddmkm.sys defectuoso y lo renombramos, le ponemos como nombre nvlddmkm.sys.old


Paso III

  • Abrimos la consola MS-DOS (Tecla de Windows + R y escribimos cmd)
  • Una vez la consola abierta:
    • 1. escribimos cd.. y presionamos Enter (para ponernos en la raíz del disco duro C:)
    • 2. escribimos expand.exe nvlddmkm.sy_ nvlddmkm.sys luego presionamos Enter.
      • Este ultimo comando nos permite descomprimir el archivo nvlddmkm.sy_ que habíamos colocado en la raíz de C y transformarlo para crear el nuevo "nvlddmkm.sys"
  • Buscamos este último => C:\nvlddmkm.sys
  • Y lo reemplazamos en la carpeta => C:\Windows\System32\drivers


Y listo! Ahora solo queda reiniciar el PC.

By worldjam with 18 comments

viernes, 8 de abril de 2011

Alternativa a los iframes con CSS, DIV y AJAX

Google no indexa bien las páginas que contienen iframes con lo cual si estás buscando como solucionar ese problema sin perder la funcionalidad de tu página o sin tener que hacer unos cambios muy importantes esta es una forma de hacerlo usando CSS, capas DIV y funciones de AJAX:

Archivo ajax.js:
var peticion = false;
if (window.XMLHttpRequest) {
  peticion = new XMLHttpRequest();
} else if (window.ActiveXObject) {
  peticion = new ActiveXObject("Microsoft.XMLHTTP");
}

function cargarExterno(datos,divID) {

  if(peticion) {
   var obj = document.getElementById(divID);
   peticion.open("GET", datos);
   peticion.onreadystatechange = function() {
  if (peticion.readyState == 4) {
   obj.innerHTML = peticion.responseText;
  }
}
peticion.send(null);
}
}

Cargamos el archivo ajax.js en la cabecera de nuestra página HTML de la forma:
 <script type="text/javascript" src="ajax.js"></script> 

En el HTML colocamos los enlaces que se van a cargar en el DIV principal que sustituye al iframe (div contenido):
<ul id="menu">
<li><a href="javascript:cargarExterno('pagina1.html','contenido');">Cargar
el html 1</a></li>
<li><a href="javascript:cargarExterno('pagina2.html','contenido');">Cargar
el html 2</a></li>
</ul>
<br>
<div id="contenido"></div>
 

Si queremos cargar inicialmente un fichero html en el div contenido, lo podemos hacer con el método onload del <body> 
<body onload="javascript:cargarExterno('home.html','con tenido');">

By worldjam with 6 comments

jueves, 7 de abril de 2011

Como crear un formulario de contacto con CSS3, HTML5 y mucho estilo!!


Muchas veces nos encontramos con el problema de crear un buen formulario de contacto con el estilo de nuestra pagina web y buscamos la mejor forma de que no desentone. Con este tutorial, Line25 muestra una forma de crear esos formularios diseñandolos con Photoshop e implementandolos con CSS y HTML5 explicandolo paso a paso!!

Formulario de contacto con CSS y HTML5

By worldjam with No comments

40 conjuntos de iconos de carpetas


Excelente recopilación de conjuntos de iconos de carpetas para usar en tus diseños o incluso en tu sistema operativo.

40-useful-free-folder-icon-sets

By worldjam with No comments

Explicación de las propiedades mas importantes de CSS3


onextrapixel no trae un excelente reportaje explicando las propiedades mas importantes de CSS3 para que termines de dominar todas estas técnicas tan necesarias hoy en día en nuestros diseños web.


the-most-important-css3-properties-explained

By worldjam with No comments

miércoles, 6 de abril de 2011

20 conjuntos de gradientes para Photoshop


designmondo.com nos ofrece esta coleccion de 20 conjuntos de gradientes para Photoshop,  de varios estilos, como los orientados a apple ó iphone

20-free-color-gradient-sets-for-photoshop

By worldjam with No comments

Ejemplo de como crear con Photoshop tu pagina web personal partiendo de cero



Excelente ejemplo de como crear paso a paso tu página web diseñada en photoshop partiendo de cero y acabando con su codificación HTML y CSS

how-to-build-a-stylish-portfolio-web-design-concept

By worldjam with No comments

Como crear un canal de youtube personalizado


Alguna vez has entrado en un canal de youtube y te has quedado prendado de su diseño? te has preguntado como podrías crear el tuyo? line25.com os trae un excelente tutorial paso a paso de como crear tu canal de youtube personalizado.

how-to-design-a-custom-youtube-background

By worldjam with No comments

martes, 5 de abril de 2011

Coleección de herramientas que te ayudan en tu posicionamiento SEO

 Conjunto de herramientas de gran ayuda para alcanzar el posicionamiento SEO deseado para tu web. De nada sirve tener una excelente web cargada de diseño y contenido si no hay forma de encontrarla en la web. Para ello contamos con una serie de herramientas que nos permiten poder posicionar nuestra web dentro de los buscadores y así hacerla mucho mas accesible.

By worldjam with No comments

    • Popular
    • Categorías
    • Archivos