Guias de programacion y temas diversos web

En maestrosdelweb tienen  una galeria de excelentes de guias de programacion  y otros temas web de muy buena calidad , si alguna quisistes aprender sobre algun tema en especifico solo deberias de darte una vuelta por esta galeria , lo temas que se tratan son muy actuales.

Recientemente se ha incorporado la guia de Django el framework de Phyton , todas las guias estan accesibles al publico lo que unico que tienes que hacer regalar un click para compartir la guia en cualquier red social.

Solo para finalizar el diseño de la interaz es muy llamativo , es uno de los mejores que he visto

Link : http://www.maestrosdelweb.com/guias/

Apache server-status activado cuidado !!

Existe una funcion muy util en los servidores apache llamado server-status que basicamente es una pagina web sencilla html que muestra el numero de procesos , el estatus de cada peticion IP que visitan el sitio  y un monton de cosas por el estilo.

Esta herramienta puede ser muy util pero tambien puede perjudicar la seguridad de tu  web , si lo dejas abierto a cualquiera  , hay mucha informacion de vital importancia en ese documento . Asi que como todo proveedor de hosting que se respete deberia de tener bloqueada esa funcionalidad .

Algunos ejemplos serian estos :

1. http://www.ford.com/server-status/ 
2.  http://www.cisco.com/server-status/

Los invito a comprobar en sus server si esta opcion esta activada y si es el caso procedan a tomar las medidas necesarias para bloquear al acceso al publico a ella .


Les dejo aqui el link de como repararla por su cuenta : http://httpd.apache.org/docs/2.2/mod/mod_status.html

Los formularios de registro web tienen que morir

Hace no mucho lei un articulo titulado "Sign Up Forms Must Die"  y tengo que decir que estoy totalmente deacuerdo .

Creo que mostrar  formularios de registro como primera impresión al usuario es cosa del pasado , como dice el articulo algunas paginas ofreciendo algun producto o servicio interesante a los usuarios y de pronto cuando comienzas a interesarte mas en el producto o servicio ZAS !! con el bendito formulario .

De esa manera pagan al usuario por haber despertado un poco de interés en su servicio , tenemos que ofrecer mas al usuario , indicarle por que nuestro servicio es lo mejor para el  y podemos hacerlo sin usar un formulario de registro obligado.

Por ejemplo hoy conteste una pregunta en stackoverflow , nunca había contestado una y nunca me había registrado en esta web , pero quise dar un aporte , que creen que paso? pues solo tuve que escribir mi respuesta a la pregunta del usuario y poner mi correo nada mas , note que en la parte de arriba de la derecha la web me habia creado un perfil asi ni mas ni mas . asi de facil sin formularios de registro.

No debemos pagar al usuario el poco interés que desperto en nuestra web con un formulario de registro a la primera , siempre hay manera mas amigables y progresivas de como hacerlo.

Un ejemplo rápido seria usar autenticacion de facebook o google , es una manera rápida de registrar usuarios .

Aprender a ser un emprendedor

Tienes una idea de negocio en Internet y no sabes como llevarla a cabo?
Sientes que te hace falta espíritu de emprendedor para alcanzar tus metas?

No hay mejor momento como el ahora  las tecnologías estan a nuestro alcance  , la información y el trabajo colaborativo no tiene fronteras en estos días   Internet nos entrega todo en bandeja solo es saber como tomarlo y como aprovecharnos de ella para explotar nuestras propias ideas.

Por que solo en otros países se triunfa con solamente una idea ?
Por que es mas fácil salir adelante en otros países que el tuyo?

Bueno si quieres saber todas esas respuestas y aprender a ser un emprendedor de la mano de los expertos este curso es para ti y lo mejor que es totalmente gratuito.

Con apoyo de instituciones y empresas como el Banco Santander, Google, Universidad Internacional Menendez Pelayo, Universia, Red Emprendia, Orbyt, UNED-Csev, Escuela de Organización Industrial, Conferencia de Rectores de Universidades Españolas, y la Fundación de la Biblioteca Virtual Miguel de Cervantes, UniMOOC-Emprende es un curso completamente abierto y gratuito al que puedes acceder con tu cuenta de Google.

