Learn and practice HTML in real-time on web

Monday, August 1, 2011

 

HTML is one of the first steps towards learning some basic computing. Back in old school days it was the first thing which I learnt and I guess many of you too!. But at that time all we were taught was just the introduction and some other basic things. Today HTML is quite popular and is the foundation of Internet today.

 

Practice makes you perfect, and if you want to learn HTML or any other Computer Programming language then you need a good tool to practice. I found an amazing tool yesterday while I was going through some random sites, it’s a real-time HTML editor.

 

Go to http://htmledit.squarefree.com/ and you’ll see that the screen is split to 2 parts, editor and preview screen. The amazing thing about this web app is that you can instantly view the HTML you code in real-time on the preview screen below the editor. While you type the HTML code in the editor, the preview of the code is shown instantly on the screen below.

 

Though you cannot use it to create new webpages but it’s a great tool to preview how  your HTML tags and code works instantly. I have checked it on Mozilla Firefox 5 and I hope it works on almost all other browsers.

 

So go ahead and learn HTML the easy way.

 

If you loved my post, then feel free to subscribe to my feed Click here!

HTML Color Codes

Sunday, May 25, 2008

Color is very important to design a blog. But to give a color to background or text or table it's not as simple as looks like, we have to know tho color code. With HTML color codes you can set the color of web site background, color of text, cells in tables and much more. With this dynamic HTML color codes chart you can get codes for basic colors.
Click on any color to get it's HTML color code:

iBlock, template for iPhone

Wednesday, March 26, 2008

Author: iBlock Template

» Download the template «

Flash Music Player and Music Playlists

Thursday, September 27, 2007

In our earlier article, Add Music to Blogspot Blog, we talked about how music can be played in the background of the blog or through a hyperlink or music console player. Readers had requested for an option to play more than one song via a playlist. We have been looking at cross-browser music players that allow us to display a music playlist of selected musical pieces for Blog readers to listen

Technorati Tags in Blogger Posts

Tuesday, September 18, 2007

Technorati, which indexes some 94 million weblogs, allows blog owners to assign tags to their posts. These tags are essentially words which describe the category that the posts, photos and videos fall under. Visitors can then search these tags to find the relevant blog posts. How can the Technorati tags be inserted into Blogger posts so that they can be indexed by Technorati? Is there a need to

Feedburner - FeedCount Chicklet Text

Monday, August 27, 2007

Feedburner is a very popular feed aggregator and provides a host of services which you can tap on to publicize and promote your Blog. One widely used service is their FeedCount Chicklet which displays your Blog Feed's circulation statistics. The chicklet can be static (displaying the number of “readers”) or animated (showing the number of “readers” via feed). Although you can change the

Customize Video Upload in Blogger

Saturday, August 25, 2007

We wrote an article some time back suggesting how you can Add Video to Blogs. We highlighted two popular video hosts – Google Video and YouTube. Just yesterday (Aug 24, 2007) Blogger released its new Video Upload feature from its Blogger in Draft. There is now an icon in your Post Editor allowing you to upload a video into your post, in the same manner as you would for photos. At the moment,

Tables – HTML Basics and Tutorial

Monday, August 13, 2007

In this article, we shall learn how to create tables in our Blog posts or as a part of our web design layout. This guide covers the usual HTML attributes and styles that can be applied to tables. Tables add a different dimension to displaying your contents and whether you have a football match fixture, menu, and song, price or grocery lists, putting them in a table format is certainly neater.Most

Social Bookmarking Links in Blogger

Thursday, August 2, 2007

In this article, we shall provide the code for you to place into the template to have a line of icon/ button links or text links to popular social bookmarking sites like Digg, Technorati, del.icio.us, Reddit, Blinklist, Furl, Yahoo, Simpy, etc. Readers can click them to add your site or your post to their bookmarks and in sharing these links with others, your Blog becomes more visible. This

Numbered List and Bulleted List

Thursday, July 12, 2007

