A while back, John Scaramuzzo came around the office asking employees to clear out any e-mails we could afford to lose in Outlook.  When disk space is low, it can be difficult and time consuming to filter through thousands of e-mails determining what to keep and what not to keep.

Using a feature of Adobe Acrobat (I have version 9 installed) I was able to backup all those e-mails into a single indexed PDF.  If you keep your Outlook mailbox organized by folder, this will turn out even more nifty after converting to a PDF.  Right click on a mail folder and notice there are 2 options regarding Adobe PDFs.  Converting will create a new PDF and appending will add the emails and the folder structure into a PDF which can be saved to the local machine.  This does NOT remove the emails from Outlook and needed to be deleted manually.

Click to Enlarge

After a certain point, the PDF document will start to respond slowly after a certain size is reached.  The best solution I’ve come up with is to organize the PDFs by year.  Remembering the relative year to a project or development period isn’t too difficult and Adobe contains a search feature to find information quickly.  A ticket number or relative project phrase usually works removing any need for digging around.   Anytime my outlook folders start to look full, I can append all the contents to the current year’s PDF and free up the space in Outlook. Below is a screenshot of what my Sent Items folder looks like in 2011′s PDF.

Click to Enlarge

If your mailbox does not already have a folder structure, it might be a good idea to set some up.  Organization never hurts!

Problem:
We recently had an issue with some images on an iPad or iPhone web page where the orientation was displaying incorrectly. However, when previewing the page on a desktop the orientation was correct.

After several tests, we realized it wasn’t coming from the web code, but was an issue with the camera. The camera software was encoding it at a certain direction for mobile devices incorrectly. A normal desktop computer wouldn’t recognize the encoding, since it doesn’t have a gyroscope.

Solution:
To fix the issue we used our image editing software to manually rotate the image to the correct orientation, saved it out and replaced the existing one. This would then remove the camera’s encoding and preview correctly on any browser. You don’t need any specific image editing software, if you happen to run into this issue.

During recent projects, integrating fonts for the right look and feel has shown to be troublesome for Internet Explorer. After implementing a font file into a CSS file, Internet Explorer 9 would provide the following error and not show the embedded font:

CSS3114
@font-face failed OpenType embedding permission check. Permission must be Installable.

This error is listed on MSDN and states that:

 The font-face does not have permissions to install with the current webpage.

And to fix:

Obtain the correct permission or licenses for embedding the font.

The only help this really provided was narrowing my search results.  Luckily, I found a nifty program that can be run from the command prompt to correct this error in IE9.  Be aware however, as stated on the publishers download page:

Changing the embedding value does not give you license to distribute the fonts. You should only change this setting if you are the font creator, or something like that. Use at your own risk.

Download embed.exe

Program Useage:

1. Download the executable and move to the desktop with a copy of the font file.
   (Alternatively, you can drop this in your Windows/system32 directory)
2. Pull up a command prompt window.
3. Navigate to the desktop within the prompt
4. Execute by typing: embed.exe fontfilename.ttf
5. Viola, your font should be ready to use in IE9.

More on Font Embedding from MSDN »

Flash is officially not being supported on mobile devices anymore. It’s a good thing for performance and battery life. It also opens up the door for more interesting ways of introducing techniques and effects to your audience.

So, that brings up the question on what people and clients ask. Should we update our site to be mobile friendly? In a short answer yes for the best reach of audience. The amount of people using mobile devices is growing and continues to do so at an astounding rate.

Here at Beacon, we have a team of professionals that can update your Flash site or Flash elements with cross browser and mobile device friendly code. Your site will feel more refined and can even be implemented to work with our great Cascade Server (CMS system). Staying ahead of the curve and keeping your site fresh will keep the visitors and customers coming back for more.

We’re proud to announce the release of the Greensboro Housing Authority redesign!  As always, Beacon was right on-time with our deliverables, which is always our goal.  The client chose a soft launch date of December 1, 2011 because they wanted to show the new site to their Board of Directors at their annual meeting that day.

