Front End

An HTML Email, a landing page, an entire website, or a custom WordPress, Drupal, or Shopify theme, hand coded to bring your design to life on the web. Mobile-first, responsive pages, SEO optimized, clean code completed in a timely and professional manner.

Animate

CSS animations or more complex JavaScript animations bring a webpage to life and help capture the user's attention. Want to add a little sparkle that'll make your site stand out? Let's do it!

Back End

Need help figuring out hosting or setting up the CMS? What about creating a Github repository to keep your website code safe and easy to update for the future? From Cpanel to AWS S3 Buckets to Bitbucket, I can help you navigate.

Portfolio

Experience My Work

Since these are not my designs, it didn't seem right to include a only simple screenshot. The part I do is bringing the design to life! However, to protect the privacy of the owners of some of these projects, the full experience is password protected. If you want to see code samples or these full sites in all their glory, please contact me!

Corporate WordPress Website

At Gainwell Technologies, I am the sole developer on the Marketing team and responsible for the corporate website. This is a WordPress website that I helped build and launch to replace the former WordPress website (which I also maintained) about a year ago following their rebranding. As the only person responsible for this website, I do everything from updating content on the front end, including creating new pages and blog posts, removing old content, and updating HTML and CSS as needed to update page layouts to fit new content, to all the backend and server maintenance like keeping plugins updated, maintaining a dev site for testing before doing updates to plugins or code, and managing data and analytics platforms for the site including Google Analytics, Semrush, and HotJar. The site is built with reusable components for future maintainability and scalability. I ensure that everything I add to the site is SEO friendly and accessibility compliant to the standards set by WCAG 2.

HubSpot Landing Pages and Microsites

As part of a contractual requirement, Gainwell provides some of its clients with microsites to house information about their programs and links to copies of documents they provide for their uses. I maintained 8 of these microsites, updating content as required by the clients and creating a new theme in HubSpot to assist with a rebranding effort.

ECommerce SalesForce Website and Email

I helped James Avery with transitioning their website from the CMS Work Area to Salesforce, coding pages based on designs to display products in various categories and for holidays. I also created batches of emails for holiday campaigns, coded hmtl banner ads with CSS animations, and covered all their development needs while their full time dev was on maternity leave. (click image to view full email)

Custom WordPress Theme, Coded with SEO in Mind

This project is a fully custom, from scratch WordPress theme I built for a local Austin company. Their previous site was built on a WYSIWYG editor, and their SEO ranking was suffering due to bloated code and slow load times. The design was updated and given to me to code, with the goal being to keep the code as clean and simple as possible to speed up the page load times. For this site, I used PHP in addition to HTML, CSS, and JS. I also wrote the functionality for their WordPress plugins to integrate with the theme, including the Google Map and Google Reviews you can see on the site, as well as a few you don't see, like Yoast SEO, which lazy loads images, preloads fonts, and handles prefetching DNS requests, among other things. Upon activating the new theme, the Google PageSpeed Insights score went from 14 (for their old site) to 70 on Mobile and from 64 to 96 on desktop, and after letting Yoast do its thing, the score improved further to 98/99 for desktop! I also wrote the schema.org code to help the search bots understand what the site is about. It looks like they have since updated their website so unfortunately my code is no longer available for viewing on the web.

ECommerce Service Site

This project used HTML, CSS, and JavaScript to bring the design to life. I was given a mobile and desktop version of the design, but the two layouts did not smoothly melt into each other, so many media queries were used to make each section work, and in places I had to go back to the designer for tablet sized images to keep the user experience smooth at all sizes. The other fun challenge in the code for this site resulted in some hidden span's. Because the navigation remains at the top of the screen as you scroll, the anchor tags needed to sit above the section they actually link to. The hidden span's account for the space required for the nav bar at the top of the screen so that when you click one of the links, the section it takes you to appears below the navigation rather than at the top of the browser, beneath the navigation.

100% ADA-Compliant Product Line Up Site

For this project, I was given a design for desktop and mobile, and the images. I coded it using Flexbox to make it responsive in between the desktop and mobile sizes I was given. I used JavaScript to write the code for the mobile menu and drop down boxes found on the product pages and FAQ page, and I found a little script that I customized to suit the animation in the hero. After the project was completed, the client came back with a request to make the site 100% ADA compliant per a web-based site test they were using. Parts of the site design had to be adjusted, as some of the original colors did not offer quite enough contrast. I did those updates, and also added code to make all the interactive elements accessible by keyboard. Upon completion, the site received a 100% compliant rating!

New Product Launch

This fun site introduced a new product with catchy animated graphics. I used JavaScript and the GreenSock animation library to create these timelines and make the magic happen! Please note - this site was designed to be a tablet experience for reps to use when visiting vendors, so it was not built to be responsive and will look best at 1600px wide. It was also not public-facing, so it was not made to be accessible or for SEO.

Informational Microsite for Distributors

Another product launch, filled with bright colors and animations as exciting as the product! From animations that follow mouse movement, a rotating 3d model, and animated counters to keep things interesting, this site is sure to catch the user's attention!

Rebranding a Product for a New Audience

This project makes use of movement to draw interest. With one page with embedded videos, another page with rotating 3d Models of the product, and other pages with tabs for clicking through to engage the user, this site is sure to draw the user in!

Responsive HTML Email Template

This is an html email, thoroughly tested in Litmus to appear just like it should in every browser and on device. The mobile version is responsive to fill the available space, the desktop version is a fixed width to maintain a layout consistent with the design and brand standards.

Product Relaunch

This site draws the user in with it's unique 3 column layout, bright colors, and jQuery powered video player, which allows the user to choose between different video clips to view in the larger player.

HTML Email Sure to Render in Every Inbox

A live text html email sent to their customer list, this one had a responsive mobile design and a desktop design, and both were tested to perfection using Email on Acid.

A Sales Funnel Landing Page

A single page site designed with one purpose in mind. As the user navigates down the page, a fun parallax effect adds interest.

Bullet Proof HTML Email

An email sent to their customer list, this one had a responsive mobile design and a static desktop design, and both were tested to perfection using Email on Acid.

Looking for more?

If you would like to see more examples of my work please contact me. I would be happy to provide them!

Contact Me

About

Avid developer, and so much more!

I love coding, bringing a client or a designer's vision to life! There is something about the process of listening to the vision for a website, and then finding the right technologies to make it happen that I find very fulfilling. I also love learning new ways of making magic happen, through learning new programming languages, experimenting with new libraries and frameworks, or trying out a new CMS! I'm constantly building my skillset, and would be happy to learn any new skills I need to complete a project.

When I'm not coding away, I enjoy hiking with my dog, a mutt named Tanner. I also love riding my horse, especially either practicing our dressage moves or exploring some trails. I'm an avid reader, and a history nerd. Want to hear more? Just ask!

Skills

Put my ever-expanding skillset to work for you!

Code:

HTML CSS HTML Email JavaScript WordPress/PHP Drupal/Twig Shopify/Liquid Mautic SalesForce

Tools:

GreenSock Animation Platform jQuery Sass/Less Bootstrap Responsys SharpSpring Adobe Creative Cloud

Need me to work with something I haven't done yet? No problem! Contact me, it may be something I've played with already and just haven't found the right application for yet!

Contact

Like what you see? Need a rockstar developer? Ready to start working together? Let's talk!

Email me at: christyrettger@gmail.com