Rhoads Creative is thrilled to announce that we recently won five prestigious Best in PA Living awards, including the coveted Best Website award for our own website RhoadsCreative.com! We’re excited to share our success with you and explain how we developed the new website using the newest in website technologies.

We built this award-winning website using Next.js. But what is Next.js? This groundbreaking framework is transforming how websites are developed and, I think, will become the norm for websites in the future. If you’re unfamiliar with Next.js, don’t worry – we’ve got you covered. In this post, we’ll break down the three big reasons why Next.js and GSAP (a powerful animation tool) have made our website stand out and why these kinds of websites will take over in the near future.

Speed

The major advantage of Next.js is its ability to deliver blazing-fast website performance. Next.js achieves this by employing several performance-enhancing features, such as automatic code splitting, server-side rendering (SSR) and static site generation (SSG). Let’s dive into these features and explore how they contribute to a lightning-fast browsing experience.

Automatic code splitting

This feature ensures that website visitors only load the information they need for a specific page rather than downloading the entire site’s information. This significantly reduces the time it takes for a page to load.

Server-side rendering (SSR)

With SSR, pages are generated before a user visits the site, meaning that content loads faster and is immediately visible, resulting in a better user experience.

Static site generation (SSG)

SSG stores a super fast copy of the page and uses it anytime someone visits. This eliminates the need for a website to load the pages every time someone visits, leading to faster page load times.

According to Next.js, websites built with their framework can achieve up to a 70% reduction in the time it takes for a user to interact with the page compared to traditional websites. At Rhoads Creative, we experienced even better improvement; the new website is over 300% faster than the previous version helping lead to our Best Website award.

Motion

Our 30th-anniversary celebration is brought to life with captivating animations and interactive elements, all made possible by the GreenSock Animation Platform (GSAP). This tool integrates seamlessly with Next.js. GSAP allows us to create these smooth, high-performance animations for web projects without the drawbacks of traditional website animation.

Some of the benefits of using GSAP include:

Device compatibility

GSAP ensures that animations perform consistently across every device, from a massive desktop computer to the smallest phone.

Fine-grained control

With GSAP, we can easily manipulate individual parts of the website for timing, fades, order and more to create sophisticated animations that were once impossible.

Performance

GSAP is designed to deliver optimal performance, even on less powerful devices, ensuring that our animations run smoothly and efficiently everywhere.

By leveraging the power of Next.js and GSAP, we created a visually stunning and engaging experience for our visitors, further solidifying our reputation as a leader in web design.

Still Accessible

Despite the advanced features and capabilities of Next.js and GSAP, our website remains easy to manage and maintain, thanks to its integration with a WordPress backend. This ensures that our team can conveniently update and edit the website’s content without compromising on its speed and performance.

Our setup utilizes a “headless” WordPress configuration, meaning WordPress acts solely as a content management system (CMS), while Next.js takes care of the presentation layer. This headless approach allows us to benefit from the user-friendly editing experience of WordPress while avoiding the extra “bloat” that can come with a traditional WordPress site.

What’s Next

If you’re considering a website overhaul or building a new one from scratch, we highly recommend exploring Next.js. It delivers not only for the exceptional speed, motion capabilities and seamless integration it delivers but these cutting-edge technologies may transform websites over the next few years.

We hope you enjoyed learning about how Next.js and GSAP contributed to Rhoads Creative’s Best Website award. If you’re interested in utilizing these technologies for your own web projects, don’t hesitate to reach out to us at Rhoads Creative – we’re always here to help!