Usar cualquier fuente en una web

google webfonts, usar fuentes, css y fuentes modernas, alternate fonts in web

Por Emmanuel Vargas – Web designer and photographer

google webfonts, usar fuentes, css y fuentes modernas, alternate fonts in webCon el HTML 5 nuevas cosas salen y cuando la mayoria de los browsers acepten bien el CSS 2 y 3 se podran hacer muchas cosas en la web. Por lo pronto nos debemos de conformar lo que los navegadores permiten.

Sin embargo sabemos que una fuente creaiva nos puede ayudar en el diseño o bien elegirla para que tenga una mayor legibilidad pero lo snavegadores estan muy limitados con las tipicas Arial, Verdana, Helevetica, Time New Roman, pero hay una alternativa muy facil que si somos cuidadosos no hara lenta la descarga de la pagina web y esta solucion son las webfonts que google nos ofrece.

Es muy sencillo, la eliges y google te ofrece oncodigo para que lo copies y pegues y asi puedas declarar en tu CSS cuando quieras usar la fuente sin que el usuario la tenga instalada y de manera transparente. Es muy facil y se pueden hacer sitios sorprendentes con solo elegir una buena fuente.

http://www.google.com/webfonts/

Anuncios

Usar cualquier fuente en una web

Con el HTML 5 nuevas cosas salen y cuando la mayoria de los browsers acepten bien el CSS 2 y 3 se podran hacer muchas cosas en la web. Por lo pronto nos debemos de conformar lo que los navegadores permiten.

Usar cualquier fuente en la web ahora es posible pero aun no es muy práctico

Es posible usar algunos servicios que convierten las fuentes en codigo para que este sea cargado en un archivo JS, y de esta manera usar la fuente que deseamos. Aun asi esto conlleva a saturar un poco la pagina web al cargar el javascript correspondiente y la fuente seleccionada. Hay un par de alternativas en la web que te ayudan a convertir las fuentes en JS para usarlo de este modo:

TYPEFACE y CUFON son dos paginas donde podraas convertir la tipografia que desees y usar el javascript indicado para que esta pueda trabajar en tu sitio.

Pros y contras de usar cualquier fuente en la web

Entre los pros esta que el diseño puede parecer mas atractivo, el javascript permite que un navagedor reciente pueda visualizar las fuentes y uno no actualizado no las ve pero si ve el texto por default.

Los contras son obvios, el tiempo de descarga crece mucho, se requiere de navegadores de ultima generacion para verlo adecuadamente, hay algunos problemas en Internet Explorer (pero eso no es una sorpresa)

.

Piramide del exito en SEO

Via :

http://sdgestudio.com/blog/2011/02/21/piramide-del-exito-en-seo-o-posicionamiento-en-buscadores/

PIramide del exito seo, posicionamiento en buscadores, optimize su pagina web, rank alto en google, no al pagerank, tips de posicionamiento

Reglas para un mejor copy

El internet provee millones de sitios con mucha información, por lo tanto hay que hacer un copy que permita comunicar rápido y claramente ya que los usuarios se toman entre 3 y 7 segundos para decidir si la pagina les llama la atención.

Evita escribir coas sin fundamento

1.- Mantén los párrafos cortos

En lugar de hacer un párrafo muy grande y que intimide mejor desglosalo en párrafos pequeños y trata que cada uno tenga su encabezado o idea. De esta manera habrá manera que alguien de sólo leer los encabezados juzgar si le interesa.

2.- Justifica a la izquierda los párrafos

Como todo libro es mejor si justificas a la izquierda ya que es así como estamos acostumbrados a leer, justificar a la derecha o al centro cuerpos de texto grandes dificultan la lectura.

3.- Evita escribir contenido sin fundamento o sustancia

Llenar de anuncios, spam o imágenes que nada tengan que ver con el artículo estara evitando que el usuario se quede en tu sitio y que vuelva. Por el contrario, cerrará la ventana y buscara en otro sitio.

4.- Agradece y contesta los comentarios

Los comentarios son una medida que te muestra que las personas les interesó tu infromación. Si el comentario es en contra agradece la crítica y toma manos en el asunto para mejorar lo que detectes de esta manera. El internet está hecho para intereactuar.

Escribe un mejor texto o copy para tu sitio web

5.- Usa puntuación y signos raros lo menos posible

Lo ideal es casi no usarlos, mantén las ideas cortas y facilitarás la lectura y con ello las visitas.

6.- Usa imágenes que ayuden al artículo

El uso de imágnes adecuadas al contenido capta la atención ya que sin siquiera leer una línea el usuario puede quedar interesado en tu página.

7.- Incluye algún link de ejemplo

Es bueno si das algún link de muestra sobre lo que hablas para reforzar el mensaje o bien si quieres dar información adicional a quien al leer se interese.

Escribe lo mas sencillo, sin faltas de ortografia y con parrafos cortos

8.- Escribe lo más sencillo posible

Las audiencias de internet  no siempre tiene conocimientos técnicos o especializados así que habla de manera sencilla, si deseas vender algo procura que sea de manera sencilla y sin tecnicismos.

