back to HTML

HTML tricks, methods

Copy & paste tricks

Never copy text from web sites that you do not trust – and especially never paste things into a context where commands can be directly executed without confirmation. See more detail!

 

Let’s start using HTML5 right now.

Why? By W3C it won’t be a standard until 2014.

Really HTML5 is currently in a working draft state. So it can be change yet.

But! The basic HTML tags are working with almost all browsers. There are new features that not supported in all browser at this moment. The one of the basic advantages of the HTML is that the browser can ignore these features without some error message. So the page is working, just looks a little bit differently.

There are some of the features of HTML5 that we can implement right now without any problem. They will work with IE8 and with other browsers and won’t hurt our site at all.
For example:

- We can change doctype. Use the simple < !doctype html>. It’s easy to remember and browsers like it.
- Discover the new INPUT tags for your forms. Browsers that don’t support them display a standard input text field, but browsers that do support these tags add very new functionality to your forms.
- We can stop using closing tags for <p>, <br> and other tags that don’t require them.
- Discover the VIDEO and AUDIO tags.
- We do not need to define the type of scripts and styles, because the browsers assume that type is text/css and application/javascript. So all we need to write the following: <script> and <style>.

 

Cool HTML Tricks
Are you creating or maintaining a blog or a website? You should then know that websites use HTML markup language to represent the content. You would like to have a cool feature or layout? Check out this 10 cool html tricks!

 

 

CSS properties for HTML elements – tips and tricks

Today, web browsers tend to adhere more accurately to the Web Standards, especially when it comes about CSS properties. CSS3 properties are supported by all web browser engines and with every version released more new properties can be used to style the HTML elements. In this article I’ll try to emphasize some useful approaches which can be used to make your work easier.

 

www.39articles.net, CSS and HTML Better Writing Tips, Techniques, Tricks
CSS and HTML are key languages to begin with, when you decide to invest your time in web design and development. They are powerful languages and most of the time may seem simple to work with. However, every single one of us, beginners, or advanced developers, have committed basic or major mistakes working with both these languages. With this in mind, I believe it is extremely important and always welcome to learn some good tips and practices which I hope will help you improve your skills and experience.
How to create Animated 3D canvas object in HTML5
Today’s lesson very interesting, we’ll learn how to create 3D objects using HTML5. This is our first lesson on the practice HTML5. In this tutorial we will make a quadrangular star. Which will rotate around its axis. Read more.

 

Model viewer
3D Model Viewer using the HTML5 Canvas Element.

 

HTML5 Canvas Demos and Applications To Make You Say WOW
The Most astonishing facet of HTML5 is the HTML5 canvas. The canvas element is a drawable region defined in HTML code with height and width attributes. Enjoy the post and celebrate New year with full oomph.

 

K3D HTML5 Canvas Demos

The canvas K3D JavaScript programming libraries by Kevin Roast support wireframes and polygons with depth cue shading, animation with motion blur, and texture mapping with a lighting model in three dimensions using HTML 5 canvas graphics. Canvas K3D does not require WebGL so it runs on most 2011 browsers including Chrome, Firefox, Internet Explorer, Opera, Safari, and many smartphones.

HTML5 Website Showcase: 48 Potential Flash-Killing Demos

The HTML5′s canvas element is the deciding factor for HTML5 to replace certain Flash animation. It allows you to build dynamic, scriptable rendering of 2D shapes and bitmap images with Javascript, which by other mean is, controllable animation.

 

How Do I… Create an HTML page with multiple-colored links?

If you understand basic HTML, it is not difficult to write some simple CSS code that lets you declare as many classes as you like for as many different colors of links as you’d like to display on a single page. You can even style text links in other ways, such as modifying the appearance of an underline or adding a background color for a hover effect.

 

How do you … create two link styles on the same page?

With the use of CSS, you are easily able to create a specific style for your page links. One question that seems to appear is… How do you create 2 or more different link styles on the same page? Here is an example that shows three different situations. One for normal full page links, the second for specific links, and the third for a group of links.

 

