Blog

Modal dinámico en Bootstrap 4

bootstrap 4

En un artículo anterior explicamos cómo refrescar contenido en un modal de Bootstrap 3, algo muy útil para una ventana de información tras añadir un producto al carrito con Woocommerce por ejemplo. Si no lo recordáis o queréis echarle un vistazo, podéis hacer click aquí. En esta ocasión explicaremos cómo podemos hacer lo mismo con un modal en la versión 4 de Bootstrap, pues el método anterior ha sido eliminado del framework. No entraremos tanto en detalle explicando el por qué hemos elegido hacerlo así o para qué sería útil porque ya lo hicimos en el artículo anterior, así que vamos directamente al nuevo método para poder actualizar el contenido del modal de Bootstrap o lo que es lo mismo, hacer modals dinámicos en Bootstrap 4. Puesto que ya no funciona como antes, en el que utilizábamos el atributo ‘href ‘ de la etiqueta ‘a’ o bien un atributo ‘data’ con el nombre ‘remote’, no veo necesario utilizar el elemento de enlace para abrir el modal, por lo que vamos a usar un span en esta ocasión.Antes: [crayon-5bc73ab3dd3e1899337747/] Ahora: [crayon-5bc73ab3dd3e7124360699/]   El código de la ventana o popup en este caso hemos preferido tener varios elementos estáticos como lo son el header y footer del modal, pero también podrían ser dinámicos si necesitáramos que tuvieran alguna otra función o información a mostrar. En nuestro caso el botón de continuar con la compra y finalizar la compra serán siempre los mismos. [crayon-5bc73ab3dd3e9846155233/]   Lo realmente diferente viene ahora, pues necesitaremos tener el código jQuery que ponemos a continuación para que al hacer click sobre nuestro elemento ‘Añadir al carrito’, el modal cargue la información deseada. [crayon-5bc73ab3dd3eb116909665/] Si os fijáis, el código contiene una pequeña comprobación que hace ligeramente más óptima la carga del servidor, pues en lugar de eliminar el contenido y volver a cargarlo en cada click, lo que hacemos es comprobar si el atributo ‘remote’ sigue siendo el mismo. Por ejemplo, el modal podría contener los términos y condiciones de uso desde varios enlaces en la misma página. También se ha añadido una variable de php por GET que nos servirá para comprobar si debo mostrar únicamente el contenido de la página solicitada, o por lo contrario debo mostrar la página junto con toda la cabecera, menús, footer, etc. Por último el template de la página contendrá el contenido del modal. Comprobaremos si existe la variable GET llamada modal para mostrar más o menos contenido. [crayon-5bc73ab3dd3ef350583134/]   Por último, aclarar que el código jQuery se lanzaría en todos los modals de la web, por lo que si quisierais tener contenido estático y dinámico en diferentes modals, no deberíais aplicar el evento click a todos los elementos data-toggle modal. Una solución serían crear una clase específica para los divs dinámicos.

Más info

Conoce cómo solicitar la verificación de una cuenta de Instagram

verificación de una cuenta de INstagram

La verificación de una cuenta de Instagram es de gran importancia si lo que deseamos es potenciar una marca registrada, una marca personal o un producto.Este paso demuestra la autenticidad de una cuenta y aporta mucha fiabilidad cuando se puede ver el tan ansiado tic azul. Como ocurre con otras herramientas y aplicaciones de Instagram, cuando se comienza a utilizar una utilidad, no está al alcance de todas las cuentas y como no, con las verificaciones al principio también ocurría así: no todo el mundo podía solicitar que su perfil estuviera verificado. En la actualidad todo eso ha cambiado y se puede solicitar la verificación de cualquier perfil. ¿Qué tengo que hacer para solicitar la verificación de una cuenta de Instagram? Es más fácil de lo que parece, pero debes seguir algunos pasos. En primer lugar tienes que hacerle una foto al DNI del titular si es un perfil personal o la identificación si se trata de un negocio o empresa. Después deberás entrar en la cuenta de Instagram y acceder a la configuración, una vez dentro, podrás encontrar en el listado la opción solicitar verificación y te pedirá la fotografía con el documento que has realizado previamente. Llegados a este punto, todo está correcto, pero…¿Qué criterios se siguen para aceptar la verificación de una cuenta de Instagram? Criterios para la verificación de una cuenta de Instagram Los criterios que sigue la red social para aceptar una verificación, principalmente son 4: Importancia La importancia consiste en tener una cuenta con muchas búsquedas, seguidores e interacciones en las publicaciones. En conclusión, un perfil que sea conocido por muchos usuarios. Cuenta completa Debe ser un perfil completo o lo que es lo mismo, debe tener rellenos campos como, la biografía, la foto de perfil, una primera publicación… También se exige que no haya enlaces a otras redes sociales y es muy recomendable que haya alguna web o tienda online a la que redirigirnos. Autenticidad La cuenta debe tener como titular a un negocio o entidad registrados, o bien, a una persona real. Como he explicado anteriormente, Instagram verifica la autenticidad a través de documentos identificativos. Singularidad La cuenta debe ser la única en representar a una persona o empresa/marca. Lo más común es verificar una única cuenta por entidad, a no ser, que la marca o producto se venda en varios países. Si eso es así, habrá una cuenta verificada en cada idioma. Si se cumple esta serie de requisitos, Instagram otorgará la verificación de tu perfil personal o tu cuenta de empresa.

