¡Nuevo Antyweb 2021!

Y todo está empezando ahora mismo. Espero que cuando leas estas palabras todo funcione bien, porque aunque probamos el sitio web de diferentes maneras, sé por experiencia que el lector siempre encontrará algunos errores.

Cambios

Diseño

Después de más de 5 años, el aspecto del sitio web finalmente debe cambiarse. No solo porque el actual ha envejecido, sino también porque todo el entorno ha cambiado por completo. Hoy en día, los dispositivos móviles son lo más importante, y la página de inicio en el escritorio debe ser legible y sencillamente bonita. Personalmente, también quería volver a la arquitectura de contenido más clásica y su diseño en el sitio web. La cronología es más clara cuando los textos se colocan uno debajo del otro. El sitio web está más limpio, todo parece más claro. También fue importante para mí que el diseño enfatizara la naturaleza del sitio web. Tecnológicamente, agresivo, moderno y legible: así se supone que es el nuevo Antyweb y espero que lo perciban de esta manera.

Nuevo logotipo, es decir, cambio de marca.

El logotipo de Antyweb necesitaba actualizarse después de 15 años en línea. Sin embargo, no me gustan los cambios drásticos en esta área y, por lo tanto, la tarea no fue tan fácil. Sí, los primeros proyectos que vi fueron muy intrigantes, pero buscaba un elemento de agresividad en ellos y no pude encontrarlo, hasta que finalmente vi este símbolo animado (el símbolo al lado del logo en el sitio web es animado , si lo miras, verás esta secuencia).

¿Y qué se supone que significa eso? Por un lado, está la clásica letra A, que está a punto de convertirse en una versión más belicosa. Y de eso se trata Antyweb. Varias opiniones, a veces profesionales, a veces emocionales y a veces provocativas. Y en mi opinión, este logo nos representa muy bien. Es supuestamente clásico y parecido al anterior, pero a la vez tiene algunas sangrías en él, pero solo dentro de la palabra Anti, porque esto es algo que nos distingue. Aparte de eso, el símbolo cambiante en mis ojos complementa muy bien todo y le da un nuevo carácter a todo el logotipo.

Tecnología

Mucha gente nos felicitó por poder optimizar WordPress de tal manera que podría mantener dicho sitio web en el nivel y la velocidad de operación adecuados. Pero ha llegado el momento de decir “basta” y decir adiós por completo a la tecnología actual. Ahora WordPress es solo un panel de administración. El resto … puedes leer más sobre esto a continuación.

Sin embargo, la tecnología no cambia solo porque haya surgido una nueva y mejor. La tecnología también es un sitio web de ejecución más rápida, más aficionado a Google y, lo que es más importante, una mejor interacción para los lectores. Es por eso que mi principal objetivo y KPI para la tecnología es qué tan rápido funciona el sitio web y qué tráfico podemos absorber, sin la necesidad de agregar servidores.

Michał, dime lo que hiciste

La agencia Autentica y su jefe, Michał Samojlik, fueron responsables del nuevo proyecto Antyweb. Le pedí que describiera lo que realmente pensó e hizo:

Me complace que sea, si cuento correctamente, la cuarta versión de Antyweb, que tenemos la oportunidad de diseñar en Autentica. Esta vez, el desafío resultó estar conectado con el cambio de marca de la marca, que solo agregó sabor a todo el ejercicio. Así que recibimos una nueva marca, que definitivamente enfatiza el “carácter” del sitio web en el contexto de una competencia apasionada. El nuevo Antyweb requería un diseño que coincidiera con el estilo del nuevo logo.

Sin embargo, el cambio de marca no fue la única ni la principal razón de la decisión de rediseñar todo el sitio web. El campo UX / UI en los últimos 5 años (sí, eso es lo que tenía la versión anterior) ha avanzado significativamente, han aparecido nuevas soluciones, tendencias, patrones y mecanismos. Ya era hora de reflejar el progreso de la industria en el aspecto y el funcionamiento de Antyweb.

Móvil primero

