Web Design Principles of Successful Websites

What is Web Design?

Web design surrounds many different skills and disciplines in the production and maintenance of websites The very process of using creativity to design and construct a website and updating it regularly to incorporate changes is also referred to as web designing.

Besides the creation and updating, it also involves taking care of the front end look, the architecture of information shows, the layout, the colors, content, navigation ergonomics, as well as the designs of the various icons.

Some other areas in web design include search engine optimization, user experience designs, standardized codes, graphic design, as well as interface design.

The term ‘web design’ may also point to the visual aspect of a website but in truth it also overlaps with the process of web development in a more broad sense.

The process includes front end designing and also the process of writing the markup.


Basic elements of a good web design

To rise high with a good web design and an effective visual and technical appearance of a website, there are some elements that must be followed. To get some introduction about these elements, you can go through the following given points:


It is an element of a web design which is responsible to create a flow in the design. A good web design is one which automatically makes our eyes move from one corner or content of the website to another, according to relevance or hierarchy.


Texture is one element that can help provide your design with a feeling of a surface. There are several types of textures that you can incorporate, and some of them include natural textures and artificial textures. This element should be used in a way that it highlights the content given on the website and makes it look more appealing.


Another basic element of a good website is the use of color. A black and white website may work for certain niches like photography websites, but it is always better to raise the appeal of a website using colors in a creative way. The colors are added in the later stage and not during the designing.


On most webpages, the shapes used are rectangular or squares but they don’t necessarily have to be. Shapes are responsible for the creation of an enclosed boundary in the overall design, and you can experiment with any shape you seem suitable.


Best Programming Language For Web Development


Web Development

is said to the process of creating a website that can range from developing a single page or a multi page website. Web development is a set of activities taht include programming, web design, content creation, client side or server side scripting as well as network security tasks, etc. In recent years, web development is said to the creation of content management systems or CMS, which is the mid-step between the user and the database. In order to pursue web development as a profession, one of the most important things that you will need to consider is having expertise in programming languages.


Interpreted Languages

An interpreted language can be executed directly and freely, line by line without being compiled earlier. Source code is run directly to produces the defined behavior right away, without generating an intermediary file

PHP — PHP is a popular language. If you have worked with WordPress, Drupal, or Opencart, then you are probably familiar with PHP because all of these platform are build on it.

Python — Python is also a very popular language. Free courses in Python are given bt Udacity that can take you all the way from coding a simple program to a driver-less car.

Ruby — It is best known for their framework, Ruby on Rails. Ruby is a good choice for creating Domain Specific Languages, It is similar to Python.

Javascript — JS is often confused with Java because of the similar name, even though Java is compiled and Javascript is interpreted. Javascript is emerging up in more and more places these days, and its uses have grown beyond web-applications to desktop widgets and web-specific browsers.

Compiled Languages

Java — Java is a advancement of c++, and although it has many popular, supported platforms, it’s uses have been decreased in recent years.

C# — C# was developed by Microsoft Corporation as part of their .NET framework, and is meant to be a modern, programmer-friendly, all-purpose language for its users.

The Best Language

One can not state one particular best language because each language has its own uniqueness. The best language for us would probably going to be the one you already know the best. If you’re a complete novice, PHP will give you more results in less time.

What We Use

We use PHP and Javascript together.


Comments In PHP

Comments in php code are lines that are not read or executed as part of the program. Its purpose is to indicate some guiding text to  the person editing the code.

Comments are useful for:

  • To let others understand what you are doing, comments help other programmers understand what you were doing in each step.
  • To remind yourself, what you were working on. Most programmers have experienced coming back to their own work a year or two later and have to re-figure the working of their program.

PHP suppports three ways of adding comment/s.

Single Line Comment





Multi-line Comment






PHP Case Sensitivity

In PHP, All user defined functions, Classes and keywords are not Case Sensitive.



echo "EXAMPLE";


Both statements will execute.


My First PHP Program

PHP Program must run on a PHP enabled web server.

A PHP Program can be placed anywhere in the document. A PHP script starts with <?php and ends with ?>

first php program

The default extension of PHP file is .php

Writing First PHP Program

A PHP script file normally contains HTML tags and some PHP scripting code.



<h1> My First PHP Page </h1>


echo "Hello World";




echo is built-in PHP function to output the text on a web page.

Save this file with .php extension. create a public folder, save this file in this folder. Save this folder in www folder on WAMP server.

# Start Server

# Type in Browser “http://localhost/

# Navigate to the folder where we have placed the php file.

# Open your php file in browser. it will display your newly created page.



Top 10 Google Ranking Factors for 2017