9.- Procura no tener faltas de ortografía

Sí tienes un diseño o anuncio para tu mercado no debe de tener ninguna falta de orotgrafía, la gente juzga y si ven faltas de ortografía pensarán que también te equivocarás al realizarles un trabajo.

to more than one animal or person. For instance, “They are ready for their prizes now.”

are to use capitalization rules for headlines and keep them as short as possible. Also, write every headline in an article the same way. For instance, in this article, I have begun each headline with an action word.

10.- Finalmente, si tu informacion salió de alguna fuente cítala

Este artículo fue basado y no copiado de uno encontrado en la siguiente página cuyos contenidos están en inglés. Hay que dar crédito al autor.

.

Diseñador, elige tus clientes!

Las empresas suelen ser muy exigentes  a la hora de contratar los servicios de un diseñador, que el precio sea buena, la calidad perfecta, le tiempo de entrega puntual, que puedan hacer muchos cambios y que no les cuesten.

Si nos ponemos a pensar por que ellos exigen y algunos lo hacen muy poco. Los diseñadores deben de exigir ciertas caracteristitcas a los clientes o de plano, no trabajar con ellos. En lo personal lo peor que me pueden decir y que muchas veces me ha hecho perder el interes son frases como:

  • Si me intereresa pero que precio me das para trabajar contigo (regateo)
  • Excelente quiero contratarte, solo que necesito 3 meses para pagarte (pagos tardados)
  • Dame a buen precio este proyecto  y te voy a seguir dando trabajos (regateo y mentiras, jeje)
  • Necesito que me des el mejor precio y que lo termines para mañana (urgencias, cliente absurdamente loco)
  • Mejorame estas cotizaciones de tu competencia y te doy el trabajo (cliente desleal y que de seguro ni te pagara)

Para trabajar con un cliente me tengo que sentir a gusto y ver que es honesto y con un servicio o producto que tambien crea en el.

Bajo que parámetros podemos juzgar a los clientes:

Tamaño de la empresa: Con que tamaños de empresas haz disfrutando mas trabajar? Con enormes corporativos y con empresas medianas y pequeñas?

Presupuesto: Cual es el presupuesto minimo de la empresa? Es suficiente el presupuesto de la empresa para hacer un trabajo de calidad y  en el tiempo indicado?

Acuerdo para los pagos: La empresa que te contrara servicios paga hasta el final de trabajo? No dan anticipos? NOquieren dar anticipo para empezar el proyecto? CUIDADO. Las empresas leales no tienen ningun problema en dar anticipos y todo se puede arreglar dialogando, si no es asi puede que ni te convenga ese cliente.

Nivel técnico del cliente: Estas dispuesto a trabajar con un cliente con cero conocimientos tecnicos de lo que concierne al proyecto? Esto puede afectar las aprobaciones y puede llevarte a que te hagan muchos cambios a lo que ya estaba aprobado.

Cooperación del cliente en el proyecto: Prefieres un cliente que te da sus requerimientos y que espera a que se lo entregues terminado? O prefieres un cliente que se involucre en le proyecto, que te retroalimente y te de tips, informacion? Con cual puedes trabajar mejor, esto depende de ambos.

Duracion de la relacion laboral: Te interesan proyectos de una sola vez o prefieres proyectos que sean una relacion duradera con trabajos que regularmente se llevaran al cabo?

Tu personalidad y la de tus clientes: Que tipo de personas son las que mas facil te acoplas apra trabajar y con cual tipo de personas te cuesta trabajo y se generan confilctos? Analiza si debes de cambiar tus actitudes y analiza si la culpa fue de la empresa y como lo puedes solucionar.

 

Si tienes que decidir entre 2 o mas has una tabla comparativa

En una hoja de calculo pon las caracteristicas y califica del 1 al 5 a los clientes en cuestion, analiza y si tienes alguna duda habla con el cliente, despeja tu duda y calidificalo. Claro, esto obvimente en secreto para no ofender egos. Suma los puntos y promedialos, esto te ayudara a guiar mejor tu decision. Suerte.

 

.

Lo que me piden para trabajar en Victoria, BC

Ugh!,  en unos lugares me piden ser un experto Drupal, en otros un experto Joomla, en otros un experto en DotNetNuke pero aqui me piden ser un experto wordpress, que por lo que he estado estudiando de todos estos seria el mas asertivo y sencillo de los CMS.

Si bien una web en wordpress tiene sus limitaciones es mucho mas rapida que si es en Drupal o en DotNetNuke por que trabaja mejor la base de datos. He notado por experiencia en trabajar con el DotNetNuke que a veces se pone muy lento, casi imposible de trabajar, no creo que las facilidades que da este CMS sean mayores para que sea soportable trabajar con un entorno lento que tambien repercute en los usuarios ya que un sitio en DNN se pone lento cunado hace sus actualizaciones y respaldos de la base de datos.

Pero bueno, por ahi me dijo un pajarito que si quiero trabajar para una empresa de diseño web en Victoria, BC tengo que saber muy bien hacer diseños wordpress al estilo de los siguientes sitios:

