1)  Understand your design and decide on the breakpoints.

2)  Start with your theme info file

name = RoboSmart
description = A responsive mobile-first layout for a corporate site.
version = VERSION
core = 7.x
stylesheets[all][] = css/style.css<

3)  Create HTML5 pages for each unique page in your website.

Based on the grid system and the nature of your design, download grids from http://960.org. In the case of the RoboSmart theme we have used a single grid at 600 which is fluid and works for any screen resolution greater than 600px.

Start with the mobile design and move the way up for all the breakpoints. Convert the HTML5 pages to template files. This step is similar to that of any general drupal theme except that the same template is applicable for multiple breakpoints. If you are using HTML5 make sure you start with the declaration in your html.php.tpl file.

Validate the outline your page generates using an outliner. Structure the HTML5 tags and header tags to achieve the desired outline. Working your way up from the lowest to the highest breakpoint, i.e starting from the mobile design, is an important aspect of the mobile first approach.

4)  Segregate the styles for the different breakpoints using media queries. Detailed below options for using media queries.

Multifile option: Embed your media queries in the .info file

stylesheets[all][] = css/style.css
stylesheets[print][] = css/print.css
stylesheets[all and (min-width: 600px)][] = css/grid-600.css
stylesheets[all and (min-width: 600px)][] = css/style-600.css
stylesheets[all and (min-width: 480px)][] = css/style-480.css
stylesheets[all and (min-width: 960px)][] = css/style-960.css
stylesheets[all][] = css/fonts.css

Single file option: Write media queries inline in css files

media all and (min-width: 461px) and (max-width: 900px) {
//embed styles here
}

5) Embed viewport & other mobile/handheld device specific meta tags in the html.php.tpl file

<meta content=”width” name=”MobileOptimized”/>
<meta content=”true” name=”HandheldFriendly”/>
<meta content=”width=device-width” name=”viewport” />
<meta content=”on” http-equiv=”cleartype”/>

6) To enable IE support, add Html5shiv, Respond.js and Selectivizr.js files to your theme.

7) Test your theme in a default Drupal installation. Voila! Here we have a Drupal 7 theme that is responsive.

Post Refer by : http://www.unimitysolutions.com/blog/7-steps-building-responsive-theme-drupal-7

Joomla is a great platform to build your website upon. But your Joomla website can go all waste if it isn’t visible online or, in simple words, ranks high on the search engine results pages. To start with you need to understand that Joomla by itself won’t produce a search engine friendly website though there are many such claims floating online. Search engine optimization involves a lot of hard work and getting some basic things right. Here we shall discuss some simple tips which can go a long way in improving the online visibility of your Joomla website.

Use Search Engine Friendly URLs

This is the first step to optimizing your Joomla website. To do so you can make use of the SEF plugin that comes by default with Joomla. However, keep in mind that this plugin isn’t pre-activated and you need to visit the global configuration page to activate it. Apart from this you can also try third-party plugins such as sh404SEF. You should also enable ‘Use URL Rewriting’ under ‘Global configuration’.

Choose Right Servers

Choosing the right servers is vital to the performance of a website and here we recommend that you set up your Joomla website on an Apache server with mod_rewrite installed. This will allow you to make numerous modifications which are a part and parcel of search engine optimization process.

Get Meta Data Correct

This is one of the most tried and tested SEO techniques which still holds good. Make sure every page in your website has a relevant description and keywords related to the text. The description shouldn’t exceed more than 160 characters. This allows search engine crawlers to index your website easily for the targeted keywords. And most importantly avoid using unrelated keywords as they harm your brand value and attract penalty from the search engines.

Turn Off PDF Links

There are situations where the PDF pages rank higher than the main pages of the website. Now this might seem good but it hurts your cause as PDF files have no menu links and thus create a dead end scenario in the website. It would be wise to turn off all the PDF files and instead focus on the core areas of the website.

Rename htaccess.txt to .htaccess

Since you have enabled URL rewriting it is important that you rename the htaccess.txt file to .htaccess – which is the version used by Joomla and mod_rewrite. This helps in redirecting non-www address to www, doing away with duplicate pages in your website.

Optimize Image Size and Use Alt Tag

Images contribute substantially to the traffic in any website and this is one area we often tend to ignore when it comes to optimizing a Joomla website. Use low resolution images which are small in size as they make the website load faster. To add Alt Tag or alternate description make use of the JCE editor which allows you to describe your image. You can also define the image dimensions which improves the load speed of your website.

Turn On Cache

The smaller the site, the faster it loads and the more popular it’s with the users. And one of the best ways to make your website load fast is by turning on Cache. You can easily do this by visiting Global Configuration.

These are only a few basic techniques but the most important ones used to optimize a Joomla website. You may also try out other things which may seem feasible to your website’s needs.

PixelCrayons, a web development company, is the contributor of this post. The company specializes in ecommerce & CMS solutions. You may hire Joomla Developers and Magento Developers here at affordable rates.