List of Google Ranking Factors

Get Useful Content This is the most important signal for Google Ranking Factors. Directly or indirectly, your visitors are your customers. Impress them, help them, and give them what they’re looking for. That’s the whole point!

Tip: Write well edited comprehensive articles that provide value to the readers. Pay attention to detail & avoid spelling mistakes. Be original with your content, research, and analysis. Add trusted sources to support the information you give. Write interesting articles targeted for readers, not for search engines. Write what is beyond obvious.

Your landing page should bring an end to users search for that term. who likes to waste time searching endlessly for something. keep that in mind.

Domain age

A brand new website which has no old WHOIS history is hard to rank in search engine for the first three months. For high volume keywords, it can take six months or more.You need to be around for at least 2-3 months for this to be considered as Google ranking factors. You shouldn’t dream to be on the first page in the first couple of months unless you create a website with extraordinary content.

Organic quality links pointing to your website (Dofollow)

When others find your web page useful or interesting, they link back to you. If the link is nofollow, it is not counted by Google to calculate your PageRank. Dofollow links improves your website authority. Links are supposed to come organically and there are webmaster guidelines which warn you against any kind of unethical methods.

Tip: Buying links will be injurious to your website. Google may penalize your site, and if there is a manual action taken on it, it will disappear from the search results altogether. You may have to visit the doctor. Google is also very strict on violations. So don’t be a villain.

Duplicate content

The only way a site will rank well is if it has unique quality content. If you scrape other sites to create your web pages, they are not going to rank in search engine. There are webmaster guidelines on duplicate content. A good habit is to check your pages on Copyscape after publishing them to make sure you have not added any duplicate content unintentionally. Pages with content that provides real unique value, rank well.

Mobile friendly site

With more than 56% of all traffic being from mobile devices. They confirmed mobile friendly website as a Google Ranking Factors, your web pages need to display well on mobile devices like smartphones & tablets.

Secure website (HTTPS)

On 06 August 2014, Google confirmed HTTPSecure as a ranking signal. HTTPS protects the privacy and security of visitors and the integrity of the website. It not only prevents the users from intruders but also from Wi-Fi providers and ISP from injecting ads into your web pages. You can easily get a free SSL certificate from providers like Let’s Encrypt and then setup them on your hosting server or you can sign up with a host like SiteGround which provides them for free.

Site Speed

In April 2010, Google confirmed website Speed as a Google ranking factors. Your website load time should be less than 3 seconds, ideally in less than 2 seconds. If a site takes long to load, users are most likely to abandon it.

This website has a PageSpeed score 84/100 on desktops respectively. To check load times for a webpage, you can use pingdom.com.



Domain history

If you are buying a domain that has been owned previously, you might want to make sure it hasn’t been in trouble with Google in the past. If it has received a manual action in the past, then it would be hard for it to acquire a respectable rank. You may either do a site:domain.com search or check archive.org to make sure it was not spammy.

Keyword density

Webmaster Guidelines mentions that keyword stuffing can harm your ranking in long run. You should make sure that the keyword density is not too much & it doesn’t appear to Google that you are keyword stuffing even if that is not your intention. As per my views, as long as it’s not above 4%, you should be able to achieve a decent rank. There is no ideal keyword density; your content & its quality matters more.

Keyword in H1, title tag, meta description, first paragraph & URL

By using your keyword once in each of the important places like the URL, H1 heading tag, web page title tag, meta description and in the first paragraph, you are telling the search engines and users about what your content is focused on. Without them in the right places, it is generally difficult to gain rank and get clicks. You should make sure that you don’t end up stuffing keywords. These should be unique & descriptive. This is important for Google Ranking Factors.



Drupal General concepts

Drupal General concepts

we will discusses some general concepts that will be useful for you to begin explore Drupal.

Node (Content)

A node is the general term for a bit of content on your website. The content type of the node will define what fields are included with it. Based on the type of node, different fields will be attached, and this is known as a content type. For eg: a basic Page content type has included fields such as title and body fields. Other examples of content type are: Book pages for use in Books, Blog pages in blogs, Discussion topics in forums, and News articles.

The word “node” is not used in mathematical sense as part of a network.

Entity types

An entity type is a useful abstraction to group together fields. Entity types stores and display data, which can be nodes (content), comments, user profiles, taxonomy terms or something custom developed.


They are another type of content you can have on your site (if you have activated the core Comment module). Each comment is typically a type of content that a user submits, attached to a distinct node. For example, each piece of discussion bound to a particular forum topic node is a comment.


