The Local Wisdom Blog

Was looking for some code to keep some images together near a page break and found this article from WordPress.  here’s what I found:

Page Breaks

While these do not work for every browser or printer, you can instruct them not to “break” your photographs or graphics in two pieces, or break apart blockquotes, or not to have a page break after a heading but to force it to break before the heading. This is not a perfect science, but if you are really particular about how your printed web page looks, you might want to use these.

h1, h2, h3, h4, h5, h6 { page-break-after:avoid;
     page-break-inside:avoid }
img { page-break-inside:avoid;
     page-break-after:avoid; }
blockquote, table, pre { page-break-inside:avoid }
ul, ol, dl  { page-break-before:avoid }

This is a spinoff from my previous post about how to setup custom 404 error pages through web.config.  After I found the solution, I felt the need to see how it really works, and figured out that httperrors lets you configure HTTP error messages for a Web server right thorough the web.config.  I found the original source here: http://msdn.microsoft.com/en-us/library/ms690497%28VS.90%29.aspx

There was too much content to format here, so I’m just showing a screenshot, you can click the above link to get to the source:

httpErrors image

If you use Rackspace’s cloudsites, you’ll find that not having direct access to IIS makes you learn how to use Web.config for everything!  Today we had to put up a custom 404 page, which we got to work at first for any missing .aspx page, but didn’t work for a random missing directory.  After a few minutes of searching, I found my answer here.  Hope you find it useful:

Classic ASP and Static Content:

<configuration>
  <system.webServer>
         <httpErrors errorMode="DetailedLocalOnly" defaultPath="/404.asp" defaultResponseMode="ExecuteURL">
            <remove statusCode="404" subStatusCode="-1" />
            <error statusCode="404" prefixLanguageFilePath="" path="/404.html" responseMode="ExecuteURL" />
         </httpErrors>
  </system.webServer>
</configuration>

.NET

<configuration>
  <system.web>
    <customErrors defaultRedirect="404.aspx" mode="RemoteOnly">
      <error statusCode="404" redirect="404.aspx"/>
    </customErrors>
  </system.web>
</configuration>

This exampled shows 404′s for all content redirecting to index.html, you will want to include both to get all pages (.aspx and everything else) to redirect correctly:

<configuration>
  <system.webServer>
         <httpErrors errorMode="DetailedLocalOnly" defaultPath="/index.html" defaultResponseMode="ExecuteURL">
            <remove statusCode="404" subStatusCode="-1" />
            <error statusCode="404" prefixLanguageFilePath="" path="/index.html" responseMode="ExecuteURL" />
         </httpErrors>
  </system.webServer>
     <system.web>
                 <customErrors mode="On">
                     <error statusCode="404" redirect="/index.html" />
                </customErrors>
     </system.web>
</configuration>

Last week I mentioned that we were gearing up to launch a new version of our portfolio. I’m delighted to announce that it’s live.

We strive for unique yet usable designs, and our portfolio is no exception.

I’m going to discuss intentions, and one of the unique features of the portfolio, but nothing can replace browsing it for yourself.

Now serving skimmers and readers

A lot goes into a web project. So naturally we have a lot to say about each project that we highlight in our portfolio.

The design needed to give a quick overview for skimmers, while allowing more curious readers the opportunity to learn the details of each project.

A new take on the Modal Box

Each portfolio item has clear thumbnails of the website that can expand in our take on a modal box.

Modal boxes typically lock-down the whole website. Why should you lose your navigation because you are looking at an image?

We also aren’t big fans of having to close a modal box just to reopen a new one.

We solved these problems by lighting up the navigation, keeping the navigation active, and adding image changing functionality.

The result is a better, more usable modal window.

Feedback

Let us know what you think. Feedback is very important to us, and we gladly accept it in any flavor (good, not-so-good, or ugly).

info@localwisdom.com

Wrap-up

A lot of LWers put a ton of effort into improving this portfolio, and localwisdom.com in general. In particular, RJay and Melissa poured themselves into this project. I speak for everyone in the Local Wisdom family when I say, job well-done.

Now it’s time to start thinking about more improvements.

if you try to use the app_offline.htm file, you’ll probably have very little code in it to show your “Site is down” message.  This causes an issue in IE as the “server returns a non HTTP-200 status code with less than 512 bytes of content, IE will not show the returned HTML and instead substitutes its own generic status code message”

Thus to fix it, you can put in more content to get the size of the file over 512 bytes as such:

<!–       
Adding additional hidden content so that IE Friendly Errors don’t prevent
this message from displaying (note: it will show a “friendly” 404
error if the content isn’t of a certain size).

Local Wisdom is the best web company ever!!!   
Local Wisdom is the best web company ever!!!
Local Wisdom is the best web company ever!!!
Local Wisdom is the best web company ever!!!
Local Wisdom is the best web company ever!!!   
Local Wisdom is the best web company ever!!!
Local Wisdom is the best web company ever!!!
Local Wisdom is the best web company ever!!!
Local Wisdom is the best web company ever!!!   
Local Wisdom is the best web company ever!!!
Local Wisdom is the best web company ever!!!
Local Wisdom is the best web company ever!!!

–>

