-

Curiosas pruebas de rendimiento de google – Google developer

Por Patricia Seuba Valls el 8 febrero, 2015 en Informático, World Wide Web

Hace no mucho he revisado algunas de las páginas con el tests de rendimiento de google y curiosa la información que ofrece.

Muchas veces deduce que una imagen de 1k le puedes bajar el tamaño, que supongo que aún puedes, pero…¿esto mejora tanto el rendimiento?

La última es que en muchas de las webs, tiendas onlines, …el cliente quiere ver el número de visitas a través de la herramienta de google, llamada analitycs y que por ello google te ofrece como integrarla. Y …ahora os cuento lo curioso.

Se supone que google consigo mismo debería estar optimizado para web, ¿verdad?

Pues parece que no es así y sino..miren el resultado de las propias pruebas de rendimiento de google:

“Especificar caché de navegador

Establecer una fecha de caducidad o una edad máxima en las cabeceras HTTP de los recursos estáticos indica al navegador que cargue los recursos descargados previamente del disco local en lugar de hacerlo a través de la red.
Aprovechar el almacenamiento en caché del navegador de estos recursos almacenables en caché:

  • http://www.google-analytics.com/ga.js (2 horas)”

Este es el mensaje literal de las pruebas de rendimiento.

Tiene gracias que estas pruebas digan que el propio google no define bien sus javascripts en caché, no?

Tú puedes tener control sobre los programas de tu web, pero de los pluggins o programas incrustados de otros, ¿cómo tener control para que no te dañe el rendimiento de tu web?

Etiquetas:

 
-

Me da error la cuenta de correo – Texto fácil que me envían algunos clientes, ;)

Por Patricia Seuba Valls el 3 febrero, 2015 en Informático, World Wide Web

Me sucede muy a menudo, incluso diría que más de lo que debería ser normal, que me llama un cliente diciendo que manda un correo a un cliente con cuenta en gmail y le sale que el cliente no existe, …

¿culpa del servidor? Me temo que no

¿ha pillado la cuenta en algún momento mal? Me temo que si

¿tenía una cuenta antigua en la caché del outlook o de otro gestor de mail? Creo que no me equivoco casi nada si aseguro que es este el problema o el anterior.

Esta es la conclusión que saca gmail si te pasa eso:

” Este error suele producirse cuando hay erratas en la dirección de correo electrónico del destinatario. Algunos de los errores más habituales:

1)Las comillas: <’nombredeusuario@gmail.com’> o <”nombredeusuario@gmail.com”>

2)Puntos al final de la dirección: <nombredeusuario@gmail.com.>

3)Espacios delante o detrás de la dirección: < nombredeusuario@gmail.com>, <nombredeusuario@gmail.com >”

Puedes leer el artículo de google en el siguiente enlace que considero interesante para todos los clientes de informáticos, ;)

Etiquetas:

 
-

Magento Compilation – ssh Compile, Clear, Enable and Disable – Compilación Magento a través de ssh

Por Patricia Seuba Valls el 1 febrero, 2015 en Magento

Upss, desastre y ya no sabemos que hacer porque no accedemos a Magento y necesitamos cómo se desactiva la compilación desde ssh.

Solución sencilla accediendo a nuestro servidor a través de ssh y ejecutando complier.php.

Un pequeño tutorial aquí mismo:

$ php shell/compiler.php
Usos:  php -f compiler.php -- [options]
state         Muestra el estado de la compilación, activa o no
compile       Ejecuta la comilación
clear Desactiva la compilación y borra los ficheros
enable Activa la compilación
disable      Desactiva la compilación
help         Ayuda!

Etiquetas: ,

 
-

Añadir una fuente nueva sin tener que diseñarla – Google

Por Patricia Seuba el 29 enero, 2015 en Sin categoría

Hoy en día, google lo pone fácil definiendo tipos de letras diversos para incorporar en la web sin dañar el rendimiento de esta y sin tener que estar diseñando el tipo de letra.

Google fonts te ofrece una amplia variedad de fuentes que puedes ver aquí y de nuevo, hace de nuestro trabajo algo más sencillo.

Es importante recordar que las letras pueden ser muy bonitas, muy estilosas, pero si quieres que haya feedback en tu web o tienda online, tiene que ser principalmente legibles. Cansar a un cliente con la lectura supone venta perdida segura.