Joomla, one of the most widely used content management systems in the world, is amply powered by several extensions that help improve its functionality. To create forms in Joomla there are several extensions that can come handy. A visit to the Joomla Extensions Directory gives a fair idea of the number of form extensions currently available. In this article we will take a look at the best form extensions for powering your Joomla website.

1. RSform Pro : This form extension is by RSJoomla that has the capacity to meet every set of requirements for any kind of website. RSform Pro is easy to install and has some great features like the ability to store submissions to a database, Ajax validation for fields, mailchimp integration, drag and drop order change, salesforce integration, easy export to Excel with custom CSS and JavaScript in your form. It also has custom layout options and multi-page forms with PHP code execution.

2. Breezing Forms : When a clean interface welcomes a developer, non-programmer or designer, the first impression will definitely be impressive! This is what BreezingForms does at the first glance. It has three interfaces: QuickMode, Easy Mode and ClassicMode. All the three have simple steps that help you create forms easily. The drag and drop features really work great in all the three ways. However, the three interfaces are designed for three different type of users. For example, the QuickMode is for non-programmers who want to create simple forms easily, while the ClassicMode is for designers.

3. Mad4Joomla : Listed among the most popular Joomla form extensions in the Joomla Extensions directory, Mad4Joomla packs quite a punch with its features. It helps create email forms with better preferences for usability, classification in categories, working with templates, file uploads as attachments etc. Mad4Joomla, created by Mad4Media, is thus perfect if you are looking for a form extension for creating job forms, reservations, contacts, donations and polls among other things.

4. Chronoforms : The latest versions of Chronoforms form extension for Joomla have definite advantages over its previous versions, especially with the form field drag and drop function. Starting from options for basic form features like field creation to email processing, data validation, data storage and management, Chronoforms does boast of several improvements. Security of the form extension is built in Captcha + ReCaptcha support. You can also perform several Joomla functions on this extension such as Joomla registration forms, User Login and Article submission. The disadvantage of using Chronoforms is that you need to create separate tables for submissions unlike the other form builders. However, it is one of the best form extensions available currently.

A visit to the Joomla extension directory will give you a glimpse of the other form extensions available for creating forms. The five listed above are among the most popular ones used.

PixelCrayons, a web development company, is the contributor of this post. The company specializes in ecommerce & CMS solutions. You may hire Joomla Developers and Magento Developers here at affordable rates.

Joomla as one of the most coveted content management systems (CMS) has found users across the world and is known for supporting all kinds of websites. From a simple content-rich website to an interactive website for education, social networking or as an ecommerce store, Joomla can be used for developing any kind of website. Using Joomla you can easily maintain a website without the technical know-how. Editing or deleting content and images is very easy mainly because of the graphical user interface. Once the back-end work is done by a Joomla developer it isn’t difficult to manage the site. Irrespective of which CMS you use, the one thing that can make or break a website is its theme design. An attractive theme ensures more traffic while a lousy one repels users. To integrate Joomla in your website theme, it is essential that you go for PSD to Joomla conversion.

When the advantages of PSD are mixed with the advantages of Joomla, the result is excellent to say the least. PSD unleashes the opportunities of a developer to get the best theme developed, on the other hand, with Joomla integration you get to make your website highly attractive, robust and user friendly. For PSD conversion it is necessary to know the markup languages HTML or its advanced version XHTML. The conversion process is technical and needs expertise. If you are not sure whether you can do it yourself, you can hire the service of Joomla developer who will do the job easily.

Steps to Integrate Joomla in your Website Theme

• Joomla integration into your website begins with PSD to HTML conversion. To do that you will first need to slice the PSD file. Slicing separates the different layers of the file and helps developers put different codes to the layers. The standard layers that are always helpful are logo, banner, links and the body. With PSD to HTML codes, you can easily define each layer.

• While converting PSD to CSS/Joomla, remember to use semantic codes. Semantic codes are beneficial in the long run as they enhance the quality and performance of a site. Using any markup language you can go for semantic coding.

• For better results, you can also use CSS that further define the design attributes of the site and help make a site faster. CSS also reduces the amount of codes and is an advantage for search engine optimization.

• Once the PSD file is sliced and coded using HTML/XHTML, getting it validated by W3C completes the conversion process. Following W3C guidelines ensure that you follow all the subscribed structure for building a website.

• Once the above steps are completed, your theme is ready as a web compatible file and can be easily integrated into Joomla. The Joomla interface has an easy-to-use admin panel through which you can easily integrate the theme into the website.

While you are converting your PSD file to make it web compatible and to get it integrated into your website using Joomla CMS, you need to keep in mind a few things. During the integration process remember to make the website theme cross-browser compatible. This way you can be sure that users using Safari, Chrome, Firefox and IE etc. have access to your website without any resolution problem. While coding the integration process, remember to lay special emphasis on search engine optimization. In today’s competitive market only SEO can ensure that you get more traffic into your website. Joomla CMS can also be used to install modules that will enable search engine marketing and viral marketing- both potent tools to make a website successful.

Joomla web development is one of the most preferred ways of developing a website as it is flexible and customizable content management system. Making the website search engine friendly is one of the principal goals for a Joomla developer. In doing so one has to optimize the URLs to make them SEO friendly. Search engine optimization plays a decisive role in the success and failure of any website as majority of the traffic to any website comes via the search engines. Let us now take a look at a five step process which allows developers to set up SEO friendly URLs for a Joomla website.