This is just a comment which the user will never see, but will help you get over the 512 byte mark. 
I found this solution here (http://weblogs.asp.net/scottgu/archive/2006/04/09/App_5F00_Offline.htm-and-working-around-the-_2200_IE-Friendly-Errors_2200_-feature.aspx), so a big shoutout to them for making it so easy to find!!!

You love working with Local Wisdom.

You also know we have the best talent in the great State of New Jersey.

Now you can help share us with the world.

I’m pleased to announce the Local Wisdom Referral Program (Sorry, no fancy acronym).

The Referral Program is pretty simple:

Tell people about Local Wisdom. For every qualified lead you give us, we will give you $100. A qualified lead is an opportunity that generates a Sales Discovery Meeting. A Sales Discovery Meeting is a chance for us to meet with the potential client to learn about their needs.

If we are able to close the deal you will receive a 2% commission of the of the total project budget. This commission will be given to the referrer upon receipt of final payment from the project.

As an added bonus, you will also receive our eternal love and gratitude.

For more information view our expertise or see some of our recent work.

If you have any questions, or would like to submit a lead you can contact me at dlarane@localwisdom.com.

The Challenge
The Global Marketing Group of Johnson & Johnson commemorates the best marketing campaigns from across the global organization in the James E. Burke Marketing Awards. Several disciplines are celebrated including PR campaigns, creative, TV/Film, shopping, and more. Each year, the call for submissions takes place on the pre-awards Intranet site. Once the winners are decided, the post-awards site is developed showcasing the entries, finalists, and winners. The Intranet site launches on the day of the live event and broadcasts the winners to the world. Since 2007, we’ve developed and curated the pre- and post- awards website while other design firms such as Mother and Smith + Manning worked on the creative. This year, we were asked to take on everything.

Design
Giving award recipients the prominence they deserve, our design showcases global winners directly on the homepage. Within one click, visitors can see key information for each winner, such as video, marketing collateral, and campaign summaries. The regional winners and semi-finalists are displayed in a “ribbon” theme allowing visitors to scroll through categories and finalists. To top it off, we added a ceremony highlights page, which allows visitors to experience the awards ceremony from around the globe by browsing photography and playing video.

Develop
Once again our developers drove the project home. Utilizing CSS3 and HTML5, they created a content heavy Intranet site, which was cross-tested throughout several browsers, including antiquated versions such as Internet Explorer 6 (yes, it still haunts us). Always keeping our customers and the Johnson & Johnson IT team in the loop, our QA team thoroughly tested functionality, video players, performance, and copy – down to the trademark (™) and registered symbols (®) synonymous with Johnson & Johnson brands.  At the end of the day, the site launched right on schedule and received rave reviews.

How did it go
Needless to say, both the Global Marketing Group and IT were happy with the results. We enjoyed hearing quotes like: “You guys really knocked this out of the park!” ”It looks dynamic and sleek!” and (our favorite)  “Love love love it!”. We are already in conversations about next year.

Expertise Used
Design & Development

LWers:
RJay (Design)
Melissa (Development)
David, Tracy, Eric (Testing)
Maria (Project Management)
Derrick (Account Management)

Graphic images: homepage, winner page, category page, and ceremony highlights page.

The new stuff coming out in Cascading Style Sheets and HTML is amazing. What required mounds and mounds of code can now be done in a few lines of text. What required graphics can not be done programmatically on the browser. Here are three great examples:

Alex Girón and his Solar System

Alex is a Web Developer and Graphic Designer out of Virginia. He is the creative director from nclude. He set out to explore the border-radius features and came up with something interesting. This working model of the Milky Way Solar system shows the planets using border-radius and their orbits and revolutions using –web kit animation properties and transform.

Jeff Batterton and his iPhone

Jeff is a User Interface designer and he’s coded an iPhone with a working world clock with NO IMAGES WHATSOEVER. Click on the image to see what I’m talking about. Its all carefully crafted markup and CSS. Keep in mind that this will only display correctly on a webkit browser and has only been tested in Google Chrome. It seems to look fine on Safari 5, but not FireFox 3.6 (definitely not Internet Explorer).

The Challenge
Family owned and operated, West Coast Subs brings the fresh, surf style of California to Toms River, NJ. Residing next to the family’s fashion boutique, The Cali Way (http://thecaliway.com), the owners of West Coast Subs needed to focus their efforts on quickly opening two storefronts. They contacted Local Wisdom to design and develop a site boasting West Coast Subs’ fresh and healthy ingredients along with its Cali flair. Before beginning we sampled the food, and they are accurate; the food is great.

Design
Renowned for its surfing aficionados and health conscious residents, California is the true inspiration behind West Coast Subs. Our design experts were able to create a surf-style aesthetic that complements the shop’s healthy and fresh menu, while highlighting the owner’s passion for the ocean and all things surfing. We built the site using Jquery to provide users with a fun and compelling interface.

Development
Without sacrificing design quality, we were able to develop a site for West Coast Subs, which would deploy in two stages. We shared in the company’s urgency to have a web presence, deploying the first stage of the site to showcase their menu. This put West Coast Subs on the map allowing the site to begin impacting search results, maximizing its customer potential. Next, we tackled the full spectrum, rounding out the full content migration along with design nuances which speak to the shop’s surf-style atmosphere.

How did it go
Being nimble for a customer is core to our philosophy. We were able to share in the client’s urgency and launch the menu stage of WestCoastSubs.com within two weeks then complete the development of the larger site. The rapid deployment, professional design, and local buzz exceeded the client’s expectations.

LWers:
RJay (Design)
Melissa (Develop)
Derrick (Account & Project Management)

The 13th major version of WordPress has been released. Introducing WordPress 3.0:

Some key features include:

• Lighter admin screen
• WordPress/Multi-user integration – power many blogs off of one WordPress install
• Bulk upgrades for plugins
• Custom post types – for better CMS use
• A new default theme called Twenty Ten that takes advantage of  current features
• Custom headers, backgrounds and menus

For a full list go to the Version 3.0 Codex page