The Blogger's post editor gives you one number style for an Ordered (Numbered) list and one bullet style for an Unordered (Bulleted) list. Here, we shall let you know how you can change these styles to add variation to your posts. We shall also discuss how links can be incorporated into such lists and how a marquee tag can be added to make the list scroll.Ordered (Numbered) ListWe like to use

Faster Web Page Load Time

Friday, July 6, 2007

We share with you what we have been doing to improve the page loading time of our Blog. If a web page takes too long a time to load, the readers will simply hop on to another site. Making it load quickly also saves the dial-up internet users' money and time. While it is true that the download time depends on the readers' internet connection speed, we can as Blog owners tweak our layout and

Post Footer – Customize Template (I)

Wednesday, June 13, 2007

In this tutorial, we discuss the various ways you can customize the Post Footer and change the Blogger template. The steps will cover how to change the “Posted by author”, “Comments”, “Labels” links in the Post Footer, replacing them with other names or pictures.This is how a typical Post Footer looks like. It includes the author's name, time of the post, number of comments, number of backlinks

Post Footer – Customize Template (I)

In this tutorial, we discuss the various ways you can customize the Post Footer and change the Blogger template. The steps will cover how to change the “Posted by author”, “Comments”, “Labels” links in the Post Footer, replacing them with other names or pictures.This is how a typical Post Footer looks like. It includes the author's name, time of the post, number of comments, number of backlinks

Post Footer – Customize Template (II)

We continue from where we left off in Post Footer – Customize Template (I). In the first part, we went through how you can change and customize the appearance of the “Posted by author” link and replace it with another name or picture. You could also remove the timestamp if you want. In this part, we continue with customization of the “Comments”, “Labels” and other icons shown in the Blogger

Scrolling Text - Marquee HTML Code

Tuesday, June 5, 2007

This HTML term Marquee is used to create a scrolling or sliding text. The text can move across the screen horizontally or vertically at a certain speed determined by you. Note, however, that while it looks nice to have scrolling announcements, advertisements, quotations, or links, having too much animation in your Blog may distract and irritate your readers. We had earlier created a line of

Links, Labels open in New Window

Friday, May 18, 2007

In our previous articles, we discussed the code for making the text and image links in your Posts open in new windows or tabs when clicked. However, to have the links in a Link List and Labels that are normally in the sidebar widgets open in new browser windows or tabs, you would need to change the HTML code in your template. Here, we shall talk about the hack that you can put into your

Blog Widgets, Gadgets and Add-ons (I)

Tuesday, May 15, 2007

In this series, we shall list the free, popular, and interesting web widgets and gadgets that you can consider adding to your Blog. Widgets are elements that extract the services or content from other sites. Some of these widgets are useful, providing your readers with news, information, and reference tips. Others may be just fun and games which make your Blog a little more interesting and

Blog Widgets, Gadgets and Add-ons (II)

This is a continued list of Blog Widgets, Gadgets and Add-ons which you can include into your Blog. If you have not read the first part, please check out Blog Widgets, Gadgets and Add-ons (I). You may also consider having a chatbox, shoutbox or message board on your Blog. We ended with AuctionAds which can earn you some extra revenue. We begin this second part with a fun widget that you can

Animated Banner with Rotating Headlines

Sunday, April 29, 2007

This article is about creating a nice looking banner that incorporates rotating headlines of your 5 recent Blog articles. If you have submitted your Blog to different Blog Directories, you would come across some which ask for your banner. It is nothing more than a picture to represent your Blog.Nonetheless, a nicely designed banner can attract more visitors and add a touch of professionalism to

Animated Banner with Rotating Headlines

This article is about creating a nice looking banner that incorporates rotating headlines of your 5 recent Blog articles. If you have submitted your Blog to different Blog Directories, you would come across some which ask for your banner. It is nothing more than a picture to represent your Blog.Nonetheless, a nicely designed banner can attract more visitors and add a touch of professionalism to