Mejor miren el vídeo para que sepan de que hablo



link: http://unimooc.com/

Tabla periodica en 3d en tu navegador

Increible este proyecto de una tabla periodica en 3D usando three.js , cada vez mas el 3d el lado del navegador me sorprende .

Si quieren aprender un poco mas de esta libreria 3d visiten http://learningthreejs.com/.

puede ver la tabla aqui : http://mrdoob.com/lab/javascript/threejs/css3d/periodictable/

Crea tu web con el estilo metro de windows 8

Si te gusta la nueva interfaz metro de windows 8 y quieres imitarla en algun proyecto web ahora puedes hacerlo con un nuevo framework llamado BootMetro , es un nuevo proyecto basado en Bootstrap  , básicamente se usa de la misma manera que bootstrap con la diferencia que los estilos serán estilos metro.

He estado ojeando un poco el proyecto aunque tiene ciertas cosas que pueden mejorarse , el proyecto cumple con su objetivo de lograr una interfaz minimalista estilo metro , invito a todo a probar el framework y crear algún proyecto con el .

A mi me gusta mucho la interfaz metro creo que voy a utilizar este framework para mis próximos proyectos webs.

enlace : http://aozora.github.com/bootmetro/

El verdadero costo de retina display

Lo primero que se me viene a la mente con esta nueva resolucion de pantallas es en el consumo de ancho de banda necesario para cargar imagenes de mas resolucion .

A veces en  paises de America latina no disponemos de buenas conexiones y los sitios optimizados para retina display pues no cargarian tan rapido , tal vez una solucion podria ser que en el sitio web hubiera una opcion para que el usuario decidiera cual version del sitio quiera cargar.

Usar logos e iconos en svg  me parece buena idea para enfrentar un poco el problema de las resoluciones con retina display , pero desafortunadamente los svg todavia tiene algunos problemitas en su renderizacion cuando haces zoom in.

Ahora dispositivos mobiles con retina display? supongamos que  pueden tener contratado planes de datos para navegacion y ese es otro problema como todos saben siempre hay limites en el ancho de banda en mobiles y si quieres navegar en  sitios en resolucion retina pues creo que tu plan de datos llegara muy rapido a su limite.

bueno solo son algunas conclusiones aqui pensando en rato frente al ordenador. buscare algo de informacion por ahi para aclararme un poco mas.

Los secretos de las presentaciones de steve job

Tienes problemas en como hablar en una conferencia ?

Quieres tener el carisma y facilidad del habla con el publico ?

Quieres saber como steve job llego a ser tan bueno en sus conferencias ?

Hay que admitirlo no cualquier persona tiene la facilidad  para hablar en publico y captar su atencion en todo momento , hoy me encontre con un libro que trata de tecnicas para hablar en publico y no morir en el intento el unico problema es que libro esta en idioma ingles pero se que por ahi hay muchas personas que no tienen problemas con el idioma ademas siempre esta el traductor de google para nosotros.

Steve job presentation from Ringga Arie

Estilos basicos CSS

Les quiero compartir un enlace donde pueden encontrar estilos basicos de css para aplicar en sus proyectos , tiene sus ejemplos  y su codigo listo para copiar y pegar .

enlace: http://tympanus.net/Tutorials/BasicReadyToUseCSSStyles/

Filtro de video que rejuvenece

Una empresa a creado un software que aplica un filtro de video en tiempo real que te hace rejuvenecer en pantalla

Ejemplo menu css 3 3D

Miren que bonito este ejemplo de menu 3D en ccss 3 : http://soulwire.github.com/Makisu/

WebRTC el framework html 5 se mira interesante

Hoy leo que existe un framework para html 5 para comunicaciones en tiempo real  se llama WebRTC segun leo en su pagina oficial ademas de estar enfocado en comunicaciones en tiempo real tambien permite compartir archivos de gran tamaño como audio y video.

