{"id":3158,"date":"2023-06-22T14:22:31","date_gmt":"2023-06-22T14:22:31","guid":{"rendered":"https:\/\/www.appyweb.es\/diccionario\/?post_type=project&#038;p=3158"},"modified":"2023-09-04T09:32:04","modified_gmt":"2023-09-04T09:32:04","slug":"mouse-over","status":"publish","type":"page","link":"https:\/\/www.appyweb.es\/diccionario\/mouse-over\/","title":{"rendered":"Mouse Over"},"content":{"rendered":"<h1><\/h1>\n<p>Se trata de una funcionalidad que consiste en activar una acci\u00f3n cuando un usuario mueve su puntero en un \u00e1rea espec\u00edfica de un sitio web. La funci\u00f3n del <strong>mouse over o eventos del rat\u00f3n es utilizada con frecuencia<\/strong> para mostrar anuncios pop up.<\/p>\n<h2>\u00bfQu\u00e9 es mouse over?<\/h2>\n<p>Es una herramienta que se utiliza en sitios web para llevar a cabo <strong>una acci\u00f3n dependiendo de los movimientos del cursor de un usuario<\/strong>. Este recurso se implementa <a href=\"https:\/\/www.appyweb.es\/diseno-landing-page\/\">en el dise\u00f1o de landing pages con frecuencia<\/a>, para mostrar una promoci\u00f3n final cuando el usuario intenta cerrar la p\u00e1gina.<\/p>\n<p>La mayor\u00eda de las veces se trata de un anuncio pop up, de esta forma, es m\u00e1s f\u00e1cil llamar la atenci\u00f3n del usuario sin que \u00e9ste tenga que hacer clic en un enlace para visualizar una promoci\u00f3n. Sin embargo, actualmente esta funci\u00f3n no es muy utilizada en los dise\u00f1os UX o de experiencia del usuario.<\/p>\n<h2>\u00bfPara qu\u00e9 sirve?<\/h2>\n<p>Su principal funci\u00f3n es llamar la atenci\u00f3n del usuario, usualmente, cuando el mouse over activa un anuncio, \u00e9ste se abre en toda la pantalla, por lo que tendr\u00e1 la atenci\u00f3n del usuario al Instante. Sin embargo, es un m\u00e9todo muy invasivo, por lo que <a href=\"https:\/\/www.appyweb.es\/diseno-web\/\">los expertos en dise\u00f1o web recomiendan<\/a> no utilizarlo, para garantizar una experiencia de navegaci\u00f3n m\u00e1s natural.<\/p>\n<p>Aun as\u00ed, <strong>se puede utilizar para optimizar el contenido<\/strong>, por ejemplo, para proporcionar m\u00e1s informaci\u00f3n. Es algo que se ve con frecuencia en el sitio web de Wikipedia, el usuario puede posar el puntero sobre un enlace y ver\u00e1 una vista previa de su definici\u00f3n, es un caso muy \u00fatil para el UX de la enciclopedia.<\/p>\n<h2>Tipos de eventos del rat\u00f3n<\/h2>\n<p>Pero, el <strong>mouse over no es la \u00fanica acci\u00f3n que se lleva a cabo de forma similar<\/strong>, hay varios eventos del rat\u00f3n que se pueden incluir en la interfaz del usuario, como los siguientes.<\/p>\n<ul>\n<li><strong>Out<\/strong>: Se lleva a cabo cuando el cursor abandona una zona determinada, por ejemplo, cuando deja de navegar por la p\u00e1gina y se dirige a la zona de pesta\u00f1as del navegador.<\/li>\n<li><strong>Clicked<\/strong>: Se inicia la acci\u00f3n \u00fanicamente cuando el cursor hace clic en una zona determinada.<\/li>\n<li><strong>Double-clicked<\/strong>: Es similar al anterior, pero se lleva a cabo solo cuando existe doble clic.<\/li>\n<\/ul>\n<h2>Ejemplos del Mouse Over<\/h2>\n<p>Un ejemplo muy com\u00fan es que al pasar el rat\u00f3n por encima de las diferentes secciones que te ofrece el men\u00fa superior, se ilumina cada uno aclarando el color de las letras, ampliando las im\u00e1genes y <strong>reflejando as\u00ed el contenido que necesita el usuario<\/strong>.<\/p>\n<p>Esta es la forma correcta de utilizar el mouse over, pero si se utiliza para mostrar anuncios pop up es probable que Google y otros motores de b\u00fasqueda sancionen estas pr\u00e1cticas, as\u00ed el sitio web no podr\u00e1 posicionarse f\u00e1cilmente.<\/p>\n<p><script type=\"application\/ld+json\">{\"@context\":\"https:\/\/schema.org\",\"@type\":\"FAQPage\",\"mainEntity\":[ \n{\"@type\":\"Question\",\"name\":\"\ud83d\udccc \u00bfQu\u00e9 es mouse over?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"<\/p>\n<p>Es una herramienta que se utiliza en sitios web para llevar a cabo <strong>una acci\u00f3n dependiendo de los movimientos del cursor de un usuario<\/strong>. Este recurso se implementa <a href='https:\/\/www.appyweb.es\/diseno-landing-page\/'>en el dise\u00f1o de landing pages con frecuencia<\/a>, para mostrar una promoci\u00f3n final cuando el usuario intenta cerrar la p\u00e1gina.<\/p>\n<p>La mayor\u00eda de las veces se trata de un anuncio pop up, de esta forma, es m\u00e1s f\u00e1cil llamar la atenci\u00f3n del usuario sin que \u00e9ste tenga que hacer clic en un enlace para visualizar una promoci\u00f3n. Sin embargo, actualmente esta funci\u00f3n no es muy utilizada en los dise\u00f1os UX o de experiencia del usuario.<\/p>\n<p>\"}},\n{\"@type\":\"Question\",\"name\":\"\ud83d\udccc \u00bfPara qu\u00e9 sirve?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"<\/p>\n<p>Su principal funci\u00f3n es llamar la atenci\u00f3n del usuario, usualmente, cuando el mouse over activa un anuncio, \u00e9ste se abre en toda la pantalla, por lo que tendr\u00e1 la atenci\u00f3n del usuario al Instante. Sin embargo, es un m\u00e9todo muy invasivo, por lo que <a href='https:\/\/www.appyweb.es\/diseno-web\/'>los expertos en dise\u00f1o web recomiendan<\/a> no utilizarlo, para garantizar una experiencia de navegaci\u00f3n m\u00e1s natural.<\/p>\n<p>Aun as\u00ed, <strong>se puede utilizar para optimizar el contenido<\/strong>, por ejemplo, para proporcionar m\u00e1s informaci\u00f3n. Es algo que se ve con frecuencia en el sitio web de Wikipedia, el usuario puede posar el puntero sobre un enlace y ver\u00e1 una vista previa de su definici\u00f3n, es un caso muy \u00fatil para el UX de la enciclopedia.<\/p>\n<p>\"}},\n{\"@type\":\"Question\",\"name\":\"\ud83d\udccc Tipos de eventos del rat\u00f3n\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"<\/p>\n<p>Pero, el <strong>mouse over no es la \u00fanica acci\u00f3n que se lleva a cabo de forma similar<\/strong>, hay varios eventos del rat\u00f3n que se pueden incluir en la interfaz del usuario, como los siguientes.<\/p>\n<ul>\n<li><strong>Out<\/strong>: Se lleva a cabo cuando el cursor abandona una zona determinada, por ejemplo, cuando deja de navegar por la p\u00e1gina y se dirige a la zona de pesta\u00f1as del navegador.<\/li>\n<\/p>\n<li><strong>Clicked<\/strong>: Se inicia la acci\u00f3n \u00fanicamente cuando el cursor hace clic en una zona determinada.<\/li>\n<\/p>\n<li><strong>Double-clicked<\/strong>: Es similar al anterior, pero se lleva a cabo solo cuando existe doble clic.<\/li>\n<\/p>\n<\/ul>\n<\/p>\n<p>\"}},\n{\"@type\":\"Question\",\"name\":\"\ud83d\udccc Ejemplos del Mouse Over\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"<\/p>\n<p>Un ejemplo muy com\u00fan es que al pasar el rat\u00f3n por encima de las diferentes secciones que te ofrece el men\u00fa superior, se ilumina cada uno aclarando el color de las letras, ampliando las im\u00e1genes y <strong>reflejando as\u00ed el contenido que necesita el usuario<\/strong>.<\/p>\n<p>Esta es la forma correcta de utilizar el mouse over, pero si se utiliza para mostrar anuncios pop up es probable que Google y otros motores de b\u00fasqueda sancionen estas pr\u00e1cticas, as\u00ed el sitio web no podr\u00e1 posicionarse f\u00e1cilmente.<\/p>\n<p>\"}}\n]}<\/script><\/p>\n<h2>M\u00e1s informaci\u00f3n sobre mouse over<\/h2>\n<p>Si tienes la tarea de programar la experiencia del usuario en tu sitio web, debes tener en cuenta c\u00f3mo tener acceso a estos eventos con diferentes herramientas. Mira los siguientes enlaces para saber m\u00e1s.<\/p>\n<ul>\n<li><a href=\"https:\/\/www.appyweb.es\/plugins-constructores-wordpress\/\">4 plugins constructores para dise\u00f1ar webs en WordPress<\/a><\/li>\n<li><a href=\"https:\/\/informaticapc.com\/curso-de-jquery\/eventos-raton.php\" rel=\"nofollow noopener\" target=\"_blank\">Controlar los eventos del rat\u00f3n en JQuery<\/a><\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Se trata de una funcionalidad que consiste en activar una acci\u00f3n cuando un usuario mueve su puntero en un \u00e1rea espec\u00edfica de un sitio web. La funci\u00f3n del mouse over o eventos del rat\u00f3n es utilizada con frecuencia para mostrar anuncios pop up. \u00bfQu\u00e9 es mouse over? Es una herramienta que se utiliza en sitios [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"inline_featured_image":false,"footnotes":""},"class_list":["post-3158","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.appyweb.es\/diccionario\/wp-json\/wp\/v2\/pages\/3158","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.appyweb.es\/diccionario\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.appyweb.es\/diccionario\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.appyweb.es\/diccionario\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.appyweb.es\/diccionario\/wp-json\/wp\/v2\/comments?post=3158"}],"version-history":[{"count":3,"href":"https:\/\/www.appyweb.es\/diccionario\/wp-json\/wp\/v2\/pages\/3158\/revisions"}],"predecessor-version":[{"id":9295,"href":"https:\/\/www.appyweb.es\/diccionario\/wp-json\/wp\/v2\/pages\/3158\/revisions\/9295"}],"wp:attachment":[{"href":"https:\/\/www.appyweb.es\/diccionario\/wp-json\/wp\/v2\/media?parent=3158"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}