Patricia Sherwood, Realtor Blog

  • Desktop view of PatriciaSherwood.com Homepage
  • About Page viewed with iPad
  • Blog Index viewed with Samsung Galaxy
  • Mobile navigation viewed with iPhone 6
  • Custom Home screen icon on Android

The goal of the project was to create a space where local realtor Patricia Sherwood could post images, recipes and household tips. This allows her to share her passions and make connections with potential clients before they are in need of a home.

In July of 2014, we were contracted to develop a mobile-friendly website for an Eastern Panhandle realtor that has a passion for the area. The site was to allow her to share most anything related to the making of her home in hopes of helping others make their own home. Additionally, the installation of a content management system would allow her to transition from a third-party solution to a version hosted on her own server.

Visual Design

Patti is a prolific photographer - just check out her Instagram feed - so we knew that those photos would provide abundant material to use throughout the development process. Patti chose a number of photos that truly represent her and we tiled them on the homepage of the site with her logo (which we cleaned up a bit) and tagline occupying the center square.

For the mobile-friendly - specifically, mobile-phone version, instead of tiling the photos, we chose one prominent photo to act as the doorway to the site. The tablet version features the same design as the desktop version with a modified navigational structure better optimized for a tablet.

Blog Design

As the primary creative outlet, the design of the blog was of utmost importance. We created a system that was flexible enough to allow her to post single images, galleries, text and video. This post on the Jefferson County (WV) Fair is a great example of an entry with a featured image and a series of secondary images with captions. A perfect way to share the traditions of the county fair. The secondary images, which make up the gallery, include a lightbox feature which allows visitors to view the entire image gallery at once using back and forward arrows.

Social Integration

When it came to social integration we took a less is more approach. Our goal was to add sharing features without the weight of sharing plugins. We decided to use social icons from our icon font (which we organized in fontastic.me) and the following href tags to create a very lightweight social sharing widget.

1
2
3
<li><a target="_blank" href="http://www.facebook.com/sharer/sharer.php?u={title_permalink="almost_heaven/article"}"><i class="icon-social-facebook"></i></a></li>
<li><a target="_blank" href="https://twitter.com/intent/tweet?text={title}&url={title_permalink="almost_heaven/article"}&via=PattiSherwoodWV"><i class="icon-social-twitter"></i></a></li>
<li><a target="_blank" href="http://www.linkedin.com/shareArticle?mini=true&url={title_permalink="almost_heaven/article"}&title={title}&summary={title}&source={permalink="almost_heaven/article"}"><i class="icon-social-linkedin"></i></a></li>

In addition to the sharing links, we added Twitter cards to each page to allow us to customize what was shared per page. The Twitter cards are populated with data from the entry within the CMS.

1
2
3
4
5
6
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@PattiSherwoodWV" />
<meta name="twitter:title" content="{title}" />
<meta name="twitter:description" content="{entry_content}{wygwam}&#123;exp:eehive_hacksaw chars = "150"&#125;{value}&#123;/exp:eehive_hacksaw&#125;{/wygwam}{/entry_content}" />
<meta name="twitter:image" content="{entry_content}{gallery}{images limit="1"}&#123;if ce_first}{image}&#123;if:else}&#123;/if}{/images}{/gallery}{/entry_content}" />
<meta name="twitter:url" content="{title_permalink='almost_heaven/article'}" />

Static Content

Like most websites, Patti’s features an assortment of content that rarely changes but that can be changed quickly and easily though the installed content management system. This includes content like testimonials, community resources (grouped by county), an about page and a contact page.

Content Management System Installation

As mentioned above, the site is managed through a content management system (CMS), which allows Patti to post entries and perform updates to static content at will.

We used the ExpressionEngine CMS (http://ellislab.com/expressionengine) for its ease of use, extensibility and proven track record.

In addition to installation of the CMS, we also provided one-to-one training to ensure that Patti was comfortable with the system and can use it to accomplish everything she needed to.

Client Feedback

Working with Brad was extremely easy. I had kept a personalized website on the back burner for a long time because I didn’t know exactly what I wanted. After just one meeting with Brad, he was able to take my long list of adjectives and random musings and transform them into a website far more stunning than I even imagined. Wanting a website made me anxious about getting bogged down with a lot of technical stuff for which I had little time or interest. To the contrary, Brad created my site with easy to use tools which empower me to connect with my clients efficiently and productively. I am very satisfied working with Brad, I got everything I wanted and more! - Patricia Sherwood

⇠ Next Project Previous Project ⇢