target=”_blank” validation

Posted on by

target=”_blank” is not valid code within webpages with a strict doctype declaration.

A valid replacement is :

<a href = “http://www.example.com” onclick = “window.open(this.href); return false;”>my link </a>

The onclick=”window.open(this.href); return false;”  is an inbuilt javascript method and needs a <meta> declaration  to work properly in in xml, strict xhtml or html4 source code pages.

<meta http-equiv=”Content-Script-Type” content=”text/javascript”>

target=”_blank” is however 100% valid in HTML5.

Facebook Feed Dialog

Posted on by

The Facebook Feed Dialog prompts a user to publish an individual story to a profile’s feed. This does not require any extended permissions. Every dialog has a method name and parameters. The URL to a dialog always starts with

http://www.facebook.com/dialog/

followed by the name of the dialog and parameters.

To ask a user to post a story to their Wall, the Feed Dialog with required parameters is used :

http://www.facebook.com/dialog/feed?parameters

The following parameters are available :

  • app_id : required application’s identifier
  • redirect_uri : required URL to redirect to after the user clicks a button
  • from : optional ID or username
  • to : optional ID or username
  • message : optional (see Facebook policies) text to prefill the data field that the user will type in
  • link : link attachment
  • picture : url of picture
  • source : url of media file; if specified, picture will be ignored
  • name : name of the link
  • caption : caption of the link; will appear beneath the name
  • description : description of the link; will appear beneath the capation
  • properties : several JSON objects of key/value pairs; will appear in the post beneath the description; key=string; value=string or JSON object with keys text and href
  • actions : one JSON object with keys name and link; will appear next to the “Comment” and “Like” link under posts

To integrate a Facebook dialog in a webpage, the URL can be constructed on the server or client side. Helper methods are available in the form of Javascript, iOS and Android SDK’s. A Javascript Test Console is available to debug common methods. The tag ?ref=nf is added by the Facebook platform to the links.

Please visit My favorite artist at Leslie’s Artgallery to see a working example of a Facebook dialog.

Pagerank, Content Farms, Search Quality and Black Hat SEO

Posted on by

Last update : June 29, 2013
PageRank is a link analysis algorithm, named after Larry Page and used by the Google Internet search engine, that assigns a numerical weighting to each element of a hyperlinked set of documents. PageRank has been patented; the patent is assigned to Stanford University and exclusively licensed to Google.

The PageRank of a website is shown in the Google toolbar. The PageRank score was however removed by Google in October 2009 from the Webmaster Tools, because Google has been telling people for a long time that they shouldn’t focus on PageRank so much. PageRank is not an important metric for search engine optimisation.

Several providers continue to find the  PageRank data useful and offer free PageRank checkers, for instance at the website www.prchecker.info.

The term content farm is used to describe a company that employs large numbers of often freelance writers to generate large amounts of textual content which is specifically designed to satisfy algorithms for maximal retrieval by automated search engines. Their main goal is to generate advertising revenue through attracting reader page views. Critics allege that content farms provide relatively low quality content.

Search engines see content farms as a problem, as they tend to bring the user to less relevant and lower quality results of the search. On February 24th, 2011, Google announced that they were making a substantial change in their ranking algorithms to purge low-quality informations in the search results.

A black hat is the bad guy in a western movie. In computing slang it refers to a computer hacker. Black Hat search engine optimization is defined as techniques that are used to get higher search rankings in an unethical manner. Some of these techniques are keyword stuffing, invisible (hidden) text, cloaking, duplicate content and doorway pages.

Further informations about the Google search algorithms are available at the scriptol website.

CSS : clear floats

Posted on by

Elements following a floated element will wrap around the floated element. To disable wrapping, you can apply the “clear” property to these following elements. The standard method is to place a complete “cleared” element last in the container :

<div style="clear:both;"></div>

To clear CSS floats without this extra markup you can use the following techniques :

  • Float the container as well
  • Use overflow: hidden on the container
  • Generate content using the :after CSS pseudo-class

A very detailed tutorial about Floats has been published by Vitaly Friedman, editor-in-chief of the Smashing Magazine.

Other useful tutorials are :

HTML5 : block-level and inline elements

Posted on by

Block-level elements like (<div>, <pre>, <p>, <ul>, <ol>, <li>,… ) take up the entire width of their containing element and the height of the default line-height. They stack up underneath each other, top-to-bottom.

Inline elements like (<img>, <em>, <strong>, <a>, <span>, …) are in-line. They stack up next to each other, left-to-right.

All HTML block-level elements have five spacing properties: height, width, padding, border and margin. In the HTML box-model, the width of padding, border and margin are added to the width of the content area.

Applying float to an element will automatically make it a block-level element.

HTML5 editors

Posted on by

My preferred HTML5 editor is Notepad++. Notepad++ is a free source code editor that supports several languages. Running in the Windows environment, its use is governed by GPL License.

There are other HTML5 editors available. Adobe’s Dreamweaver CS5 is the flagship among the commercial tools.

A list of some other useful HTML5 editors is shown below :

  • Aloha Editor (semantic Rich Text Editor framework written in Javascript with best support of xHTML5)
  • Rendera by Brian P. Hogan

ccTLD & gTLD

Posted on by

A  ccTLD (country code top-level domain) is an Internet top-level domain generally used or reserved for a country, a sovereign state, or a dependent territory. In 2010, the IANA (Internet Assigned Numbers Authority) began implementing internationalized country code TLDs, consisting of language-native characters when displayed in an end-user application.

A gTLD (generic top-level domain) is another category of top-level domains maintained by the IANA. The core group of generic top-level domains consists of the com, info, net, and org domains. In addition, the domains biz, name, and pro are also considered generic, however, these are designated as restricted, because registrations within them require proof of eligibility within the guidelines set for each.

A third category of  top-level domains, called sponsored TLD,  is a specialized TLD that has a sponsor representing a specific community served by the domain. The communities involved are based on ethnic, geographical, professional, technical or other theme concepts proposed by private agencies or organizations that establish and enforce rules restricting the eligibility of registrants to use the TLD. Some examples are edu, gov, tel, mobi, …

IANA is operated by ICANN (Internet Corporation for Assigned Names and Numbers).

Lightbox scripts

Posted on by

last update : April 11, 2012

Lightbox is a simple, unobtrusive script (modal dialog box) used to overlay images on the current webpage. It’s a snap to setup and works on all modern browsers. Lightbox was developed by Lokesh Dhakar.

The current version is 2.0.5 released on March 18th, 2011. It’s based on the Prototype Javascript  Framework and on script.aculo.us. There are specific modified versions available like ThickBox (developed by Cody Lindley, but no longer maintained), LyteBox (version 5.5, released on January 26, 2012 by Markus F. Hay) and others. Different plugin’s are available for WordPress.

A very minimal implementation of a lightbox (modal dialog box) is available at the Google code website. More scripts about modal dialog boxes are listed at the Designlabel website.

My favorite script is Lytebox developped by Markus F. Hay. Based on the Lightbox class that Lokesh Dhakar originally wrote, the purpose was to write a self-contained object that eliminated the dependency of the javascript frameworks prototype.js, effects.js, and scriptaculous.js. Lytebox supports iFrames.  Since the original version of Lytebox, major modifications were added as a result of user input to improve performance as well as slideshow support, themes support, HTML content support and many more configurable options that allow you to customize the look and feel of the software.

More informations about modal dialog boxes are available at the following links :

Standalone scripts :

jQuery based scripts :

Miscellanous :