1. Configure .htaccess: The first stage of this URL optimization starts with configuring the .htaaccess (hypertext access). This is a directory-level configuration file which is supported by web servers and allows decentralized management of web server configuration. For this you need to go to the Control Panel of your hosting area and login. Here you need to find the File Manager (the same place where you upload and modify your raw HTML, CSS files etc. in your hosting) You would find a file called htaccess.txt; all that you need to do is rename this file to ‘htaccess.

2. Login In To Joomla Admin: In this step you need to go to the administrator directory (yoursite/administrator) under your Joomla installation and login. This is the nerve center of your Joomla website and a place where you would be customizing the Joomla website URLs to make them friendly for the search engines. Any changes in Joomla development needs to be made from this section in the website.

3. Global Configurations: In the admin area of your Joomla installation you will come across Global Configuration. Click and access it and here you will do some of the most important configuration to make these URLs attract the attention of the search engines. Apart from the URLs you can optimize lots of other things for your website under Global Configuration to make the website search engine friendly. But for now our focus is on search engine friendly URLs.

4. Optimize SEO Settings: Under the Global Configuration you will come across SEO Settings section and you have to optimize the URLs here. You will have the option to check ‘yes’ for Search Engine Friendly URLS and Use Apache mod-write options. Check both these buttons as this will immediately turn the URLs of your Joomla based website into search engine friendly urls. Apache modules play a very important role in the search engine friendliness of your website.

5. Save The Changes: In the SEO Settings you need to hit the ‘Save’ button at the top of the page once you have checked Search Engine Friendly URLS and Use Apache mod-write options. This will save the changes that you have made and attract Google, Yahoo and Bing to your website helping you reach out to a large audience.

Now within a short period of time you will see the effect of optimizing the URLs of your Joomla website. Search Engine Friendly URLs will help you attract targeted traffic to your website. Joomla development is a powerful way of building a website and make sure you hire the services of a professional Joomla developer who has in-depth knowledge of search engine optimization and use white hat SEO techniques to optimize your website. Take a look at the portfolio of the developer as this will give you a fair idea of the work he has done in the past and help you make an informed choice. Wrong choice of the developer can hurt the website development process.

Joomla development is the perfect solution to get websites which fulfill the needs of small and large businesses alike. This perhaps explains its immense popularity among all the CMS web development solutions available in the market. Joomla developers have perfected their skills of developing websites which are highly secure thus protecting the interest of your business. However developing a secured website is no child’s play. A lot of things need to be implemented to protect a website from external threats. Here are a few security tips which should be applied to your Joomla website.

• Use Secure Servers - A lot of security issues in CMS web development arise due to the mismatch of server and technology. When it comes to a Joomla website you should host your site on a server that runs PHP 5.2 or in CGI mode. It should support Su_PHP which helps in executing scripts under your specific user account and easily identify security breaches.

• User Account & Permission - Most websites fall victim due to the fact that they don’t set proper user accounts and permissions. A website is likely to be used by multiple users in a large organization and it becomes very important to set different levels of user permission. This reduces the vulnerability of your website.

• Weak Passwords - Setting weak and common passwords is as good as using a cheap and easily breakable lock in your homes. Your password shouldn’t be something that can be cracked with brute force by hackers. Craft a password that contains numbers, upper and lowercase letters and special characters and change it at regular intervals. This goes a long way in protecting your website.

• Use Extensions Carefully - It is a fact that Joomla extensions make it such a powerful platform but at the same time they pose the biggest security threat to your website. So you need to be extremely choosy while adding extensions to your Joomla website. Read their reviews and rating before you make use of them. Keep the extensions updated as and when patches come out and avoid using unnecessary extensions in your website.

• Remove Unused Extension - It is most likely that your server still has a few extensions which you have stopped using or don’t intend to use in the future. It would be wise to remove them as they can be the source of vulnerabilities in your website as such files in the server fall easy prey to the hackers and can be the source of problems in your website.

• SSL Certification Is Must - This is one of the best ways to secure a website. Use SSL on your site and force Joomla into SSL mode for all logins. You need to configure the SSL certificate for your site’s domain and make sure there are no compatibility issues with the appearance and functionality of the website.

• Shut Down FTP Layer - The FTP layer has lost its significance in today’s web development techniques. On most occasions you need to turn it off to allow third-party extensions to work on your Joomla website. Thus to reduce the security threat to your website it is wise to disable it completely after ensuring it doesn’t have any of your login details.

• Change Table Prefix - Hackers can easily gain access to the default jos_users database table. This allows them to take control of the website. Use random names as this adds another level of security to the website which cannot be breached easily.

Making a website secure from external threats in Joomla tests the skills of developers and thus always you should always insist on hiring the services of Joomla developers who have a proven track record. Remember unlike design and functionalities it is very difficult to measure the level of security in a website. So tying up with developers who have worked on several sites in the past is the wisest thing to do.