Drupal has a system for classifying content referred as taxonomy. This is provided by the core Taxonomy module. user can define their own vocabularies (groups of taxonomy terms) and add terms to each vocabulary. Each vocabulary can then be linked to one or more content types, and in this way, nodes on your site can be grouped into various categories, classified, or tagged in any way you choose.


A user is a entity which represents a actual-world website user. By default, a user has a set of properties like their user name, password, e-mail address, and role. However, they may also have other properties provided by other modules, and it can be extended with new fields. For example, you could add a new field “Link” for user’s Twitter address.


A module is a part of software (code) that extends Drupal functionality. Modules fall into one of three categories:

Core modules are by default included with the main download of Drupal. These can be turned on or off without downloading additional components. Examples include Taxonomy, Book, Poll, or Blog
Contributed modules can be downloaded from the download section of drupal.org, and installed inside your Drupal installation. Examples include Panels, Views or Meta tag.
Modules which you write yourself is called Custom Module. This requires a through understanding of Drupal, PHP programming, and Drupal’s API.

Regions & Blocks

Pages on your Drupal site are laid out in Regions. These can include the header, footer, featured top, featured bottom, sidebars, main content regions etc.. . Your theme may define additional regions.

Blocks are discrete chunks of information that are displayed in the regions of your website’s pages. Blocks can take the form of static chunks of HTML or text, menus (which are for site navigation), the output from modules or dynamic listings that you’ve created yourself (e.g. a list of new users).


There are four standard menus in Drupal 7:

The Main menu is built by site administrators and displayed automatically in the page header section of many themes (if not, you can enable their blocks to display them).
Management is the administration menu, and is presented in the Admin toolbar.
Navigation is a link-all menu that usually contains links supplied by modules on your website.
User menu contains links to the User account and the logout link.
You can also create your own menus (custom), and display them by enabling their blocks.

You can customize menus in several ways, such as reordering menu items by setting their “weight” or simply dragging them into place, renaming menu items, and changing the link title (i.e, tooltip that appears when you mouse hover a menu item). You can move a menu item into a different menu by editing the Parent property of the menu item.

You can also include custom menu items to a menu, from the Add menu item tab of the Menu administration screen. To create a menu item, you will need to provide the path/url to the content.

In all cases a menu item will only be displayed to a visitor if they have the permission to view the page it links to. For example, the admin menu item is not shown to visitors who are not registered/logged in.


The Theme layer is separate from the data layer, the functionality extension layer (module) and Core. Theme controls the appearance (look and feel) of your site, or how your site is displayed, including the graphic look, layout, and colors. A theme consists of one or more PHP template files that define the HTML output of your site’s pages, along with one or more CSS files that define the layout, fonts, colors, and other styles.

For a collection of useful materials for themers, see Theming and Front End Development with Drupal.


Not all sites have Views, most sites include the Views module because of the excellent tools it provides. Views allows people to choose a list of nodes or other entities and present them as blocks, pages, RSS feeds, or in other formats. The main use case for views is to create dynamically updating lists of content (for example, a list of  news), based on characteristics of that content (in the case of the news listing, that the content type is “News” and sorted by publication date).


Drupal preserve information in a database. Inside this database, each type of information has its own database table. For example, the basic information about the nodes of your website are stored in the Node table, and data of each field stores in a separate table (which Drupal creates automatically). Comments and Users also have their own database tables, as  permissions, roles, and other settings.

The most common database for Drupal is MySQL. However, you can also run Drupal on other database systems, such as PostgreSQL, as well.


When you visit a URL under your Drupal site, the part of the URL after your base site address is known as the path.

When you visit a path in your Drupal site, Drupal figures out what information should be sent to your browser by checking its list of routes and menu items. Generally, Drupal allows each module to define paths that the module will be responsible for, and when you choose to visit a particular path Drupal checks the module what should be displayed on the page.

For example, the page you are now viewing is http://drupal.org/node/18728, and the path is “node/18728”. The module that is functional for this path is the core Node module, so when you visit this page, Drupal lets the Node module determine what to display.


The bootstrap is the CPU (central processing unit) of Drupal. this is sometimes called the event loop in other interactive software environments . Drupal’s core is a bit like that. It sits around waiting for a path request, and then starts processing the request.


Permissions can be set to control what users have access to view and/or edit particular areas of a site. These permissions relates to registered users (ie: content editors, administrators, site members) and non-registered users. Permissions can be set to be very specific and granule making for a powerful feature to use when developing a site’s structure.


what is Drupal

Drupal is a PHP based free and open source Content Management System (CMS) that allows organizing, managing and publishing your content. It is based on php environment. This is carried out under GNU i.e. General Public Licence, that means anyone can download and share it to others. This tutorial will teach you the basics of Drupal using which you can create websites with ease.

