http://www.uitrick.com All about user interface and development Ashis Kumar Mohanty

What is HTML?HTML (HyperText Markup Language) is a universal language for World Wide Web (WWW). It is the standard text formatting language used for creating and displaying pages on the Web. This allows an individual using special code to create web pages to be viewed on the Internet. HTML documents are made up of two things: the content and the tags that formats it for proper display on pages.

What are the different versions of HTML?HTML has many versions since it inceptions during 1991. HTML versions are HTML 2.0, HTML 3.2, HTML 4.0, HTML 4.0.2 and HTML5 is the latest version.

What is DOCTYPE?DOCTYPE stands for Document Type Declarations. DOCTYPE is used to specify the web browsers that which types of documents (such as SGML or XML Documents) it will receive. is declared above the tag.

What are HTML tags?In HTML, a tag tells the browser what to do. The content is placed in between HTML tags in order to properly format it. When you write an HTML page, you enter tags for many reasons -- to change the appearance of text, to show a graphic, or to make a link to another page.Tags starts with a less than symbol (). A slash symbol is also used as a closing tag. HTML tags mostly comes in pair.

What is HTML Element?An HTML element is everything from starting to the ending of HTML tags.Example:This is an HTML ElementIn this example, from starting tag to ending tag everything is HTML element and This is an HTML Element is Element Content.

Write a simple HTML page?HTML Code:

This is my page title!

This is my message to the world!

What is HTML Attribute?HTML attribute adds additional information to the HTML Elements. In this below example size and color are html attributes.Example:

How do you insert a comment in html?Comments in HTML starts with .Example:

What is Hyperlinks?Hyperlinks are used to navigate to new document with the help of text, image or with group of words.

What is image map?Image map lets you link to many different web pages using a single image. You can define shapes in images that you want to make part of an image mapping.

How to apply a hyperlink to an image?Hyperlinks not only limited to text, also can be used on images. To convert an image into a link that will allow user to link to another page when clicked, you need to wrap the image within the tag combinations.

How to open a link in new tab or window?To open a link in new tab or window, we have to use the following html code:Welcome to UI Tricks!

What are the different types of Headings supported by HTML?HTML headings are important to highlight the contents of the documents. HTML supports 6 heading starting from to .

What are the limits of the text field size?The default size for a text field is around 13 characters, but if you include the size attribute, you can set the size value to be as low as 1. The maximum size value will be determined by the browser width. If the size attribute is set to 0, the size will be set to the default size of 13 characters.

What is list? How to create a list?There are two types of HTML list, they are ordered list and unordered list. HTML tag

&