Más info

No todos los backlinks son iguales. Cómo distinguirlos para aumentar el posicionamiento orgánico SEO

grafic_backlink

En mi anterior artículo Cómo conseguir enlaces de calidad para posicionar, intentaba responder a las preguntas más habituales a las que se enfrentan todos las o los responsables del posicionamiento orgánico (SEO), en cualquier proyecto web, cuando se les exige la captación de enlaces entrantes (backlinks) para mejorar las posiciones de las palabras clave. ¿Por qué son tan importantes los enlaces entrantes para tu proyecto web? Ya sea una tienda online, una web corporativa o una página de aterrizaje (landing page). ¿Qué es un backlink? Pregunta obvia que requiere ajustar y aclarar para no perderse en el enorme listado de términos anglosajones que inunda el día a día del marketing digital. ¿Qué es una estrategia LinkBuilding y para qué sirve? Para que comprendas la importancia, sus posibilidades, y la necesidad de una buena planificación para alcanzar tus objetivos en los resultados orgánicos. Y terminaba con la cuestión, probablemente, más interesante ¿Cómo conseguir esos enlaces entrantes tan deseados? Pero también avisaba, antes de lanzarse a la caza y captura de enlaces entrantes a lo loco, que no todos los backlinks son lo mismo, no todos se consiguen igual, y muchos, en vez de ayudarte a subir posiciones, podían conseguir justo el efecto contrario y arruinar el proyecto al que tantas horas y días le habías dedicado. Tipos de backlinks. Un backlink no deja de ser un enlace que enlaza, conecta, una página web con otra. Y como link que es, existen dos tipos muy distintos: Enlace dofollow. Los link dofollow son los que debes perseguir en tu estrategia de LinkBuilding. Son los ansiados enlaces que traspasan parte de la autoridad la página web al dominio que enlazan. Son el tipo de enlace que se genera por defecto pero, como explicaremos más adelante, al mismo tiempo son los menos habituales y por lo tanto los más buscados y deseados. Enlace nofollow. Los enlaces nofollow son los backlinks más habituales a conseguir por cualquier proyecto web. La mayoría de ellos se consiguen fácilmente, y muchos de ellos gratis, al darse de alta en un directorio temático o participar en un foro de opinión sobre tu sector, por ejemplo. La contrapartida es que estos backlink nofollow NO traspasan la autoridad web de su dominio al otro dominio con el que enlazan, el denominado y ansiado grial link juice. Para diferenciar un enlace dofollow de un enlace nofollow se le añade el atributo rel=”nofollow” dentro de la etiqueta HTML que contiene el atributo principal href. Y con esta explicación, es necesario responder a la siguiente pregunta: ¿Los backlinks nofollow mejoran el posicionamiento SEO? Rotundamente sí: los enlaces entrantes nofollow también sirven y son necesarios para tu estrategia de construcción de enlaces. Por una parte, aunque no traspasan autoridad de una web a otra, sí favorecen el incremento de visitas a la página enlazada. Es decir, ayudan a aumentar el tráfico de visitas al clicar sobre el hipervínculo. Y las visitas que recibe tu proyecto web es uno de los principales indicadores que atiende el algoritmo de Google, y del resto de buscadores, para dar mayor o menor importancia a una página web dentro de su buscador. Y además, la araña de Google encontraría muy raro que sólo tuvieras enlaces dofollow, o todos los enlaces nofollow. Se interpreta como un enlazado artificial, no natural. Lo “normal”, lo esperable, es que haya un equilibrio y se mantenga una proporción aceptable entre backlinks dofollow y backlinks nofollow. Si has llegado hasta aquí, como ya estarás deduciendo de este artículo, existen múltiples factores a tener en cuenta para conseguir una estrategia linkbuilding exitosa. No puedes salir a captar enlaces entrantes para tu proyecto web al tun tun y a lo loco. ¿Qué factores debo tener en cuenta para acertar en la planificación para conseguir enlaces hacia mi página? Un nuevo condicionante que debes tener en cuenta es evitar agregar enlaces entrantes de manera compulsiva. Es decir, para Google, y para cualquiera, resulta “antinatural” y “sospechoso” que un día agregues una docena de enlaces entrantes y después, durante semanas o meses, no recibas ningún otro link nuevo. Por este motivo, para aprovechar al máximo los backlinks conseguidos, y no arriesgarte a conseguir el efecto contrario y sufrir alguna penalización, debes agregar tus preciados enlaces progresivamente, paulatinamente, de manera periódica, y en ningún caso varios de golpe. ¿Todos los backlinks son buenos? Cómo distinguir entre un backlink bueno y un backlink malo o enlace tóxico. Más cuestiones a revolver en próximos artículos. Prometo responder a todas las cuestiones planteadas que hayan podido quedar abiertas. Continuará…

