Venkat's Planet

Navigation Links Place an Imporatant role in crwaling the whole website. So for developers there are many ways in Navigationg the control from one page to another page. Here we discuss, how the navigation is done in different languages. JavaScript : Window.Location="home.php"; Php: Header("Location:home.php"); Html: <a href="home.php"> Home </a> Jquery: $(window).attr("location","home.php"); In the above examples, The control is transfered from current page to the "home.php" page

Html5 has lot of advantages. This HTML made the easy for the web designers. While designing a Website, in any situation you may come across to store the data. The data needs to be accessed in many pages. For this problem the solution is WebStorage concept in the HTML5. There are two kinds of storages, They are     1.  LocalStorage     2.  SessionStorage LocalStorage :  Here the data is stored for ever. There is no time limit for variable to expire.      Eg.    localStorage.id="abc";     Here in this example.                 "id"  is the variable. "abc" is the value. This says that the value "abc" is stored in the variable "id".         To use this variable in the other page Just use the statement.                alert("localStorage.id");  SessionStorage:  Here the data is stored only for ...

There may be a situation where you are bored of seeing the whole regular fonts in the css. So there is also possibiltiy to add some new fonts in the css as new Font-Family. @font-face { font-family: myFont; src: url(yourDesiredFont.ttf); } This is the css style you need to add in css. Here the source(src) is the font you want to use... you can use any kind of font, search in google for different kind of fonts. When you refer the font-family for the next time you can directly refer to this new font you have added. Usage h1 { font-family: myFont;         font-size:24px; }

Media queries plays an important role in Responsive Design. So in that situation the Meta-tag is the one which is most imporatant, <meta name="viewport" content="width=device-width, initial-scale=1.0"> Here      Device-width == Content to scale the full width of the device.      initial-scale  == the Zoom value to view the webpage      if the value of initial-scale= 1.0. This is the unscsaled document.      if you write user-scalable= "no".  Then it disables the zoom.               

There are Media Queries which help in making the website responsive. Here are some tips which will make easier to Understand the Media Queries to various devices Large Desktops : Layout Width will be from 1200px and Up               @media (min-width:1200px){                }   2.   Default : The Layout width will be from 980px and up   3.    Portrait Tablets : The Layout width will be from 768px and Above              @media (min-width:768px) and (max-width: 978px){               }   4.   Phones to Tablets: The Layout width will be from 767px and below             @media (max-width:767px){              }   5.   Phones :  The Layout width will be from 480px and below     ...