Saturday, November 25, 2006

Flash is Only a Tool

Flash is a tool and like any tool it can be misused if it's used incorrectly. While there are no ironclad rules when you should or shouldn't use Flash, a little common sense can be helpful. Ask yourself the following questions:
  • Can the same effect be achieved with HTML and graphics?
  • Does Flash get in the way of the user such as increased wait time (not everyone has DSL or cable modem) or a requirement to download the plugin?
  • Has any important customer called up and asked, "Why aren't you using Flash on your site?" (I haven't... all they want is a functional and informational site that SELLS their product very effectively.)
  • Do the people suggesting Flash work in the marketing department? (Marketing people are mesmerized by shiny things.)
    Common Flash annoyances:
  • Loading time.
  • Use of "Splash" pages (which BTW, cannot be effectively indexed for optimization).
  • Poor navigation - especially the animated kind.
  • Often text is really small and barely legible.
  • Putting background music on the page.
    As you can tell, I'm not a huge fan of Flash.
  • MIE vs. FireFox

    Mozilla is getting lots of attention, thanks to Firefox and not just from computer geeks, Internet surfers and web designers. Mozilla boasts that Firefox browsers have a total of about 25 million users.

    Firefox is lauded by fans for its download speed and a superior user interface, and users say that its pop-up blocker is one of the best out there. It offers tabbed browsing, which means that users can jump back and forth between different sites with only one window open, and live bookmarks, which show users the most recent headlines on their favorite sites and lets them go directly to those articles.

    But the biggest challenge facing anyone who wants to take on IE is that most web sites are built to work best with Microsoft's IE, simply because it comes bundled on most PCs. That means some sites may not look quite right or may not be accessible at all via a browser other than IE. My FireFox "pet peeves", from a web designer's perspective, include alignment issues, unrecognized table attributes, background image issues (does not recognize fixed, no repeat or gradient properties). My advice, install both browsers and use the one that best fits your browsing application.

    Update on 2/24/07: I have installed FireFox 2 and IE 7. The improvements in performance, features and functionality of FireFox is marginable. (My "Pet Peeves" listed above are still issues with the newest version.) However, the new tabbed browsing feature on IE 7 is a plus. My only IE complaint, the pull-down menus are not visible in the default setting, you must customize your toolbar to add this feature.

    Friday, November 24, 2006

    POP3 101

    It seems the most requested "tech support" question I get from clients is how do I set up my POP3 email account on my computer? If you use Outlook Express, here's the simple steps:

    1. Open Outlook Express.
    2. Click on the "Tools" pull-down menu.
    3. Click on "Accounts", then "Mail" tab.
    4. Click the "Add" button, then "Mail".
    5. Type in the account name (you decide!), then click "Next" button.
    6. Make sure "POP3" is selected in the top box, then select radio button next to "I already have an e-mail account..."
    7. Type in your full e-mail address in the next box, then click "Next" button.
    8. For incoming mail (POP3) type: mail.(your domain excluding www)
    9. For outgoing mail* (SMTP) type: mail.(your domain excluding www), then click "Next" button. *You may have to use your ISP's settings here.
    10. Type account name:
    11. Type password:
    12. Check "Remember password" box, then click "Next" button.
    13. Under “Outgoing Mail Server”, check “My server requires authentication”.
    14. Click "Finish" button.

    That's it! You're now ready to send & receive e-mail with your domain account

    Do You Really Want To Manage Your Own Website? Learn HTML!

    (For Web Designers) This is why it is always a bad idea to suggest to a client, who has little or no HTML scripting experience, they can manage their website with a WYSIWYG editor:

    HTML Text Editors - PROS
    Faster to Edit- For simple edits, it is often faster to make changes to a page using a text editor.
    Helps You Learn HTML- Text editors teach you to read HTML. They often have wizards and functions to do the more common tasks (like the basic page tags), but you'll learn HTML if you use a text editor
    More Marketable- A Web Developer who can write HTML using a text editor will be more marketable than one who can only use a WYSIWYG editor. The former is more flexible and can get up to speed on any HTML editing tool, while the latter has to start all over with each new editing tool.
    No "Funky" HTML- The only HTML that will be in the document will be tags that you placed there deliberately. This will help your pages download faster, as well as look leaner.
    Human Readable HTML- The HTML can be generated the way you like it, and include comments and other notes to allow more efficient editing by other team members.

    HTML Text Editors - CONS
    Must Know HTML- While most HTML text editors can help with tags and suggest attributes and so on, this is no substitute for knowing HTML. Most modern text editors have drag and drop styles such as bold and italic, but if you can't remember the code for "non-breaking space" your editor might not be able to help.
    Steeper Learning Curve- Because you have to learn both HTML and the editor functions itself, a beginner will find a text editor more difficult to use.
    Harder to "Design" With- Some people find text editors more difficult to design pages in because they can't visualize how the page will look from just the HTML.

    DISADVATNTAGES of WYSIWYG EDITORS
    Crazy coding- Some WYSIWYG editors are guilty of outputting bloated and non-standard code. (especially FrontPage)
    Proprietary- Once you've got used to one WYSIWYG editor, it can be hard to switch to another.
    Can't fix things- Sometimes you have to get dirty with the code to fix problems. If you're only accustomed to the shielded luxury of a WYSIWYG environment, you'll be reduced to a blubbering wreck when things (inevitably) go wrong.

    WYSIWYG Is Not HTML
    All editors try to map WYSIWYG metaphors into HTML code (with varying degrees of success). WYSIWYG editors often make mistakes. Many are notorious for failing to close FONT tags or misplacing other tags on the page. Since browsers resolve HTML problems according to different rules, you can encounter unexpected problems when you test the pages.
    Limited Functionality- HTML itself isn't a precise language and you often have to wrestle with your code to produce the exact result you want. A WYSIWYG editor is less precise than editing by hand because it adds a layer between the designer and the code. There are just some things you can NOT do with a WYSIWYG editor, so you have to edit your code by hand.
    Editing Difficulty- You may have problems if you load a page you coded by hand into a WYSIWYG editor. They often reformat your code according to their own rules, which makes it difficult to go back and edit the page by hand afterwards. Some will even break the page entirely.

    LEARN HTML - Links for HTML basics:
    SoYouWanna learn the basics of HTML
    HTML Primer
    Dos and Don'ts for Website Design

    The worst WYSIWYG editor on the planet, in my opinion, is Microsoft FrontPage. It writes lines of useless code which makes reformatting in an HTML text editor a nightmare for web designers. I recommend Macromedia Dreamweaver.

    Web Design Basics

    Why have a website?
    -To market your product or service
    -To advertise your business or organization
    -To express yourself, your ideas, interests, values or philosophy
    -To provide a forum for viewpoint on issues
    -To entertain (music, video, online gaming, internet radio, etc.)
    -To inform, educate, enlighten
    -To connect with others in the internet community who share common interests
    Making your website irresistible
    Make your website “sticky” so people will come and stay for awhile!
    a. Is the content inviting? Make every surfer feels welcome to your site!
    b. Is the content interesting? Does it capture their attention?
    c. Is the content fresh? Stagnant content will kill website traffic!
    Make your website user-friendly so they’ll return, again and again!
    a. Use a sitemap or navigation bar.
    b. Use hyperlinks (underlined text linking to another webpage)
    c. “Inter-connect” every page on your website.
    d. Frames or no frames? (Personally, I don't like frames)
    e. Watch table and image widths, avoid “panning” (my opinion: 775 pixels or less, some users still have an 800 x 600 resolution display).
    Make your website appealing so that it will catch and keep a web surfer’s eye!
    Remember, just as important as the number of “hits” is the length of a surfer’s session!
    a. Using color (backgrounds & fonts)
    b. Using fonts (typeface, size, special effects)
    c. Using background textures and images
    d. Using images (animated or static?)
    e. Using JavaScript and applets
    f. Use a logo, banner or header to quickly identify your business.
    g. Aesthetics (color coordination, use your logo on every page!)
    What to avoid when building your website
    a. Clutter (too much activity, distracting, no focus)
    b. Large or excessive images and graphics (load too slow, keep in mind not everyone has high-speed access or a fast processor or modem)
    c. Poor quality images (looks unprofessional, avoid grainy appearance, aliasing, etc.)
    d. Too “wordy” (the surfer got the message, but are you boring them to death?) In other words, no visual appeal
    e. Too much “fluff”, not enough content (you may have dazzling effects, but does the surfer get the message?)
    f. Technical glitches (Test your webpage in a browser before uploading! I recommend Mozilla FireFox, it is very unforgiving)
    IMAGES
    Formats
    a. GIF- commonly used on the internet, supports animation and transparency
    b. JPG- best for images that contain a variety of tonal values, such as photos, does not support transparency. Uses compression, requires less upload time and server space than gifs or bitmaps
    c. BMP- bitmap, standard Microsoft Windows image format, supports paletted 24-bit RGB color and grayscale. Requires more upload time and server space
    Anti-aliasing
    The blending of pixel colors along the edge of an image (or font) to smooth out “jaggies” (jagged, “stair-stepping” along a curved or slanted edge)
    Transparency
    The “canvas” on which an image is displayed is invisible
    Special effects- add a:
    a. Drop shadow
    b. Border or frame
    c. Layer & combine images
    d. Text
    e. Animation- use with purpose, consider loading time
    Sources for acquiring images
    a. Scan from a magazine, catalog or book
    b. Purchase clip art software (such as ClickArt)
    c. Download images from the internet
    FONTS
    IMPORTANT! The viewer’s settings on their computer’s browser determines what fonts will be available and be used on your website! If you use a font not in their font directory, it will use the default font.
    I recommend using fonts commonly available on all computers (example: Arial, Courier, Times New Roman, Verdana and on Macs, Helvetica). If you want to use fancier fonts, create the word or phrase as an image to keep it’s character intact.
    Special effects- add a:
    a. Drop shadow
    b. Chisel, bevel or emboss
    c. Texture, pattern or sculpture
    Use color that coordinates with other images and text on the webpage. Experiment with different fonts to punctuate, accent and capture attention. TrueType fonts are available to download on the internet, or you can purchase software.
    BACKGROUNDS
    Avoid using colors, patterns or images that are too “loud” or “busy” that may distract from or compete with your webpage’s content. I recommend soft or muted backgrounds and light colors (“warmer” and easier on the surfer’s eyes).
    For more helpful suggestions, visit the "Links for HTML Basics" (see post above).