Their Web site was designed and constructed in-house several years ago, which meant that it was time for a completely new look.  The site also had content that was very out-of-date, so the client took it upon themselves to do a complete rewrite of the content, and restructure the site to be more intuitive.  Also, they wanted to get away from having to update the site by-hand using HTML, and wanted it in a content management system.  Finally, they wanted a new Web hosting partner.

Enter Beacon:

• We provided them with a brand-new graphical design;
• Developed it to display perfectly in multiple browsers;
• Implemented the new site into Cascade Server (content management system) to allow multiple users to update the content with an easy-to-use solution;
• Incorporated a new search feature;
• Imported approximately 60 pages of content, including 20 fact sheets about each of their properties;
• Transferred their Web site to a shared hosting package here at Beacon.

Several Beacon staff members made this project a success:

• Wendy:  Without much direction from the client, Wendy put together a design that they liked on the first try, which is phenomenal.
• Stephanie:  She was instrumental in getting the project off the ground, attending the initial meetings and providing meeting notes, the business requirements, and proposed site hierarchy.
• Zed:  He was thrown into the fire, as this was his first development project here.  He developed the front-end HTML/CSS/jQuery, and implemented the site into Cascade Server (which he picked up on very quickly), and entered most of the content.
• Tiffany:  Provided assistance and training to Zed.
• Justin:  Project Management and Cascade Server documentation & training.
• Beacon’s Technical Support Group (TSG):  And finally, no site hosting transfer is complete without the efforts of TSG, specifically Caleb and William, for setting up the hosting and troubleshooting some DNS issues over a weekend.

This is another high-quality design to add to our portfolio, and another non-profit site we can be proud of.   Thanks to everyone involved!

Before

After

One of our recent enhancements to the Beacon website included integrating components of our blog into the content of the site. This is visible on the homepage under the “Blog” tab and shows the three most recent postings on our WordPress blog. Additionally, we decided to include links to recent blog links by categories or topic on the page. For example, the SEO Management page would produce blog links that fell in the SEO category. This is applied throughout the site on interior pages, which is effective for SEO as each page will be updated with every blog posting we create (given the post falls in the category of the page displayed).

The blog feed on the homepage was much easier in comparison worked like this:

XSLT Format used in Cascade:

This is a simple ASP literal that will be the populated by the blog feed.

<xsl:comment>#START-CODE<asp:Literal id=”litFeedReaderBlog” runat=”server”/>#END-CODE</xsl:comment>

VB for CodeBehind File:

VB CodeBehind File (.pdf)

This small set of code basically links to page with RSS feed, in this case, the general RSS feed for entire blog. The part shown in red needs to match the URL of the RSS feed to your particular WordPress site. The part shown in green is a relative path to the XSL file you will use to format the output. Lastly, the part in blue needs to match the ID of your ASP literal so the codebehind knows where to place the output.

Most WordPress sites use the following schema to the feed: http://sitename.com/rss

Example: http://blog.beacontechnologies.com/feed

The above linked RSS page acts as the data source for the VB CodeBehind file and uses an XSL file (shown below) to format the output to the page. Because this RSS page is updated and managed by WordPress, the output is always up to date with the blog.

XSLT used by CodeBehind File for Output:

XSLT File (.pdf)

This XSL will limit the number of posts displayed to the most recent 3 posts (First 3 listed on RSS page–Code shown in green) and will output it in a way to provide a linked title, the author and date, as well as a snipped from the article itself and ‘Read More’ link. We used JavaScript to clean up some of the output that the RSS feed delivers, such as the [...] text and cleaned up the way links were displayed in the snippet.  You can visit the blog feed page and view source to get the XML data that will be processed by the XSLT.

So, if you followed all that and put it into practice, you get something like this (after styling):

Now, to implement category control, we needed to add an additional Data Definition within Cascade on every page that would set the category. We used a simple drop-down that had an entry for every category we have on our blog. Notice below that the data-definition values need to be URL-friendly. The reason for this is that the modified blog feed with category control will integrate this category to the blog’s general RSS feed. We are going to pass this category information to the codebehind file for processing by sticking the data definition value into the ASP literal’s text attribute. All interior pages would use the same codebehind file as to avoid the need for a new configuration type that would need published with each page.  The only maintenance that goes along with the blog feed is adding new ones to the data definitions as they are created in WordPress.