Ademas todo indica que esta tecnologia es soportada actualemente por google , mozilla y opera. Dentro de 4 meses segun se estima sera soportado por todos los navegadores , el framework segun entiendo incrementa la velocidad de la transmisión de audio , video y demas componentes y pueden ser accedidos por medio de la API en javascript. permitiendo desarrollar aplicaciones tipo chat con video con mucha facilidad.

Si quieres saber mas de esta tecnologia visita la pagina oficial del framework para que conozcas su API y puedes hacer experimentos .

link : https://sites.google.com/site/webrtc/home

Como sera el nuevo Megaupload

Leo via  fayerwayer las nuevas caracteristicas que tendra el nuevo Megaupload , la verdad que ahora si que la tendran dificil las compañias que se han dedicado a caza del copyright , aqui las caracteristicas

• Los archivos que se suban serán encriptados en el navegador del usuario, y éste obtendrá una llave única para poder descifrar el archivo.

• Serán los usuarios los que tengan el control del acceso a un archivo que fue subido al servicio, dependiendo de con quién compartan o no la llave de acceso.

• Debido a que Mega no tendrá la llave, la empresa no puede revisar los archivos subidos a su servicio de almacenamiento, ya sea una canción, película, videojuego, etc. Esto hace que Mega no pueda hacerse responsable del material que suben sus usuarios, y que no se les pueda demandar por eso. “Lo que sea que se suba al sitio, se mantendrá cerrado y privado sin una llave”, dijo Dotcom.

• No se aplicará la llamada “duplicación” en sus servidores, un sistema utilizado para ahorrar espacio. Por ejemplo, con la duplicación si dos usuarios suben el mismo archivo, en realidad se sube una sola vez y se da acceso a las dos personas a lo mismo. Pero Mega funcionará distinto: Si cien usuarios suben el mismo archivo, se encriptará cien veces y se subirá cien veces, generando cien llaves para descifrar diferentes. Eliminarlas todas requeriría 100 solicitudes de parte de los estudios y sellos.

Si quieres leer la noticias completa aqui el link : http://www.fayerwayer.com/2012/10/mega-es-el-nuevo-megaupload/

Como tener tu propia tienda online facil y rapido.

Algunas personas me han preguntado si existe alguna manera facil y rapida de poner una tienda online ,  pues yo siempre digo que rapida no la hay , siempre estan los CMS y plugin para crear tienda virtuales  pero después me preguntan como integran todo eso a facebook .

La cosa no es tan simple aun usando los CMS populares que existen como joomla o wordpress  , pero hoy he visto un servicio un tanto interesante para crear tu tienda en linea  se llama ecwid , y por mucho esta es la  forma mas sencilla de añadir un carrito de compras a tu pagina de facebook, tiene métodos de pago como Paypal, incluso mediante orden telefónica. 

Otra caracteristica muy buena es que una vez que creas tu catalogo con el servicio puedes insertar tu tienda en cualquier pagina web que tu quieras , solo agregando el codigo html que el sistema te genera asi puedes tener tu tienda en muchas paginas webs al mismo tiempo de una sola vez. aqui dejo un video de ejemplo de como se agrega una tienda en wordpress en 5 minutos asi de facil lo unico malo es que esta en ingles.

Ecwid. Getting Started. from Ecwid Team on Vimeo.

Buscando en youtube encontre un video tutorial en español para que se den una idea como funciona:




Puedes consultar las planes aunque la version gratuita es mas que suficiente para comenzar a testear a ver si te gusta.

En este enlace puede ver  un ejemplo de una tienda en facebook : http://www.facebook.com/ecwid?sk=app_251458316228   , tus potenciales clientes pueden hacer comentarios sobre los productos y compartirlos a otras Redes Sociales.

El servicio esta en muchos idiomas por si se lo preguntaban  , ahora si no tienes ninguna excusa para no montar tu propia tienda online y integrarla en facebook en  un par de clicks.