1. are used to create lists.Example:
   1. Item One
   2. Item Two
   3. Item Three

   What are HTML forms?HTML forms takes data and sends the information to the servers.

   What is a marquee?A marquee allows you to put a scrolling text in a web page. To do this, place whatever text you want to appear scrolling within the and tags.

   What is the difference between form get and form post?With GET the form data is encoded into a URL by the browser. The form data is visible in the URL allowing it to be bookmarked and stored in web history. The form data is restricted to

   ASCII codes. Because URL lengths are limited there can be limitations on how much form data can be sent.With POST all the name value pairs are submitted in the message body of the HTTP request which has no restrictions on the length of the string. The name value pairs cannot be seen in the web browser bar.POST and GET correspond to different HTTP requests and they differ in how they are submitted. Since the data is encoded in differently, different decoding may be needed.Read more about GET and POST.

   What are applets?Applets are small programs that can be embedded within web pages to perform some specific functionality, such as computations, animations, and information processing. Applets are written using the Java language.

   What are meta tags and why it is used?Metadata is information about data. The tag provides metadata about the HTML document. Metadata will not be displayed on the page, but will be machine parsable.Meta elements are typically used to specify page description, keywords, author of the document, last modified, and other metadata. The tag always goes inside the head element. The metadata can be used by browsers (how to display content or reload page), search engines (keywords), or other web services.

   How to redirect to a webpage using HTML?Using HTML meta tag, we can redirect users to different webpage.

   What are the differences between cell spacing and cell padding?Cell spacing: Cell spacing controls the space between table cells by defining the pixel width between them

   Cell padding: Cell padding controls the amount of space between the contents of the cell (text, images, etc) from the cell wall.

   What is the difference between HTML and XHTML?HTMLHTML or HyperText Markup Language is the main markup language for creating web pages and other information that can be displayed in a web browser.Generalized Markup Language (SGML). HTML can take up less space, and so be speedier to download. HTML is more forgiving and easier to learn. For example, if you leave off tags in HTML, your code will still work reliably. Some older browsers respond more effectively to HTML than to XHTML.

   XHTMLXHTML (Extensible HyperText Markup Language) is a family of XML markup languages that mirror or extend versions of the widely used Hypertext Markup Language (HTML), the language in which web pages are written.Application of XML.

   XHTML is clearer on beginnings and ends of tags - so styles and events can be hooked in more easily. XHTML integrates well into other programming languages because it is XML.

   Some browsers respond more reliably to XHTML and so display the pages consistently, even across platforms.

   How to migrate from HTML to XHTML?As recommended by W3C following steps can be followed for migration of HTML to XHTML (XHTML 1.0 documents): Include xml:lang and lang attributes on elements assigning language. Use empty-element syntax on elements specified as empty in HTML. Include an extra space in empty-element tags: Include close tags for elements that can have content but are empty: Do not include XML declaration.

   Carefully following W3Cs guidelines on compatibility, a user agent (web browser) should be able to interpret documents with equal ease as HTML or XHTML.

   Can I nest tables within tables? Yes, a table can be embedded inside a cell in another table.

   Is it possible to make the HTML source not viewable?In short, there is no real method or script for making standard HTML source code not viewable. You may consider doing any of the below if they are concerned about your source code.Create the web page in Macromedia Flash or a similar program. The visitor would need to download the Macromedia Flash plug-in and would be unable to view the source code for the flash applet.

   There are various scripts that will disable the right click feature, preventing the user from saving images or viewing the source. However, this will not protect the source code of your page. For example, Internet Explorer users may still click "View" and "Source" to view the source code of the page, or a user could disable scripts and images can be saved by simply saving the web page to the hard drive.There are several programs that will help scramble your code, making it difficult (not impossible) to read. Again, this is not going to prevent someone from viewing your code.

   Can I have two or more Submit buttons in the same form? Yes. This is part of HTML 2.0 Forms support (some early browsers did not support it, but browser coverage is now excellent). The submit buttons must have a NAME attribute. The optional VALUE attribute can be used to specify different text for the different submit buttons. To determine which submit button was used, you need to use different values for the NAME and/or VALUE attributes. Browsers will send to the server the name=value pair of the submit button that was used.

   Can I have two or more actions in the same form?No. A form must have exactly one action. However, the server-side (e.g., CGI) program that processes your form submissions can perform any number of tasks (e.g., updating a database, sending email, logging a transaction) in response to a single form submission.

   How do you optimize a websites assets?There are a number of answers to this question - File concatenation, file compression, CDN Hosting, offloading assets, re-organizing and refining code, etc. Have a few ready.

   What are three ways to reduce page load time?Again there are many answers for this - Reduce image sizes, remove unnecessary widgets, HTTP compression, put CSS at the top and JavaScript at the bottom or in external files, reduce lookups, minimize redirects, caching, etc.

   What is Semantic HTML?Semantic HTML is a coding style where the tags embody what the text is meant to convey. In Semantic HTML, tags like

for bold, and for italic should not be used, reason being they just represent formatting, and provide no indication of meaning or structure. The semantically correct thing to do is use and . These tags will have the same bold and italic effects, while demonstrating meaning and structure (emphasis in this case).

Whats the difference between standards mode and quirks mode?Quirks Mode is a default compatibility mode and may be different from browser to browser, which may result to a lack of consistency in appearance from browser to browser.

What is CSS?CSS stands for Cascading Style sheets that enable you to build consistent, transportable, and well-defined style templates. These templates can be linked to several different web pages, making it easy to maintain and change the look and feel of all the web pages within a site.

What is a sprite?A image sprite is a collection of images put into one single image.Using css positioning you can show and hide different parts of the sprite depending on what you need.Sprites reduces the number of http requests thus reducing load time of page and bandwidth.