The code and logic above was primarily followed for the related links, but had to be modified to fit the following specs:

• Have Cascade output a text attribute on the ASP literal containing the category to be used (grabbed from data definitions) which would be passed as a parameter to the functions used in the original VB Codebehind.
• List out 3 of the most recent blogs (just linked titles, somewhat simplified from homepage output) from the blog category set in the data definition. If NO data definition is set for the ‘blog category’, use the ‘Section’ data definition value (which shown above is required on all of our pages.) The section value is a fall-back to one of the three parent categories on the blog: Web Development, Web Marketing, and Web Hosting.  Notice we can’t just use the values of the ‘Section’ data because it does not match the URL structure on WordPress.
• If there aren’t 3 posts for the blog category that has been set in the data definition, retrieve what posts are available and then use one or two posts the parent category (depending on how many needed to make 3 posts).

At first, the solution Justin and I had come up with, was to make the VB smart enough to recognize when less than 3 posts were output and go out and grab the remaining from the parent category. The issue with this was that the parent category of any category might list already output postings by the sub-category (since they are listed in order of most recent). Therefore, we had to heavily modify the codebehind file in a way that it would ALSO recognize not to output duplicate posts from the parent category.

XSLT Format and Template Changes in Cascade:

Every page needs to get the codebehind file.  In Cascade, this is accomplished by adding the following to the template:

<!–#START-ROOT-CODE<%@ Page Language=”VB” aspcompat=”true” AutoEventWireup=”false”  CodeFile=”/rightColumnBlogFeed.aspx.vb” Inherits=”_Default” %>#END-ROOT-CODE–>

We saw that http://blog.beacontechnologies.com/feed shows a listing from all categories (10 of the most recent being shown).  We can change the URL to include one of our categories, say… Web Marketing — just by changing the URL to http://blog.beacontechnologies.com/category/web-marketing/feed.  Notice the RSS feed is then modified to fit the category and still listed (as defaulted in WordPress) by most recent posts.  The XSLT file below was used to select either the post category or section for outputting the text attribute of the ASP literal.

Modified XSLT File (.pdf)

Changes in VB Codebehind & CodeBehind’s XSLT

While I’d prefer not to share our exact source code, here are the modification necessary to the templated file above to prevent duplicate stories from being output.

• The ‘BuildFeed’ function had the first parameter changed to the ASP literal’s text value.
• The XSLT file got dutplicated, one to output 3 posts and one to grab the full page of posts generated by the RSS (10).  Both had ‘~’ characters appended after each list item.
• The BuildFeed function would fetch what posts it could from the blog category, if there are less than 3, it would record the titles of the categories found and load them into an array (This was the reason for ‘~’ character being added–Parsing values was a bit easier this way using the split function.)
• The BuildFeed function would then visit the parent categories RSS page and compare post title with those in the subcategory recorded in the array.  If they matched, it skipped the post, otherwise appended it in with list to be included.  Because we didn’t have any categories with less than 3 posts, I was able to just switch my XSL file used by the codebehind to output only 2 posts–and the VB would take care of the rest and use the 10 post page parent.  Controlling the output this way made it much easier to debug and test that the proper number of posts being output from the parent category and subcategory feeds.

Beacon is pleased to announce the launch of Framingham State University’s Academics section redesign.

After completing a redesign of Framingham State University’s main website in the summer of 2010, the client contracted with us to address the Academics section such that it would be more effective in reaching prospective and current students.  Well, we are proud to announce the launch of the newly redesigned Academics section and all department sections as well.  The client had a very tight deadline for this project in order to have the new site launch coincide with a planned ad campaign.  Beacon’s Web Development Team juggled its resource plan to complete this project on time and within budget (again)!

 

Justin Klingman managed the project and Wendy Honeycutt, worked directly with the client to create the beautiful design.  Keana Lynch completed the template and Cascade development a little early and perfectly, and Thomas Brinegar customized the jQuery homepage slideshow on the Academics homepage.