Sí, es un cliché de la industria, pero las estadísticas de tráfico de la mayoría de las editoriales son una clara prueba de ello, especialmente si hablamos de la categoría de tecnologías ampliamente entendidas. Comenzamos completamente con la versión móvil, tratando el escritorio como “hazlo tú mismo”. Y así fue. La arquitectura de la información, los diseños de pantallas individuales, la red publicitaria, las interacciones se prepararon teniendo en cuenta los teléfonos inteligentes.

Cuando buscamos una característica distintiva, decidimos enfocarnos en fotos grandes en el fondo. Entonces tenemos la apertura de la página de inicio y el artículo en forma de imagen que ocupa la mayor parte del espacio de la pantalla. De vez en cuando, también encontrará artículos o videos especiales que tienen sus propias soluciones:

El formato de la columna, favorecido por los lectores, también conservó su carácter individual, y aquí renunciamos por completo a las fotos.

Uno

La página principal es modular y la publica la oficina editorial. La gestión de todo el diseño y el contenido desde el lado del CMS ofrece posibilidades ilimitadas de ajustar el diseño a las necesidades tanto de los periodistas como de los anunciantes. Así que no se sorprenda si encuentra elementos nunca antes vistos o cambia el orden de los bloques de vez en cuando.

Lucha por la atención del lector

Sin embargo, es más interesante en lugares que pueden ser menos visibles, pero muy importantes desde el punto de vista comercial del editor. Se trata de distribuir el tráfico y luchar contra las visitas breves y superficiales. Se trata de mantener y cambiar algunas opciones en el ojo del lector para ir más allá, para elegir contenido nuevo. Así que tenemos enlaces a la página de inicio y al menú de categorías como elementos flotantes.

Además, el sistema muestra automáticamente vistas previas de otros artículos seleccionados contextualmente en lugares predeterminados, reemplazando así al personal editorial del sitio web. La clave también tiene en cuenta la necesidad de una ubicación eficaz de los anuncios y una pasarela de suscripción al boletín. En un futuro próximo, realizaremos investigaciones que, en base a los datos recopilados, nos permitirán optimizar el sistema si es necesario.

Todo esto tiene como objetivo mantener el interés del lector y brindar opciones en caso de los primeros signos de estar saturado con el contenido actual. Se produjeron muchos cambios en la propia red publicitaria, aparecieron nuevos formatos. Sin embargo, no me explayaré sobre este tema, porque creo que no sería un tema muy popular entre los lectores 🙂 Sin embargo, intentamos combinar una buena exposición de los anuncios de los clientes con una comodidad de lectura inalterada.

Continuando con la tradición de 5 años, esperamos ser invitados nuevamente en 2026. ¡Gracias Grzesiek!

Tripas completamente nuevas

La nueva infraestructura de Antyweb es principalmente un cambio de un monolito a microservicios. WordPress ha sido reemplazado por algunos servicios más pequeños con funcionalidades dedicadas; solo queda el panel de administración del antiguo sitio web.

Al construir la infraestructura y, de hecho, el nuevo Antyweb, usamos las últimas tecnologías y tendencias en el enfoque de construcción de aplicaciones basadas en microservicios.

Frontend, o lo que ves, es una aplicación PWA, es decir, una aplicación web progresiva, que cuando se traduce al polaco significa que es una aplicación construida con la premisa de “móvil primero”. El objetivo es garantizar la recepción de aplicaciones web de la más alta calidad por parte de todos los dispositivos y navegadores, independientemente de la calidad de la conexión a Internet. Inmediatamente después de ingresar al sitio web, algunas cosas se guardan en la memoria del dispositivo utilizando trabajadores del servicio (un pequeño código responsable de la forma en que se cargan los elementos utilizados en el sitio web), y el reingreso al sitio web es mucho más rápido gracias al uso de datos guardados.

Eso no es todo, porque aparecerá una API misteriosa. Para mostrar información en el sitio web, el cliente de front-end necesita descargar datos desde algún lugar. El lugar desde donde los descarga es la API, que a su vez recupera datos directamente de la base de datos o Elasticsearch (el sistema de base de datos responsable de BIGDATA), dependiendo de los recursos descargados. Para acortar el tiempo de respuesta del servidor tanto como sea posible, los datos descargados o construidos se guardan en el sistema Redis para su posterior visualización.