Asi que ya saben si quieren que les paguen a 40 CAD la hora pues ya saben en lo que deben ser expertos. Yo por lo pronto ya compre un tutorial de como hacer temas wordpress en Lynda.com WordPress 3: Creating and Editing Custom Themes

.

Diferencias entre browsers al mostrar textos y CSS

Es obvio para un diseñador web que habra diferencias al mostrar una misma pagina en diferentes navegadores. Sin embargo hay veces que es dificil enseñarle eso a un cliente y es una buena practica mostrar de manera visual las diferencias. A continuacion pongo una imagen done se muestra como el texto tiene minimas pero notables diferencias que estan marcadas con un circulo rojo y marcadas con un cuadrado rojo se muestra como hay minimas pero notables diferencias en la altura de renglones.

Los navegadores en cuestion son: Firefox, Google Chrome, Opera y Safari.

html y css varia segun el browser
html y css varia segun el browser
.

Drupal WYSIWYG FCKEditor : Como instalarlo

Si bien los fans de Drupal dicen que esta documentado muy bien todavia deja algunas dudas a la hora de documetnar como instalar un WYSIWYG, es decir un editor tipo word para que editees tus textos sin usar el codigo HTML. Por sus siglas WYSIWYG (what you see is what you get) o “lo que ves es lo que obtienes” es una gran herramienta a la hora de que alguien sin experiencia en HTML pueda actualizar una pagina web en Drupal.

Sin embargo el instalar el FCKEditor fue un poco dificil ya que la ayuda esta un poco confusa y fue cosa de leer los README los cuales tambien te dan una informacion a medias. He aqui la manera de instalar de manera mas clara:

Archivos que son necesarios:

1.- Necesitas el modulo WYSIWYG

2.- Necesitas un medulo editor como el FCKEditor

3.- Necesitas el javascript para que funicone el FCKEditor con el WYSIWYG: FCKeditor.Java: Java integration for FCKeditor

PASO 1:

Cuando tengas esto podras subir el modulo en archivo comprimido del WYSIWYG y el del FCKEditor a la carpeta sites/all/modules y ahi descomprimirlas.

PASO 2:

Subir y descomprimir el contenido del archivo coprimido con el javascript del FCKEditor dentro de la segunda carpeta del modulo FCKEditor sites/all/modules/fckeditor/fckeditor

Paso 3:

Habilitar los modulos como normalmente se hace, establecer los permisos de usuarios, y listo queda instalado. Se recomienda leer los archivos README de cada modulo y del Javascript apra mejor referencia. Lo que no dice muy claro en los foros de Drupal es que necesitas 3 descargas para hacer funcionar el sistema WYSIWYG y que el Javascript va dentro de la segunda carpeta del FCKEditor.

Espero ayudarlos y darles unas pistas mas claras, tambien pueden siguiendo estos pasos instalar otras editores en lugar del FCKEditor  como aqui los muestra este compañero del blogs: http://www.ribosomatic.com/articulos/editor-de-texto-wysiwyg-para-drupal/


iTunes o Cuidado con los hackers, troyanos y software malicioso

Cuentas de iTunes vinculadas con el servicio de pagos por internet, Paypal, habrían sido alteradas por hackers. Varios usuarios de estos servicios se quejan de que “piratas” vaciaron sus suscripciones.

Cuidado con los troyanos y software en sus computadoras

Es bien sabido que los hackers diseminan programas, juegos aplicaciones o meten software malicioso para robar datos como nombres de usuarios, passwords, tarjetas de credito y todo esto con la complacencia de los bancos quienes tardan a veces meses en devolver el dinero sustraido de tu cuenta. Un caso muy sonado esta pasando a los usarios de ITunes Store ya que hackers se han introducido al sistema y han robado miles de dolares en musica, aplicaciones y todo lo que se puede descargar en esta tienda de apple. De esta manera usuarios han quedado con deudas de miles de dolares y su cuenta banacaria vacia.

Revisa por virus tu ordenador y mas importante no bajes torrents ni cosas piratas

Ten cuidado y no visites sitios peligrosos o de warez o porno que de seguro te coges un virus troyano y si tienes la mala fortuna te podrian vaciar tu cuenta de banco mediante la iTunes Store.
Mas Informacion en el articulo via la BBC de londres.

Proceso de trabajo que aplica al diseño

Si bien un gran problema en cada trabajo de diseño web o grafico es captar la necesidad real del cliente esto se puede lograr mediante la informacion adecuada y un proceso ordenado.

Lo mas importante es pedirle al ciente toda la informacion,, ejemplos e ideas de como cree que debe ser su trabajo, no siempre lo que el cliente cree es lo que necesita pero si no da la informacion no se le puede guiar en lo que es la mejor solucion.

He aqui un diagrama de un proceso para un proyecto completo

Esta en ingles, y muestra de manera muy detalla da las etapas de un proyecto desde que se contacta al cliente, se le pide la informacion y se hace un brief o recopilado de los requerimientos para poder hacer una propuesta que contemple todos los detalles y asi evitar malentendidos y tratar de minimizar los imprevistos. Lo tome de una empresa de outsourcing en Canada, espero les sirva tanto como a mi.