Friday, October 30, 2009

HTML Tags

Beginning HTML Tags!

A web browser reads an HTML document top to bottom, left to right. Each time the browser finds a tag, it is displayed accordingly (paragraphs look like paragraphs, tables look like tables, etc). Tags have 3 major parts: opening tag(s), content(s), and closing tag(s). Recall that a completed tag is termed an element. By adding tags to an HTML document, you signal to the browser "Hey look, I'm a paragraph tag, now treat me as such."
As you will learn, there are probably hundreds of HTML Tags. Tables, images, lists, forms, and everything else being displayed on an web page requires the use of a tag or two.
HTML Code:
<openingtag>Content</closingtag>
<p>A Paragraph Tag</p>
Tags should be lower-case letters if you plan on publishing your work. This is the standard for XHTML and Dynamic HTML. Here's quick look at some HTML tags.
HTML Tags:

<body>Body Tag (acts as a content shell)
<p>Paragraph Tag</p>
<h2>Heading Tag</h2>
<b>Bold Tag</b>
<i>Italic Tag</i>
</body>
Tags Without Closing Tags
There are a few tags that do not follow the mold above. In a way, they still have the 3 parts (opening/closing and content). These tags however do not require a formal </closingtag> but rather a modified version. The reason being that these tags do not really require any content. Rather some of them just need a source URL and this is enough information for the web browser to display the tag properly (image tags). Let's take a look at a line break tag.
HTML Code:
<br />
To tell the browser we want to place a line break (carriage return) onto the site, it is not necessary to type <br>linebreak</br>. If every line break tag needed all three components as other do, life would become redundant real quick. Instead the better solution was to combine the opening and closing tags into a single format. Other tags have also been modified such as the image tag and input tag.
HTML Code:
<img src="../mypic.jpg" /> -- Image Tag
<br /> -- Line Break Tag
<input type="text" size="12" /> -- Input Field
Display:


--Line Break--

As you can see from the above image tag, your browser is completely capable of interpreting this tag so long as we tell the browser where the image is located using the src attribute. More on attributes in the next lesson.
Beginning HTML Tags!

A web browser reads an HTML document top to bottom, left to right. Each time the browser finds a tag, it is displayed accordingly (paragraphs look like paragraphs, tables look like tables, etc). Tags have 3 major parts: opening tag(s), content(s), and closing tag(s). Recall that a completed tag is termed an element. By adding tags to an HTML document, you signal to the browser "Hey look, I'm a paragraph tag, now treat me as such."
As you will learn, there are probably hundreds of HTML Tags. Tables, images, lists, forms, and everything else being displayed on an web page requires the use of a tag or two.
HTML Code:
<openingtag>Content</closingtag>
<p>A Paragraph Tag</p>
Tags should be lower-case letters if you plan on publishing your work. This is the standard for XHTML and Dynamic HTML. Here's quick look at some HTML tags.
HTML Tags:
<body>Body Tag (acts as a content shell)
<p>Paragraph Tag</p>
<h2>Heading Tag</h2>
<b>Bold Tag</b>
<i>Italic Tag</i>
</body>
Tags Without Closing Tags
There are a few tags that do not follow the mold above. In a way, they still have the 3 parts (opening/closing and content). These tags however do not require a formal </closingtag> but rather a modified version. The reason being that these tags do not really require any content. Rather some of them just need a source URL and this is enough information for the web browser to display the tag properly (image tags). Let's take a look at a line break tag.
HTML Code:
<br />
To tell the browser we want to place a line break (carriage return) onto the site, it is not necessary to type <br>linebreak</br>. If every line break tag needed all three components as other do, life would become redundant real quick. Instead the better solution was to combine the opening and closing tags into a single format. Other tags have also been modified such as the image tag and input tag.
HTML Code:
<img src="../mypic.jpg" /> -- Image Tag
<br /> -- Line Break Tag
<input type="text" size="12" /> -- Input Field
Display:

--Line Break--
As you can see from the above image tag, your browser is completely capable of interpreting this tag so long as we tell the browser where the image is located using the src attribute. More on attributes in the next lesson.

Sunday, October 25, 2009

Beginner's Web Site Creating Guide

Beginner's Web Site Creating Guide

Welcome to Tizag.com's introduction to HTML and web design. This short tutorial is aimed to give newbies a little experience in writing HTML code, saving their files correctly, and viewing the completed works in a web browser. Regrettably this tutorial cannot teach you the basics of using a computer, so please be sure that you meet the following requirements:
  • Know what notepad is and how to use it
  • Are able to open up a file using Internet Explorer (or the browser of your choice)
  • Know how to copy and paste text from a webpage (important!).