El Elasticsearch mencionado anteriormente contiene documentos que en realidad son una representación del artículo y todas sus conexiones. Entonces, es una base de datos tan grande (en forma de json) con archivos de texto.

Tanto el frontend como el backend están compuestos por módulos, lo que facilita el mantenimiento y la expansión de todo el sistema.

Como aplicación, Antyweb es sin cabeza, lo que significa que el contenido del backend está separado de los archivos frontend y estáticos. Estos archivos se almacenan en el servicio S3 en AWS (almacenamiento de objetos en la nube, un servicio de Amazon). ¿Qué nos aporta la tecnología sin cabeza? En primer lugar, se trata de un servicio de datos mucho más rápido gracias a la división de la responsabilidad de la aplicación y la adaptación de la CDN a la transferencia adecuada de archivos estáticos.

El nuevo Antyweb también es muy flexible cuando se trata de administrar la apariencia, los datos y su flujo. Podemos construir una nueva página de inicio en cualquier momento gracias a la estructura modular del sitio web. Podemos agregar un subservicio o un diseño de página completamente nuevo. Cada elemento del sitio web es un módulo que se puede gestionar de forma prácticamente gratuita.

Mirando desde abajo a la nueva infraestructura, también tenemos un sistema de implementación de datos muy flexible. Todo está automatizado (lo que significa que ningún archivo en los servidores se cambia manualmente) y garantiza la coherencia total del sistema. Y todo el proceso de realización de la nueva versión de la aplicación se realiza con un solo clic (lo vi con mis propios ojos, tarda entre 3-5 minutos). Este enfoque se llama integración continua.

La implementación de todas estas complejas tecnologías de sondeo nos permite utilizar los recursos de manera mucho mejor y más eficiente. Dicen que necesitamos menos servidores para manejar más tráfico. ¿Por qué?

Así es como se ve ahora la interacción con la aplicación Antyweb:

El usuario ingresa a la página: la consulta se envía al servidor, se devuelve el html base, que se construye en el lado del servidor y contiene toda la información (es decir, todos los módulos ya están conectados entre sí). Luego, cuando intentas cambiar a otro elemento de la página, solo se reemplazan los módulos que son nuevos y necesarios en ese momento. No es necesario volver a descargar HTML.

Antyweb ya no es un sitio web sino una aplicación adaptada a nuestras necesidades.

Por supuesto, no soy tan sabio para entenderlo todo, Sebastian Szczepański, quien es el padre y la madre de esta solución, me ayudó en la descripción tecnológica. Sebastian está involucrado profesionalmente en el diseño de soluciones tecnológicas tan complejas pero necesarias.

Gracias

Nunca construiríamos Antyweb nosotros mismos, por lo que me gustaría agradecer al equipo de Autentik por su paciencia, comprensión y gran enfoque, y a Sebastian por crear una solución desde cero, gracias a la cual Antyweb ha alcanzado y superado los estándares actuales en muchos aspectos. . Hosters que mantienen Antyweb con valentía, por un enfoque de consumidor mega pro, para llamadas nocturnas, sin nervios durante la implementación, por paciencia y un apoyo increíble

¡Lectores!

Por estar con nosotros todo el tiempo, por todos los comentarios valiosos, también por los menos amables pero sinceros, etc. Gracias a ti nos movilizamos constantemente para trabajar, por eso ahora contamos con tu opinión sobre la nueva Antyweb. Déjame saber lo que crees que no funciona. Estoy seguro de que todavía hay mucho margen de mejora. Incluso si probamos el sitio web durante 2 meses, no encontraremos tanto como usted en 30 minutos.


Source: AntyWeb by antyweb.pl.

*The article has been translated based on the content of AntyWeb by antyweb.pl. If there is any problem regarding the content, copyright, please leave a report below the article. We will try to process as quickly as possible to protect the rights of the author. Thank you very much!

*We just want readers to access information more quickly and easily with other multilingual content, instead of information only available in a certain language.

*We always respect the copyright of the content of the author and always include the original link of the source article.If the author disagrees, just leave the report below the article, the article will be edited or deleted at the request of the author. Thanks very much! Best regards!