Category: X / HTML

  • Problems with Add-On domains on CPanel

    PS: This is a post which is a direct outcome of a discussion on IndiBlogger forum.

    The question was whether Google and other Search Engines treat Add-On domains differently? The direct answer is no, but it does affect your SEO efforts. The culprit here being CPanel, the trusted and proven Web Hosting Manager used by most of the Hosting Service Providers.

    I could not find a single post telling me everything I need, and I had to read through many forum threads to understand the issue. Hence I thought of putting it all together in a post, hoping to help fellow readers.

    (more…)

  • How can you make copying from your blog difficult?

    Well, this was one of the questions posted on the IndiBlogger forum, and something that I paid keen interested to. IndiBlogger forum was slowly moving away from the Sourav Pandey plagiarism case when this thread appeared.

    It is a well-known fact that many a times, you find your content has been ripped off by plagiarist and claimed to be theirs. I faced that with my Tata Nano April Fool scoop a couple of years ago. I hunted down the sites using Google Search and Google Image Search, sent out emails / comments to Admins of the site to get my due credit. Some obliged, some did not.

    Among the ones who did not were what we now call them Feed Aggregators. These websites chew your feed and put them on their site. The loss is the Ad revenues they get from showing off adverts and Google punishment on us for copying content.
    (more…)

  • Advantages of using Analytics for blogs and websites

    Advantage No.1: Statistics: It tells you how much your blog is visited and from where. This is in particular useful to guage two things. One the amount of revenue your site can get, two to see viability of the website. By viability, I mean, to see how much are you getting in return for your investment (here time) which helps you to prioritize your activites on the website.

    No.2: Targetting: Analytics helps you to esitmate your efforts in one goal your have set for yourself. It may be your reach in a particular region (geographicaly or by subject) or your returns from a region. It tells you what you have achieved for that period.

    No.3: Search & Keywords preformance: It helps us to learn how our keywords are performing on search and how search is helping you reach to your end user. You can find out the keywords that are relevant and start using them more often knowing that you are getting good hits via those keywords. Also, it helps us analyze which keywords are not performing optimal to your expectations and work towards it.

    No.4: Platform, Connectivity: For most bloggers, it wont make a big impact but other wise for a website it does. For example, if you want to check what % of users use Flash on their browsers. This helps you decide whether you want to create a flash based intro or a flash based application for creating a dynamic application. The same stands true for Operating systems, but it is not that important these days as most advance browsers behave almost same in terms of delivering your content. However, your Operating systes are important to know when you want to check Mobile OS. Which helps you to categorize and calculate your visitors from Mobile Browsers. Opera on PC/Mac can be confused with Opera on mobile and hence this parameter helps.

    Also, it helps in deciding your target audience. For example, lets take the latest technology on web is HTML5 with Javascript. If you wanna start redesigning your website on HTML5, you might as well check what your users are using. If 90% of your users are using th latest browsers, it makes sense to go ahead. If lesss than 10% of your visitors are usign latest browsers, it wont help as others wont be able to use the website functionality you intend to develop.

    Knowing Connectivity is important as well, to gauge what size of webpage your users will be able to download fast. If you have more thna 50% of users on dailup with 28KBPS speed, it wont help having a website that is heavily loaded with graphics.

    All in all, analytics is used to target your website to a sect of users with importance to multiple aspects and you working towards achieving your targets.

     

  • Happy New Year! A New Theme too

    Wishing all my visitors and regulars a very Happy New Year. From this new year, for me things remain largely (i.e. except date) unchanged and all I am looking forward to is having happier times ahead 🙂

    I had planned for the theme change since end of last year, and here I am. I had penned good bye to my last theme Pixel and gone for Comet, a very light theme with 7 color color options and as with every other wordpress theme, highly customizable. There are some changes I wish to do now to optimize the pages to meet Google Page Speed and Y!Slow.

    In the mean while, I would like to have your humble review of the color and theme in general. I am not keen on using Heavy graphics this time around. I like this color and hence pasted it in the background. Once again fellas, wishing you a Happy New Year

    PS: Not that i will change this color, but yes suggestions are welcome 😛

  • Apple Safari 4.0: Something Very Different

    Believe it or not, I have started using Safari leaving Firefox behind. Yes, the new Safari 4.0 (beta) has caught my attention and I am glued to it. A claimed whopping 150 features are waiting for you to explore them.

    The most striking feature is the Top Sites which is ala Speed Dail of Opera and Most Visited on dashboard of Chrome.

    Then you have a full History search and Cover Flow which are imported from Mac. You get a similar interface. Works effortlessly. The feature of auto completion of the web address is intelligent. Tabs are put on the top, and added animation like a slide bar has been thrown in when you want to bring two far ended tabs closer.

    I love the way they have put it as against Opera and Chrome. Of-course it consumes more ram, but then if I have some extra ram to spare, then why not.

    Now, a bit from the Web Designer and Developer View.

  • The W3C XHTML | How to validate your XHTML?

    The W3C XHTML | How to validate your XHTML?

    The World Wide Web Consortium (W3C) develops interoperable technologies (specifications, guidelines, software, and tools) to lead the Web to its full potential. W3C is a forum for information, commerce, communication, and collective understanding. On this page, you’ll find how to incorporate W3C Website guidelines in your website. I feel that we all should design our webpages in accordance with the Guidelines laid out by the governing body.

    The following are some of the common errors which form a part of W3C XHTML Validations (see W3C Website Guidelines on W3C website). The following is an XHTML Validator Tutorial of sorts. You all can take a look at the same, and try to adapt it to your websites as well. You can validate your website at the W3C HTML Validator

    Complaince to W3C Standards is legaly complusary in some countries including in the UK, the USA or else some one might sue you! You can use various Validators to validate your HTML files, however I would advice that you follow the original W3C Validtor.

    DOCTYPE

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    The above declaration is a compulsory factor. Though, the declaration may vary according to your settings, it is always advised to follow the latest Declarations. The DOCTYPE declaration defines the code language, standard and enforcement level used for your HTML.

    It is also an answer to question I asked anyone who claims to know HTML. In 99% of interviews I conducted, 99% of candidates have failed to answer the question – What is the first tag in HTML?

    Obviously, the answer I get is HTML! People in India are thought nothing about it (or at least the ones I met). Some of the people are surprised to know that there is something known as DOCTYPE. Even in the book published by some prominent state education boards in India do not have any mention of DOCTYPE.

    HTML Tags:

    HTML Tag itself (<html>)

    Obviously, the above declaration is a compulsory factor, and it is a no-brainer altogether. However, there are various types of HTML that needs to be defined.

    Start tags for text and sub-tags

    Text, or sub-tags (like input, select, img, a href etc.) should be in <div>*[text to be put inside paragraph tag <p>]<p> or <ul> <ol> <h1> etc.

    End tags

    End tags for all start tags are compulsory. it is also important that you have to end the tag at proper location. use <br />, <img src=”somefile” alt=”something” style=”border-width:0px; />”

    <form name="frmsize" action="something" method="get">

    A form tag has to contain the action=”someaction.aspx”

    <div id="name" name="name" class="name_id">

    Avoid using name=” name “ attribute

    Underline Tag (<u>)

    You have to remove it and avoid using it.

    Use: style="text-decoration:underline;"

    Option Tag

    This element is used under the Select Tag. Well, here the only catch is <option></option> simply does not work for validation. If you want to have a blank one, then please put &nbsp;

    Flash Objects

    Inserting Flash Objects can be tricky and would add to your woes when checking the document for your HTML document. It is better to use the following coding type which helps in attaining our goal of a completely Validated XHTML.

    <object type="application/x-shockwave-flash data="c.swf?path=movie.swf" width="400" height="300">
     <param name="movie" value="c.swf?path=movie.swf" />
     <img src="noflash.gif" width="200" height="100" alt="" />
     </object>

    The solution for this comes from A List Apart article on the Embedding Flash While Supporting Standards

    Close of Head tag, scripts and styles

    The close head tag has to be proper and the style tag to be included in head tag along with script tags.

    Elements

    Character Type

    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">

    The above declaration helps the browser to understand the character set your webpage is using. It comes below the <html>. The character set can be changed according to the characters you are using in your webpage, most commonly used is iso-8859-1

    Its also important to have all the elements in lower case. You should code <html> instead of <HTML>

    Vertical align

    Valign used in image tags, td/tr/table should be avoided. Instead use, “style:vertical-align:top;”

    Horizontal align

    We have a strong habit to use the ALIGN element. Avoid using ALIGN and start using the CSS property

    text-align:left; or right"style:vertical-align:top;"

    You will have to avoid using the language attribute. Use of type=”text/javascript” is must

    <script language="javascript" type="text/javascript"></script>

    Image Border

    Usage of border=”0″ is not allowed. instead use the style elements: style=”border-width:0px;” etc.

    topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0" marginheight="0"

    Instead use the alternative style elements: style=”margin-left:0px; margin-right:0px;” etc.

    Target

    You will have to avoid using the target element. We can use JavaScript Window.Open property. Using JavaScript is a not entertained though because popping open windows can be very annoying.

    target="_blank" Target="_top" target="_parent" target="_self"

     

    Double quotes

    The double quotes are important for specifying values/ i.e. values have to be like

    [id="company"] [ alt="companyname-caption" ]

    Ampersand in URIs / URLs

    If you have to use ‘&’ in any URL (URI) please make special effort to make it &amp;

    JavaScript actions

    When you write the JavaScript element onchange=jumpbox(); , make sure you put “jumpbox();” in double quotes, avoid the name attribute

    ID & Name Attributes

    <select class="text" id="selLanguage">

    The id should be declared compulsorily)

    <input type="hidden" name="Language" />

    Necessary where ever an end tag in not specified.

    Images

    alt is necessary for images. border not applicable. read [border=”0″] for more information

     

     

     

  • What is HTML? Basics of HTML and XHTML

    What is HTML? Basics of HTML and XHTML

    I had written this article for some of my team members’ benefit, and sharing it with you all here for yours! 🙂

    What is W3C?

    W3C stands for World Wide Web Consortium. Its an organization which develops interoperable technologies (specifications, guidelines, software, and tools) to lead the Web to its full potential. W3C is a forum for information, commerce, communication, and collective understanding.

    What is HTML?

    HTML is a computer language devised to allow website creation. These websites can then be viewed by anyone else connected to the Internet. It is relatively easy to learn, with the basics being accessible to most people in one sitting; and quite powerful in what it allows you to create. It is constantly undergoing revision and evolution to meet the demands and requirements of the growing Internet audience under the direction of the » W3C, the organization charged with designing and maintaining the language.

    The definition

    • Hyper Text is the method by which you move around on the web — by clicking on special text called hyperlinks which bring you to the next page. The fact that it is hyper just means it is not linear — i.e. you can go to any place on the Internet whenever you want by clicking on links — there is no set order to do things in.

    • Markup is what HTML tags do to the text inside them. They mark it as a certain type of text (italicized text, for example).

    • HTML is a Language, as it has code-words and syntax like any other language.

    What is DocType?

    DocType is the Document Declaration Tag. This helps the browser to understand the version of HTML or XHTML the files is being created in. After determining the HTML / XHTML version, the browser renders the code in the respective format.

    This particularly helps in terms of older versions of HTML / XHTML. With every new HTML version, some of the tags are added and some are removed. If the browser is supporting the latest version and the HTML is of older version, it will not support the tags removed in the latest version.

    However, if proper doc type declaration is made, then the browser will understand that for rendering the HTML page is to be made according to the earlier version.

    What are MIME types?

    MIME types are another part of the HTML header – an important one. Also known as the content-type header, they tell the browser what kind of file they are about to send. Browsers don’t rely on HTML files ending in .html, JPEG images ending in .jpeg, and so on: they rely on the content-type header.

    text/html – HTML.
    text/css – CSS
    text/plain – plain text.
    image/gif – GIF image.
    image/jpeg – JPEG image.
    image/png – PNG image.
    audio/mpeg – MP3 audio file.
    application/x-shockwave-flash – Flash movie.

    What is XHTML?

    What is the difference between XHTML & HTML?  XHTML is just cleaner HTML—tags are consistently lowercase, all tags are closed, and tags are properly nested.

    An example how do you create a cell in XHTML?

    The Cell can be created in the following format.

    <table>
        <tr>
            <td> This is a Cell </td>
        </tr>
     </table>

    The above illustration shows how a cell is created. The Table tag defines to the browser that the following code will be displayed in a Tabular Format.

    TR tag defines the start of the row, where as TD  defines the start of the Cell.

    With the closing each and every tag in a properly nested format, with lower case, can make it XHTML.

    An example of valid XHTML code

    The look and feel of the table should be exactly same with font pixels set at 10px, and you should use CSS to style the following table.

    Table Table of Contents
    Type of Buildings Type A – Flat Systems Type B – Flat System
    Bungalow System
    Type of Material Bricks Wood

    Answer:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     <html xmlns="https://www.w3.org/TR/xhtml1/normative.html">
     <head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <title>Document Title</title>
    
    <style>
     table
     {
     font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;
     }
     .style1 {color: #FF6600}
     .style2 {color: #0033CC}
     </style>
    
    </head>
    
    <body>
     <table>
     <tr>
     <td>Table</td>
     <td colspan="2">Table of Contents</td>
     </tr>
     <tr>
     <td rowspan="2" valign="top"><span class="style1">Type of Buildings</span></td>
     <td><span class="style2">Type A – Flat Systems</span></td>
     <td class="style2">Type B – Flat System</td>
     </tr>
     <tr>
     <td width="394" colspan="2" valign="top" class="style2">Bungalow System</td>
     </tr>
     <tr>
     <td>Type of Material</td>
     <td class="style2">Bricks</td>
     <td class="style2">Wood</td>
     </tr>
     </table>
     </body>
     </html>

    Example Output

    TableTable of Contents
    Type of BuildingsType A – Flat SystemsType B – Flat System
    Bungalow System
    Type of MaterialBricksWood

     

     

     

    What is Accessibility for Website?

    Accessibility is basically making websites accessible to the disabled. The disabled use specific browsers to read out the HTML based web pages on the website. By ensuring compliance to W3C Guidelines, you can easily be compliant to these browsers.

    >> The British Disability against Discrimination Act, the US Sec 508, The Australian Disability Law etc, are the laws of the respective countries where following web accessibility is made compulsory.