Para poder instalar una fuente de google, iremos al enlace arriba mencionado y elegiremos uno de los que vemos.
En este caso voy a poner un ejemplo para poder ayudar a la instalación aunque es de sobra sencillo.

1) Elegimos la Normal 400, Slabo 27px y pinchamos sobre la flecha que pone “Quick use”.
Veremos rápidamente el impacto que tiene ese tipo de letra en nuestra web. Importante para no influir en el mal rendimiento de la página.
2) Elige en el segundo paso de este acceso, el estilo de caracteres que puedes llegar a usar. En la fuente que he elegido, hay 2 opciones, sólo, pero pueden ser muchas más.
3) Integra la fuente en tu web, al inicio de los tags

<head></head>

con el código que te aparece. En mi caso el siguiente

<link href='http://fonts.googleapis.com/css?family=Slabo+27px&subset=latin,latin-ext' rel='stylesheet' type='text/css'>

.

Ejemplo de la inseción:

<html>
  <head>
    <link href='http://fonts.googleapis.com/css?family=Slabo+27px&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
    <style>
      body {
        font-family: 'Slabo', latin;
        font-size: 27px;
      }
    </style>
  </head>
  <body>
    <div>Chupi!</div>
  </body>
</html>

4) Como último paso integra la fuenta en tu css en vez de ponerlo directamente en el .html para futuras modificaciones te ahorrá dolores de cabeza.
font-family: ‘Slabo 27px’, serif;
Por ejemplo:
h2 { font-family: ‘Slabo 27px’, serif; font-weight: 400; }

Etiquetas:

 
-

¿Cómo traducir una extensión de Magento? – How to translate a Magento extension?

Por Patricia Seuba el 23 enero, 2015 en Informático, Magento

¿qué opináis de si un trabajo está hecho y funciona, para qué volverlo a hacer?

En muchas ocasiones, hay desarrolladores de Magento que comparten sus trabajos con un coste que vale la pena pagar ya que el hecho de empezarlo de cero supone más esfuerzo y coste.

Hace no demasiado me encontré con uno de estos fabulosísimos trabajos con la excepción de que las traducciones al español no estaban ni pensadas y ahí fue dónde se me ocurrió poner este post donde explico cómo hacer que una extensión que no está traducida, empiece a estarlo.

Instaláis la extensión y….ta chan! sólo en inglés!
Debéis ir a app/code/community/directorios_extension/etc/config.xml y buscar dentro una referencia al fichero “.csv” o un tag <translate>

Pueden ocurrir dos cosas:
1.- No está ningún enlace a un fichero .csv
2.- Si está, pero no traduce tampoco

Vamos a explicarlo como si no estuviera y a partir de ahí, avanzamos hasta el caso 2 donde simplemente está pero no traduce.

Pasos a realizar:
1) Buscar el fichero config.xml en app/code/community donde normalmente se instalan las extensiones, en el propio directorio etc de la extención. Imaginemos que está dentro de app/code/community/extensionguay/masprogram/etc

2) coger el fichero config.xml que hemos comentado, editarlo e insertarle un trozo de código de este estilo, entre los tags de <frontend></frontend>

<translate>
            <modules>
                <advancedsearchsuggests>
                    <files>
                        <default>extensionguay_masprogram.csv</default>
                    </files>
                </advancedsearchsuggests>
            </modules>
</translate>

3) Generar ese fichero .csv en el directorio /app/locale/en_US con las líneas de los textos en inglés-inglés como de costumbre.

4) Generar ese fichero .csv en el directorio /app/locale/es_ES con las líneas de los textos en inglés-español como de costumbre y pongo un ejemplo por si no se sabe: “Price: “,”Precio: ”

Y….c’est tout!

* Es importante recordar que los textos a traducir son literales, con espacios y todo. Es decir, no es lo mismo traducir “Price:” que “Price: “. Recordarlo porque suele dar unos cuantitos quebraderos de cabeza.

Bien sencillo, ¿verdad? Pues si estamos en el caso 2, sólo abrá que hacer el cuarto paso, pero..eso ya lo sabéis todos, verdad?

Etiquetas: ,

 
-

Optimización de caché – Aumento de rendimiento agregando Headers de Expiración

Por Patricia Seuba Valls el 13 diciembre, 2014 en Magento, Posicionamiento WEB