Más info

La tipografía y el color en la marca gráfica

marca gráfica

En el anterior artículo hablábamos sobre la importancia que tenía la marca y puntos a tener en cuenta a la hora de su creación. Si ya tienes un nombre, es hora de crear la identidad visual corporativa o marca gráfica. Identifica los elementos de una marca gráfica Lo primero que debemos saber es a identificar los elementos que la componen: Isotipo: es la parte simbólica de la marca y puede funcionar por separado, como el check de Nike. Logotipo: el nombre o las siglas, se utilizan como texto utilizando una tipografía personalizada o característica para que sea reconocible, como Coca-Cola o Sony. Imagotipo: es la combinación de la imagen y el texto, estos pueden funcionar también por separado, como la marca del supermercado Carrefour o Adidas. Isologo: El texto y la imagen van juntos y no funcionan por separado, como Burger King. Estos son los elementos que pueden conformar una marca, pero dependiendo del producto o servicio que ofrece la empresa puede necesitar un logotipo o un imagotipo. Por ejemplo, hay una tendencia en las marcas de ropa a tener logotipo, como Zara, Women’s Secret o Mango. Sin embargo, para una empresa de restauración, por ejemplo, sería mejor emplear un imagotipo que pueda adaptar el isotipo a la vajilla del restaurante, uniforme de empleados, etc. Ya hemos decidido que forma elementos deben conformar la marca, entonces ¿cuál es el siguiente paso a seguir? Tenemos que tener en cuenta dos de los elementos más importantes a la hora de crear la marca, la tipografía y el color. Una mala elección de estos factores hará que nuestra marca no conecte con el público deseado o que demos una imagen que no queramos. Empecemos con una parte fundamental del diseño de marca, la tipografía. Debemos tener en cuenta el mensaje y la función que queremos transmitir, ya que los tipos tienen su propia personalidad y el tipo de letra que usemos puede transmitir estilo y calidad o todo lo contrario. ¿Qué tipografía debo elegir para una marca gráfica? Las tipografías se dividen en dos grandes familias, las sans serif o palo seco y las serif o romanas. Pasamos a definirlas un poco. Sans serif o palo seco: se considera la más moderna, estas tipografías se desprenden de lo accesorio y se queda con lo funcional. Son tipografías actuales de bordes simples, minimalistas, con aire juvenil y una lectura más clara y legible. Estas fuentes suelen utilizarse para transmitir innovación, juventud y minimalismo. Las familias más conocidas son la Helvética, Futura, Arial o Verdana. Hay diferentes variantes de esta familia y se suelen utilizar con diferentes fines. Las rounded, son tipografías redondeadas y de formas suaves, por lo que se suelen utilizar en proyectos que tengan que ver con la infancia o empresas que requieran cercanía con sus clientes y amigables. Algunos ejemplos son las Comfortaa o la Quicksand. Las geométricas son tipografías muy versátiles y se pueden lograr grandes combinaciones, pueden ser serias, elegantes o dinámicas y divertidas. Se suelen utilizar en áreas como la tecnología, la innovación o que tengan que ver con la ciencia. Ejemplos de esta familia son la Futura o la Century Gothic. Las condensed son tipografías más estrechas de lo normal para obtener un aspecto rígido y duro. Se suelen utilizar con bastante interletrado para darle un aspecto sofisticado, moderno y elegante. En la familia de las condensed tenemos las PT Sans o la Roboto Condensed. Por último, las tipografías modernas son bastante neutras y se pueden aplicar a cualquier proyecto, sobre todo están pensadas para textos web, por lo que si necesitas destacar no son las más aconsejables. Ejemplos de tipografías modernas son la Univers, Frutiger o Raleway. Serif o romanas: son las tipografías más antiguas pero a la vez también pueden ser modernas, son características de la prensa escrita y la literaria ya que sus remates nos ayuda a no perder el hilo del texto. Son tipografías elegantes y con estilo. Suelen utilizarse para instituciones, empresas que quieren transmitir prestigio y formalidad, en moda, belleza y artículos de lujo. Dentro de las Serif encontramos la Times New Roman, Baskerville, Garamond o Bodoni. Dentro de las Serif encontramos las Slab, tipografías como las serif pero con remates cuadrados, son más modernas y sólidas, pero a la vez divertidas. Al ser unas tipografías sin contrastes y de líneas rectas, transmiten la seriedad y solidez de las sans serif con la delicadeza de las serif. Ejemplos encontramos en la Rockwell, Museo o Clarendon. También podemos encontrar otras tipografías que pueden venir bien para ciertas marcas, hablamos de las script o caligráficas y las decorativas. Las script son tipografías que imitan la escritura manual realizada con plumas, pinceles, pinceles o cualquier intrumento de escriura. Son letras elegantes de trazo modulado y fino que originan una gran fluidez, se relacionan con el lujo, la elegancia y la sofisticación. Suelen utilizarse en proyectos históricos y tradicionales, también en productos de gama premium. En este grupo entrarian las tipografías góticas, y se suelen utilizar para firmas o títulos. En cuanto a las decorativas, son tipografías originales, características y con personalidad que se crean para un fin específico, por lo que para incorporarlas a una marca hay que estar muy seguro. Muchas pierden la legibilidad al poseer texturas o deformaciones y son de mala calidad, por lo que pueden transmitir sensaciones negativas. Las decorativas suelen utilizarse para proyectos artísticos y expresivos. A la hora de seleccionar nuestra tipografía debemos tener en cuenta diversos factores, pero no hay ninguna regla establecida al respecto por lo que tenemos un amplio abanico de posibilidades. Las sans serif tienen un carácter flexible que las hace perfectas para combinar con otras tipografías, combinan muy bien con las serif y estas combinaciones son perfectas para obtener el carácter que estamos buscando. Dependiendo del proyecto al que nos enfrentemos tendremos que decidir la que mejor encaja, y siempre de forma objetiva, no nos dejemos llevar por las modas. Además de la familia tipográfica debemos tener en cuenta otros factores, como

Más info

Contáctanos
966 10 96 89 info@avanzaeninternet.com
O si lo prefieres
Visítanos
C/ Cid, 7, 1º dcha. 03420 Castalla (Alicante)
de lunes a jueves de 9:00 a 14:00 h. de 15:00 a 18:00 h.
viernes de 9:00 a 14:00 h.
Nuestras Redes Sociales

Nuestra web utiliza cookies propias y de terceros. Esto es necesario para que puedas disfrutar de la mejor experiencia. Más información.

Los ajustes de cookies de esta web están configurados para "permitir cookies" y así ofrecerte la mejor experiencia de navegación posible. Si sigues utilizando esta web sin cambiar tus ajustes de cookies o haces clic en "Aceptar" estarás dando tu consentimiento a esto.

Cerrar