If you are lacking the ability of the aforementioned items please contact a local geek and ask nicely for a quick lesson.

Tutorial Overview

In this tutorial you will be transcribing code into notepad and then viewing it with a web browser. The code is called HTML (Hyper Text Markup Language) and notepad is a commonly used text editor on Window PCs. HTML may seem confusing at first, but we will help you understand how it works in this step-by-step tutorial of how to make your first web page.

Your First Web Page

To start off with copy the following HTML code into notepad. Be sure to copy the code exactly, otherwise your web page may not function correctly.

HTML Code:

<html> <head> <title>My Own Webpage!</title> </head> <body> <h2>Welcome to my webpage</h2> </body> </html>
The above code is all that is required to create a basic web page! Now save your file in notepad by selecting Menu and then Save. Click on the Save as Type drop down box and select the option All Files.
When asked to name your file, type "index.html", without the quotes. Double check that you did everything correctly and then press save. Remember where it was saved to because you will need to open this file, soon!

Viewing Your Web Page - Web Browsers

To view your web page, you are going to have to use a web browser (of course). Web browsers are programs that interpret HTML, like what you have just copied into notepad, and transform that code into a visual representation, or a web page. Common web browsers include:

Viewing your page

To view your web page, you must open the "index.html" file inside of a web browser. Open up another browser window and then follow these instruction.
  1. In the new browser window, select File then Open
  2. Then click Browse to enter Windows Explorer
  3. Do you remember where you file is? Good, then navigate to its location
  4. When you find your file, index.html, double-click the file to open it inside your web browser
Success! You have just viewed your very first webpage.
If this did not work for you, please go through the steps again and follow the directions closely. If you still can't get this to work, please Contact Us and we will get you up and running.

First Web Page - Review

Very good! Now let's be sure that you remember what you learned in this lesson.
  1. how to copy some weird looking text (HTML) into notepad
  2. how to correctly save this weird text in notepad
  3. how to open your saved file and view the your webpage

Your Second Web Page

Now that you have created your first webpage, let us examine the different segments of your "index.html" file. You have probably noticed a pattern of various words that are surrounded with <>. These items are called HTML tags.
An example of an html tag is . The Body tag tells the browser where the page's content begins. Body is also an example of one of the required HTML tags that every web page must have.

Basic HTML Tag Information

Let's learn more about these tags. A basic web page is composed of 2 main tags. If you create a web page without these tags you will be in trouble!

HTML Code:

<html> <head> <title>My Own Webpage!</title> </head> <body> Your site's content goes here </body> </html>
The first HTML tag, which conviently is labled tells the browser that your HTML code is starting. The second HTML tag, tells the browser that the visible part of the webpage ( your content ) is going to start.

Closing Tags -

You might be wondering what is the deal with the two tags at the end, and . These tags are telling the browser that certain tags are ending. The lets the browser know that your content is ending, while the tells the browser that your HTML file is finished.
The "/" that is placed before the tag's name informs the browser that you would like to stop using the specified tag. is used to begin a tag and is used to end a tag.

HTML Tag Order - Important!

The order that opening tags appear and ending tags appear follow an important rule. If an HTML tag is opened within another, for example the body tag is opened inside the html tag, then that tag(body) must close before the outter(html) tag is closed.
We ended the body tag first because it was opened most recently. This rule of "closing the most recent tag before closing older tags" applies to all HTML tags.

Continue Along

These ideas might take a while to sink in, so how about you create your second web page? Copy this code into notepad, like you did before, following the same directions.

HTML Code:

<html>
<head>
<title>My Own Webpage!</title>
</head>
<body>
<h2>Welcome to my webpage</h2>
<p>Coming soon will be my completed webpage that will wow and impress you!</p>
</body>
</html>
After you are sure that your HTML code inside notepad is exactly the same as our provided HTML code, go ahead and save your file. You should be saving this file as "index.html". You may be prompted that you will be saving over a file, that is OK, you do not need your 1st web page anymore. When you are done, please continue.

Thursday, October 22, 2009

Types Of Web Site:

Organized by function, a website may be

It could be the work of an individual, a business or other organization, and is typically dedicated to some particular topic or purpose. Any website can contain a hyperlink to any other website, so the distinction between individual sites, as perceived by the user, may sometimes be blurred.

Websites are written in, or dynamically converted to, HTML (Hyper Text Markup Language) and are accessed using a software interface classified as a user agent. Web pages can be viewed or otherwise accessed from a range of computer-based and Internet-enabled devices of various sizes, including desktop computers, laptops, PDAs and cell phones.