link : http://www.ecwid.com/

Como es windows 8 ?

Todavia no tengo la oportunidad de ver el nuevo sistema operativo de la microsoft  pero hoy he leido un articulo muy bueno en fayerwayer donde explican  algunas diferencias entre windows 7 y 8 .

 los invito a leer el articulo si quieren saber cuales son :

 http://www.fayerwayer.com/2012/10/las-8-principales-diferencias-entre-windows-7-y-windows-8/

Que es Retina Display ?

Retina display en la boca de todos desde que apple hizo su anuncio , ni modo hay que adaptarse a las nuevas tendencias . Personalmente no he visto ningun dispositivo con una pantalla de retina display por eso me abstengo de escribir un articulo sobre esta tecnologia pero hoy lei un articulo de freddy vega en cristallab sobre el  retina display y queria compartirlo para los que aun no saben que es esta nueva tecnologia :

aqui dejo el link : http://www.cristalab.com/blog/que-significa-retina-display-en-el-diseno-web-c108299l/

Conoce los Datacenter de google

Quieres conocer los datacenters de google ? pues ahora con google streetview puedes hacerlo .

Les dejo el link aqui  : http://www.google.com/about/datacenters/inside/streetview/

Ripple Emulator para probar tus sitio mobiles

Hoy encontre una herramienta muy buena para testear nuestros sitios web para mobiles , aunque aun esta en beta hace muy bien su trabajo los invito a probarla para probar sus sitios , es una extension para google chrome por cierto.



 https://chrome.google.com/webstore/detail/ripple-emulator-beta/geelfhphabnejjhdalkjhgipohgpdnoc

El mejor gif animado que he visto hasta ahora

Este es por mucho el mejor gif animado que he visto:

Herramientas para evaluar usabilidad web

Tengo que admitir que no se nada sobre usabilidad web , hoy estuve leyendo un post muy bueno que quiero compartir sobre este tema para que otros no este igual de perdidos que yo .

http://www.maestrosdelweb.com/editorial/aplicaciones-gratuitas-para-evaluar-usabilidad/

Aprender a programar con Codecademy

No se como nunca habia escrito sobre Codecademy , se me habia pasado por alto  , pero bueno Codecademy es una web donde puedes aprender a programar lenguajes de programacion como phyton , Ruby , javascript , ect  aunque la mayoria de la buena informacion esta  en ingles este sitio es muy recomendable para aprender lenguajes nuevos que te interesan .

Les dejo el link de la pagina en hispana para lean un poco sobre ella  :  http://www.codecademy.com/es/#!/exercises/0

El estado de javascript en el 2012

Si te dedicas a esto de hacer webs y el asunto de la internet seguramente sabras que javascript es el lenguaje que  is kicking asses en la internet y bueno hoy navegando por lo rincones oscuros de la web encontre una presentacion  del creador de javascript brendan Eich (el tipo de abajo) donde hace un repaso del futuro de javascript para su proxima version .

Pueden encontrarla en este link : http://brendaneich.github.com/Strange-Loop-2012/#/

Para ver la presentacion tienes que usar las flechas del teclado para mover el contenido, Aprovechando este post de javascript queria compartir alguna informacion importante relacionada con Javascript.

Lo primero es el uso de : use strict  encontre un buen articulo donde hable sobre esta sentencia en javascript , la recomiendo esta muy buena : http://raohmaru.com/blog/javascript/use-strict/

Lo segundo era un ejemplo en javascript sobre como dibujar con letras por donde pasa el mouse , para verlo en accion arrastren el mouse haciendo click entre mas rapido lo hagan mas grande se dibujaran las letras : http://codepen.io/tholman/pen/qCnfB

LLevando el kinect de Microsoft al proxima nivel

Investigadores de Microsoft, en conjunto con el Laboratorio de Cultura de la Universidad de Newcastle y la Fundación para la Investigación y Tecnología, han creado un dispositivo que es capaz de hacer un seguimiento completo de nuestra mano como si fuera una pulsera .

