Monday, November 10, 2008

How to Open a Link in a New Window

Sometimes you want your readers to stay on the same page that they are at, even if they click on a link. In fact, many Web sites open a new window whenever you click on a link external to their site.
Before you decide to make all your links open new windows, there are some things to consider:
  • Some readers are annoyed when they have multiple windows open on their screen
  • The back button doesn't always work in the new window, and this may confuse some people
  • Do you need to have the window be fully functional?

Depending upon what you need and want, there are two ways to open a new window when your reader clicks on a link:Targeting (using a function that came from frames) JavaScript.

How to Add an HTML Table with Dreamweaver 8

The first step in adding a table in Dreamweaver is to choose where you want to put it. In Design view, place your cursor where you want to position your table.
If your Web page has nothing on it, the table will appear at the top left corner of the window.
Tables are block-level elements, and so act a lot like images or paragraphs in the flow of your Web page. You can also apply block-level styles to them like float to make them align on the page how you'd like.
Once you have your cursor positioned where you'd like it inserted, go to the Insert Menu and choose "Table". You can also use the shortcut keys provided (Ctrl-Alt-T on Windows and Cmd-Option-T on Macintosh) to open the insert table menu.

How to create a web page with html.

Once you finish this entire course, you'll have created a Web site that you can use for many things, for example:
  • Photo gallery - as my demonstration site has done
  • A sales portal - where each photo is a product for sale
  • A family album - with one page of pictures and information for each family member
  • Your own special page
This Web page will have a navigation bar on the left to personalize your page and make it easy for your readers to navigate from one location to another.
All the text on the page will be styled using Cascading Style Sheets (CSS). This makes it easier for you to make changes in the future. You'll learn how to link text and images to other pages within your site so that people can get around easily

Tips for creating Plain-text Emails

  • Use a simple plain-text program. Microsoft Word will NOT work. Simple text editors are free, and they're already installed on your computer. If you're a Windows user, click your "Start" button, then "All Programs" and then go to "Accessories" to pick "NotePad". Mac users, open up a program called "TextEdit." When you use these programs, note that they are like working in the stone age. No formatting, no color, no frills whatsoever. That's plain-text. Hey, it works.
  • Most email programs will take a plain-text message and wrap it for you properly, so you don't have to worry about weird wrapping issues.
  • But in the old days, a lot of email programs automatically wrapped your lines at 60 or 70 characters. If you had something crucial (like a hyperlink) that started near the end of a line, it could be prematurely wrapped (and broken).
  • So the old advice was to enter a "Hard Return" at about 60 characters in your plain-text email. You can type the letter "W" 60 times near the top of your message to use as a temporary "visual ruler" for when to hard-return. Delete the ruler when you're finished composing the message. I don't even bother doing this anymore, but if you feel like being safe, go for it.
  • Bullet points are key. Plain-text emails are harder to read, so break it into chunks that are easier to skim and scan. Use little characters like (*) to make bullet points, and use as line separators.
  • Speed tip: in MailChimp, pop-up preview your HTML email. Copy the content. Paste that content into your plain-text email field, then reformat as needed.
  • When you send your campaign, both the plain-text email, and the HTML email are "embedded" into one message. The recipient's email program chooses which one to display. What few people realize is that some spam filters look at the differences between the content in both versions. If they see a big HTML email with lots of content, and a blank plain-text email, it looks lazy and sloppy (like spam) so they block the email. Plain-text emails are never exact replicas as the HTML email versions, but do spend an appropriate amount of time on them---people do read them.

What is wrong with sending HTML and MIME message?

  • Many E-mail and Usenet News reader programs, usually the mail and news reader programs that come with browser packages, allow users to include binary attachments (MIME or other encoding) or HTML (normally found on web pages) within their E-mail messages. This makes URLs into clickable links and it means that graphic images, formatting, and even color coded text can also be included in E-mail messages. While this makes your E-mail interesting and pretty to look at, it can cause problems for other people who receive your E-mail because they may use different E-mail programs, different computer systems, and different application programs whose files are often not fully compatible with each other. Any of these can cause trouble with in-line HTML (or encoded attachments). Most of the time all they see is the actual HTML code behind the message. And if someone replies to the HTML formatted message, the quoting can render the message even more unreadable. In some cases, the message is nothing but strange looking text. For this reason, many mailing lists especially those that provide a digest version, explicitly forbid the use of HTML formatted e-mail.
  • HTML or MIME messages are larger and more wasteful than simple text messages. Using HTML or MIME in E-mail messages makes the messages larger in size by a mimimum of two thirds to more than twenty times. These will take longer to download and they take up more storage space than standard plain text E-mail messages.
    E-mail storage is important because many people retain copies of messages they receive and in the case of mailing list digests , the individual messages are combined in one large message and sent to the user at the end of the day. Some mailing list programs fail to format the digest correctly if HTML messages appear. In addition, many mailing lists archive the messages for periods of 6 months or more to enable users to search for particular past postings.
  • HTML or MIME messages leave or include unwanted files (attachments) on the machines of the recipients of these messages.
  • HTML quickly fills the memory of PDAs (Personal Digital Assistants like the Palm Pilot). In addition, many HTML messages are also completely unreadable on most PDAs.
  • e-mail recipients may have set their background to something other than white, may have chosen a typeface which they find most readable and adjusted its size in accordance with their visual acuity, normal viewing distance, monitor size and screen resolution. All this fine tuning is completely erased by HTML e-mail

