An invitation to all web designers
Templamatic.com nears completion
I am very excited to announce that Templamatic.com is almost complete. Templamatic is a new site I’ve been working very hard on for the last six months with help from Clark Wimberly and our small team of developers.
Templamatic, as the name suggests, is a site dedicated to website templates of exceptional quality. We are focusing on high-end designer templates that are created by the world’s top web designers. Designers are invited to submit their templates to the site, where our team reviews them and adds them to the site. Designers have the unique opportunity to earn up to 75% of the commission from every sale of their templates.
In the coming weeks, we will officially launch the site and open it up to people who are interested in becoming part of the seller’s beta program. The seller’s beta program allows web designers early access to the site so we can increase our inventory before opening the doors to the general public. If you are interested in being a part of the seller’s beta, or just want to get notified when the site launches, head over to templamatic.com and register your email. If you visit the site, you can also get a sneak peak at the new design.
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
666666666666666666666666666666666666666666666666
6666666666666666666666666666666666666666
6666666666666666666666666666666666666666666666666666666666
Updating your directions page with Google Maps
|
View Larger Map |
The traditional directions page has been a staple of website design for as long as I can remember. Some sites write elaborate directions to their facility or office from all major highways. Other sites provide links to mapquest.com. I remember feeling savvy back in the day when I would take little screen shots of mapquest maps and put them directly on the directions page. People who were courageous enough to tackle the longest URLs in the world, might manage to embed a Mapquest map directly onto their website. But it was never pretty or easy.
Well, look out Mapquest, and good bye screenshots. Google Maps is here to save the day! Now Google Maps has been out for a long time, so why am I getting all excited about it today? Because I’ve only just recently seen it integrated into external websites, as a replacement for the traditional directions page. Thank you Google!
So more to the point, how do we add a Google Map to our directions page? Well lucky for us, Google has made it as easy as possible by offering a new “embed in website” option to the map interface. All you need to do is search for the location you want to display, click on “link to this page” and copy the embed code provided. Paste it into your website or blog source and voila!
This is a great new way to add interactive maps to your website using a common interface that most everyone is familiar with. You can include advanced funtionality in the maps that you embed such as driving directions by setting those options before you click “link to this page” or by clicking on “customize and preview embedded map”. For more complete instructions, refer to the google map embed help page.
I originally wrote this post all about the Google Maps API, before I realized that Google had launched the new embed functionality directly into Google Maps. The embed feature makes it so much easier for non-technical people to add maps to their site, I’m not sure I need to cover the API in much detail at this time. Let it suffice to say, if you need more advanced mapping functionality in your embedded map, or if you plan on building a map application that utilizes Google Maps, you should definitely look into the Google Maps API.
1 hour FREE website advice
I would like to help you with your website. Whatever problems you may be facing, I would like to help. To facilitate this process, I’ve decided to offer 1 hour of my time, every week to help you out. For the next year, I will keep one hour of my time completely open and free to anyone who wants help. To take advantage of this offer, just send me an email so that we can set up a time to talk. Please include your name, website address, brief description of your question, and the best time for us to speak.
Everyone is welcome, including new or existing clients, friends and family, or anyone else. The idea is just to get a conversation started so that we can all learn and grow in our efforts to improve our online presence. If I stumble upon some interesting questions, I will post them (anonymously) on the blog for everyone to learn from.
Requests will be granted on a first-come first-serve basis. If this week is already full, I will schedule you for the following week. I look forward to speaking with you soon!
Creating a 1 year website plan
Now, more than ever, websites reflect what we are doing, where we are at, and who we are as companies, organizations and individuals. Your website is your always-on public face to the world. With the new year fast approaching, now is the perfect time to review your website and plan for the coming year.
How do I create a 1 year plan for my website?
Step 1 - Evaluate where you are today
The first step towards making a plan for your website is to analyze where you are today. Take an honest look at your site from the perspective of a new site visitor. How does it look? Does your current site draw people to your cause, or inspire them to reach out and make contact? For a more concrete answer to this question, you can review your website statistics, or analytics reports for the year. If you made goals last year, pull them out and see how you did. With this information in hand, make a list of where you are at today. List out your average monthly traffic, average monthly income, and the average monthly growth of new customers or site members.
Review your own output on the site. How often are you updating your site? Are you contributing enough to your site to sustain your goals?
Identify any problem areas with your site. Are there any areas of the site that are hindering user experience? Are there broken pages, empty sections, missing content? Is the site design poor, or out of date? Is the site optimized for search engines? Are you paying more to keep the site running than you are generating from the site?
All of this goes into your evaluation of where you are at today, and should give you valuable insight into how your visitors perceive your site.
Step 2 - Write down where you want to be in a year from now
What are your goals for your site for the new year? Make a list! Depending on the complexity of your site, you may have just a few goals, or many more. In either case, it’s good to prioritize your goals, and shuffle them around until the absolutely most important ones are at the top.
Make your goals as specific as possible and make sure they address all the different aspects of your site.
- Visitor Goals (1000 visitors / week)
- Income Goals ($2,000 / month in ad revenue)
- Form Submissions (25 new leads / month)
- Content Updates (2 blog posts / week)
Save your written goals in a place that you can easily access, and refer back to frequently.
Step 3 - Make a plan
Armed with a better understanding of where you are, and where you want to be, it’s time to make a plan. Compare your lists from Step 1 and Step 2. Make a schedule for adding content to your site. If you run a blog, make and commit to a publishing schedule. Make adding content part of your weekly routine. Schedule and plan any major design or programming tasks for the year. If your company or organization has a yearly website budget, incorporate it into your plan.
Step 4 - Follow through
Use your plan as a reminder throughout the year. Check your progress against your goals. If you have trouble remembering to check your plan, set up an auto-reminder to check it every 2 weeks. Keep working on the highest priority goals until they are complete. Accomplished all of your goals? Start over and create some new ones.
I wish you all the best of luck and success as you achieve your goals in 2008.
Adding DVD video to your site
Believe it or not, one of the most common requests I get is for help adding a DVD video to a website. The process is pretty straight forward once you know the steps involved, but there are lots of options so it is not surprising to me that so many people need help with this. This post is about DVD video, but much of the information can be applied to other video types as well.
Many companies and organizations seem to have video in DVD format. Why? Because DVD is a popular format to record to and makes it easy to distribute long video recordings. Trade shows, networking events, or even television advertisements are often saved to DVD for distribution. And so it is, many DVD’s show up at my door, urgently trying to get on to the web.
The first step in getting a DVD onto the web is to convert it into a format that is better suited for the web. There are many formats for video on the web, and so this first choice can be a tricky one. The most common video formats for the web are:
Flash Video (.swf, .flv)
Windows Media (.avi, .wmv)
QuickTime (.mpg, .mov)
There are other less popular formats, such as Real Player that I don’t want to discuss. You may want to offer your video in multiple formats, so that your visitors have an option. If you have a specific reason to offer the video in a particular format, this is the time to address it. There are likely many opinions about which format is best, or what to offer your site visitors. I remember a time a few years ago when it was common to offer video in multiple formats to give the choice to the user. While this sounds nice in theory, it becomes very challenging to manage multiple video files and it disrupts the user experience to have to choose a video format as you browse a site. Luckily, new technology has come out that makes the choice a no-brainer. Flash video has become the clear winner in this arena, and it is the option I most often recommend. Huge video sites like YouTube rely heavily on Flash video technology, and for good reason. It’s the best choice!
Flash video has the following advantages:
- Easy to Embed video player
- Most downloaded browser plugin
- Highly customizable video player
- Advanced streaming options available
If you agree, and decide to use Flash video to display video content on your site, the new queston becomes how do I get this DVD into Flash? Easy! You must download and purchase conversion software. Since Flash can’t natively import DVD video, you must find software that will convert a DVD into a file format that Flash recognizes. There are hundreds of these software packages available online. Some of them are even FREE! I recommend ponying up a few bucks for one, and avoid the hassle often associated with trial versions, or partially disabled software. I have had success using Flash DVD Ripper which you can pick up for around $35.00.
Once you purchase, download and install the Flash DVD conversion software, you are ready to convert your DVD. Flash can import multiple video formats, including many of the popular formats mentioned above, such as .wmv, .avi, .mpg and .mov files. Depending on your local computer, you may have better results with certain file types. I usually use .wmv since I am on a PC and it works. Using the simple conversion software, you can convert your DVD into a .wmv (or other supported file type of your choice). This process can take between 20 minutes and 2 hours, depending on the length of the DVD you are trying to convert, and the processing power of the computer you are using. When it finishes, you should have a single video file on your computer such as “NovemberEvent.wmv”. This is the file you will import into Flash. But before doing so, this is a good time to take into consideration the size and placement of the video on your site. The source video might be much wider, or taller than the spot you have for it on your website. You need to measure the space you have, and plan accordingly. If you have 300 pixels to put the video, you don’t want to stuff a 600 pixel wide video into it. You can use Flash to properly resize the video while you import it. Video dimensions are usually constrained height and width, so just worry about figuring out the width you need to resize the video to and that should be enough.
Inporting video into Flash is pretty easy. Open the Flash application, go to the file menu and select Import > Import Video. This will launch the Flash video import wizard which will take care of everything you need to create Flash video. There are some questions in the video wizard that are more important than others. Besides specifying the video you want to import, you will also be asked if you want to use streaming video or progressive download. These are two different ways to use Flash video. Streaming video requires a special streaming server, and unless you know for a fact that this is the setup you have, you are probably looking to use progressive download. Progressive download is a fancy way of saying “not streaming.” With progressive download, you can only view as much of the video as you have downloaded. If you have a 30 minute video, you will not be able to watch the 23rd minute, until you have downloaded minutes 0-23. With a streaming server, you could request just the 23rd minute, by moving the video player scrubber. If you are trying to get a single video on your site, and this is a one time situation, you most likely want to use progressive download. If you have many videos, or a video section, you may want to consider a streaming option.
Assuming you choose progressive download, you will next be asked if you want to resize the video dimensions. You also have control over quality output settings for audio and visual channels in the video. You will have to choose a video skin, which is the look and feel of the video controls that you see. You can choose between displaying only a few, or all of the available video controls such as volume, seek, play, and stop. You can also choose a skin color to match your website. Flash will generate a separate file for the skin itself. It will be named according to the options you select such as SeekPlayPauseGrey.swf. Make sure that you upload this file to your server when you are finished, or you won’t be able to control your video.
Importing the video into Flash will automatically create another separate file called an “flv”. This is a Flash video file and it should be in the same directory or folder as your skin file “SeekPlayPauseGrey.swf”. When you have finished importing the video into Flash, you should see an empty black video component on the Flash stage, and not much else. Publishing this Flash file will generate the third and final file you need, which is the container file that holds everything together. If you have saved your Flash file as “NovemberEvent.fla” you should end up with a file called “NovemberEvent.swf”. This is your video container file. It contains important information like the path to the .flv and the path to the skin file .swf. If you need to change the path or file name, you can do so by selecting the video component on the stage of your container file, and going to the parameters tab. If you plan to embed this video into a page outside the folder where all the files live, you will need to update the path to both the .flv and the .swf skin file to work, relative to the embedded page. For example, if your video files are located at “/Videos/NovemberEvent.swf” and you want to embed the video in the index page of your site at /Index.html, you will need to change the path for the .flv and skin files from “SeekPlayPauseGrey.swf” to “/Videos/SeekPlayPauseGrey.swf”. This part can be a bit tricky if you are not used to file path issues. In the end, you need 4 files on a web server to make a progressive Flash video player work.
1. Html to embed the video container file (index.html)
2. Flash video container file (NovemberEvent.swf)
3. Flash video file (NovemberEvent.flv)
4. Flash video player skin file (SeekPlayPauseGrey.swf)
Any time you see a reference to these files in html, or in Flash, you should use the full path to the files such as “/Videos/NovemberEvent.swf”. If you have problems seeing the video, or the controls, check your paths. Upload all your files to your web server to test. If all went well, you should see your original DVD on your website!
If you don’t have Flash, or are just looking for another option, you could also use a video file sharing site such as YouTube to upload, convert, and host your video. This option removes some of the complexity involved in importing to Flash and uploading to a web server. You don’t have to worry about file path issues either. You do loose some control over the look and feel of the video player, and you are also making the video content available to the world by hosting it publicly. These are all important options that should be considered. For larger companies looking to distribute streaming video, there are commercial video solutions that have lots of advanced features. Services such as Brightcove allow you to manage entire libraries of video, add advertising in your videos, and much more. You can also rent hosting space from streaming media service providers to host your streamed content.
After explaining the various options for adding DVD video to a website, it is even more clear to me now why people need help with this process. If you don’t have time to fuss with the details and just need it to work, you can always hire me! I’d be happy to help.
Site launches and announcements
It has been a busy summer and an even busier early fall for Ben Harper Design. Lots of projects are coming to a close, and even more are just beginning. The busier things are in project land, the slower things are on the blog and so I apologize for the lack of more frequent updates. But that’s good news for all the projects we’ve finished.
What’s kept us so busy these last few months? I am proud to say we have just launched a fantastic new site for the Spain - U.S. Chamber of Commerce. We’ve spent six months and over 500 hours completely overhauling spainuscc.org. The site is fully content managed, allowing administrators to add content in all sections of the site, including photo galleries, videos, FAQ’s and more.
Even more exciting are the business administration tools that were added to the site allowing the organization to move much of their business processes online. This includes full member subscription management to their 400+ member base, making up the core of their business. Credit card processing was set up so that members and non members could pay for events and publications online. The entire site is multi lingual, allowing international visitors to choose between English or Spanish versions.
Over all, the site is a huge success and brings tremendous value to the Spain - U.S. Chamber of Commerce. This was the first project of this size and magnitude completed by Ben Harper Design since we launched in April and we are so tremendously happy that it went so well. Our contacts at the Spanish Chamber of Commerce were a pleasure to work with and made the process easy and enjoyable. I am also very grateful to the small team of developers and designers who worked with me on this project. Hats off all around!
Ben Harper Design has also made new relationships with several small firms in Boston and Chicago, teaming up on web design projects of all sorts. Look for more updates on these projects in the coming weeks in the portfolio section.
As always, if you are looking for an experienced team to build you a great website, look no further. Drop us a line, or email us any time.
Zero Gravity - A Silverlight game
Recently, I had the great pleasure of working for Terralever Interactive on Zero Gravity, a unique online game. The project was commissioned by Microsoft as a means of showcasing Silverlight, their new interactive platform. Zero Gravity is a space themed puzzle game which takes the player through 25 mind bending levels of maze-like puzzles. Designing a game interface was a first for me, and provided me a chance to think outside of the website box.
Further stepping outside the box, I also got to learn how to design using Microsoft’s design tools Expression Design and Expression Blend. I had not previously used these design tools, but found them intuitive enough to just allow me to jump right in. It was fascinating to see how Microsoft designed their creative applications, and to notice how technicaly driven the interfaces and underlying presentation format are.
I also think Microsoft was smart to promote their new software in this fun, exciting way. Many products, or campaigns could be benefited by a similar viral approach. By creating something unique and engaging, they have brought value and pleasure to the user, while simultaneously demonstrating the functionality of their software. They also took this one step further by having an outside firm develop the game, which pushes the exposure of the game and gives designers and developers a first hand look at their new applications. Very Smart!
This project was a lot of fun to work on and I am extremely happy to be a part of it.
Visit ltbennett.com to play Zero Gravity now! You will need the Silverlight plugin before begining. Visit zerogravity.terralever.com for more info.
How to choose the best web design company for your next project
As the owner of a small web design company, I am often being evaluated and compared to other companies by clients in the process of finding the best web design company for their upcoming project. For this reason, I spend a lot of time considering what goes into this important decision making process and have some insight that can help simplify your search.
What should you look for in a web design company?
1. You should love their work.
Successful web design captures a visitors attention. You want your new website to do the same. Review the portfolio of work for any company you are evaluating. If what you see leaves you less than inspired, find another company. After reviewing a few different portfolios, you will be able to establish a baseline for your likes and dislikes as they relate to the needs of your new site. While each website is unique, and requires its own design, you can get a good understanding of a companies abilities by looking at their portfolio. If you are working as part of a team, make sure to review the works together and reach a general consensus.
2. Do they have relevant technical experience?
Lot’s of companies act as a one-stop-shop, offering to service your every web need. While it’s true that many companies share a common knowledge base, the spectrum of web technologies is vast, and most shops specialize in a specific set of recommended technologies. If you have a specific technology requirement, make sure the company you work with has a demonstrated experience with it.
3. Recommendations and referrals
Despite the plethora of info available online, sometimes it’s better to ask another human for their opinion in the search for the best web design company. You can get good insight into a company from their clients. Ask your colleagues and friends if they can recommend a good web design firm. If you are evaluating a specific company, ask to speak to some of their existing clients.
4. Is the price right?
Just like with any purchase, you want to get the most bang for your buck. When buying a website, it can be difficult to measure and compare just exactly what you are getting with one company versus another. This is especially true if you are less experienced with web technologies and standards. Sometimes there are small intangibles in a web project that are hard to evaluate upfront. Do your homework, and don’t be afraid to ask questions. Find a project completed by the potential web company that is similar to your new site. Review the work flow and general ease of use of the site. Have they put in the extra effort into the small details, making the site shine?
You shouldn’t have to take out a business loan to buy a website. There are many ways to keep your costs down while keeping the quality high. The key to accomplishing this is maintaining a focussed, streamlined approach to your site. Do more with less. Trim the fat. Target your website to accomplish specific prioritized goals. You can break your project up into affordable chunks. Growing a website is an iterative process so don’t be afraid to break it up into manageable bite-sized pieces.
5. Accountability, reliability and professionalism
Building a website can be a complicated process that takes time and commitment. To succeed, you need to work with a trusted partner that has a vested interest in your success. Try and find a reliable company that can stand behind their work and their word.
Building a website can also be a lot of fun (in a nerdy way), so don’t hesitate to work with people you enjoy.
Happy hunting!
Meet In The Lobby
Ben Harper Design is pleased to be hosting meetinthelobby.com - a hot new community blog for movie buffs who crave serious movie talk. This outstanding blog, presented by Norm Schrager features interviews, movie previews and more. So, without further ado, let’s meet in the lobby.
Next Page »