A Andres Hernandez
Home Projects Portfolio Dashboard Export PDF Log in

Languages

English
127

Filtered Posts (Clear all)

August 11, 2026 0 Astro HTML

Optimizing Web Performance: Why We Switched to AVIF for Hero Assets

Every byte matters when it comes to first-contentful-paint (FCP). In our ongoing effort to polish the performance of the rifasvelez-web project, we took a hard look at our hero image assets and realized they were becoming a bottleneck.

Our landing pages were serving high-resolution PNG files. While visually crisp, these files were significantly inflating our total page weight. For users on mobile devices or slower connections, this translated into unnecessary latency.

The Audit

Evolving Web Content: Implementing Raffle Deletion and Dynamic Footer Updates in Astro

In dynamic web applications, content evolves constantly. Features are added, data is updated, and sometimes, entire sections need to be gracefully retired. This ongoing process of managing content lifecycle is crucial for maintaining a clean, performant, and user-friendly experience.

Recently, on the rifasvelez-web project – a web application built with Astro – we tackled two specific content management tasks: the complete removal of a raffle entry and the addition of dynamic details to the

July 11, 2026 0 PHP HTML UX

Enhancing UX: Replacing Manual Ordering with Intuitive Drag-and-Drop

The Frustration of Manual Ordering

Ever found yourself meticulously typing '1', '2', '3' into an 'order' field, only to realize you missed an item and now have to renumber everything? This common developer and user frustration was precisely what we aimed to eliminate in the pqrs project. Our goal was to modernize the management of filter options by replacing a cumbersome manual 'Orden' column with an intuitive drag-and-drop reordering system.

Why Manual Order Columns Fall Short

July 09, 2026 0 PHP CSS HTML

Enhancing User Experience: A Deep Dive into Responsive UI Improvements for pqrs

Introduction

The pqrs project recently underwent significant user interface enhancements, specifically targeting responsive design across its core components. The goal was to ensure a seamless and intuitive experience for users, regardless of their device – from large desktop monitors to compact mobile phones.

The Challenge

Prior to these updates, certain elements of the pqrs application's dashboard, sidebar, and login screens presented usability challenges on smaller viewports.

Integrating Branding: Adding a SENA Logo with Tailwind CSS

A common task in web development is updating or adding branding elements. For the pqrs project, a recent update involved integrating a new SENA logo and applying specific styles to ensure it visually aligned with the existing user interface. This seemingly simple task often highlights the benefits of a well-structured styling approach.

The Challenge

Integrating a new logo isn't just about dropping an image file into a directory. It requires careful consideration of placement, sizing,

Streamlining Image Handling in Astro: Embracing Native `<img>` Tags

Introduction

In the fast-paced world of web development, optimizing asset delivery, especially images, is crucial for performance and user experience. For our rifasvelez-web project, built with Astro, we recently made a subtle yet impactful change: standardizing our image implementation to favor native <img> tags by default. This shift, while seemingly minor, brought significant benefits to development workflow and potential performance.

The Challenge

Modern frameworks often

Boosting Web Performance: Image Optimization in Astro for rifasvelez-web

Introduction

In the competitive landscape of web applications, every millisecond counts, especially when it comes to visual content. For our rifasvelez-web project, which relies on engaging visuals to captivate users, unoptimized images were proving to be a silent performance killer, directly impacting user experience and site loading speeds. Addressing this became a crucial step towards delivering a smoother, faster, and more enjoyable platform.

The Problem

High-resolution images

Boosting Web Performance: A Deep Dive into Image Optimization with Astro

Project Context

In the rifasvelez-web project, we've recently focused on a critical aspect of web performance: optimizing image delivery. Images are often the largest contributors to page weight and load times, directly impacting user experience and SEO.

The Challenge of Images

Modern web applications, especially those rich in visual content, frequently encounter performance bottlenecks due to unoptimized images. Large file sizes, incorrect dimensions, and inefficient loading

April 25, 2026 0 Astro SEO HTML

Boosting Search Presence: Fixing SEO Schema in Astro Projects

For our rifasvelez-web project, maintaining a strong online presence and ensuring discoverability is crucial. Search Engine Optimization (SEO) plays a vital role in this, and one often-overlooked yet powerful component is structured data, specifically SEO Schema. This post details how we addressed and fixed issues related to SEO Schema to enhance our project's visibility.

The Challenge: Unoptimized SEO

Initially, our rifasvelez-web Astro project, like many web applications, primarily

April 13, 2026 0 PHP CSS HTML

Fixing the View: Styling 404 Pages in Vehiculos-SENACAB

This post details a focused effort on enhancing the user experience in the Vehiculos-SENACAB project by refining the styling of the 404 error page.

The Issue

An unstyled or poorly styled 404 page can leave users feeling lost and disconnected. A consistent and visually appealing 404 page is crucial for maintaining a positive user experience, even when errors occur.

The Solution

The primary goal was to improve the aesthetic appeal and usability of the 404 error page.

Andres Hernandez

Andres Hernandez

Product-focused Software Developer specializing in the React ecosystem (Next.js, TypeScript). Proven experience contributing to high-impact open source projects and building scalable web applications. Committed to clean code, UI/UX design principles, and SOLID architecture to solve complex problems.