Guidelines for Making W3C Compatible Mobile Websites

W3C MobileOk Checker performs tests on a web page to determine its level of mobile-friendliness. http://validator.w3.org/mobile/

This also helps in page speed.
Following are some basic guidelines to make mobile sites W3C compatible.

  • The total size of the page should not be exceeded 20 kilobytes (Primary document, Images, Style sheets)
  • Big pages require a possibly high cost and a long waiting time in many mobile networks. For instance, on many mobile networks, downloading 100KB worth of data takes as long as 1 minute.
  • Scale down images to a reasonable size. Remove images that are not essential to the layout of the page.
  • Make CSS & Javascript external. Eliminate inline CSS & javascript code. It increases page size as well as blocks initial content from loading.
  • <input type=’image’> assumes that the user will click on a specific area of an image, which is not possible on many mobile devices. So don’t use the image input type, try to use another input mechanism like “button”, “submit” or <img> etc…
  • The size of the document’s markup should not exceed 10 kilobytes. Mobile devices have limited screens. Long pages on small screens are confusing, because users can’t see the big picture and feel lost. The 10Kb limit ensures that the page is still usable on devices with small screens. Continue reading →

Deprecated features in PHP 5.3.x

ITechonology

Image

PHP 5.3.0 introduces two new error levels: E_DEPRECATED and E_USER_DEPRECATED. The E_DEPRECATED error level is used to indicate that a function or feature has been deprecated. The E_USER_DEPRECATED level is intended for indicating deprecated features in user code, similarly to the E_USER_ERROR and E_USER_WARNING levels.

The following is a list of deprecated INI directives. Use of any of these INI directives will cause an E_DEPRECATED error to be thrown at startup.

Deprecated functions:

View original post 88 more words

Which PHP CMS You Likes Most?

Eureka!

We can use to detect the browser such that it would redirect user to another if the request comes from a .

1. Create the .

View original post 31 more words

Best Techniques for Web Page Load Time Optimization

Followings are some best techniques to speed up your websites:

1.    Include CSS in head – always render CSS file in the head section

2.    JavaScript in footer – move JavaScript calls to web page footer.

3.    Avoid inline CSS and JavaScript expressions. It increases html size and http

4.    Avoid duplicate CSS & javascript code. Keep optimized files.

5.    on window.onload

a. Render heavy JavaScript based objects on window.onload event. Like

  • JS widgets
  • Social media sharing buttons scripts

It will help to improve web page content loading time.  Once browser completed rendering of main content then objects written on window onload event will be rendered into background and doesn’t require user to wait for them

Continue reading →

Use of Media Queries for Standard Devices

CSS3 provides a way to make CSS conditional to write the CSS as per device resolution.

See following HTML5 compatible CSS to design your mobile websites for various standard devices. It includes iPhone, iPad, smart phones etc…