A website is hosted on a computer system known as a web server, also called an HTTP server, and these terms can also refer to the software that runs on these systems and that retrieves and delivers the web pages in response to requests from the website users. Apache is the most commonly used web server software (according to Netcraft statistics) and Microsoft's Internet Information Server (IIS) is also commonly used.

Static website

A static website is one that has web pages stored on the server in the format that is sent to a client web browser. It is primarily coded in Hypertext Markup Language (HTML).

Simple forms or marketing examples of websites, such as classic website, a five-page website or a brochure website are often static websites, because they present pre-defined, static information to the user. This may include information about a company and its products and services via text, photos, animations, audio/video and interactive menus and navigation.

This type of website usually displays the same information to all visitors. Similar to handing out a printed brochure to customers or clients, a static website will generally provide consistent, standard information for an extended period of time. Although the website owner may make updates periodically, it is a manual process to edit the text, photos and other content and may require basic website design skills and software.

In summary, visitors are not able to control what information they receive via a static website, and must instead settle for whatever content the website owner has decided to offer at that time.

They are edited using four broad categories of software:

  • Text editors, such as Notepad or TextEdit, where content and HTML markup are manipulated directly within the editor program
  • WYSIWYG offline editors, such as Microsoft FrontPage and Adobe Dreamweaver (previously Macromedia Dreamweaver), with which the site is edited using a GUI interface and the final HTML markup is generated automatically by the editor software
  • WYSIWYG online editors which create media rich online presentation like web pages, widgets, intro, blogs, and other documents.
  • Template-based editors, such as Rapidweaver and iWeb, which allow users to quickly create and upload web pages to a web server without detailed HTML knowledge, as they pick a suitable template from a palette and add pictures and text to it in a desktop publishing fashion without direct manipulation of HTML code.

Dynamic Website

A dynamic website is one that changes or customizes itself frequently and automatically, based on certain criteria.

Dynamic websites can have two types of dynamic activity: Code and Content. Dynamic code is invisible or behind the scenes and dynamic content is visible or fully displayed.

Dynamic Code

The first type is a website with dynamic code hidden inside. The lines of code are constructed dynamically on the fly using active programming language instead of plain, static HTML.

A website with dynamic code refers to its construction or how it is built, and more specifically refers to the code used to create a single web page. A dynamic web page is generated on the fly by piecing together certain blocks of code, procedures or routines. A dynamically-generated web page would call various bits of information from a database and put them together in a pre-defined format to present the reader with a coherent page. It interacts with users in a variety of ways including by reading cookies recognizing users' previous history, session variables, server side variables etc., or by using direct interaction (form elements, mouseovers, etc.). A site can display the current state of a dialogue between users, monitor a changing situation, or provide information in some way personalized to the requirements of the individual user.

Dynamic Content

The second type is a website with dynamic content displayed in plain view. Variable content is displayed dynamically on the fly based on certain criteria, usually by retrieving content stored in a database.

A website with dynamic content refers to how its messages, text, images and other information are displayed on the web page, and more specifically how its content changes at any given moment. The web page content varies based on certain criteria, either pre-defined rules or variable user input. For example, a website with a database of news articles can use a pre-defined rule which tells it to display all news articles for today's date. This type of dynamic website will automatically show the most current news articles on any given date. Another example of dynamic content is when a retail website with a database of media products allows a user to input a search request for the keyword Beatles. In response, the content of the web page will spontaneously change the way it looked before, and will then display a list of Beatles products like CD's, DVD's and books.

Purpose of Dynamic Websites

The main purpose of a dynamic website is automation. A dynamic website can operate more effectively, be built more efficiently and is easier to maintain, update and expand. It is much simpler to build a template and a database than to build hundreds or thousands of individual, static HTML web pages.

Software systems

There are a wide range of software systems, such as Java Server Pages (JSP), the PHP and Perl programming languages, Active Server Pages (ASP), YUMA and Cold Fusion (CFM) that are available to generate dynamic web systems and dynamic sites. Sites may also include content that is retrieved from one or more databases or by using XML-based technologies such as RSS.

Static content may also be dynamically generated either periodically, or if certain conditions for regeneration occur (cached) in order to avoid the performance loss of initiating the dynamic engine on a per-user or per-connection basis.

