DISEÑO Y SERVICIO WEB, RECURSOS EN LINEA, TUTORIALES, PROGRAMAS Y MÁS...

jueves, 26 de noviembre de 2009

Conocer fácilmente cada parte de la plantilla de un blog

conocer la plantilla de tu blog
En esta entrada voy a presentar una solución para conocer cada una de las partes que compone una plantilla.
Header, sidebar, footer son partes que se repiten en casi todas las plantillas, pero muchas veces hay partes que no son tan fáciles de identificar. Lo que propongo hacer es lo siguiente:

Tomar una hoja y anotar 30 o 40 colores en código hexadecimal ayudandose con un programa como Photoshop o Dreamweaver y darle un nombre a cada color. Asi por ejemplo: #AE3DD2 Verde Oscuro. Un consejo que se tomen colores diversos y bien diferenciables uno de otro ya que esto nos será de provecho en el siguiente paso.

Luego de preparada la lista vamos a la plantilla de nuestro blog y primero que nada la descargamos (esto es obligatorio) porque le haremos algunas modificaciones.
Cuando ya este la plantilla descargada lo que hay que hacer es: cada vez que encontremos un color en formato hexadecimal cambiarlo por uno de los de nuestra lista y anotar en ella junto al nombre del color a que se le puso el mismo
Así por ejemplo si en la plantilla aparece esto
cuerpo{ background:#AAAAAA}

yo cambio el color por verde oscuro quedando asi

cuerpo{ background:#AE3DD2}

y luego en mi lista de colores escribo verde oscuro=cuerpo


Una vez terminado el cambio de todo los colores hay que guardar los cambios de la plantilla y visualizarla. Nuestra plantilla tendrá mútliples colores que nos permitirán conocer todas las partes que conforman la plantilla asi como el nombre de cada una de ellas.

Después de tener una idea clara de la misma (sería bueno hacer un boceto) cargamos la plantilla descargada para que todo vuelva a como estaba antes




Si te gustó también te invito a leer:

¿Cómo colocar una imagen de cabecera en un blog?
¿Cómo cambiar la plantilla del blog?

miércoles, 25 de noviembre de 2009

Redimensionar de forma manual los videos de youtube

Es un recurso muy común publicar videos de youtube  sin embargo muchas veces las dimensiones que tiene el objeto video  no son las que sirven cuando lo publicamos en un blog o una página
Puede ocurrir que el video se escape de la zona de publicación por ejemplo.
Para solucionarlo alcanza con editar el código del objeto, reudiciendo o aumentando los pixeles.

Aquí les dejo una demostración
Tomaré un video  cualquiera de youtube en este caso elegí el títulado  "La historia de Internet en 8 minutos (subtítulos en Español)

Su código para visualizarlos en otra web es:

<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/YPc3ghd8Kas&hl=es_ES&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/YPc3ghd8Kas&hl=es_ES&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>

y el video se ve así


Pero como yo deseo que se vea más pequeño tendré que cambiar el width(ancho) y el height(alto)
Para eso busco los valores width="425" y heigh="344" y los remplazo por el número de pixeles que quiero que tengan. Para mantener la proporción se recomienod que restemos o sumemos el mismo número de pixeles al widh y al height. Para este ejemplo restaré 200 a cada uno.

Asi que el codigo se verá así:

<object width="225" height="144"><param name="movie" value="http://www.youtube.com/v/YPc3ghd8Kas&hl=es_ES&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/YPc3ghd8Kas&hl=es_ES&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="225" height="144"></embed></object>


y el video queda de este tamaño




Publica cualquier tipo de contenido en tu blog con embedit.in

incrustar cualquier documento en un blog con embedit/></a><br />
</div><br />
<a href=


Embedit.in es una de esas páginas que surgieron para solucionar un problema o limitación que tienen los blogs. Sabemos que archivos populares con formato .pdf o .doc no se pueden publicar directamente en un blog, pero con este sitio eso es posible gracias a que permite  publicar toda clase de contenidos en un blog de forma gratuita. Además es totalmente personalizable

Entre los archivos se encuentran:

documentos de: word, excel, powerPoint
archivos de texto: txt, rtf, csv
vectores gráficos: api, eps, ps
códigos: html, sql, js
imágenes: gif, jpeg, png, tiff, bmp, psd
también páginas web y url's




Publicar es muy fácil, sigue estos pasos:


1. Ve a la página 
2. Da clic en "select Files..." 
3. Elige el archivo
4. Copia el código que aparece en el recuadro y pégalo en una entrado en tu blog



También te puede interesar
Agregar Música al blog o página con eSnips

Agregar código javascript o HTML en Blogger
Subir archivos doc o pdf al blog con Scribd
Crear contador de visitas con Histats.com

viernes, 20 de noviembre de 2009

¿ Qué es Google Chrome OS?

Aquí dejo un video que encontre en youtube que explica en que consiste Google Chrome OS. Es bueno ir conociendo las novedades que tendrá este sistema operativo que se propone destronar a Windows. Creo que este sistema operativo ya se puede descargar en su versión Beta pero no estoy muy seguro.
A modo de Adelanto.
Nota: El video esta en inglés, es que no lo puede conseguir en Español

jueves, 19 de noviembre de 2009

Las 25 mejores Tutoriales de Photoshop del año 2009

En el blog webdesignledger publicaron un excelente artículo en el cual recopilaron según su criterio las 25 mejore tutoriales del año. Todas estan muy recomendables, tienen la contra que son en inglés, pero son muy intuitivas y con ilustraciones que permiten entenderlas a cualquiera que tenga conocimiento de photoshop

Si querés más 
Tutoriales Photoshop


Agrega efectos a tu foto

Adobe Photoshop 8 versión completa

martes, 17 de noviembre de 2009

Diccionarios Informáticos

Si eres nuevo en el mundo de la informática o no dominas todos los términos de dicho mundo y se te hace díficil entenderlo . Te recomiendo el diccionario informático en el cual podrás encontrar el significado de todas las palabras que son moneda corriente en dicha materia.

Otra opción es el diccionario que ofrece la web del programador que cuenta con 2.217 definiciones hasta el momento


Capaz te interese leer  también
Manual para crear tu blog desde cero

Conocer la calidad y la velocidad de nuestra conexión a Internet

Hay muchísimas páginas que ofrecen de forma gratuita testear la velocidad de una conexión a internet. Pero una conexión rápida no significa que la conexión sea buena. Para calificarla hay que tomar en cuenta otros factores. Por ejemplo podemos tener un buena velocidad de descargar pero que sea muy inestable, es decir que la velocidad por momentos sea rápida y por momentos baje a una muy lenta.
Páginas que nos permitan conocer estos datos hay menos. Pero navegando por la dichosa red encontre una que permite obtener numerosos datos de la conexión.  Así también se encarga de calificar la conexión en una escala que va desde una A (excelente) hasta una F(muy pobre)
Dentro de los datos que nos permite comprobar son el ping :que es el tiempo que demora en conectarse un servidor con un cliente.
También permite saber el jitter :que son esos cambios o saltos de velocidad de un momento a otro

El sitio web es www.pingtest.net . La forma en que presenta los datos es muy recomendable, la página esta en inglés pero todo se puede entender por medio de las ilustraciones

Para conocer la velocidad de subida y bajada www.speedtest.net

Discurso de Steve Jobs en Stanford

Este es un video muy conocido y difundido por la web el cual quiero compartir los lectores de este blog que aún no lo han visto.
Steve Jobs es el co-fundador de Apple y una de las personas más conocidas del mundo de la Tecnología. En esta oportunidad se dirige a los graduados de Stanford con un discurso motivador con muchos relatos de su propia vida. El video está muy bueno. Hay que mirarlo

El video esta en inglés con subtitulos en español

miércoles, 11 de noviembre de 2009

Descripción de los formatos de películas más comunes

La diversidad de formatos de peliculas que circulan por la red es tan grande que uno puede hacerse un mareo. Pero es fundamental tener una noción básica de los formatos para no llevarse algunas sorpresas.
Jonathan Préstamo Rodríguez ha hecho una mini guía "para entender las calidades de las películas descargadas y no morir en el intento" en su blog tecknoplof que no tiene desperdicio y por eso quiero compartirla

Cuando tenemos la intención de descargar una película de Internet por medio de cualquier software de intercambio entre pares o P2P (eMule, eDonkey, Azureus, Ares, uTorrent, Pando…), al realizar una búsqueda es posible que obtengamos numerosos archivos de la película que deseamos descargar. El tamaño de estos archivos puede variar, así como su calidad de audio y vídeo, desde 600 Mb hasta más de 4 Gb, aproximadamente. Ello es debido a la forma en que ha sido copiada la película, y es
que no es lo mismo una copia exacta de un DVD que una grabación clandestina con una cámara de vídeo en una sala de cine.

Por norma general existe una regla no escrita entre las personas que se dedican a ripear películas a la hora de nombrar los archivos que comparten. Seguro que, tras una búsqueda en eMule, más de una vez nos hemos tropezado con nombres de archivos de película como el siguiente:

Juegos de Guerra 2 (Spanish) 2007 DVDRIP Xvid-Mp3 (Centraldivx.com).avi

Es posible que nunca nos hayamos parado a observar todo lo que va más allá del título, pero lo cierto es que nos ofrece toda la información necesaria para saber la calidad que obtendremos tras la descarga.

Después del título aparece el idioma de la película entre paréntesis y el año de la producción. Con respecto a estos términos no comentaré nada más, porque son lo suficientemente claros como para arrojar más luz sobre el tema. Simplemente apuntar que el idioma puede aparecer escrito en inglés (lo más común) como en este ejemplo (Spanish), puede aparecer en español (Español), o incluso abreviado (ES, SP, ESP, SPA, etcétera). A la hora de realizar una búsqueda es conveniente introducir alguno de
estos términos para cribar los resultados al máximo.

Lo que sigue al año de producción (DVDRIP Xvid-Mp3) es precisamente lo que nos informa sobre la calidad en la que está ripeada la película. En este caso vemos que es una copia directa de DVD (DVDRIP), que el códec de vídeo es Xvid y el de audio es MP3.

Vamos a ver a continuación las distintas calidades que puede tener un archivo de película y cómo se especifica, generalmente, en su nombre. Comenzaremos por la calidad peor y terminaremos por la mejor.

continuar leyendo el artículo

sábado, 7 de noviembre de 2009

Convertir PDF

Convertir en formato PDF

Convertir de formato PDF a otros formatos de archivo

El formato PDF es un formato liviano que permite cargar y descargar documento de texo para visualizarlos sin tener el programa con que se generaron y de un modo más liviano.
Por ejemplo: podemos leer en pdf un documento creado con la última versión de word sin tenerla instalada desde internet o localmente muy bien sin mayores problemas. Muchas veces queremos enviar un documento de word a alguien pero resulta que este no tiene la versión que nosotros tenemos y no lo puede abrir, eso se solucionaría tranformando dicho documento a pdf, cualquiera lo podrá ver y leer aunque no tenga ninguna versión de word. Sólo requiere que tengamos intalado la ultima versión de Adobe fácil de descargar y gratis desde su sitio oficial y que generalmente todos la tenemos instalada ya que al navegar en la red muchas veces se nos sugiere hacerlo para ver más información.

Para pasar de Word a PDF
Les recomiendo un programa sencillo que pueden descargar desede aquí llamado Cute Writer , se instala fácilmente en segundos. Sólo sirve para pasar de word a pdf y una vez instalado casi no lo notarán en su ordenador o computadora. Actúa como si fuera una impresora de word, una vez abierto el texto a convertir en word o escrito, deberán ira a imprimir del menú Archivo, luego elegir CutePDF Writer como impresora en la opción nombre, dar aceptar y listo convierte su .doc en .pdf. Muy recomendable y sencillo
href="http://www.cutepdf.com/download/CuteWriter.exe">Descargar CutePDF Writer

Para pasar de PDF a Word
Un programa sencillo y fácil de utilizar (pese a que esté en inglés) es "Free PDF", además es muy intuitivo, una vez instalado lo abrimos e indicamos en el primer espacio en blanco la ruta del documento en pdf a transformar y en el segundo espacio en blanco el lugar donde queremos que genere el nuevo documento. Sólo restará dar click el botón converter y listo generará el documento en segundos. Funciona muy bien con imágenes y tablas. Aquí les dejo una imagen de la ventana principal de este programa:

pasar PDF a word

Descargar Free PDF

Ahora para darles mayores opciones les paso a dejar un sitio donde podemos descargar programas para convertir pdf a otro formato o al revés, deberán poner ateción algunos son de pago y otros free:
Pinchar aquí

viernes, 6 de noviembre de 2009

Buena lista con tutoriales para aprender más sobre programación

ABC nos ofrece una buena lista de tutoriales a tener en cuenta para aprender más
Verlos pinchando aquí

miércoles, 4 de noviembre de 2009

Visor de Imágenes panorámicas con JQuery

Crear un visor de imágenes panorámicas con JQuery

Como les prometí continué mi búsqueda de distintas opciones para colocar imágenes o fotografías panorámicas en una web...
Fue entonces que encontré una buena opción usando JQuery (Ver Ejemplo) , aquí les dejo los pasos:

1. Descargar el archico jquery.panorama.zip y descomprimirlo. En él se ecuentran todos los archivos para lograr el efecto; esta carpeta deberá estar en tu sitio web contiene estilos css, scripts y una carpeta para las imágenes, en ella deberás colocar tú imagen panorámica.
Descargar aquí
2.Coloca en el head de tu página el siguiente código.

<link rel="stylesheet" type="text/css" href="css/jquery.panorama.css" />

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript" src="js/jquery.panorama.js"></script>

3.Este otro código colócalo en el cuerpo de tu web (body) donde deberá aparecer el visor.

<img src="img/atelier.jpg" class="panorama" width="2642" height="375" />

Modifica donde dice img/atelier.jpg, por el nombre de tu archivo de imagen colocado en al carpeta img
Pruébalo se ve muy bien...
Si te queda una duda no dudes en dejarme un comentario...

Si te interesa el tema tienes más información y opciones en la siguiente web (muy recomendable)
Panorámicas 360º, 8 formas de incrustarlas

¿Cómo colocar una imagen panorámica o fotografía panorámica en tu web o blog?

Cargar fotografías panorámicas en un sitio web

Todos hemos visto el buen efecto que tiene entrar en una web y ver una imagen panorámica... Pues se me ocurrió que deberíamos saber como colocar una imagen panorámica en nuestro blog.
Lo primero a tener en cuenta es saber como hacer una imagen panóricamica. Para quienes manejan photoshop este puede ser una buena opción, para quienes prefieren un programa más sencillo y fácil para crear panorámicas, les digo que hay varios en la web, a mí me gustó este: (que además es free o gratis)
Microsoft ICE
Lo puden descargar en varios lugares, yo aquí les dejo una opción.
El proceso es muy sencillo luego de sacar varias fotografías de todos los planos de nuestra paisaje o lugar del que se quiere crear la panorámica, se abren dichos archicos de las distintas imágenes tomdas con este programa y él mismo se encarga de unirlas todas, luego realizamos el recorte deseado y listo , ya tienen la panorámica...
Ahora una vez que tenemos nuestra panorámica la pregunta es : ¿Cómo cargamos o subimos la fotografía panorámica el sitio web?
Encontre varías opciones, algunas más complejas como:
El Mundo de las panorámicas
con el beneficio de ser en español
Y otra más sencilla e intuitiva pero en inglés (no teman es fácil)
www.clevr.com
Una vez realizado el registro te permite subir tus fotos panorámicas y te da un código para poderlas pegar en tu web...
(Atención: cuando la intenten pegar un post o publicación de vuestro blog les dara que no acepta la etiqueta embed no hagan caso la publica igual y se ve muy bien)
Aquí les dejo el ejemplo:



Espero les guste y les sirva...
De todos modos vamos a seguir investigando sobre el tema pues hay mucho más al respecto por descubrir...
Astillero Gijón