A través de la herramienta de google que os comenté en otro post, se puede ver que es importante definir la caché de las páginas y de los tipos de ficheros tipo javascript, estilos, imágenes,…
Es en este punto es donde se debe saber que se habla de header de expiración que es donde indicamos cuando un fichero expira. Si el fichero ha expirado, se vuelve a cargar y si el fichero no ha expirado, no se carga de nuevo para poder optimizar las cargas al máximo. Por tanto, para ficheris que no cambian comúnmente como las imágenes, vídeos, javascript, hojas de estilo podríamos agregarle headers de expiración con lo cual solo se cargarán la primera vez que accedemos a la pagina.

Esto lo podemos definir a través del fichero .htaccess. Para el caso de la expiración se puede utilizar ExpiresDefault, para ello tenemos las siguientes directivas de tiempo: years, months, weeks, days, hours, minutes, seconds.

Lo recomendables es colocar una expiración mínima de una semana en los ficheros menos modificados (jpg, png, gif, swf, js, css), entonces podríamos agregar el siguiente código:

ExpiresActive On
ExpiresDefault A0

# expiracion de 1 semana para archivos estaticos

ExpiresDefault "access plus 1 weeks"

La expiración también se puede expresar en segundos. El ejemplo anterior quedaría (7 dias = 60*60*24*7 = 604800):

ExpiresActive On
ExpiresDefault A0

# expiracion de 1 semana para archivos estaticos

ExpiresDefault A604800

Otra forma para agregar la expiración es por tipo de fichero utilizando la directiva ExpiresByType. Por ejemplo:

ExpiresActive On
ExpiresDefault A0

ExpiresByType image/gif A604800
ExpiresByType image/png A604800
ExpiresByType text/css A604800
ExpiresByType text/javascript A604800

Etiquetas: ,

 
-

Scripts javascript – Async – Increase speed with script async

Por Patricia Seuba Valls el 24 noviembre, 2014 en Informático, Magento, World Wide Web

Las solucionas Javascript para incorporar módulos de facebook, twitter, zoopim o resto de programas que necesitamos para que nuestros clientes nos vean de diversas formas por la web están muy bien pero hay que tener en cuenta que son programas que se ejecutan en otro servidor y que si no se lanzan de forma asíncrona, ralentizan nuestra web.

Por ello es recomendable, en la medida de lo posible y siempre y cuando no sea un código que intervenga en la ejecución de los programas, el poner este tipo de scripts que se ejecuten de forma asíncrona.

Busca todo aquel código que se ejecute como script y evalúa cuál puedes cambiar. Por ejemplo, los de los módulos que he comentado al inicio son fácilmente ejecutados de forma asíncrona y harán que todo vaya mejor.

Para ello en las líneas donde empiecen de la siguiente forma:

<script.....>

se podrán cambiar por:

<script async...>

y veremos rápidamente el rendimiento.

Este tipo de temas se nota en gran medida cuando los servidores donde se encuentran las páginas de estos módulos no van bien o están dando fallos porque parece que nuestra propia página da errores.  Por tanto, es super recomendable ponerlo de forma asíncrona siempre que podamos.

Etiquetas: , ,

 
-

Magento – Buy or Preorder – Comprar o Reservar bajo pedido – Parte II

Por Patricia Seuba Valls el 23 octubre, 2014 en Informático, Magento, World Wide Web

En este post, explicaremos lo que dejamos en incertidumbre en el post Parte I.

Empezaremos por las partes previas a modificar los programas como es:

* Crear un atributo FECHA DE ENTREGA donde podemos definirlo como un texto abierto para poder poner una explicación a nuestros clientes tan extensa como queramos o definir los valores posibles de fecha de entrega.

* Editar la ficha de Producto y tener siempre documentada la fecha de entrega editada anteriormente en los casos de productos en reserva.

* En la ficha de producto también hay que tener en cuenta que el inventario en los productos sin stock tienen que ser cambiados y poner los siguientes parámetros cambiados:

  1. Disponibilidad en existencias – En Existencia (Stock Availability – In Stock)
  2. Pedidos de artículos sin existencias – Permitir por debajo de cero avisando o no según como se quiera (Backorders – Allow).

* Editar el fichero list.phtml de app\design\frontend\default\plantilla\template\catalog\product\ y el addtocart.phtml de httpdocs\app\design\frontend\default\plantilla\template\catalog\product\view\ para añadir el nuevo código con lo que podremos controlar si el producto está en stock y por tanto hacer visible o no la fecha de entrega.

