Lisa Forgan's Blog

Web Developer's Tools & Tips part 2

2011-01-14T11:31:00.004-07:00

Best thing about designing/building websites are the cool tools available. There are a wide variety of tools to help improve your skills and increase your productivity. Here a few more tools that are great to have:

Firebug
This is a great tool to inspect html elements. You can modify stlyes and layout within this tool. Just be aware that it is for just viewing purpose only and you must make these changes in your html file. Firebug also has an advance Javascript debugger. It can analyze network usage and performance.

ColorZilla
You can view the color of any point in your brownser. This is great for figuring out what color is used and able to paste it into another program.

Measure It
With this tool you can draw a ruler across any webpage to check the width, height and aligment of the elements in pixels.

Web Developer
Various web developer tools that is a must if you work on, build or troubleshoot websites. Lots of information packed into this baby. Everything from the basic view source, view css, view javascript, ways to display attributes, outlining, DOM Inspector, cookies, disabling features, Elemental controls, etc.

Colorful Tabs
Great way to stay organize and separate your tabs. It colorizes every tab into a unique color so it is easy to distinguish them.

Google Analytics:
Google Analytics is a free powerful tool that lets you see and analyze your traffic data. Great for tracking transactions to campaigns, keywords, etc and measuring the loyalty and info while identifying your revenue sources. You can set goals to track sales and conversions.

Kuler
Need help creating a color pallet. Kuler is a greet tool at generating color themes to inspire your projects. You can create your own colors or you can browse through thousands of themes from the Kuler community. Best of all this tool i free.

Search Engine Updates

2010-12-08T10:52:00.002-07:00

Here is a quick review over some of the search engine's updates that will have impacts on where you may get impacted in the results.

Google

Back in November, Google had released their Instant Previews to improve search results and user satisfaction. At first there were problems with the previews not displaying properly. Google has fixed the issue, except for flash. Google recommends using 'previews vs. clicks' when filtering information in analytic.

Bing

Bing has successful intergration with Facbook features in its search engines. Users will have to opt-in. This allows them to see 'likes' from friends in their results. The results shown will only be of those whom you are a member of in Facebook and friends with a person.

Also, when Windows Phone 7 was released so was the Bing for Mobile app. The app is preinstalled on the Windows phone and Android users can download the app. During the launch Bing updated Maps home page with redesigned menus, more access to Map Apps and Street Views, and gave more controls.

Yahoo

In response to Google Instant, Yahoo announced testing of Rich Search Assistant. Their format provides only answers, not the results, and will focus on news, sports, TV, and other trendy topics. Yahoo’s Local interface is trying to be geared towards content versus directory. The feature is currently in beta, but it would contain community content, daily deals, news and events. Also, Yahoo’s new local search quick apps now lets you circle an area and display the top five picks in the area, using Sketch-a-search app. OpenTable app lets you choose and book a table online within the search results. You also can compare, price, distance, cuisine and rate restaurants with the Restaurant Comparison app.

Web Developer's Tools & Tips part 1

2010-11-18T07:54:00.006-07:00

JW Player
I've been using the JW Player for over 5 years. It has been the best solution for a video player skin. When JW Player first came out, it was a sweet simple tool to style your player. As it has grown over the years, it has become a bigger and grander tool. It has a little more functionality and is even more simple to use.

The best thing about this video skin, is that it has a big community behind it. That means, they are always improving it, there are always people to help you find the solution to your problems, they are staying up with today's coding technique (yes, html 5 too) and it is cross-browser/device compatible. It is easy to customize so it fits into your website's layout and design. The JW Player also can have a video library or not. It can play many formats. View the specs here. Skin it. Script it. Embed it anywhere. Play it on your iPhone or iPad, too. Visit the JW Player Website.

You can use the JW Player Wizard to help you achieve the look and feel you want. It will also generate the javascript code. Go to the Wizard.

To use this it is simple and should only take a few minutes to set up.

Step 1 : Define what video you want it to be / and its format (flv, mp4, etc)
Step 2 : Put/link swfobject.js in the head.
Step 3 : Upload your video onto the server
Step 4 : Paste JavaScript code into the html where you want it to display.
Step 5 : Customize color, size, etc. to your needs.
Step 6 : Test

That pretty much sums it up on how it is done.

jQuery
I think with jQuery, I've been using this library for 7 years. It is a quick and simple JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.