Plug ins are available to expand the features and abilities of web browsers, which use them to show active content, such as Microsoft Silverlight, Adobe Flash, Adobe Shockwave or applets written in Java. Dynamic HTML also provides for user interactivity and realtime element updating within web pages (i.e., pages don't have to be loaded or reloaded to effect any changes), mainly using the Document Object Model (DOM) and JavaScript, support which is built-in to most modern web browsers.

Turning a website into an income source is a common practice for web developers and website owners. There are several methods for creating a website business which fall into two broad categories, as defined below.

Content-based sites

Some websites derive revenue by selling advertising space on the site (see Contextual advertising).

Product- or service-based sites

Some websites derive revenue by offering products or services for sale. In the case of e-commerce websites, the products or services may be purchased at the website itself, by entering credit card or other payment information into a payment form on the site. While most business websites serve as a shop window for existing brick and mortar businesses, it is increasingly the case that some websites are businesses in their own right; that is, the products they offer are only available for purchase on the web.

Websites occasionally derive income from a combination of these two practices. For example, a website such as an online auctions website may charge the users of its auction service to list an auction, but also display third-party advertisements on the site, from which it derives further income.

Spelling

The forms website and web site are the most commonly used forms, the former especially in British English. The Associated Press Style book, Reuters, Microsoft, academia, book publishing, The Chicago Manual of Style, and dictionaries such as Merriam-Webster use the two-word, initially capitalized spelling Web site. This is because "Web" is not a general term but a short form of World Wide Web. As with many newly created terms, it may take some time before a common spelling is finalized. This controversy also applies to derivative terms such as web page, web master, and web cam.

The Canadian Oxford Dictionary and the Canadian Press Style book list "website" and "web page" as the preferred spellings. The Oxford English Dictionary began using "website" as its standardized form in 2004.[3]

Bill Walsh, the copy chief of The Washington Post's national desk, and one of American English's foremost grammarians, argues for the two-word spelling with capital W in his books Lapsing into a Comma and The Elephants of Style, and on his site, the Slot.[4]

Types of websites

There are many varieties of websites, each specializing in a particular type of content or use, and they may be arbitrarily classified in any number of ways. A few such classifications might include:[original research?]

  • Affiliate: enabled portal that renders not only its custom CMS but also syndicated content from other content providers for an agreed fee. There are usually three relationship tiers. Affiliate Agencies (e.g., Commission Junction), Advertisers (e.g., eBay) and consumer (e.g., Yahoo!).
  • Archive site: used to preserve valuable electronic content threatened with extinction. Two examples are: Internet Archive, which since 1996 has preserved billions of old (and new) web pages; and Google Groups, which in early 2005 was archiving over 845,000,000 messages posted to Usenet news/discussion groups.
  • Blog (web log): sites generally used to post online diaries which may include discussion forums (e.g., blogger, Xanga).
  • Brand building site: a site with the purpose of creating an experience of a brand online. These sites usually do not sell anything, but focus on building the brand. Brand building sites are most common for low-value, high-volume fast moving consumer goods (FMCG).
  • Content site: sites whose business is the creation and distribution of original content (e.g., Slate, About.com).
  • Corporate website: used to provide background information about a business, organization, or service.
  • Electronic commerce (e-commerce) site: a site offering goods and services for online sale and enabling online transactions for such sales.
  • Community site: a site where persons with similar interests communicate with each other, usually by chat or message boards, such as MySpace or Facebook.
  • City Site: A site that shows information about a certain city or town and events that takes place in that town. Usually created by the city council or other "movers and shakers".
  • the same as those of geographic entities, such as cities and countries. For example, Richmond.com is the geodomain for Richmond, Virginia.
  • Gripe site: a site devoted to the critique of a person, place, corporation, government, or institution.
  • Forum: a site where people discuss various topics.
  • Humor site: satirizes, parodies or otherwise exists solely to amuse.
  • Information site: contains content that is intended to inform visitors, but not necessarily for commercial purposes, such as: RateMyProfessors.com, Free Internet Lexicon and Encyclopedia. Most government, educational and non-profit institutions have an informational site.
  • Java applet site: contains software to run over the Web as a Web application.
  • Mirror site: A complete reproduction of a website.
  • News site: similar to an information site, but dedicated to dispensing news and commentary.
  • Personal homepage: run by an individual or a small group (such as a family) that contains information or any content that the individual wishes to include. These are usually uploaded using a web hosting service such as Geocities.
  • Phish site: a website created to fraudulently acquire sensitive information, such as passwords and credit card details, by masquerading as a trustworthy person or business (such as Social Security Administration, PayPal) in an electronic communication (see Phishing).
  • Political site: A site on which people may voice political views.
  • Porn site: A site that shows sexually explicit content for enjoyment and relaxation, most likely in the form of an Internet gallery, dating site, blog, social networking, or video sharing.
  • Rating site: A site on which people can praise or disparage what is featured.
  • Review site: A site on which people can post reviews for products or services.
  • School site: a site on which teachers, students, or administrators can post information about current events at or involving their school. U.S. elementary-high school websites generally use k12 in the URL, such as kearney.k12.mo.us.
  • Social networking site: a site where users could communicate with one another and share media, such as pictures, videos, music, blogs, etc. with other users. These may include games and web applications.
  • Social bookmarking site: a site where users share other content from the Internet and rate and comment on the content. StumbleUpon and Digg are examples.
  • Video sharing: A site that enables user to upload videos, such as YouTube and Google Video.
  • Search engine site: a site that provides general information and is intended as a gateway or lookup for other sites. A pure example is Google, and the most widely known extended type is Yahoo!.
  • Shock site: includes images or other material that is intended to be offensive to most viewers (e.g. rotten.com).
  • Warez: a site designed to host and let users download copyrighted materials illegally.
  • Web portal: a site that provides a starting point or a gateway to other resources on the Internet or an intranet.
  • Wiki site: a site which users collaboratively edit (such as Wikipedia and Wikihow).

Some websites may be included in one or more of these categories. For example, a business website may promote the business's products, but may also host informative documents, such as white papers. There are also numerous sub-categories to the ones listed above. For example, a porn site is a specific type of e-commerce site or business site (that is, it is trying to sell memberships for access to its site). A fan site may be a dedication from the owner to a particular celebrity.

Websites are constrained by architectural limits (e.g., the computing power dedicated to the website). Very large websites, such as Yahoo!, Microsoft, and Google employ many servers and load balancing equipment such as Cisco Content Services Switches to distribute visitor loads over multiple computers at multiple locations.

In February 2009, Netcraft, an Internet monitoring company that has tracked Web growth since 1995, reported that there were 215,675,903 websites with domain names and content on them in 2009, compared to just 18,000 websites in August 1995.

what is a web site

A website (also spelled web site) is a collection of related web pages, images, videos or other digital assets that are addressed with a common domain name or IP address in an Internet Protocol-based network. A web site is hosted on at least one web server, accessible via a network such as the Internet or a private local area network.

A web page is a document, typically written in plain text interspersed with formatting instructions of Hypertext Markup Language (HTML, XHTML). A web page may incorporate elements from other websites with suitable markup anchors.

Web pages are accessed and transported with the Hypertext Transfer Protocol (HTTP), which may optionally employ encryption (HTTP Secure, HTTPS) to provide security and privacy for the user of the web page content. The user's application, often a web browser, renders the page content according to its HTML markup instructions onto a display terminal.

All publicly accessible websites collectively constitute the World Wide Web.

The pages of a website can usually be accessed from a simple Uniform Resource Locator (URL) called the homepage. The URLs of the pages organize them into a hierarchy, although hyperlinking between them conveys the reader's perceived site structure and guides the reader's navigation of the site.

Some websites require a subscription to access some or all of their content. Examples of subscription sites include many business sites, parts of many news sites, academic journal sites, gaming sites, message boards, web-based e-mail, services, social networking websites, and sites providing real-time stock market data.

what is a web site

A website (also spelled web site) is a collection of related web pages, images, videos or other digital assets that are addressed with a common domain name or IP address in an Internet Protocol-based network. A web site is hosted on at least one web server, accessible via a network such as the Internet or a private local area network.

A web page is a document, typically written in plain text interspersed with formatting instructions of Hypertext Markup Language (HTML, XHTML). A web page may incorporate elements from other websites with suitable markup anchors.

Web pages are accessed and transported with the Hypertext Transfer Protocol (HTTP), which may optionally employ encryption (HTTP Secure, HTTPS) to provide security and privacy for the user of the web page content. The user's application, often a web browser, renders the page content according to its HTML markup instructions onto a display terminal.

All publicly accessible websites collectively constitute the World Wide Web.

The pages of a website can usually be accessed from a simple Uniform Resource Locator (URL) called the homepage. The URLs of the pages organize them into a hierarchy, although hyperlinking between them conveys the reader's perceived site structure and guides the reader's navigation of the site.

Some websites require a subscription to access some or all of their content. Examples of subscription sites include many business sites, parts of many news sites, academic journal sites, gaming sites, message boards, web-based e-mail, services, social networking websites, and sites providing real-time stock market data.