[fusion_builder_container hundred_percent=»no» equal_height_columns=»no» menu_anchor=»» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» class=»» id=»» background_color=»» background_image=»» background_position=»center center» background_repeat=»no-repeat» fade=»no» background_parallax=»none» parallax_speed=»0.3″ video_mp4=»» video_webm=»» video_ogv=»» video_url=»» video_aspect_ratio=»16:9″ video_loop=»yes» video_mute=»yes» overlay_color=»» video_preview_image=»» border_color=»» border_style=»solid» padding_top=»» padding_bottom=»» padding_left=»» padding_right=»» type=»legacy»][fusion_builder_row][fusion_builder_column type=»1_1″ layout=»1_1″ background_position=»left top» background_color=»» border_color=»» border_style=»solid» border_position=»all» spacing=»yes» background_image=»» background_repeat=»no-repeat» padding_top=»» padding_right=»» padding_bottom=»» padding_left=»» margin_top=»0px» margin_bottom=»0px» class=»» id=»» animation_type=»» animation_speed=»0.3″ animation_direction=»left» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» center_content=»no» last=»true» min_height=»» hover_type=»none» link=»» border_sizes_top=»» border_sizes_bottom=»» border_sizes_left=»» border_sizes_right=»» first=»true» type=»1_1″][fusion_text columns=»» column_min_width=»» column_spacing=»» rule_style=»default» rule_size=»» rule_color=»» content_alignment_medium=»» content_alignment_small=»» content_alignment=»» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» sticky_display=»normal,sticky» class=»» id=»» font_size=»» fusion_font_family_text_font=»» fusion_font_variant_text_font=»» line_height=»» letter_spacing=»» text_color=»» animation_type=»» animation_direction=»left» animation_speed=»0.3″ animation_offset=»»]
¿Qué es el WPO?
[/fusion_text][fusion_text columns=»» column_min_width=»» column_spacing=»» rule_style=»default» rule_size=»» rule_color=»» content_alignment_medium=»» content_alignment_small=»» content_alignment=»» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» sticky_display=»normal,sticky» class=»» id=»» font_size=»» fusion_font_family_text_font=»» fusion_font_variant_text_font=»» line_height=»» letter_spacing=»» text_color=»» animation_type=»» animation_direction=»left» animation_speed=»0.3″ animation_offset=»»]
Hoy en día, se busca que la navegación en la página web sea rápida y sencilla para el usuario. Además, a esto hay que añadir desde el año 2011, Google le ha dado bastante importancia a tanto a la navegación como al tiempo de carga ya que lo considera como factores importantes a la hora de posicionamiento SEO. Pues precisamente es de lo que vamos a hablar, del WPO o Web Performance Optimization, que es un conjunto de técnicas y métodos para la optimización de la carga de un sitio web.
[/fusion_text][fusion_imageframe image_id=»15600|full» max_width=»» sticky_max_width=»» style_type=»» blur=»» stylecolor=»» hover_type=»none» bordersize=»» bordercolor=»» borderradius=»» align_medium=»none» align_small=»none» align=»center» margin_top=»» margin_right=»» margin_bottom=»» margin_left=»» lightbox=»no» gallery_id=»» lightbox_image=»» lightbox_image_id=»» alt=»» link=»» linktarget=»_self» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» sticky_display=»normal,sticky» class=»» id=»» animation_type=»» animation_direction=»left» animation_speed=»0.3″ animation_offset=»» filter_hue=»0″ filter_saturation=»100″ filter_brightness=»100″ filter_contrast=»100″ filter_invert=»0″ filter_sepia=»0″ filter_opacity=»100″ filter_blur=»0″ filter_hue_hover=»0″ filter_saturation_hover=»100″ filter_brightness_hover=»100″ filter_contrast_hover=»100″ filter_invert_hover=»0″ filter_sepia_hover=»0″ filter_opacity_hover=»100″ filter_blur_hover=»0″]https://www.suratica.es/wp-content/uploads/2020/09/WPO-Optimizacion.jpg[/fusion_imageframe][fusion_text columns=»» column_min_width=»» column_spacing=»» rule_style=»default» rule_size=»» rule_color=»» content_alignment_medium=»» content_alignment_small=»» content_alignment=»» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» sticky_display=»normal,sticky» class=»» id=»» font_size=»» fusion_font_family_text_font=»» fusion_font_variant_text_font=»» line_height=»» letter_spacing=»» text_color=»» animation_type=»» animation_direction=»left» animation_speed=»0.3″ animation_offset=»»]
¿Para qué sirve el WPO?
[/fusion_text][fusion_text columns=»» column_min_width=»» column_spacing=»» rule_style=»default» rule_size=»» rule_color=»» content_alignment_medium=»» content_alignment_small=»» content_alignment=»» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» sticky_display=»normal,sticky» class=»» id=»» font_size=»» fusion_font_family_text_font=»» fusion_font_variant_text_font=»» line_height=»» letter_spacing=»» text_color=»» animation_type=»» animation_direction=»left» animation_speed=»0.3″ animation_offset=»»]
Estas técnicas lo único que pretende es mostrar el contenido al usuario lo más rápido posible, lo que conlleva a optimizar una serie de factores, que afectan directamente a ella. A continuación nombramos algunas técnicas más conocidas del WPO:
[/fusion_text][fusion_checklist icon=»fa-check-circle fas» iconcolor=»#f44336″ circle=»» circlecolor=»» size=»» divider=»yes» divider_color=»» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» class=»» id=»»][fusion_li_item icon=»»]
Compresión de imágenes.
La optimización en la subida de imágenes es clave. Google considera un error (y no le falta razón) subir una imagen de 1200px para luego mostrarla a un máximo de 300px. ¿Y esto a que se debe? Pues al peso de la imagen. No es lo mismo el peso de una imagen pequeña que puede ocupar unos 50kb, que gigante que puede llegar a 2mb o más. Influye también en esto los PPP (Puntos por pulgada). Cuantos más PPP tenga una imagen, más resolución tendrá pero también ocupará más tamaño. Se deben subir las imágenes al tamaño exacto a como se verán en la web. Tenemos más información como afectan las imágenes al SEO.
[/fusion_li_item][fusion_li_item icon=»fa-check-circle fas»]
Carga diferida.
Pongamos por ejemplo que en nuestra web, en la Home, se van a mostrar unas 60 imágenes y que todas éstas están optimizadas. ¡60 imágenes!, por poco que pese cada una, la carga total puede ser muy lenta y ralentizar bastante. La carga diferida trata de esto precisamente, sólo cargar las imágenes que se muestran y no todas. Algunos navegadores como Chrome y Firefox ya han incluido nativamente esta opción, lo cual supone una buena noticia.
[/fusion_li_item][fusion_li_item icon=»fa-check-circle fas»]
Minimizar y concatenar código.
Ya explicamos con detalle los conceptos sobre minificación de código, sólo habría que añadir el término concatenación en WPO; en el cual se intenta unificar todo el código CSS en un mismo archivo, JS en otro. Con esto conseguimos que sólo se cargue un sólo archivo (aunque eso sí, de mayor tamaño), con todo nuestro código, lo que supone menos peticiones al servidor. Esto puede dañar la experiencia del usuario, ya que puede tarda más en cargar la página web.
[/fusion_li_item][fusion_li_item icon=»fa-check-circle fas»]
Desactivar plugins.
En el caso de utilizar un CMS como Wordpress o Prestashop, por regla general, un usuario suele instalar un plugin para casi cualquier cosa. La sobrecarga de estos también afecta al rendimiento, dado que una web con 50 plugins verá si o si como su tiempo de carga es bastante alto. La desinstalación de plugins inactivos y la mejora de carga puede ser una buena solución para poder mejorar los tiempos de carga. A muchos CMS les ocurre que el código de un plugin que sólo se utiliza en una determinada página se cargue por defecto en todas. Por ejemplo, si dispongo de un plugin para crear un formulario y sólo tengo uno en la página de contacto, ¿realmente es necesario que este plugin cargue sus archivos en otra página que no sea contacto?, pues no, no lo es para nada.
[/fusion_li_item][fusion_li_item icon=»fa-check-circle fas»]
Peticiones Externas.
Se realizan casi en todas las web y es normal, pero tenemos que saber que, como todo, cuantas más peticiones haya más afectará al rendimiento. Cuando usamos una clave recaptcha, una fuente de google fonts, un píxel de facebook ó un código de seguimiento de analytics. Estos son algunos ejemplos que afectan en la carga del sitio web debido a que son carga de ficheros externos que solicitamos y no podemos mejorar el tiempo de respuesta.
[/fusion_li_item][/fusion_checklist][fusion_separator style_type=»none» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» sticky_display=»normal,sticky» class=»» id=»» flex_grow=»0″ top_margin=»20″ bottom_margin=»» width=»» alignment=»center» border_size=»» sep_color=»» icon=»» icon_size=»» icon_color=»» icon_circle=»» icon_circle_color=»» /][fusion_text columns=»» column_min_width=»» column_spacing=»» rule_style=»default» rule_size=»» rule_color=»» content_alignment_medium=»» content_alignment_small=»» content_alignment=»» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» sticky_display=»normal,sticky» class=»» id=»» font_size=»» fusion_font_family_text_font=»» fusion_font_variant_text_font=»» line_height=»» letter_spacing=»» text_color=»» animation_type=»» animation_direction=»left» animation_speed=»0.3″ animation_offset=»»]
Desde luego que existen muchas otras técnicas WPO que abordaremos más adelante, pero podemos considerar que éstas son las más básicas y que gran parte del rendimiento de una web dependen de ellas.
[/fusion_text][fusion_separator style_type=»none» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» sticky_display=»normal,sticky» class=»» id=»» flex_grow=»0″ top_margin=»20″ bottom_margin=»» width=»» alignment=»center» border_size=»» sep_color=»» icon=»» icon_size=»» icon_color=»» icon_circle=»» icon_circle_color=»» /][fusion_text columns=»» column_min_width=»» column_spacing=»» rule_style=»default» rule_size=»» rule_color=»» content_alignment_medium=»» content_alignment_small=»» content_alignment=»» hide_on_mobile=»small-visibility,medium-visibility,large-visibility» sticky_display=»normal,sticky» class=»» id=»» font_size=»» fusion_font_family_text_font=»» fusion_font_variant_text_font=»» line_height=»» letter_spacing=»» text_color=»» animation_type=»» animation_direction=»left» animation_speed=»0.3″ animation_offset=»»]
¡Hasta el #Viernesdeopinion que viene!
[/fusion_text][/fusion_builder_column][/fusion_builder_row][/fusion_builder_container]