Adobe Edge, el reemplazo HTML5 de Flash

Por si alguien aun no lo sabe , y para los que hechan  de menos a Abode Flash ahora existe  Adobe Edge Animate que es una aplicación para crear animaciones en HTML 5 con CSS 3 y  permite generar acciones, interactividad y controla eventos del usuario .

Ya no uses flash ahora usa : http://html.adobe.com/edge/animate/

Les dejo un video de como funciona

Web Platform Docs nueva alternativa de documentacion

Si eres programador web sabras que en tu dia a dia siempre estas revisando documentacion sobre como hacer alguna cosa en html , javascript o cualquier cosa , buscando los estandares web html 5 y cosas por el estilo.

Al final terminaras siempre revisando sitios como estos : Referencia de Mozilla , StackOverflow , referencias de la W3C/WHATWGy algun que otro blog , bueno pues ahora se ha lanzado otro sitio pero este es un poco direferente a todo los demas se llama : http://docs.webplatform.org/




Pero que diferencia este sitio de los demas ?? bueno aqui algunas poderosas razones.

1)  Todos los provedores de navegadores esta trabajando para documentar todo sobre del lado del Navegdor : DOM, CSS, HTML, SVG, Canvas, HTML5, JS, ES5…

2) Ya han aportado mucho de su contenido : referencia de  MSDN IE , Opera Web standar y muchos articulos sobre HTML5 Rocks.

3) Escritos de tiempo completo de google , Microsoft , Abode y otros agregando contenido (este no se si creerlo).

4) Y que la documentacion estara mucho mas organizada y facil de encontrar

Aunque en la web dice por todos lados que esta en alpha se puede ver codigo de ejemplos y buena documentacion sobre estandares web .






  Si quiere contribuir con el  proyecto puedes dirigirte a este link : http://docs.webplatform.org/wiki/WPD:Getting_Started 

Conoce a Carlos Icaza

La primera vez que escuche de Carlos Icaza fue en un periodico local donde habia un reportaje sobre el , me gusto mucho saber que un Nicaraguense tenia tanto exito en el mundo de la internet . Si eres Nicaraguense y te dedicas a esto de la web  estas obligado a saber quien es el y que ha hecho para el mundo.

Iba un articulo completo pero como ya he encontrado uno pues no vale la pena hacerlo , una cosa de ser programador es que escribes codigo solo una vez para hacer una cosa , asi que mejor pongo el link donde sale su biografia link : Carlos Icaza


Aqui pongo un video de los 10 mandamientos de los emprendedores de Carlos



Lo  ultimo que conozco que ha hecho Carlos a sido http://lanica.co/   que es un motor de juego para moviles  , hechen un ojo a la web para saber mas .

Tambien el link de su blog : http://www.carlosicaza.com/

Dibujando cosas con Box-Shadow (increbile)

Hola hoy he visto ua tecnica un tanto peculiar sobre como dibujar , logos , imagenes , o vectores solo con un elemento html y puro css .

La tecnica basicamente es hacer copias de cada elemento pixel y posicionarlo donde tu quieras y de esa manera ir formando tu dibujo. Bueno creo que con unos ejemplos te puedes dar cuenta de lo increible de la tecnica aqui pongo algunos link de dibujo hechos solo con CSS repito no son imagenes son dibujados con CSS.

1. http://codepen.io/jackrugile/pen/tGBAC
2. http://codepen.io/joshnh/pen/iwmAp
3. http://codepen.io/joshnh/pen/rxAtE
4. http://codepen.io/Kseso/pen/pmEah
5. http://codepen.io/joshnh/pen/ohbHl

Como recordatoria esta tecnica es genial pero realmente nunca deberia de usarse en produccion  , por que el box-shadow no es soportado por todos los navegadores y el render es muy lento.

Por ultimo si quierem probar con sus propias imagenes aqui les dejo un link  donde puede subir tu imagen y sera convertida a css pero no usen imagenes muy grandes link :  http://codepen.io/blazeeboy/pen/bCaLE