En ambos ficheros habrá que definir 3 variables que nos dirá la situación del producto:

define("CUSTOM_BACKORDERS_YES", 1);
define("CUSTOM_BACKORDERS_YES_NOTIFY", 2);
define("CUSTOM_STOCK_INSTOCK", 1);

Por otro lado habrá que definir el botón con texto del estilo “Comprar” o “Reservar” según la situación. Se podría controlar con este código:

$rquantity = (int)Mage::getModel('cataloginventory/stock_item')->loadByProduct($_product)->getQty();
$rbackorder = Mage::getModel('catalog/product')->load($_product->getId())->getStockItem()->getBackorders();
$rstockavailability = $_product->getStockItem()->getIsInStock(); ?>
<?php if (($rquantity <= 0) && (($rbackorder == CUSTOM_BACKORDERS_YES) || ($rbackorder == CUSTOM_BACKORDERS_YES_NOTIFY)) && ($rstockavailability == CUSTOM_STOCK_INSTOCK) ) { ?>
<?php $buttonTitle = $this->__('Preorder'); ?>
<?php } else { ?>
<?php $buttonTitle = $this->__('Add to Cart'); ?>
<?php }

* Editar el fichero de traducciones para traducir la palabra backorder en el checkout.

Etiquetas: , ,

 
-

Magento – Buy or Preorder – Comprar o Reservar bajo pedido – Parte I

Por Patricia Seuba Valls el 15 septiembre, 2014 en Informático, Magento, World Wide Web

En todas las tiendas que compramos, creo que la mayoría nos gusta saber si lo que compramos está en stock o no y el tiempo que tarda en llegarnos.

Hay una forma de desarrollarlo en Magento a través del botón de compra y los atributos del inventario, a parte de tener informado a través de páginas de cuál es nuestra política de envío y de inventario.

Pasos que debemos tener en cuenta:
* Poner por ejemplo un botón de comprar o reservar según si está en stock o no.
* Definir un atributo fecha de entrega que dará más información a nuestros clientes.
* Gestionar nosotros el stock a través del inventario del producto.
* Dar de alta texto de traducciones para las reservas, si tenemos la tienda en multiidioma.

En el siguiente post informaremos de cómo se puede realizar esto editando los programas de Magento.

Etiquetas: , ,

 
-

PageSpeed Insights (by Google) – Disponible para Chrome

Por Patricia Seuba Valls el 9 agosto, 2014 en Posicionamiento WEB, World Wide Web

Hoy en día los clientes cada día más se preocupan no sólo que su página esté desarrollada, también de los comentarios a su vez de sus clientes, de las opiniones de ellos y de una herramienta que ha sacado google hace ya bastante tiempo, PageSpeed Insights y que ahora está disponible para Chrome.

Para mi gusto hay que mezclar la herramienta web junto con la de Pc, bajo chrome para poder conseguir los mejores consejos y poderlos comprobar tú mismo.

Evalúa bloqueos de Javascripts, rendimientos de CSS, tamaño de imágenes, visibilidad desde pc ó móvil y el timeout de las páginas o caché, así como muchos aspectos más. Todo esto es importante para el rendimiento y el placer de poder visitar una página y atraer más o menos clientes, pero no se debe olvidar que el aspecto que a tí te parece el más “genial” del mundo, a unos clientes les gusta a tope y a otros no les gusta nada y es más, hay aspectos que pueden mejorar el rendimiento y ser muy poco atractivos y otros ser muy atractivos pero tener un rendimiento pésimo. Evaluar todo esto junto con el desarrollo de una tienda es una de las tareas más duras y difíciles de aconsejar, asesorar y ayudar. Los informáticos nunca tenemos la razón, ;)

Ahondando en la herramienta que ha sacado Google para Chrome diré que es la maravilla para adentrarse en cada una de las peculiaridades de la programación y eso sí, la forma de pasar las horas muertas haciendo que una web pueda estar lo más óptima que se pueda.

A sudar, queridos, con esta herrmienta y a descubrir un nuevo universo! PageSpeed Insights (by Google)!

Etiquetas: , ,

Copyright © 2010-2016 Patricia Seuba All rights reserved.

Desarrollado por: Sioseo