Friday, February 27, 2009

Hyper Text Markup Language – HTML

HTML is not a programming language, but rather a markup language. If you already know XML, then HTML will be a snap for you to learn. We urge you not to attempt to blow through this tutorial in one sitting. We recommend that you spend 15 minutes to an hour a day practicing HTML and then take a break, to let the information settle in. We aren't going anywhere!

Moving Toward Accessible Design

The accessible repair approach commonly taken to improve the accessibility of web resources often results in web resources becoming more "technically accessible" but still remaining functionally unusable by many people with disabilities. The Best Practices avoid this problem by focusing on the functional requirements that improve access to all users, including people with disabilities. They are inspired by the needs of people with disabilities but are designed to give all users more options and control when accessing web resources and support the interoperability concepts of the web. In accessible design approach, less assumptions are made about what technologies will be used to access a web resource and emphasis is placed on separating content from styling and creating semantically meaningful markup. This provides all users with more options to use of a broader range of technologies and provide users with the ability to restyle information for their own needs, including people with disabilities. The use of web standards also benefits developers since they can

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

    Tuesday, October 21, 2008

    What is HTML? Why HTML is good idea?

    H-T-M-L are initials that stand for HyperText Markup Language (computer people love initials and acronyms -- you'll be talking acronyms ASAP). Let me break it down for you:
    · Hyper is the opposite of linear. It used to be that computer programs had to move in a linear fashion. This before this, this before this, and so on. HTML does not hold to that pattern and allows the person viewing the World Wide Web page to go anywhere, any time they want.
    · Text is what you will use. Real, honest to goodness English letters.
    · Mark up is what you will do. You will write in plain English and then mark up what you wrote. More to come on that in the next Primer.
    · Language because they needed something that started with "L" to finish HTML and Hypertext Markup Louie didn't flow correctly. Because it's a language, really -- but the language is plain English.

    HTML is good. It's faster and more efficient than ActiveX FLASH and is more accessible by all computers, Linux-friendly, AnyBrowser Compatible, etc. It's also possible to get at the workings of it, and so is a culture of learning and shared knowledge rather than a culture of sealed-units and protectionist markets.

    Tuesday, February 5, 2008

    HTML Attributes

    Attributes provide additional information to an HTML element.
    HTML Tag Attributes
    HTML tags can have attributes. Attributes provide additional information to an HTML element.
    Attributes always come in name/value pairs like this: name="value".

    Attributes are always specified in the start tag of an HTML element.

    Thursday, January 3, 2008

    What are HTML Tags?

    HTML tags are used to mark-up HTML elements
    HTML tags are surrounded by the two characters <>
    The surrounding characters are called angle brackets
    HTML tags normally come in pairs like and
    The first tag in a pair is the start tag, the second tag is the end tag
    The text between the start and end tags is the element content
    HTML tags are not case sensitive, means the same as

    HTM or HTML Extension?

    Whenever you save an HTML file, you can use either the .htm or the .html extension.

    What is an HTML File

    HTML stands for Hyper Text Markup Language
    An HTML file is a text file containing small markup tags
    The markup tags tell the Web browser how to display the page
    An HTML file must have an htm or html file extension
    An HTML file can be created using a simple text editor