The great thing about jQuery is that there is a huge community behind it and it is very cross-browser/device friendly. They consistently are updating/improving code. They also have many people who can help you with troubleshooting and questions.

Some of the possible animations, plugins, or even just simplified JavaScript code you can do are:

Superfish Menus
Accordians
Fades
Sliders
PNG Fix
jParallax
Animations
Pretty much anything.

To learn more about jQuery, click here.

To learn about jQuery's mobile devices coding, click here.

There is also a mobile device coding that follows similar to jQuery but has a liquid layout called the CSSGrid.

Article Recognization

2010-10-12T14:09:00.004-06:00

So, it has been a while since I posted in here. I'm a little delayed notifying others about a wonderful accomplishment due to being busy at doing what I do best, building websites, of course. Back in August I wrote an article about Designing and Developing a Mobile-Friendly Site. It was originally only to be seen internally at work. The good news is that the Business Marketing Association (BMA) got a peek at my article and requested to have it published onto their site.

Basically, my article is about best practices and tips when starting to build mobile friend versions of the website. I talk about how to make it conversion driven and seo friendly. It is also a great reference tool to show how different a mobile site is compared to a regular website.

Click here to read my article on Designing and Developing a Mobile-Friendly Site

HTML 5 and CSS3

2010-07-22T16:10:00.005-06:00

If you are a web developer you probably have heard about HTML5 and CSS3. There is so much hype about it that it seems to bring up many conflicts whether to use it or not. I did my research upon this style of coding and spent an ample amount of time from the start learning it. There are definitely benefits to learning it but I feel it has come out a little premature due to all the hacks and lack of browser support. Also, the W3C hasn’t even made this a standard of coding yet. If I remember right, they stated when HTML5 first was announced that they don’t expect it to be a standard for about another 10 years.

Because I like to be optimistic about stuff, I'm going to talk about the pros first and then get into the cons.

Here are some of the Pros:

It lets you do drop shadows on boxes and text all with css
use a variety of fonts replacements with @font-face (similar to Cufon) without needed sifr (flash based) or images
Some very similar XML like tags (for example header, nav, article, section, footer)
Gradients (css based and no need for images)
Can do Canvas
Simple Doctype

Here are some of the Cons:

IE6-9 do not support most (almost all) of HTML5 and CSS3
In order to get all the IE's to work consistently, you will need to use javascripts or specially coded htc files and also include the "behavior" attribute for certain stylings in your css. Even this may not cover all the new styling abilities.
You need to do multiple hacks in order for it to look consistent and work across all browsers (this ends up adding way more code and looking like when css first came out and each browser didn't follow the same rules)
It makes your code look dirty because it can lead to overcoding.

There are many reasons I believe it is a premature move to fully code in html5 and css3 without making sure your IE's work. IE is important and if you want to use HTML5, you will need extra time to make sure it is consistent. Most companies use IE6 still (especially non-profits). It is hard for them to upgrade due to time, software compatibility and money. Yes, they could easily download Firefox... but be real about this. They don’t! Sometimes it is because they aren't computer savvy or it is rules of their organization. So, in the meantime for all the developers who say don't code for IE6 or for any IE, remember that you are losing about 20% of your users and potential clients.

Now there are some clients who want their site to work in IE and don’t care if it looks exactly the same across browsers. You then can do Progressive enhancement. This is another method of coding that makes IE still usable and functional. Anyway, this is another topic for another time. :P

How to Sell Your Ideas the Decision Makers

2010-06-22T14:52:00.005-06:00

Idea Selling - It is useless to have great ideas unless you can sell it.

Selling is a transfer of enthusiasm
Passion is the quality of commitment
Be yourself but be the best version of yourself
When you have an idea, own it and posses it

"It's useless to be a creative, original thinker unless you can also sell what you create. Management can’t be expected to recognize a good idea until it's presented to them by a good sales person."

Rapport Science

In order to build a strong rapport with your decision makers, you must build a relationship with them. By getting to know the audience you can associate and share the similar interests. There are many ways to learn about your decision maker so you can build that rapport. Learning their business lingo or how their days are (weekdays and weekends) can help bridge communication gaps. When you get the decision maker involved throughout the process they’ll approve and take ownership. This is due to the fact that it makes them feel part of the thought process. It gives a higher chance for approval. Once the client feels comfortable and gives approval it then becomes their ideas as well since they get to see it as the designer does.

In order to make your decision makers or bosses comfortable with having you deal with the project(s), you must know the appropriate questions to ask.

Questions should be based on:

How come
Easy ones & open ended
What else should I be asking you?
Listen!

Don’t get offended if your boss or decision maker has objections. By not getting too personal with critizims, you can step back and see it from the client perspective. This is a great way to pull yourself back together and try to get the client to see what you are visualizing.

What to do when client has Objections:

Pause
Agree
Ask

Remember if to trust your gut feelings when doing presentations/pitches. If you walk in to give a pitch and it doesn’t feel right, ask to reschedule. Sometimes it helps put the clients in check to emotionally be focused otherwise if they can't get into the mood, they may shoot down your presentation before you start.

What about Handouts?

Don't use handouts for idea pitches/presentations as they can be a distraction. It can easily break your sell before you start. My suggestion would be to use Leave Behinds. They are something the decision maker can take and sell it to their own boss. Leave Behinds provide examples, case studies and can be used as a resource material.

The Secret of Presentation Building:

Have 1 Big Idea, which should be your main theme. Get the point across in 1- 2 lines.
Have a strong start. Tell a story, fact, quote, objectives, etc.
Use simple language. Have 2- 3 keywords and be concise. Make memorable lines
Paint pictures. Make them visualize with your words
Add drama by knowing their wants/needs.

Now that you have some understanding of how to create a strong presentation which can sell, the next important step is practice. Practice – Practice – Practice! Show your confidence and that you you’re your stuff inside and out. People have expectations of you so it is important to be yourself, but be the best version of yourself.

And remember, once you sold something, don’t buy it back! Know when – and how – to close the sale.

Adobe vs Apple - The War Begins

2010-05-03T10:05:00.006-06:00

As technology advances the war of who will dominate the internet goes further in depth. We all know from the past about the browser wars. IE (Microsoft) wants to do their own thing while the other browser do another. W3C was created (web standards) to help stop this madness. Of course, certain things never change (like IE6). Now, comes the battle between Adobe and Apple. Interactivity and Rich media. This time it is all about flash support.

Apple has no desire to support flash. There are several reasons that flash isn't supported by iPhone, iPad, and other iDevices are because of:
Flash's lack of respect for battery life to the "reliability, security, and performance" problems of many Flash apps.

But Flash is still supported by the web and most mobile devices. It still has rich multimedia capabilities and is considered to be graphically interactive.

What does this mean for the future?

With HTML 5, it means that there will be more ways to display multimedia BUT only if you are capable of writing apps and getting them cross-browser and media device compatible. JavaScript can handle certain animations and interactivity that flash does but still isn't as capable of creating a full rich media experience. For now, don't expect flash to die or to go anywhere. It is still being used and Adobe is trying to improve their feature and client's needs.

Who does this effect?

Mainly, companies that specialize in just flash based sites and/or applications. Unfortunately, with the lack of apple's support in flash, this can cause a backup or controversy with clients who want their website to work in all forms of devices. It will also cause a downfall in these types of corporations if flash eventually does fall off the side of the planet. In other corporations, it can increase the need for JavaScript gurus to help develop supporting apps to make features similar to flash work across both browsers and mobile devices.

But, for now, we will just have to wait and see who wins this war.

Microsoft's point of view in this war:

Hachamovitch's explains that H.264 will be the only video codec natively supported by IE9 and he expects it be the codec of choice for HTML5. He smashes Firefox as he claims it can't provide native support. Therefore, In the
future of HTML5 where neither Flash nor Silverlight will be required to play embedded Web video, Firefox gets aced out.

Apple's point of view in this war:

Job's most important reason for shutting out Flash is that it's a cross-platform development tool. In other words, he doesn't want the competition and wrapping himself in HTML 5 is a way to look "open" as he no longer supports flash. He show's through the Apple's App Store that flash isn't always necessary to create graphically rich applications.

Adobe's point of view:

So far, this war has caused a downfall in Adobe's flash products. Even so, it is still the favored format for delivering interactive and video advertising. To stall falling sales, Adobe recently acquired analytics powerhouse Omniture for $1.8B. This will help understand what the click-through rates of those ads were in real time
and to be able to take more advantage of it.

Photography

2010-03-07T15:26:00.003-07:00

We all know that photos can enhance anything. The right type of picture can make a website, magazine, or even a photo memorabilia seem perfect. It can change your mood, make you cry, laugh, smile, and "ohs and ahs". Manny Forgan is a professional photographer. He has quality photos that are hard to find elsewhere. What makes his work stand out from other photographers is that his photos are all natural. He believes that by taking photos when people are not fully aware to participate their actions (which tends to become too model like), he can capture the special moments. It doesn't matter if it is a landscape, candid, or pet... Manny Forgan's photos do capture the moment as if you were there on looking and experiencing that exact moment. Check out his work and website at http://mannyforganphotographer.com/.

Sometimes it is important to make your work stand out. Using stock photos can become boring and overdone, that is when hiring a professional photographer is important. They can help find that uniqueness to brand yourself and also attract new customers. Professional photographers can take the right photo that will meet your needs.

This blog has moved

2010-03-06T21:31:00.001-07:00

This blog is now located at http://silverfoxinteractive.blogspot.com/.
You will be automatically redirected in 30 seconds, or you may click here.

For feed subscribers, please update your feed subscriptions to
http://www.silverfoxinteractive.com/atom.xml.

Educating Oneself To Grow

2010-01-17T15:11:00.004-07:00

It has been a while since I have written in my blog. Lots of changes have happened since the last post. I am moving forward in the web development end. I even took an opportunity to work for Wall Street on Demand. They are helping me grow more in the back-end web as well as deepening my front-end code in the development side. I am learning lots of advance javascript, jQuery, asp, asp.net, etc. I feel that it is important to share some of my education to fellow web developers, clients, and even those who are just following my posts.

But for now...
Please keep checking back to see what new skills are coming along the way.

8 Elements That Shouldn't Be Forgotten When Designing A Website

2009-10-09T20:16:00.004-06:00

There are 8 elements that many designers and developers forget to style or place into a website. Sometimes these elements go unnoticed for a period of time. The 8 elements that I will list and describe are in no particular order. It is important to understand from this list how to improve one's website and what is missing.

1. Favicon - Favicons are great at branding and identifying who you are. They not only take your branding a step further in solidifying it, but they are viewable through bookmarks and the search engines.

2. Using gradients, textures, and shadows - Greatly enhances your website by giving a depth and keep things from looking flat and boring. This helps keeps your website pleasing to the eye, appeal to your readers and entice new ones to check out your site.

3. Icons - Icons are often not styled into the site. You'll notice that many designers will just slap an icon onto the site and it may not feel as it is part of it. It is import by finding or making the right icon (or set of icons) to fluidly fit into your design.

4. Whitespace - You do not need to fill every inch of your screen with something. It is important to know how to balance space and not fill up. The key words to remember are "Less is More".

5. Alignment - People respond favorably to symmetry because it is easy to follow and read, and ensures that your elements are all in line. There are so many ways to be visually stimulating to those who will be interacting with your site. It is never wrong to be a little creative but remember that too much can be distracting and hard on the eyes.

6. Typography - Typography can make your site pretty and enhance the mood. It also gives headlines a way to stand out and grab reader’s attention to draw them in... makes it eye catching.

7. Emphasis - There are so many ways to make emphasis on text or objects. Such methods are bold, italics, colors, etc. Make sure that you take this into consideration and use it wisely to bring out the important information for users so it can stand out for them.

8. Styling Lists & Blockquotes - Bulleted Lists and Blockquotes are mostly forgotten and they are greatly used. By taking a few moments to style these elements it will ehance the look of the website and gives a sophisticated appeal.

I feel these 8 elements are a great starting point on enhancing a website. If you feel that your website is missing some appeal or styling, please contact me today.

Client's Websites

2009-09-01T14:07:00.009-06:00

I have been busy working on many projects. One of which, I'm proud to say, is now live on the internet.

Truitt Law Offices is a new website that I designed and developed. The client requested to have a site that had depth and unique appeal. They also stated that they wanted no photos of which felt to business oriented or contained business suites. This site has an expandable form and sitemap. Check back soon to see my website gallery updated.

Also, I'm am currently making more updates to Network Affiliates Legal website. They are adding expanding mini forms that can email directly to each staff member. The background is going to get a little face lift to add more contrast and appeal to the site. Keep checking back to see these changes.

Another website that I took over is The Atla Wage and Hour. It is a Drupal site that allows its members to search and find lawyers. This site is not yet live as it is the process of getting the client approval. I had to build out and style the website based on the composition that was designed by another designer. Check back soon as this site will soon be displayed and available for viewing.

Contact Lisa Forgan at silverfoxinteractive.com today to see how I can help enhance your site.

Updated Website

2009-07-19T21:00:00.008-06:00

SilverFox Interactive has just been updated. I have added a new page addition to SilverFox Interactive called Featured Updated Websites. On this page you will be able to view my updates and read a description of how and why I applied the updates to the clients' websites.

Also, I've added two new featured websites to my web gallery page.
You can view my very first Drupal (CMS) Website and learn about the specialties this site contains.

But, that isn't the only site that was added. Check out the new sites and rediscover what the knowledge of web is all about.

Have fun! If you have any questions about my web services, please contact me and I'll help you to the best I can.

Drupal Camp Colorado

2009-06-27T21:08:00.007-06:00

I'm so excited to be able to attend the Drupal Camp Colorado. It is a very important event pertaining to knowledge and skills dealing with Drupal.

What is Drupal Colorado?

First let me give you a very brief description of Drupal.

Drupal is a free program that lets users, such as individuals or a community to publish, organize and manage a wide variety of content on a website.

Drupal Camp Colorado is the region's largest gathering of people interested in Drupal that occurs yearly. The attending dates are June 27 and 28th. It is located at the Denver PPA Event Center and is an all day event for both days.

What does this mean for SilverFox Interactive?

Well, with training myself and getting hands-on-experience with my first Drupal Site Client (check back soon as I'll have a link and a new piece in my gallery once the site is finished), I'm able to communicate with highly experienced professional Drupal programmers and Designers. I am learning more efficient techniques and ways to implement better methods to improve my work-flow.

Naming a few of the seminars that are being taught:

Design Theming
Node Theming
Functional Design
Content Construction Kit and Views
WYSIWYG
Ubercart
Modules
Taxonomy
and more

If you are wanting more information about Drupal and if it may be suited for you, contact me today. We can discuss if you need a Drupal website, need a design for a Drupal site, theming a Drupal site, or wondering if you should approach Drupal or not. I will be able to help you.

Learning Drupal

2009-06-06T23:55:00.005-06:00

I am currently learning Drupal. So far I've been spending several hours a night teaching myself CMS (Drupal and theming). I have inherited a website in which I am now the Designer/Developer doing all the upkeep and maintenance. The site is purely Drupal and it is all customized. So far, I was able to find several problems in the theme template that the client is using and made some changes to enhance it.

This work and self teaching is very time consuming. In the long run, I will soon be able to do Drupal.

If you have any questions about Drupal or what it is, feel free to contact me.

SilverFox Interactive Redesign

2009-06-05T22:26:00.003-06:00

I'm so excited. I just finished my redesign of SilverFox Interactive. I added several new features to my site. I got an animated jQuery banner and also a small flash piece. I added a web services page...in here you'll find my specialties and what I do. Feel free to look around at the new and improved redesign. Please contact me if you have questions.

Getting A Facelift

2009-05-24T19:25:00.001-06:00

I guess it is time to start thinking how I can improve SilverFox Interactive. I feel that since I am growing more with knowledge, so should SilverFox. I need to show how I, Lisa Forgan, has become more than just a web designer... but a professional webmaster.

So, keep checking back and the new design may be up.

How Typography Can Improve Your Website

2009-05-07T14:58:00.009-06:00

A webmaster once told me "What separates a good website from the GREAT websites is the Typography."

Typography can change the mood of your website. It can also change the readability of the text and contents.

So What Is Typography?

Fonts - try to limit down to 3 main fonts.
Calls to Action - Fonts used here are to catch the eye of the viewer and make them take an action
Colors - important for readability and standing out from the content
Text Decoration - this occurs through bolding, italicizing texts, and also underlining
Animation - flash can also enhance your typographic detail by animation
Formatting - Left align, center align, or right align
Eye Tracking - this means how to separate your content with specific heading tags, bullet points, and also width of the column

No matter how you apply typography to your website, the key goal is consistency and to make it an easy read.

Click here for an example of how typography can be applied.

If you feel that your website's typography can be improved, please contact Lisa Forgan today.

Welcome

2009-05-04T09:36:00.005-06:00

Welcome to SilverFox Interactive. Thank you for visiting my blog. My name is Lisa Forgan. I am a web designer and developer. Feel free to explore my website. Please let me know if you need a new website, a website redesign, or even updates. I will help you with my professional skills. If you have any questions contact me and I'll try to assist you to the best of my abilities.

I would like to use this blog to share a little more about what I do and who I am. It is not always just about websites but also building a relationship.

In this blog you may also find the new trends of today's websites and marketing techniques, educational topics, as well as understanding of what a web designer does and why.