Category Archive: Web Design

How to Close Fancybox from an Iframe

This little snippet is being posted because of extreme frustration in trying to find the answer for how to close a fancybox window with a link or button.  Hopefully this little tid-bit will help you out.

How to close Fancybox from an Iframe:

 

<button onclick=”parent.jQuery.fancybox.close();”>Close</button>


And it will look like this:



or for a textual link:

<a href=”#” onclick=”parent.jQuery.fancybox.close();”>Close</a>

Google Fonts

I saw an interesting Twitter post the other day talking about Google’s font directory.  Fonts have always been a problem on the web as not everyone has the same fonts installed and it has made consistency on a website a difficult task.  It appears, however, that Google is attempting to solve this problem by offering up an API for their currently small collection of fonts.

http://code.google.com/webfonts

Something else I have also noticed is they are using CSS3 to reference the styling of their fonts.  You can learn more at their quick start guide and if I implement this in a site I will be sure to come back with an update and a link.

http://code.google.com/apis/webfonts/docs/getting_started.html

Choosing Safe Website Fonts

So you want your website to display a certain font, huh? Well before you go down the road of taking the time to run down the broad list of your options it is important to understand how fonts work. The reason for this is because if you choose a vague font to display your text the chances are good that your website visitor will not actually be able to see that font.

Before we go into further detail lets understand what a font is. It is easiest to think of each individual font as a computer program. When you are in your text editor, like Microsoft Word, and you see a long list of fonts it is because you have all of those fonts individually installed on your computer. Similarly, if you see a very short list of fonts it is because you do not have too many installed. If someone were to send you a text document with a font specified that is not installed on your computer, you would not be able to view that font. So basically this means that you can ONLY view fonts in documents that are installed on your computer.

What does this have to do with a font on a web page? Fonts on web pages are essentially the same as a font in a Word doc. When you visit a web page the code on that page tells your computer what font to view the page in. If your computer does not have the specified font installed, it will use your browser’s default font (like Arial) to view the web page.

So what does all this mean? This means that it is important to consult your web page designer before actually choosing a font for the content of your web page. You want it to be uniform for all visitors and there is a small list of fonts that are typically safe to assume are installed on all computers.

Here is a general list of safe fonts to use:

  • Arial
  • Lucide
  • Times New Roman
  • Impact
  • Tahoma
  • Courier New
  • Comic Sans
  • Verdana
  • Georgia
  • Garamond

Your web designer can define multiple fonts to be used in case one is not installed on the users computer. Its almost like a backup plan. When loading the web page your computer will go down the list and check for each font in order of preference until it finds one that is installed or gets to the end of the list and loads the browser’s default font.

In conclusion, we now know that it is important to choose a font for your web page that is standard on most computers and is not going to vary too much when displayed on different systems.

For more reading on fonts visit this nice MIT website that covers more detail.

How to Add your Business to Google Local

Have you ever wondered how Google gets its information for its local search results? All too often companies have erroneous information listed with Google due to an address change, error or for no reason at all. Here is how you can change your Google Local business listing.

If your business has a website that has been around for awhile chances are you have a Google local listing and you did not have to do anything to get it. Google will automatically create a Google local page for you whether you want it or not. The Google robots harvest information off your website, usually from the contact page, and create a listing for your website. But what if this information is incorrect? What do you do then?

If you have incorrect information listed with Google Local there is something you can do about it. Google has created a place where business owners can login and edit their current business information.

If you have a current listing with Google you will want to actually search your business name. If you don’t have a Google local listing yet click here. For example, search “Moore Web Exposure, Portland, OR” but replace that with your business. You should find something like this:

mwx-local-755623Next you will want to click on the “More information >” link that you see at the bottom there. This should take you to a page that gives you the full listing for your business.The next page should look something like this:

mwx-full-745667You will now want to click on the “Add or edit your business” button you see highlighted in red. The rest is pretty self explanatory as long as you have the patience to follow the directions Google provides you. You will be taken to a page where you can edit your business. The whole process is pretty easy. Once you put your information in Google will ask to verify that you really are the owner of that business. They will call the phone number provided and give you a verification code to enter. Its that easy.

If you do not already have a listing with Google then you will have to create one from scratch. Go to www.google.com/local/add and add your listing to Google. There is a video tutorial provided by Google that is helpful as well.

Once you have your account setup feel free to look around and see what Google has to offer. You can add coupons for your business as well as track the number of people who look you up. If have questions on Google local than feel free to contact me for help.

Stock Photos: What are they and why do I need them?

Stock Photos:

Wikipedia’s definition of stock photos:

Stock photography consists of existing photographs that can be licensed for specific uses. Publishers, advertising agencies, graphic artists, and others use stock photography to fulfill the needs of their creative assignments.

A customer who uses stock photography instead of hiring a photographer can save time and money, but can also sacrifice creative control. Stock images can be presented in searchable online databases, purchased online, and delivered via download or email.

A collection of stock photography may also be called a photo archive, picture library, image bank or photo bank. As modern stock photography distributors often carry stills, video, and illustrations, none of the existing terminology provides a perfect match.

So, how do stock photos come into play when it comes to your website? Stock photos can be used to essentially enhance the overall look and feel of your site. For example, a picture of two people shaking hands would be a good picture to put on the meet us section of your website.

Stock photos are not free, however. For truly good images there is usually a fee involved for use. Most people do not want to pay for these images as it adds up and therefore are looking for good websites that offer free images. Here is a list of websites that offer free or close to free images. ** Be sure to read the disclosures, terms of use and any other agreements. Most of these sites also offer images for a fee and it is sometimes hard to tell which ones are free. Additionally, many terms of use agreements state that the images cannot be used to make a profit. So for all you not for profits organizations out there, you may have just found your loophole to the stock photo issue.

http://www.sxc.hu/ – Recommended

http://www.morguefile.com/

http://www.imageafter.com/

http://www.freefoto.com/index.jsp

http://www.everystockphoto.com/

For even more visit this comprehensive list:http://www.digitalimagemagazine.com/blog/featured/25-free-stock-photo-sites/

Online - click to chat

Listening To:

Sister by The Black Keys
from the album El Camino.
1 week ago via last.fm.
Powered by Google Talk Widget