Remote debugging , debuguear en nuestros dispositivos moviles

Remote debugging  los permite ejecutar y caturar codigo en dispositvos moviles , permitiendonos una manera de inspeccionar el HTML , CSS y javascript y hace cambios en vivo  , es como usar el modo consola de google chrome  pero para moviles  , asi podemos evitar usar emnuladores.

 Tenemos la siguentes herramientas a nuestra disposicion aunque la documentacion esta en ingles creo que se puede entender muy bien para los que tengan problemas con el idioma ,  sino pues para eso esta el traductor de google que es muy bueno.

1) Chrome para android :  https://developers.google.com/chrome/mobile/docs/debugging


2) Opera y DragonFly : http://www.codegeek.net/blog/2012/mobile-debugging-with-opera-dragonfly/

3) Firefox para Andriod : https://hacks.mozilla.org/2012/08/remote-debugging-on-firefox-for-android/

3) Safari para IOS 6 incluye un l Remote Web Inspector oficial : http://www.mobilexweb.com/blog/iphone-5-ios-6-html5-developers

Y los quiero invitar a que vean esta presentacion sobre remote de debugging donde muestran muchas mas herramientas como las que publique link : http://thecssninja.com/talks/remote_debugging/

maily para enseñar a tus hijos a usar el correo

Maily es un servicio para enseñar a usar a tus hijos pequeños a usar un cliente de correo electronico , lo cual me parace my buena idea por que no conocia una herramienta asi , aqui les dejo el video de la presentacion.




link : http://www.maily.com/

Microsoft TypeScript - La version de Microsoft de javascript.

Bueno asi como lo leen microsoft tiene su version de javascript a falta de mas informacion sobre este tema pondre un fragmento del sitio http://wwwhatsnew.com/

"Dicho de manera simple, TypeScript no es más ni menos que un superconjunto de JavaScript. Gracias a esta característica, se puede utilizar muchas de sus funcionalidades sin tener que aprender un lenguaje desde cero. Tal como lo explican en sitio web de TypeScript, este lenguaje toma prestado las mejores características de JavaScript, a la vez que añade otras que son fundamentales dados los avances en la tecnología de la programación.

Por lo que nos encontraremos que TypeScript cuenta con clases, tipos y módulos, de lo que JavaScript carece, ofreciendo un amplio conjunto de herramientas ideales para grandes proyectos realizados en Javascript o TypeScript nativo. Como es de esperarse tendrá soporte para todos los navegadores web, para cualquier servidor y tipo de sistema operativo.

Ya Microsoft dio a conocer que van a incluir un plugin para poder usar TypeScript mediante Visual Studio 2012, dando así a los programadores tradicionales en JavaScript, todo el potencial de las herramientas y características de la suite de programación."

link : http://www.typescriptlang.org/

Error 324 (net::ERR_EMPTY_RESPONSE) en google Chrome

(net::ERR_EMPTY_RESPONSE): Unknown error.This Error called Error 324 in Google  Chrome while trying to open a Website.Do not panic mostly this is just a browser cache problem you do not any malware or any major problem with your computer so you do not need any special software to fix this error.

Este error ocurre mientras chrome esta intentando abrir un sitio web y tiende a repetirse muchas veces lo cual te da la impresion que tienes algun error con tu codigo y  tienes que repararlo pero te das cuenta que no tienes ningun error y no sabes que hacer. Pero no entres en   panico este es solo un problema de cache en el navegador , no tienes virus y no es un gran problema  de tu  computadora o tu codigo .

Este es un error de google chrome un poco conocido y en un futuro estara parcheado ,
 para repararlo tienes 3 opciones:

1) Resetear tu navegador a la configuracion por defecto.
2) borrar tu historial de navegacion y tus cookies.
3) algunas veces pasa por problemas en tu conexion asi que tienes que resetear tu router.

bueno espero te sirva , y no mal gastes tiempo pensando que es un problema con tu codigo.