/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
/* Styles */
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
/* Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}

Reference URL

usort() PHP Function Issue with PHP 5.3

Most of you may be faced this issue, usort() behaves differently in PHP 5.1 & 5.3 versions.

E.g

<?php
class myClass {
  public static function mySortMethod($object1, $object2)
  {
     if ($object1->order == $object2->order) 
    {
         return 0;
    }
    return ($object1->order < $object2->order) ? -1 : 1;
  }
}

usort($arr, 'myClass: mySortMethod');

?>

This would be working fine till PHP 5.1, but in latest version means PHP 5.3 it doesn’t sort properly.

Solution:

Continue reading →

Select box skinning Jquery plugin

If you want to design/skin your HTML  select box, you can do it using jquery.select_skin plugin.

Find following link for more information and to download this plugin:

http://www.verot.net/jquery_select_skin.htm

HTML5 Canvas – Nice flame/fire effect using particles

Try following HTML script. Shows nice flaming/fire effect using Javascript and CSS.

Javscript:
window.onload = function(){
var canvas = document.getElementById(“canvas”);
var ctx = canvas.getContext(“2d”);

//Make the canvas occupy the full page
var W = window.innerWidth, H = window.innerHeight;
canvas.width = W;
canvas.height = H;

var particles = [];
var mouse = {};

//Lets create some particles now
var particle_count = 100;
for(var i = 0; i < particle_count; i++)
{
particles.push(new particle());
}

//finally some mouse tracking
canvas.addEventListener(‘mousemove’, track_mouse, false);

Continue reading →

Custom Carousel with jQuery and Roundabout

Try this:

http://www.joezimjs.com/javascript/how-to-build-a-custom-carousel-with-jquery-and-roundabout/

Demo: http://www.joezimjs.com/demos/roundabout-demo/

Nice article to get jquery roundabout effect.

Also you can modify the UI as you want. There are lots of moving effects functions available into this plugin by which we can change sliding effects.

 

PHP MYSQL Data Pagination

<?php 
if (isset($_GET["page"])) { $page  = $_GET["page"]; } else { $page=1; }; 
$start_from = ($page-1) * 20; 
$sql = "SELECT * FROM students ORDER BY name ASC LIMIT $start_from, 20"; 
$rs_result = mysql_query ($sql,$connection); 
?> 
<table>
<tr><td>Name</td><td>Phone</td></tr>
<?php 
while ($row = mysql_fetch_assoc($rs_result)) { 
?> 
            <tr>
            <td><? echo $row["Name"]; ?></td>
            <td><? echo $row["PhoneNumber"]; ?></td>
            </tr>
<?php 
}; 
?> 
</table>
<?php 
$sql = "SELECT COUNT(Name) FROM students"; 
$rs_result = mysql_query($sql,$connection); 
$row = mysql_fetch_row($rs_result); 
$total_records = $row[0]; 
$total_pages = ceil($total_records / 20); 

for ($i=1; $i<=$total_pages; $i++) { 
            echo "<a href='pagination.php?page=".$i."'>".$i."</a> "; 
}; 
?>

Disable csrf protection in Symfony

Disable LOCAL csrf protection

In order to disable CSRF for just *this* form, inside the form configure() method add following code

$this->disableLocalCSRFProtection();

Disable GLOBAL csrf protection

It might also happen that you want to quickly disable CSRF protection for all forms you have, you can do this using static method disableCSRFProtection() on sfForm.

sfForm::disableCSRFProtection()

Combining two fields data into one field in the same database table

If you only want to display the name after combining the fields then simply use:
SELECT CONCAT(first_name, ‘ ‘, last_name) AS full_name FROM table_name;

But if you want to save them in a separate db field then use UPDATE query. To update all the records in the table in one shot use:

UPDATE table_name SET full_name = CONCAT(first_name, ‘ ‘, last_name);

Symfony Coding Standards Tips

Structure:

  • Never use short tags (<?);
  • Don’t end class files with the usual ?> closing tag;
  • Indentation is done by steps of four spaces (tabs are never allowed);
  • Use the linefeed character (0x0A) to end lines;
  • Add a single space after each comma delimiter;
  • Don’t put spaces after an opening parenthesis and before a closing one;
  • Add a single space around operators (==, &&, …);
  • Add a single space before the opening parenthesis of a control keyword (if, else, for, while, …);
  • Add a blank line before return statements, unless the return is alone inside a statement-group (like an if statement);
  • Don’t add trailing spaces at the end of lines;
  • Use braces to indicate control structure body regardless of the number of statements it contains;
  • Put braces on their own line for classes, methods, and functions declaration;
  • Separate the conditional statements (if, else, …) and the opening brace with a single space and no blank line;
  • Declare visibility explicitly for class, methods, and properties (usage of var is prohibited);
  • Use lowercase PHP native typed constants: false, true, and null. The same goes for array();
  • Use uppercase strings for constants with words separated with underscores;
  • Define one class per file;
  • Declare class properties before methods;
  • Declare public methods first, then protected ones and finally private ones.

Continue reading →

Building Views with Fivestar and VotingAPI

The Five Star voting module adds a clean, attractive voting widget to nodes
Please see the following link, this tells you how to integrate the fivestar rating functionality into views using voting API.

http://www.lullabot.com/videos/building-views-fivestar-and-votingapi

Integrate the image upload feature in TynyMCE wysiwyg editor using IMCE Drupal module

In Drupal, by default the TynyMCE editor is allowing to insert the image URL only and not allowing to upload the images from front-end editors.

You need to add and configure some third party modules to achieve this functionality:

Following Drupal modules are required for it:

  • WYSIWYG – offers an API for implementing a variety of WYSIWYG editors including FCKeditor 2.6, jWYSIWYG 0.5, markItUp 1.1.5, NicEdit 0.9.0, openWYSIWYG 1.4.7, TinyMCE 3, TinyMCE 2, Whizzywig 55, WYMeditor 0.5, YUI editor 2.7.0
  • IMCE – IMCE is an image/file uploader and browser that supports personal directories and quota.
  • IMCE Bridge – This module is acts as a bridge between the IMCE module and the Wysiwyg module.

Continue reading →

Drupal Tips and Tricks

Drupal admin and configuration:

  1. Create a “HTML help” block and assign it to appear on only “node/*/edit” and “node/add/*”
  2. Use the “edit permissions” link on admin/user/roles to get a single column
  3. Use the Firefox Web Developer Toolbar to “Populate Form Fields” on the access page for the admin role
  4. Use “site:drupal.org {search terms}” to search all of drupal.org withGoogle. Set up a Firefox shortcut so you can type “dru [your search]” tosearch Drupal. Also api.drupal.org/apis/{search_term}
  5. When using pathauto to alias usernames, don’t let users change their usernames.
  6. Use PathAuto and Path Redirect together to redirect old aliases to the new ones. Search engines will love you.

Continue reading →

List of Top 40 Drupal Modules

  1. Drupal Core
  2. CVS Integration / Project / Project Issue Tracking
  3. Views
  4. CCK
  5. Pathauto
  6. Devel
  7. ImageCache
  8. TinyMCE
  9. API
  10. Organic Groups
  11. Continue reading →

How to resolve the Drupal’s Clean URL disabled issue

Most of the time in Drupal the clean url setting in admin section is now allowing to enable/disable the clean UR’s.  It is totally unfocused.

This issue is not with the Drupal, this is because of wrong server configuration or .htaccess file. You can get rid of this issue by doing following steps.

1. Check the AllowOverride in httpd.conf is set to All

2. If you are using symbolic links then make sure that Options FollowSymLinks is uncommented.

3. Make sure that  Options Indexes FollowSymLinks is on in document root setting section. If you have written MultiViews in-front of this line then you should remove it because it overrides the mod_rewrite rules.

4.  Check .htaccess file is exist or not in drupal installation.

How to call a javascript function after pressing enter key in input box

If you got the errors in IE browsers after calling some Javascript
functions on input box event, then user the following methodology
to get rid of it:

<input type="text" id="txtSearch" 
onkeydown="if (event.keyCode ==13) document.getElementById('btnSearch').click()"/>

<input type="button" id="btnSearch" value="Search"
onclick="doSomething();" /> 

How to flush all the data from Memcached using command line

Use following command:

echo "flush_all" | nc 127.0.0.1 11211

How to see all the statistics about stored data into Memcached

Use Following command to see it:

echo "stats" | nc 127.0.0.1 11211

Follow

Get every new post delivered to your Inbox.

Join 67 other followers