Check the following useful tag reference table from w3schools.com about the HTML tags:

Tag Description
<!–…–> Defines a comment
<!DOCTYPE> Defines the document type
<a> Defines a hyperlink
<abbr> Defines an abbreviation
<acronym> Not supported in HTML5
<address> Defines an address element
<applet> Not supported in HTML5
<area> Defines an area inside an image map
<article> New Defines an article
<aside> New Defines content aside from the page content
<audio> New Defines sound content
<b> Defines bold text
<base> Defines a base URL for all the links in a page
<basefont> Not supported in HTML5
<bdo> Defines the direction of text display
<big> Not supported in HTML5
<blockquote> Defines a long quotation
<body> Defines the body element
<br> Inserts a single line break
<button> Defines a push button
<canvas> New Defines graphics
<caption> Defines a table caption
<center> Not supported in HTML5
<cite> Defines a citation
<code> Defines computer code text
<col> Defines attributes for table columns
<colgroup> Defines groups of table columns
<command> New Defines a command button
<datalist> New Defines a dropdown list
<dd> Defines a definition description
<del> Defines deleted text
<details> New Defines details of an element
<dfn> Defines a definition term
<dir> Not supported in HTML5
<div> Defines a section in a document
<dl> Defines a definition list
<dt> Defines a definition term
<em> Defines emphasized text
<embed> New Defines external interactive content or plugin
<fieldset> Defines a fieldset
<figcaption> New Defines the caption of a figure element
<figure> New Defines a group of media content, and their caption
<font> Not supported in HTML5
<footer> New Defines a footer for a section or page
<form> Defines a form
<frame> Not supported in HTML5
<frameset> Not supported in HTML5
<h1> to <h6> Defines header 1 to header 6
<head> Defines information about the document
<header> New Defines a header for a section or page
<hgroup> New Defines information about a section in a document
<hr> Defines a horizontal rule
<html> Defines an html document
<i> Defines italic text
<iframe> Defines an inline sub window (frame)
<img> Defines an image
<input> Defines an input field
<ins> Defines inserted text
<keygen> New Defines a generated key in a form
<kbd> Defines keyboard text
<label> Defines a label for a form control
<legend> Defines a title in a fieldset
<li> Defines a list item
<link> Defines a resource reference
<map> Defines an image map
<mark> New Defines marked text
<menu> Defines a menu list
<meta> Defines meta information
<meter> New Defines measurement within a predefined range
<nav> New Defines navigation links
<noframes> Not supported in HTML5
<noscript> Defines a noscript section
<object> Defines an embedded object
<ol> Defines an ordered list
<optgroup> Defines an option group
<option> Defines an option in a drop-down list
<output> New Defines some types of output
<p> Defines a paragraph
<param> Defines a parameter for an object
<pre> Defines preformatted text
<progress> New Defines progress of a task of any kind
<q> Defines a short quotation
<rp> New Used in ruby annotations to define what to show if a browser does not support the ruby element
<rt> New Defines explanation to ruby annotations
<ruby> New Defines ruby annotations
<s> Defines text that is no longer correct
<samp> Defines sample computer code
<script> Defines a script
<section> New Defines a section
<select> Defines a selectable list
<small> Defines small text
<source> New Defines media resources
<span> Defines a section in a document
<strike> Not supported in HTML5
<strong> Defines strong text
<style> Defines a style definition
<sub> Defines subscripted text
<summary> New Defines the header of a “detail” element
<sup> Defines superscripted text
<table> Defines a table
<tbody> Defines a table body
<td> Defines a table cell
<textarea> Defines a text area
<tfoot> Defines a table footer
<th> Defines a table header
<thead> Defines a table header
<time> New Defines a date/time
<title> Defines the document title
<tr> Defines a table row
<tt> Not supported in HTML5
<u> Not supported in HTML5
<ul> Defines an unordered list
<var> Defines a variable
<video> New Defines a video
<wbr> New Defines a possible line-break
<xmp> Not supported in HTML5

 

 

back to HTML