When was the last time your disaster recovery (DR) plan was revised? A viable DR plan may be what saves your business. Having a DR plan is a bit like an insurance policy. You don’t want to use it but are glad to have one when you need it. If you have a current DR plan, you realize the value of being able to recover from a catastrophic event. Well run companies not only have a DR plan but have assigned a monetized value for it. Establishing the value of a DR plan also indicates a level of commitment.

The extreme weather that has created earthquakes this summer in the Northeast is one disaster example. If your business is not impacted directly, chances are your suppliers or vendors are in some way. How prepared are you?

A basic DR plan includes :

1. contact list - where is it, how to access it and contains information on internal staff and key customers.
2. documentation - reactive scenarios to use based on the type of outage (network, infrastructure, data center, customer support, manufacturing).
3. training-  the staff  in IT, Sales, Customer Support, and Purchasing is trained on their roles and what to do when a disaster occurs.
4. commitment - last but the most important aspect. The management team and the worker bees are committed to knowing and being able to execute a DR plan.

Let’s assume you have a plan. When did you last update it? Is the plan reviewed periodically? Is having the plan revised connected to anyone’s performance goal? The amount of planning captured in the plan is directly proportional to the value management assigns to the DR plan.

Having a DR plan is fundamental to every business. What it contains and how extensive it is indicates your level of commitment. Kind of like the value of your insurance policy.

Here’s a very nice article about website navigation from our partners over at Hannon Hill, the developers of our preferred content management system Cascade Server:  Designing Your Navigation – Hannon Hill Corp.

I’ll also add a content matrix template that I use to record a site’s current and redesigned structure during the analysis phase of the project, before development begins.  There are two tabs in the spreadsheet– one for “current site” and one for “redesigned site.”  The redesigned site is pretty self-explanatory, but the current site information is often neglected in anticipation of starting the new project.  While it may seem superfluous to annotate a site that will be redesigned, documenting the current site ensures that no sections are “lost” during the transition (note that unless the current site map is maintained dynamically, these are rarely kept up to date).

I have seen time and time again that the success of a redesign can often be determined in the first few weeks of a project by how carefully the site is cataloged in advance.  As Kat notes so well in her article:

I cannot stress enough how crucial it is to map out the structure of your website prior to designing the navigation, especially if you are implementing one of the most powerful capabilities of a content management system, namely content reuse in the form of dynamic navigation.

Happy mapping!

The Vecoplan, LLC site was launched on August 4th. This site is slightly different than any other site Beacon has developed due to the fact it has been developed in a content management system called Typo 3.  Since Vecoplan is headquartered in Germany, the CMS for this North American website was mandated by Corporate because TYPO3 is very prevalent in Europe.  The challenge for this project was developing a new website that matched Corporate branding, yet focused on the products and services of Vecoplan LLC (No. America), provided improved usability and most importantly, sustained the SEO web marketing initiatives that are also being provided by Beacon.  Needless to say, the ramp up on a different CMS was extremely challenging, but our staff stepped up to deliver another high quality website!  In addition, our web marketing team worked with the web development team to successfully guard against the usual dip in organic traffic that can occur when migrating to a new website.

The site features the following:

• Rotating banner image on home page, updatable by client via CMS
• Several carousels that allow user to choose market sector, service area, etc.
• Mini-contact form housed in the footer
• Parts Order form through which customers can fill out and submit online
• Unique sub-navigation across center of page
• Product detail pages – Really beautiful product detail pages that showcase the product photography
• Integration of Vecoplan Midwest’s website

A HUGE thanks goes out to Miral who really made it all work!! Miral was faced with the challenge of not only learning a whole new content management system to build this site in, but one where most of the instructional material was in German. Throughout this project he continually faced many challenges and met each one admirably.  This project was led by Stephanie, Project Manager, who did a great job of keeping the team moving forward during various challenges to add another unique launch to Beacon’s portfolio.  Other big contributors were Wendy, who provided the client with exactly what they needed for a design, Thomas who assisted with all of the Flash and carousel work, and Jeff who provided SEO feedback and analysis. Finally, William, Wayne, and Caleb whom all had a hand in the launch at some point – thank you Beacon team!