Types of sites that Drupal can be used for includdrupal_branding_2012e:

personal or corporate Web sites
social networking sites
resource directories
e-commerce sites

What You Need?

A dedication to learn

Commit to learn Drupal. Just giving one or two hours a day will get you ahead long in future. You won’t be skilled if Drupal said to be a CMS to play around in your leisure time. If you are really interested in Drupal , and want to work as a developer, or as a Drupal developer, making a commitment to work and to educate yourself on a daily basis is never under rated.

Prior coding skills?

You don’t have to know coding to start with Drupal. Ofcourse, if you know, you’ll get more advance than a new user without technical skills. For Drupal developers, it is required. But for a basic usage, Drupal as a CMS, you don’t need to have coding skills.


Basic Components of Net Framework 3.5

Components of .Net Framework 3.5

Before moving to the next step on .Net technology, let us see various components of the .Net framework 3.5.

Following are components of the .Net framework 3.5 and the work they perform:
1. Common Language Runtime or CLR

It performs memory management, debugging, security checking, exception handling, thread execution, code safety, code execution, verification, and compilation. The code that is directly managed by the CLR is called the managed code. After compiling the managed code, the compiler converts the source code into intermediate language (IL) code. A Just In Time(JIT) compiler converts the IL code into native/machine code, which is CPU specific.

2 .Net Framework Class Library

It contains a library collection of reusable types. classes, interfaces, structures, and enumerated values, which are in group called types.

3. Common Language Specification

It contains the specifications for .Net supported languages and implementation of language integration.

4. Common Type System

It provides general rules for declaring, using, and managing types at run-time, and cross-language transmission.

5. Metadata and Assemblies

Metadata is the binary information which describes the program, which is either placed in a executable file (PE) or in the memory. Assembly is a logical unit consisting of the assembly manifest, IL code, type metadata and a set of resources like image files.

6. Windows Forms

Windows Forms contains the graphical presentation of any window displayed in the application.


ASP.NET is the web development model and AJAX is an extended part of ASP.NET for developing and implementing AJAX functionality. ASP.NET AJAX provide the components that allows the developer to update data on a website without completely reloading the page.


It is the technology used for manipulating with data and databases. It provides access to information sources like SQL server, XML, OLE DB, etc. The ADO.NET technology connects to database for retrieving, manipulating, and updating data.

9. Windows Workflow Foundation (WF)

It assists in building work-flow-based applications in desktop environment. It haves workflow run time, activities, work-flow designer, and a rules engine.

10.Windows Presentation Foundation

It provides a partition between and the business logic and the user interface. It helps in developing visually stunning interfaces using media, two and three dimensional graphics, documents, animations, and more.

11. Windows Communication Foundation (WCF)

It is the technology used for setting-up and executing connected systems.

12. Windows CardSpace

It provides safety for accessing resources and sharing private information on the network.

13. LINQ

It imparts data querying capabilities to .Net languages using a syntax which is equivalent to the tradition SQL query language.



Begin With ASP.NET

ASP.NET Overview

ASP.NET is a development framework used for building web pages and web sites with HTML, CSS, JavaScript and server script.

ASP.NET supports 3 different development models:

Web Pages, MVC (Model View Controller), and Web Forms:



Before we start with this tutorial, you should have a some knowledge of .NET programming language. It will be good if you have an understanding of different internet technologies such as HTML, CSS, AJAX. etc, As we are going to develop web-based applications using ASP.NET web application framework.


XML Syntax


  • If  document contains a XML declaration then it must be first statement of the document.
  • XML declaration is case – sensitive, where document begins with <?xml>. “xml” is in lower case.
  • An HTTP protocol can override the value of encoding that you put in the XML declaration.

<?xml version="1.0" encoding="UTF-8"?>



Element Syntax: every XML-element must be closed either with begin or with finish components as shown below:


or just by this technique:


Nested elements: An XML element can contain other XML- elements as its child, but the children elements must not overlap it parent element. i.e., an end tag of an element must have the same tag name as that of the most recent unmatched start tag.

example for incorrect nested tags:

<?xml version="1.0"?>
<name>syntax definition

example for correct nested tags:

<?xml version="1.0"?>
<name>syntax definition

Root element: An XML document must have and can have only one root element. For example, following example is not a correct XML document, because both the a and b elements occur at the top level without a root element:


The correct form of XML document is:




Case sensitivity: The tag names of XML-elements are case-sensitive. This means that the name of the starting and the ending elements should be exactly in the same case.

For example <Syntax> is different from <syntax>.