How to Create Great HTML Emails with CSS

HTML emails are widely used for all kinds of professional correspondence. Beyond email newsletters they're used for all sorts of application-generated messages, such as receipts and confirmations. Styled messages have lots of appeal for marketers, designers and consumers -- but for coders, it's a real headache to create them properly.
Creating an HTML email that looks right to every reader is a job that makes cross-browser testing look easy. What can go wrong? After reaching its final destination, an email could be read using any of a number of standalone email clients (such as Outlook, AOL, and Eudora), and even more Web-based clients (Yahoo, Hotmail, and Gmail to name a few). Each of these email clients displays your HTML email message a little bit differently, so ensuring that your message displays correctly can be a daunting task.
How are coders coping with this mess? Some say the only solution is to go retro -- by ditching CSS and using old-school HTML for formatting, but what about serious CSS coders who can't even type a font tag with a straight face? Fortunately, we have options

What Is Well-Formedness?

Well-formedness is a concept that comes from XML. Technically, it means that a document adheres to certain rigid constraints, such as every start-tag has a matching end-tag, elements begin and end in the same parent element, and every entity reference is defined.
Classic HTML is based on SGML, which allows a lot more leeway than does XML. For example, in HTML and SGML, its perfectly OK to have a
or
  • tag with no corresponding
    and
  • tags. However, this is no longer allowed in a well-formed document.
    Well-formedness ensures that every conforming processor treats the document in the same way at a low level.
    This leaves no room for browser interpretation. All modern browsers build the same tree structure from this well-formed markup. They may still differ in which methods they provide in their respective DOMs and in other aspects of behavior, but at least they can agree on whats in the HTML document. Thats a huge step forward.

    What is bitmap Formats.

    Bitmaps are inescapable for photographs and are also used for color contours and a variety of color gradients. There is a long list of formats. Fortunately there exist comprehensive sets of tools for dealing with them, such as the NetPBM utilities, as well as freely available image editors such as GIMP. If the graphic consists of nothing but the bitmap, then it is relatively easy to deal with, and the main question is how to avoid getting a PS file that is enormous. In fact it may well be the best policy to ask coauthors if they are supplying photographs to supply the JPEG file itself. Then you can convert it to PS in your own rational way, rather than receiving a butchered file from someone else's attempt to convert.

    What are the Instructions to graphics authors.

    The following might be useful to provide collaborators or others who are supplying you with graphics, as a way of telling them how to supply graphics in a compatible form
    • Supply Encapsulated Postscript, without preview, in portrait orientation.
    • Ensure the margin is minimal, the edges of the media surround the graphic snuggly.
    • Don't use print-to-fit settings.
    • Don't convert vector drawn figures to bitmap
    • Don't scan monochrome line drawings as black/white (two color); use gray-scale.
    • Don't supply figures that have been through Powerpoint unless unavoidable. Please use the original, prior to being imported into Powerpoint.
    • For vector drawn figures, export as PDF and EPS and supply both.
    • Supply (the original) JPEG for photographs if available.
    • Transfer EPS files using ASCII (plain text) ftp settings.

    Getting started with HTML: The Basics

    HTML text is simply plain text with "markup" tags in it to tell the browser what to do with parts of the document. If you've ever used Word perfect with "Reveal Codes" on, you can see what a marked-up document looks like.
    Documents are marked up with tags. Tags are enclosed in angle brackets (< , >) to distinguish them from the text.
    Most tags are paired -- that is, there is an opening tag and a closing tag, i.e., Exed text As you can see, the closing tag is preceded by a slash (/). A pair of tags and the material contained inside them is referred to as an element. (The example above is an X element.) Tags can have attributes, which are inserted within the angle brackets of the tag: Exed text Tags do not have to be capitalized, but most people do in order to make reading the HTML easier.

    Basic Notes - Useful Tips

    When you write HTML text, you can never be sure how the text is displayed in another browser. Some people have large computer displays, some have small. The text will be reformatted every time the user resizes his window. Never try to format the text in your editor by adding empty lines and spaces to the text.
    HTML will truncate the spaces in your text. Any number of spaces count as one. Some extra information: In HTML a new line counts as one space.
    Using empty paragraphs

    to insert blank lines is a bad habit. Use the
    tag instead. (But don't use the
    tag to create lists. Wait until you have learned about HTML lists.)
    HTML automatically adds an extra blank line before and after some elements, like before and after a paragraph, and before and after a heading.
    We use a horizontal rule (the


    tag), to separate the sections in our tutorials.

    Recap on HTML Elements

    • Each HTML element has an element name (body, h1, p, br)
    • The start tag is the name surrounded by angle brackets:
    • The end tag is a slash and the name surrounded by angle brackets
    • The element content occurs between the start tag and the end tag
    • Some HTML elements have no content
    • Some HTML elements have no end tag