Thursday 12 November 2015

Computer Security Tips

Keeping your computer from harm's way is important for any individual. Even for any private computers or public computers, you need to make sure that your contents are away from other people's hands. I cannot blame everyone, because no one is the same. If someone get hold of your contents somehow, some will not use them and delete them forever whereas on the other hand some may use it corrupt your life, blackmail you or even ruin you completely. But as I said, no one is the same. Some may do it, where some may not. So it's your job to make sure that those may not get into other's hands.

Keeping a computer safe doesn't mean only from other people, but also from electrical damages and failures. Keeping a computer healthy is a lot of work and if you care about your works, I think it's best to take that time and keep the computer in good shape.

Here are some tips that you can use to secure your PC.

01. Lock your PC
You may think that no one is going to check your PC, but you are wrong. Some may look into your files without you knowing. Maybe a person in competition at work may look into your works if you leave your work unattended and that may enable him to know everything about your project and may make a copied version before you implement yours. So it is best to lock your PC, even it is only yours. That ensures that no one can look into your file, unless he or she knows the trick to break the password. But most people don't bother that much, so locking a PC can help you in lot a way.

02. Prevent Virus Attacks
After you buy a computer, you might want to secure it from future attacks. It may come in the form of a virus, phishing, or a hack. These may lead you to a serious trouble. So it better to be aware of them and secure it before getting affected. A virus or other types of worms such as malwares, adwares and trojans are problem for your computer and for yourself. A virus, or a worm or a trojan are actually computer programs that are written to do a specific task. They can really do some serious problems. These programs enter into our computer through networks mainly the internet, or from a disk drive or USB that has been connected to a virus attacked system. These programs are always in the move. They go from one place to another. They infest one computer after another. In fact, these programs may not be detected at first. But when they trigger and perform the task that it was meant to do, then we find that our PC is being affected. So it's best to prevent them rather and allowing them to enter our PC. Anti-viruses are programs that detect virus code and deletes them. So it's best to have an anti-virus in all computers.

03. Prevent Malware and Adwares
Malwares and adwares are created to extract our information in an illegal way. I advice not to go into fake adverstisement for they may steal your private information and use them to access your property. So it's better to register or use products or websites in which we can actually believe in. Use the latest versions of browsers such as Google Chrome, Firefox and Opera since they provide with better protection and security. These provide you with security that double-checks URL and notify you if it is a malware site.

04. Backup your Data
No one can actually say when they will be infected. So it's best to backup all your important to just-so-important files and folders for if you lost them, then that means all that you have done or got was all just a waste. This may be your important files at work or your photos of your dear ones or your family, friends or anybosy you're close with. Losing it means breaking off a large part of your life. Losing your work can cost you your job. So it's best to backup all your files before you lose them. You can back up to another external har drive or you can just upload all your backups to online storage space like Google Drive or Dropbox and other services which provides security so that you can believe in them.

05. Shutdown during Lightning
Securing your computer from vicious programs is not just enough. Yes, they may be a lot of problem. But you have to secure your device from everything around you such as rain or lighning. Just some amount of rain can short circuit your computer and damage it. It may lead to exploding of your system and that may be the end of your system. Be careful while taking your laptops out of home. Use a water repellent cover for it, so that it may not get wet. Rains can be really a problem, not only for laptops but for any computerised devices such as the mobiles phones. Even mobile phones, exposed to rain can get damaged. So be warned to take an umbrella everytime you go out. 

Sunday 17 May 2015

Speed Up your Internet

Tired of using the same slow internet? Do you get bored when you wait for the browser to show the webpages? Yeah, I know, you are BORED or on the other hand IRRITATED. Today, in this technological age, when you are using a internet connection that has much lower speed and also may sometimes disconnects are more than irritating for everyone.

Yeah, for everyone. Some may not know, because they are fond of using speed internet connections. But keep them in front of a computer with slow connection. I am sure that they may throw the PC or Laptop in anger or he/she is an angel and have the patience to wait. But about 3/4th of the world doesn't have the patience. They want speed internet in their hands. Internet without disconnection, and user friendly.

For that you may need to get a more priced internet connection. But I have some tips to speed up your internet connection that you are using now. Well, for a matter of fact, I only know that some of this will work, but there is no harm in trying, Is there?

01. Contact your Internet Service Provider
This is actually one of the best way to know why our internet connection is slow. Maybe, there is a breakage of a wire or over-traffic in the cable. So before doing anything, contact your service provider and ensure why your internet connection is slow. If it is the problem of the service, they will surely try to correct the problem because customers are the valuable asset of the service provides. Without you all, no company can grow.

You may be staying far off from the providers and as farther you go, that much slow the connection becomes. So if you call and tell the providers your problem, they can amplify the power and you can have fast internet connection.

02. Optimize your Browser
You may not know that all browsers are not the same. Each browser has it's own functionalities and functionalities. So it is best to see the performance of most browser before standing onto one. There are some people that still use Internet Explorer because they don't know about most browsers. They may get slow internet connection and may sometime complain the providers. Complaining about anything doesn't prove anything. Change the browser to what we are comfortable with and that will provide us with the best options.

Browsers like Google Chrome, Mozilla Firefox  and Opera have better functionalities than most of the others. They do have better features and that enable us to use the internet to its best configuration. But you can check the other browser and check with what you are most comfortable to use. Google Chrome use only a small memory and can be used in sites having JavaScript of Flash files and Mozilla Firefox has many features like blocking JavaScript files or advertisements and Opera has compression technology especially for slow connections

03. Optimize your Device
If you are using a modem, you can optimize it to the best settings allowing you to use more efficient and better internet connection. Changing your settings can sometimes lead to damage or change to your network. So I advice you to ask the help of those who actually know how to change the settings. Don't try it for yourself, if you don't know. It may lead to damage and you may not get any network after that. If you want to learn how, be in the supervision of one who knows about it.

If you are using a router, you can also optimize it to the best setting. You can also place it to the place where you get more coverage and also keep in mind that there should be a direct connection between your PC and the router. Also avoid interference from other wireless devices. in fact keep them a little distance away from the path between the router and computer so that it may not interfere with the network passage.

You can also optimize your Internet service package to better options. You can upgrade to the better package. Buy the one in which you are comfortable with and gives you more access. Don't buy anything that have no range near your home. You can also do a speed test to know how much network you are getting. If it slow, try it on another computer and if it is slow on that computer also, contact the ISP or if it not, configure you PC to the best standards.

04. Prevent Illegal Access
If you are using a wireless connection, make sure that no one is stealing from it. When someone else or many people share a single connection, the speed of the internet can get a lot more slow. Maybe you think that it is the problem of the network. But always be in mind to check that no one has cracked the code and is accessing it without you knowing.

The more people that shares your connection, the more slow it gets. Maybe you just gave it to only one of your friends thinking that he/she will only access it for a limited period of time. But once he/she gets the password, they may share it with their friends which in turn may share to other people. You may only think that only your friend knows the password, but in turn, now the whole neighbourhood knows it. So it's best to find out the statistics of who all are using your wireless connections. And furthermore, be sure to add a WEP password to stop unauthorised users from using your Internet connection or if you can, set up WPA encryption.

05. Check the Bandwidth Usage
There are many application that may use your bandwidth. These may be the program updates or other web applications. These may all run in the background without you knowing. Some of them, may also be assigned to do automatically when the system turns on. So these application may use up all or some of the network in which you have.

So it is best to find out what all applications are running in the background and turn off all which are of no use to you at that time. Sometimes plug-ins in your browser can also take up more bandwidth and memory. So I advice not to put a lot more plug-ins or add-ons in your browser. Keep only that you require and delete all the other. Even it is enabled or not. The plug-ins needs to be loaded and that may take up some of your speed allowing you only a little of the network you actually have.

I also advice you to close the tabs in which you are not looking. Even if you don't do anything, the page is automatically refreshing as new content is published at all times. So that pages even if you are not using consumes a part of your network. So it is best to close the tabs which are not lloking at the time.

06. Scan your PC
Virus attack can also affect your computer which in turn affects your network. Virus are programs that are designed to damage or steal data inside a computer. You may not know whether it is inside the computer, until it is executed. So when it is activated, it may do the work it is supposed to leading to the damage to all your work, morever your programs.

So it is best to prevent viruses and trojans from entering the PC. Install good antivirus and scan your PC at all possible time (at least once a month) and that may find all the virus inside your PC and also prevent other virus, malware or spywares from entering the PC throught the internet connection. As it is said - "Prevention is better than Cure".

07. Take Good Care of your PC
Sometimes, slow internet means not a good PC. Speed and memory of your PC can also affect your network connection. From time to time, browsers and other web applications are updating and they require more and more menory and processing. So dealing with an old computer, this may lead to slow network and even slower computer. So it is best to upgrade our PC first before implementing the network on our computer.

Sometimes it may also be slow on new computers due to over memory usage. People may put a lot of programs at a time such as playing games, listening music, browsing and chatting, working on a photo or audio or video and all at the same time. This leads to over usage of our memory. Our RAM and CPU are just a chip and tha may really get heated up due to over usage. So it is best to close some of the programs and allow the memory to be processed at an equal rate, so that we can use the PC efficiently.

Sometime you may also need to defragment and cleanup your PC, to remove junk files and clean up for better and efficient PC. Uninstall unused programs and check the free space of your hard drive. A full hard drive will slow your computer. You should also turn off the computer when not in use. Give the computer time to rest, so that it will function better.

Monday 4 May 2015

Protect Files & Folders in Windows

Locking a folder is sometimes important for us. Maybe we have some files that we don't want others to get their hands into. Those files may be important for us or for our work and those in the wrong hand may sometime leads to a miserable life to us. But remember that there is no 100% protected folder. One way or another computer specialists can break into that, but most of them won't bother when they see that it is password protected.

So it is important to lock or hide these folders from others. here are some steps which you can use for ensuring the security of your folder.

Method 1: Create a Multiple User
You can use a user for yourself, so that no one can log in into your account. You can create a Guest account for others so that they can use the computer without using your personal documents.

  1. Go to Control Panel.
  2. Click User Accounts
  3. Select "Create a password for your account".
    1. Type in a "New password" then "Confirm New Password". You can also give a "Password Hint" so that you can remember your password.
    Method 2: Create a Password Protected Folder
    You can create a password to protect your folder. Here are the steps: 

    Note: This also may sometime leads to missing of your files. So if you are a beginner. Make sure you try this out with some random files before doing with the real one, so no harm for your real data.

    1. First, you need to ensure the folder that you want to lock. If you don't have one, create one by Right Click - New - Folder . 
    2. Create a new text document by Right Click - New - Text Document. Type in the following code.
    3. cls 
      @ECHO OFF 
      title Folder Private 
      if EXIST "HTG Locker" goto UNLOCK 
      if NOT EXIST Private goto MDLOCKER 
      :CONFIRM 
      echo Are you sure you want to lock the folder(Y/N) 
      set/p "cho=>" 
      if %cho%==Y goto LOCK 
      if %cho%==y goto LOCK 
      if %cho%==n goto END 
      if %cho%==N goto END 
      echo Invalid choice. 
      goto CONFIRM 
      :LOCK 
      ren Private "HTG Locker" 
      attrib +h +s "HTG Locker" 
      echo Folder locked 
      goto End 
      :UNLOCK 
      echo Enter password to unlock folder 
      set/p "pass=>" 
      if NOT %pass%== PASSWORD_GOES_HERE goto FAIL 
      attrib -h -s "HTG Locker" 
      ren "HTG Locker" Private 
      echo Folder Unlocked successfully 
      goto End 
      :FAIL 
      echo Invalid password 
      goto end 
      :MDLOCKER 
      md Private 
      echo Private created successfully 
      goto End 
      :End
      
    4. Change the "PASSWORD_GOES_HERE" in the code and change it to your desired password.
    5. Save the text document as lock.bat (remember to save in .bat batch extension)
    6. Run the batch file by double-clicking on it and that will create a folder named Private. This is the place where you will store all you important data. Bring all your important data into the folder.
    7. Run the batch file again. This time it will ask whether you really want to lock the folder. Press "Y" and hit Enter. You can see that the folder disappears.
    8. To get the folder back. Run the batch file again and enter the password. Then the folder reappears. 
    9. This is a simple process of locking your folder. But if you forget your password and you know some basic knowledge of computer, then don't worry.
    10. Just go to the "Folder Options" and uncheck the boxes for “Show hidden files, folders, and drives” and “Hide protected operating system files”.
    11. The other step is to Right Click on the batch file and click Edit, and you can view your password in the code. So be sure to take the batch file from other's hands.
    Method 3: Encrypt your folder
    Windows come with option to protect your folder by encrypting it. Encryption means the process of encoding messages or information in such a way that only authorized parties can read it.

    Windows XP/Vista/7/8
    1. Select the file or folder that you want to encrypt. 
    2. Right Click on it and click Properties. Click the Advanced option.
    3. Check "Encrypt contents to secure data" option. You can see that the folder becomes green in colour.
    4. Click Apply and then Ok.
    5. If you want to reverse the process and decrypt the folder. Then select the folder. 
    6. Right Click on it and click Properties. Click the Advanced option.
    7. Unheck "Encrypt contents to secure data" option. 
    8. Click Apply and then Ok.
    Windows Server
    1. Select the file or folder that you want to encrypt. 
    2. Right Click on it and click Properties. Click the Advanced option.
    3. Check "Encrypt contents to secure data" option. You can see that the folder becomes green in colour.
    4. Click Apply and then Ok.
    5. If you want to reverse the process and decrypt the folder. Then select the folder. 
    6. Right Click on it and click Properties. Click the Advanced option.
    7. Unheck "Encrypt contents to secure data" option. 
    8. Click Apply and then Ok.
    9. Now click Start - Run (Windows Key + R) and type mmc. 
    10. Microsoft Management Console (MMC) Window opens.
    11. Click File - Add/Remove Snap-In - Certificates - click Add - My User Account - click Finish - click Ok.
    12. In console root, click Certificates - Current User - Personal - Certificates - Right click Administrator - All Task - Export - click Next - select Yes, export the private key - click Next - Personal Information Exchange - PKCS #12 (.PEX) - check "Include all certificates in the certification path if possible" & "Delete the private key if the export is successful" - click Next - set Password - set the location to save the key - set Key file name - click Next - click Finish - click Ok. Then the message "Export was Successful" will open.
    13. Log off the system. Log in again.
    14. Double click the key - click Next - click Next - Give Password - check "Mark the key as exportable. This will allow you to back up or transport your key at a later time" & "Include all extended properties" - click Next - click Next - click Finish. Then the message "Import was Successful" will open.
    Method 4: Password Protect Compressed Folders
    You can also compress a folder and give a password to it.
    1. Select the folder. Right click and click "Add to Archive" (if you are using Winrar). Compress the folder.
    2. Go to Advanced tab. Click on Set Password. Enter any password and for additional protection check mark 'Encrypt file names'.
    3. Click Ok.
    4. Then delete the original file.
    Method 5: Create an Invisible Folder
    If you like, you can create an invisible folder, so no one knows where your folder is. 
    1. Right click on the folder and select Rename
    2. Press Alt and type 0160 (Alt + 0160). This will create a blank space. Unlike the space, it is a valid filename.
    3. Now change the icon. Right-click on the folder. Select Properties and then select the Customize tab. Click "Change Icon" and select a blank icon. 
    4. Your folder is now hidden, but can be known when the user drags a selection box across the screen.
    Method 6: Download a Third-Party Software
    You can also download some software that allows you to password protect your folder. These help you in ensuring the safety of your folder. But like I said before, you can be 100% sure, whether your folder is safe or not. But it is the best to prepare that facing the worst. here are some name of some third-party softwares that you can use.
    1. Protected Folder
    2. Folder Lock
    3. Folder Guard
    4. Folder Password Lock
    5. Folder Protect
    6. LocK-A-FoLdeR
    7. Folder Protector
    8. Folder Lock Lite

    Friday 1 May 2015

    Bootstrap Website

    Creating a website with Bootstrap is easy and fun. If you know HTML and CSS or have a basic knowledge to code them, then you wont have much a problem to code in Bootstrap. Bootstrap used both HTML and CSS properties for designing. It commonly uses the HTML5 doctype.

    You should always remember to put the HTML5 doctype declaration and also the lang attribute at the starting of the webpage.

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    </head>
    <body>
    Body content......
    </body>
    </html>
    
    Bootstrap is mainly used to create mobile responsive web pages. The good point is that you don't have to view the same big desktop page in your mobile. You don't have always minimize and maximize anytime you want to click a link or view the text. Mobile-first styles are actually a part of the Bootstrap core framework. But in order to get proper mobile rendering you have to add the following meta code in the head section.

    <meta name="viewport" content="width=device-width, initial-scale=1">
    
    • "width=device-width" - This part sets the width of the page to follow the width of the device.
    • "initial-scale=1" - This sets the initial zoom level when the page is first loaded.
    Bootstrap also requires a container to wrap site contents. But remember that you cannot put one container inside another. There are mainly two container classes.
    • ".container" - This provides with a fixed width responsive container.
    • ".container-fluid" - This provides with a full width container spreading across the entire width of the viewport.
    Container
    For Example:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    </head>
    <body>
    <div class="container">
    <h1>My Bootstrap Webpage</h1>
    <p>I love learning Bootstrap.</p>
    </div>
    </body>
    </html>
    
    Container-Fluid
    For Example:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    </head>
    <body>
    <div class="container-fluid">
    <h1>My Bootstrap Webpage</h1>
    <p>I love learning Bootstrap.</p>
    </div>
    </body>
    </html>
    

    CSS Links

    Links are found in every document. Links are used to click their way from one page to another page. With CSS, we can style links to make them decorative and colorful.

    Styling Links

    Links can be styled with any CSS property such as color, font-family, background etc. In addition, links can be styled differently depending on what state they are in.

    The four link states are:
    • a:link - a normal link, or an unvisited link
    • a:visited - a link that the user had visited
    • a:hover - a link when the user mouses over it
    • a:active - a link at the moment it is clicked
    For example:
    a:link {color:#FF0000;}
    a:visited {color:#00FF00;}
    a:hover {color:#FF00FF;}
    a:active {color:#0000FF;}
    

    Text Decoration

    The text-decoration property is mainly used to remove the underline from the links.

    For example:
    a:link {text-decoration:none;}
    a:visited {text-decoration:none;}
    a:hover {text-decoration:underline;}
    a:active {text-decoration:underline;}
    

    Background Color

    The background-color property is used to specify background color for the links.

    For example:
    a:link {background-color:#0000FF;}
    a:visited {background-color:#FF00FF;}
    a:hover {background-color:#00FF00;}
    a:active {background-color:#FF0000;}
    

    HTML Forms

    HTML Forms are used to create different kinds of user inputs.

    HTML <form> Tag

    HTML <form> tag is used create an HTML form to pass user inputs and data to the server. AN HTML form can contain input elements like text fields, checkbox, radio-buttons, submit-buttons, and more. A form can also contain select lists, textarea, fieldset, and label elements.

    The <form> elemts can contain one or more of the following elements.
    • <input>
    • <textarea>
    • <button>
    • <select>
    • <option>
    • <optgroup>
    • <fieldset>
    • <label>
    For example:
    <form action="form.asp" method="get">
    First name: <input type="text" name="fname">
    Last Name: <input type="text" name="lname">
    <input type="submit" value="Submit">
    </form>
    

    HTML <input> Tag

    The most important form element is the input element. The <input> element is used to select user information. It specifies an input field where the user can enter data. The input element can vary in different ways, depending on the type attribute. It can be of text types, checkbox, password, radio button, submit button and more.

    Text Fields
    The text fields are used to create a one-line input field to enter text into.

    For example:
    <form>
    First name: <input type="text" name="fname">
    Last Name: <input type="text" name="lname">
    </form>
    
    Password Field
    The password field are used to create a one-line input field to enter the password. The characters inside the password field are masked that is, it will be shown as asterisks or circles.

    For example:
    <form>
    Password: <input type="password" name="pwd">
    </form>
    
    Radio Button
    The radio buttons are used to create a radio button which allows the user to select only one of a limited number of choices.

    For example:
    <form>
    <input type="radio" name="sex" value="male">Male
    <input type="radio" name="sex" value="female">Female
    </form>
    
    Checkboxes
    The checkbox are used to create checkboxes that allows the user to select multiple number of options of a limited number of choices.

    For example:
    <form>
    <input type="checkbox" name="web" value="HTML">Hyper Text Markup Language
    <input type="checkbox" name="web" value="CSS">Cascading Style Sheets
    </form>
    
    Submit Button
    A submit button is used to send form data into the server. The data is sent to the page specified in the form's action attribute. The file defined in the action attribute does some action the data it receives.

    For example:
    <form>
    First name: <input type="text" name="fname">
    Last Name: <input type="text" name="lname">
    <input type="submit" value="Submit">
    </form>
    

    HTML <textarea> Tag

    The <textarea> tag is used to define a multi-line text input control. A text area can hold an unlimited number of characters, and the text is rendered in a fixed-width font. The size of the textarea can be specified by the cols and rows attributes, or using CSS height and width properties.

    For example:
    <textarea rows="4" cols="20">
    The <textarea> tag is used  to define a multi-line text input control.
     The size of the textarea can be specified by the cols and rows attributes 
     or using CSS height and width properties.
    <textarea>
    

    HTML <label> Tag

    The <label> tag defines a label for an <input> element. The <label> tag does not render as anything special for the user. However, it provide a usability improvement for mouse users, because if the user clicks on the text within the <label> element, it toggles the control.

    For example:
    <form>
    <label for="male">Male</label>
    <input type="radio" name="sex" id="male" value="male">
    <label for="female">Female</label>
    <input type="radio" name="sex" id="female" value="female">
    </form>
    

    HTML <fieldset> Tag

    The <fieldset> tag is used to group related elements in a form. It draws a box around the related elements.

    For example:
    <form>
    <fieldset>
    <legend>Personalia:</legend>
    Name: <input type="text" size="30">
    Email: <input type="text" size="30">
    </fieldset>
    </form>
    

    HTML <legend> Tag

    The <legend> tag is used to specify a caption for the fieldset element.

    For example:
    <form>
    <fieldset>
    <legend>Personalia:</legend>
    Name: <input type="text" size="30">
    Email: <input type="text" size="30">
    </fieldset>
    </form>
    

    HTML <select> Tag

    The <select> tag is used to create a drop-down list.

    For example:
    <select>
    <option value="HTML">HTML</option>
    <option value="CSS">CSS</option>
    <option value="JavaScript">JavaScript</option>
    <option value="jQuery">jQuery</option>
    </select>
    

    HTML <optgroup> Tag

    The <optgroup> tag is used to group related options in a drop-down list. It is used when you have a long list of options, and it helps to group realted options, ehich is easier to handle for a user.

    For example:
    <select>
    <optgroup label="Designing">
    <option value="HTML">HTML</option>
    <option value="CSS">CSS</option>
    </optgroup>
    <optgroup label="Scripting">
    <option value="JavaScript">JavaScript</option>
    <option value="jQuery">jQuery</option>
    </optgroup>
    </select>
    

    HTML <option> Tag

    The <option> tag is used to define a option in a drop-down list.

    For example:
    <select>
    <option value="HTML">HTML</option>
    <option value="CSS">CSS</option>
    <option value="JavaScript">JavaScript</option>
    <option value="jQuery">jQuery</option>
    </select>
    

    HTML <button> Tag

    The <button> tag is used to create a clickable button. Inside the button element, we can put contents like text or images.

    For example:
    <button type="button">Click Me!</button>
    

    HTML5 <datalist> Tag

    The <datalist> tag is used to specify a list of pre-defined options for an input element. The datalist element is used to provide an autocomplete feature on input element. Users can see a drop-down list of pre-defined options as they input data.

    For example:
    <input list="browsers">
    <datalist id="browsers">
    <option value="Google Chrome">
    <option value="Mozilla Firefox">
    <option value="Safari">
    </datalist>
    

    HTML5 <keygen> tag

    The <keygen> tag specifies a key-pair genator field used for forms. When the form is submitted, the private key is stored locally, and the public key is sent to the server.

    For example:
    <form action="form.asp" method="get">
    Username: <input type="text" name="username">
    Encryption: <keygen name="security">
    <input type="submit" value="Submit">
    </form>
    

    HTML5 <output> tag

    The <output> tag represents the result of a calculation.

    For example:
    <form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
    <input type="range" id="a" value="50">100
    +<input type="number" id="b" value="50">
    =<output name="x" for="a b"></output>
    </form>
    

    Thursday 30 April 2015

    Mouse Tips All Should Know In Windows

    Mouse Tips All Should Know
    Mouse is an important device for computer users. Some may not think about that, but guess a computer with no mouse and you to use the keyboard everytime you want to click something, maybe an icon or a pageo r anything else. Now did you find the use of mouse. In fact, mouse is one of most important input device apart from keyboard. That is why, when you buy a computer system, keyboards as well as mouse is also given becuase these are the basic input device for your sysytem.

    Mouse is a device which coordinates using the x-axis and y-axis. Here are some mouse tips so that you can use the full potential of a mouse in time of need.

    Left Mouse Buttton
    The left mouse button is the one that we commonly use. It is used to open a folder, file or link.

    Right Mouse Button
    The right mouse button is used to open the property menu for the file, folder, or the web.

    Move Text
    If you have hightlighted a text, left click and drag it to move the text to the new position. This saves time instead of cutting and pasting everytime. You can also right click and drag the text and it will open the action menu which allows you to move, copy or link the text.

    Shift Key + Mouse Click
    Press the shift key and left-click the mouse wherever you want. It is used to highlight a portion or all the text in a text editor.

    Ctrl Key + Mouse Click
    Press the ctrl key and left-click the mouse to select multiple objects or hightlight multiple text. If single click didn't do the trick, try double-clicking.

    Alt Key + Mouse Click
    Press the alt key and left-click the mouse to select the text vertically. This is useful if your content is in columns.

    Cut, Copy, Paste
    You don't have to click the cut, copy or paste icons in text editors. You just have to right click on the highlighted text and options like cut, copy, paste including undo and redo will appear.

    Links in New Tab
    Press the Ctrl key and click on a link to open the link in a new tab.

    Move & Copy
    You can also use the mouse to move or copy folders, files or other items.
    • Press the shift key and drag and drop item using the left mouse button to move the item.
    • Press the ctrl key and drag and drop item using the left mouse button to copy the item.
    • You can also drag and drop the file or folder using the right mouse button to open the action menu which allows you to copy or move create a shortcut.
    Open Command Window
    Did you know that you can open the command window using the mouse. You don't have to go the Run command and type "cmd" everytime you want to open the command window.  Press the shift key and right key on the mouse will open the option to open command window.

    Functions of Mouse Wheel
    All of you must be familiar with the mouse wheel since we all use it to scrool up and down. But there are also some other functions of the mouse.
    • The mouse wheel is not just a wheel, but also a button. It can used as the mouse's third button.
    • You can click the middle button to open a link in a new tab. Just click on the link and the link will automatically open in a new tab. 
    • You can also close the link by simply clicking the middle button on the tab.
    • Mouse wheels can also be used to scroll automatically. Just double-click on the mouse wheel, a arrow shaped cursor will come. Move the cursor to push the scroll bar to wher e you want to go.
    • Zooming can be done by using the mouse wheel. Just click the Ctrl key and scroll up to zoom in and scroll down to zoom out. This can be done in most web browsers, documents etc.
    • Click the shift key and scroll the wheel to go forward and back in most web browsers.
    Power of multiple clicks 
    You always double click to open a folder or a file or an application. But there are also some other importance in multiple clicks

    • Double click on the title bar of your window to maximize it.
    • Double click on the left hand side of your title bar to close it.
    • Double click on a text to select a whole word.
    • Double click and drag the mouse to select one word at a time.
    • Triple click on a text to select the whole paragraph.
    Mouse Side Buttons
    Now many new mouse comes with side buttons which can be programmed to do anything. By default, the left-thumb button is used to go back on web pages. This helps you since you don't have to move your cursor anytime you want to change the browser tab windows.

    Windows Snap To Feature
    If you want to save time to automatically move your mouse to buttons of dialog box, you can turn on the Windows "Snap To" feature in the control panel. 

    Move your Mouse with your Keyboard
    Instead of using the mouse, you can use the keyboard to move the mouse cursor by enabling Windows option. 

    Customize your Mouse
    At last, you can customize your mouse button configuration. You can switch primary and secondary buttons, change the speed, change the pointer, display pointer trails. Finally, if you have a mouse with more than two buttons, installing the mouse software will allow you to customize your mouse even more.

    Wednesday 29 April 2015

    jQuery Syntax

    With jQuery, we can select HTML elements and perform some actions in it.

    jQuery Syntax

    The jQuery syntax is used to select the HTML elements and perform some action in it.

    The Basic Syntax is : $(selector).action()
    • The $ sign is used to define or access jQuery
    • The (selector) is used to find or select HTML elements.
    • The action() is the jQuery action to be performed in the HTML element.
    For example:
    $("p").hide()
    

    The Document Ready Event

    The document ready event is used to prevent any jQuery code from running before the document had finished loading. It is good practice for the document to be loaded before working with it. This also allows you to place the jQuery code before the body of the document, that is in the head section.

    For example:
    $ (document).ready(function() {
       // jQuery method goes here...
    });
    

    The jQuery team has also created an even shorter method for the document ready event.

    For example:
    $ (function () {
       // jQuery method goes here...
    });
    

    Monday 27 April 2015

    HTML Tables

    Tables are used to create tabular data that is, data represented in rows and columns. HTML tables are created using the <table> tag in conjunction with the <tr> and <td> tags. Some also use table to represent web layouts.

    HTML <table> Tag

    The <table> tag is used to create a HTML table. The <table> tag is used in conjunction with the <tr>, <th> and <td> tag to create a table.

    For example:
    <table>
    <tbody>
    <tr>
    <th>HTML</th>
    <th>CSS</th>
    </tr>
    <tr>
    <td>Hyper Text Markup Language</td>
    <td>Cascading Style Sheets</td>
    </tr>
    <tr>
    <td>.html</td>
    <td>.css</td>
    </tr>
    </tbody>
    </table>
    

    HTML <tr> Tag

    The <tr> tag is used to define a table row in an HTML table. The <tr> tag contains more than one <th> and <td> tags.

    For example:
    <table>
    <tbody>
    <tr>
    <th>HTML</th>
    <th>CSS</th>
    </tr>
    <tr>
    <td>Hyper Text Markup Language</td>
    <td>Cascading Style Sheets</td>
    </tr>
    <tr>
    <td>.html</td>
    <td>.css</td>
    </tr>
    </tbody>
    </table>
    

    HTML <th> Tag

    The <th> tag is used to create a header cell in HTML tables. The header cell will be bold and centered and also left-aligned by default.

    For example:
    <table>
    <tbody>
    <tr>
    <th>HTML</th>
    <th>CSS</th>
    </tr>
    <tr>
    <td>Hyper Text Markup Language</td>
    <td>Cascading Style Sheets</td>
    </tr>
    <tr>
    <td>.html</td>
    <td>.css</td>
    </tr>
    </tbody>
    </table>
    

    HTML <td> Tag

    The <td> tag is used to create standard cells in HTML tables. This cell usually contains the data in the table.

    For example:
    <table>
    <tbody>
    <tr>
    <th>HTML</th>
    <th>CSS</th>
    </tr>
    <tr>
    <td>Hyper Text Markup Language</td>
    <td>Cascading Style Sheets</td>
    </tr>
    <tr>
    <td>.html</td>
    <td>.css</td>
    </tr>
    </tbody>
    </table>
    

    HTML <caption> Tag

    The <caption> tag is used to define a table caption. The <caption> tag is inserted just after the <table> tag. By default, the caption may be center aligned.

    For example:
    <table>
    <caption>WEB DESIGNING</caption>
    <tbody>
    <tr>
    <th>HTML</th>
    <th>CSS</th>
    </tr>
    <tr>
    <td>Hyper Text Markup Language</td>
    <td>Cascading Style Sheets</td>
    </tr>
    <tr>
    <td>.html</td>
    <td>.css</td>
    </tr>
    </tbody>
    </table>
    

    HTML <thead> Tag

    The <thead> tag is used to group the header contents in an HTML table. The <thead> tag is used in conjuction with the <tbody> and <tfoot> to specify each part of the table.

    For example:
    <table>
    <thead>
    <tr>
    <th>HTML</th>
    <th>CSS</th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <td>Hyper Text Markup Language</td>
    <td>Cascading Style Sheets</td>
    </tr>
    </tbody>
    <tfoot>
    <tr>
    <td>.html</td>
    <td>.css</td>
    </tr>
    </tfoot>
    </table>
    

    HTML <tbody> Tag

    The <tbody> tag is used to group the body contents in an HTML table. The <tbody> tag is used in conjuction with the <thead> and <tfoot> to specify each part of the table.

    For example:
    <table>
    <thead>
    <tr>
    <th>HTML</th>
    <th>CSS</th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <td>Hyper Text Markup Language</td>
    <td>Cascading Style Sheets</td>
    </tr>
    </tbody>
    <tfoot>
    <tr>
    <td>.html</td>
    <td>.css</td>
    </tr>
    </tfoot>
    </table>
    

    HTML <tfoot> Tag

    The <tfoot> tag is used to group the footer contents in an HTML table. The tag is used in conjuction with the <thead> and <tbody> to specify each part of the table.

    For example:
    <table>
    <thead>
    <tr>
    <th>HTML</th>
    <th>CSS</th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <td>Hyper Text Markup Language</td>
    <td>Cascading Style Sheets</td>
    </tr>
    </tbody>
    <tfoot>
    <tr>
    <td>.html</td>
    <td>.css</td>
    </tr>
    </tfoot>
    </table>
    

    HTML <colgroup> Tag

    The <colgroup> tag is used to specify a group of one or more columns in a table for formatting. The <colgroup> tag is useful to specify styles for an entire column rather than repeating styles for each cell, for each row.

    For example:
    <table>
    <colgroup>
    <col span="2" style="background-color: yellow;"></col
    <col style="background-color: red;"></col>
    </colgroup>
    <tbody>
    <tr>
    <th>HTML</th>
    <th>CSS</th>
    <th>JavaScript</th>
    </tr>
    <tr>
    <td>Markup Language</td>
    <td>Style Sheet Language</td>
    <td>Scripting Language</td>
    </tr>
    <tr>
    <td>.html</td>
    <td>.css</td>
    <td>.js</td>
    </tr>
    </tbody>
    </table>
    

    HTML <col> Tag

    The <col> tag is used to specify column properties for each column within a element. The <col> tag is useful to specify styles for an entire column rather than repeating styles for each cell, for each row.

    For example:
    <table>
    <colgroup>
    <col span="2" style="background-color: yellow;"></col
    <col style="background-color: red;"></col>
    </colgroup>
    <tbody>
    <tr>
    <th>HTML</th>
    <th>CSS</th>
    <th>JavaScript</th>
    </tr>
    <tr>
    <td>Markup Language</td>
    <td>Style Sheet Language</td>
    <td>Scripting Language</td>
    </tr>
    <tr>
    <td>.html</td>
    <td>.css</td>
    <td>.js</td>
    </tr>
    </tbody>
    </table>
    

    JavaScript Syntax

    Just like all programming language,in JavaScript also, the Syntax defines how to construct the language. It is the principle by which the language is constructed. The sentences of a programming language is called statements.

    JavaScript Character Set

    JavaScript uses Unicode character set. Unicode cover almost all characters, punctuations, and symbols in the world. Unicode enables processing, storage, and transport of text, independent of platform and language. Unicode can be implemented by different character set. The most commonly used encoding are UTF-8 and UTF-16. A character set contains the following:

    1. Letters: The English alphabets (A to Z and a to z)
    2. Digits: The Numerals (0 to 9)
    3. Special Characters: + - * / \ ! @ # $ % ^ & * ( ) _ - = [ ] { } | ; : " ' , . ? etc
    4. White spaces: Blank Space (Space bar), Tab, Return etc
    5. Other characters: Non-Graphic Symbols.

    JavaScript Functions

    A function is a block of code designed to perform a particular task. JavaScript statements written inside a JavaScript function, can be invoked many times as the user desires. To invoke a function means to call upon the function or asking up the code in the function which is being called to be executed.

    For example:

    function myFunction (a, b) {
     return a + b;
    }
    

    JavaScript Data Type

    JavaScript data types are the data's provided to an variable. It can be anything like number, characters, text string, arrays, objects, and much more. A programming language like JavaScript has to deal with all kinds of data. Data types are defined to differentiate the nature and size of incoming data. JavaScript is flexible enough to allow user to define data types therefore increasing its demand in the programming world.

    For example:

    var number = 10;
    var name = "Edwin";
    var language = ["HTML","CSS","JavaScript","jQuery"]
    

    JavaScript Keywords

    A JavaScript statement always starts with a keyword. The words that convey a specific meaning to the language compilers are called keywords. These are also known as reserved words as they are reserved by the language for special purpose and cannot be redefined for any other purpose.

    abstract else instanceof super
    boolean enum int switch
    break export interface synchronized
    byte extends let this
    case false long throw
    catch final native throws
    char finally new transient
    class float null true
    const for package try
    continue function private typeof
    debugger goto protected var
    default if public void
    delete implements return volatile
    do import short while
    double in static with

    For example:

    var x = 5 + 6;
    var y = a * b;
    

    JavaScript Identifiers

    All programming languages must identify variables, functions, and objects with unique name. These unique names are called identifiers. Identifiers are the user defines words that are used to name different program elements such as memory locations, functions, statements, objects, classes etc. These are the fundamental building blocks of the program. The identifiers of memory locations are called variables; of functions are called function names; of statements are called labels and so on.

    JavaScript Literals

    Literals are tokens that represent data items that never change their value during the program run. They are often referred to as constants. In programming language, literals are constants. Number literals can be written with or without decimal points, and wit or without scientific notations. String literals can be written with double or single quotes.

    For example:

    3.14
    1001
    123e5
    "Edwin Ronald Lambert"
    'Edwin Ronald Lambert'
    

    JavaScript Operators

    Data processing is a sequence of operations. Operators are predefined symbols that can carry out operations. Operators are the token that triggers some kind of operations on the data. The data on which the operations are carried out are called operands. The operands may be either a constant or a variable. Generally operators perform the operations and return some results.

    For example:

    x = 5;
    y = 6;
    z = x + y;
    

    JavaScript Statements

    JavaScript statements are commands to the browser. It tells the browser what function it has to do. JavaScript ignores spaces, tabs and newlines that appears in a JavaScript program. Because of that, it allows you to format and indent the program in a neat and consistent way that make the code easy to read and understand. Semicolon separates the JavaScript statements. Therefore we add semicolon at the end of each executable statements.

    For example:

    x = 5 + 6;
    y = x * 10;
    

    JavaScript Variables

    In JavaScript, variables are the named memory locations capable of storing constants or data. in fact, variables are containers for storing informations or data. A variable can be defined in any data type. The size and nature of data stored in a variable depends on the data type , it is declared. The equal sign assigns a value to a named variable.

    For example:

    x = 5;
    y = 6;
    z = x + y;
    

    JavaScript Comments

    JavaScript comments are used to explain the code and make the code more readable. It can also be used to prevent execution during testing alternative codes.

    For example:

    //This is a single line comment. I will not be executed.
    
    /*
    This is a double line comment.
    I will not be executed.
    */
    

    Sunday 26 April 2015

    What is Blogging?

    What is Blogging
    A blog is discussion site where one writes about an event, topic or even his daily life to the public published by the World Wide Web. The process of creating and writing in a blog is called blogging. It is an informative and fun thing to do. Anybody who has the knowledge to write, even from small children can write a blog. It is a free, inexpensive to enhance your reach to the public.

    Websites have their time. It has cool designs and is still the main part of the web. But blogging is not website. It is completely different and also on the other hand similar to the web. You don't have to learn all computer languages for blogging. Just plain English (or any other language) and if you want you can also know the basic HTML, CSS code also. That may sometimes help you in the arrangement also.

    There are many important things in blogging such as:
    • Boost Search Engine Optimization: The web is looking for new and fresh contents. Nobody wants to see the viewed things again and again. They want new details, information, fun and the best way to provide these to them is by blogging. It is free of cost. So we can write our heart content in our own language. You can write the content in your own words. Make it fun and more people will read it. People are looking for new things, so it's our job to give it to them.
    • Establish your Business: If you are trying to get your product to the world, then blogging is a path way for that. By blogging, you can define your products so that more people would see. That is why, most websites have Blog page in their menu bar. So even if your business is small, you can reach more people by giving more enhance and informative detail about your product and services which may convince the people to try out these services. At first, this may a bit slow, but if you put in your blood and sweat for this, you may ultimately find a better customer rate for your product.
    • Develop Relation with Customers: By blogging, it allows you to connect with more people especially your site visitors. Most people don't want to see all those cool pictures of products or the website design. They wanted to know about the product, not only see it. They have so many questions to which we have to give the answers. So blogging is a way to give them what they want. By blogging, it helps you to promote your product and also establish a healthy relation with the customer who may sometimes share it to their friends.
    • Connect People to your Product: Blogging allows people to see your personal side apart from all the marketing techniques. This allows people to connect and see the standards, vision and personality of your business.
    • Get Shared: Connecting with more people may help your business because if the people see that your product is of importance, they may share this to the friends, family and more likely to the public. This brings in new visitors and then again new visitors. When the share this to social media sites, this allows more people to know about our site.
    • Drive Traffic to Website: If more people view your blog, then they are surely likely to visit your site as well. Some of them may stay and may get interested in your products. So blogging is one way to get more people to join the community and help you rise in business.
    So as you have guessed, blogging is good. It is really good for you if you have a small site or business. But remember, people don't come to your blog if you are giving the same old subjects that everyone else provides. You have to be creative. New ideas and new innovations are what people are looking for. This may help you to raise your business, get creative and know better writing also. Write your contents in your language. Yeah, you can search the web if you have doubts, but don't write like them. Be Creative!

    There are many platforms through which you can let the world know. It is up to you to select which one to choose. Every platform has their own features. So don't worry, if one is good than the other and other is good then this one. Even if you choose any platform, it is you who does the work. So don't worry of choosing your platform. Get the one with which you are comfortable.

    JavaScript Statements

    WebLearn Tech

    A JavaScript consist of statements that are placed inside the <script> and </script> HTML tags. The <script> tag tells the browser that everything inside the tag is a script. In HTML, JavaScript is a sequence of statements that can be executed by a web browser.

    JavaScript Statements

    JavaScript statements are commands to the browser. It tells the browser what function it has to do. JavaScript ignores spaces, tabs and newlines that appears in a JavaScript program. Because of that, it allows you to format and indent the program in a neat and consistent way that make the code easy to read and understand. Semicolon separates the JavaScript statements. Therefore we add semicolon at the end of each executable statements.

    JavaScript Code

    JavaScript code is a sequence of JavaScript statements. Each statement is executed by the browser in the sequence they are written. JavaScript code can be grouped together in blocks. A block starts with the left curly bracket and ends with the right curly bracket. The purpose of the block is to make the sequence of the statement execute together. You can break up the code using a backslash within the text string.

    For example:

    <!DOCTYPE html>
    <html>
    <body>
    
    <h1>My Web Page</h1>
    <p id="myPar">This is a paragraph</p>
    <div id="myDiv">This is a Div</div>
    <p><button type="button" onclick="myFunction()">Try it</button></p>
    
    <script>
    function myFunction()
    {
    document.getElementById("myPar").innerHTML="Hello World!";
    document.getElementById("myDiv").innerHTML="How are you?";
    }
    </script>
    
    </body>
    </html>
    

    JavaScript Identifiers

    All programming languages must identify keyords, variables, methods, properties and labels with unique names. In JavaSript, these unique names are called identifiers. In JavaScript, these identifiers should begin with a letter, or an underscore (_) or a dollar sign ($). The other characters can be letters, digits, underscore or dollar sign. Some JavaScript identifiers are reserved as keywords and cannot be used as identifiers in a script.

    JavaScript is case Sensitive

    JavaScript is Case Sensitive. All identifiers, keywords, variables, methods, properties, and functions are case sensitive. A variable named myVariable is different from MyVariable, also the function getElementById is different from getElementbyID.

    Resolve Windows Automatic Rebooting

    Resolve Windows Automatic Rebooting
    Sometimes after a system failure or a system crash you may find that the windows OS keeps rebooting on and on. The system may open only up to the windows loading and then reboots. Yes, it is a problem happened to most PC in the world. You may sometimes worry about this or may get irritated. You may also try out all that you can to bring this back to normal. Sometimes you can or on the other hand, sometimes you cannot.

    Some of the things that lead to this problem are:

    • May be you clicked on the power switch to shut down fast. This saves time, but destroys the life of your computer. Because, one, by doing this you may corrupt the hard disk. The Hard disk as all of you is a magnetic device, so it needs time to save all the files correctly. That is why, it takes time to shut down when you click the Turn off button because the computer is saving the files and correcting all the work it had done. So if we shut down by clicking the power switch, we may risk losing the hard disk because the hard disk suddenly stops while working which may lead to system failure. So don't ever switch off like that. And all of you should use UPS also, because sudden power cuts can sometimes lead to hard disk damage. 
    • Check your power supply. This problem may also arise due to dying power supply. Try checking your power supply whether it is in good condition and it still doesn't tell you; check the system with a spare one.
    • It may be also due to the computer temperature. Always have in mind to have fans, heat sink or air compressor in your CPU cabinet. Make sure that these components work perfectly. Increase in work load means increase in production of heat, which may damage your processor. Keep your processor safe. Without your CPU, your computer is just like running dead. You need a processor for the smooth working of your PC. So keep in mind to keep safe of your CPU.
    • Protect your cabinet from dust. Sometimes dust can also lead to damage in motherboard components. So it is better to clean your cabinet once in a while. Keep in mind to switch off your PC completely while cleaning. We do not want any damage to ourselves also. Right! 
    Don't worry if your computer keeps on rebooting. You have many options to try out. First check all the system components. 

    Method 1:
    If you are using Windows 7 keep in mind that the problem is set by default to automatically restart the operating system after a system failure.

    To avoid system reboot in the future, you have to cancel automatic reboot. Click Start - Computer - right click on Properties and click on Advanced System Settings.
     Resolve Windows Automatic Rebooting
    In the advanced option, click Settings on Startup and Recovery.
    Resolve Windows Automatic Rebooting

    In the startup and recovery settings, uncheck the Automatically restart for system failure and click Ok.
    Resolve Windows Automatic Rebooting

    Method 2:

    Here are some of the things to check while system rebooting.

    • Check all your components are correct. No lose wire or something like that.
    • Check you're HDD, RAM, power supply and other drives. Also your fans and heat sink.
    • Remove the HDD and try to boot it from a bootable DVD.
    • If you have a graphics card, remove it and try to connect the monitor to the onboard video chipset.
    • Check the CPU temperature in BIOS.
    • Check whether your CPU voltage is high enough to power up the system.
    • It may be due to a system virus, try to get rid of it.
    • Do a system repair by clicking the F8 button on restart. On the Advanced Boot Options screen, use the arrow keys to highlight Repair your computer, and then press Enter. Select a keyboard layout, and then click Next. On the System Recovery Options menu, click a tool to open it.
    • Insert the Windows installation disc or a system repair disc and try to repair it.
    • Troubleshoot your computer in safe mode. 
    • If your problem doesn't end, try formatting and reinstalling the windows OS once more.
    Hope you liked this post. If you have more ideas, feel free to comment them and let the people who are in trouble know the solutions.

    Saturday 25 April 2015

    Keyboard Shortcuts All Should Know In Windows

    Keyboard Shortcuts All Should Know
    Keyboard is an essential part of our life. Not only for computer professionals, but also to small kids onwards, we need keyboards to type in the data to the computer. In fact, keyboard is one of those devices which have reduced time management. So keyboards are a friend to anybody who uses computer, which may be everyone in today's world.

    Using keyboard we can many things such as type in text, play video games, etc. As all of you know, keyboards are the evolved form of typewriters which were used to write documents in olden times. Well, keyboard is also used in writing, but has many functionality.

    So you all use keyboards, so it important to know some of the shortcuts of your computer. I am using a Windows PC, so I am posting only Windows shortcuts. Sorry! Mac users, no hard feelings. It's just that I have come in contact with Windows more. Using shortcuts is really helpful in certain times. Instead of using the mouse dragging the text over and over again. It is best to use keyboard shortcuts sometimes.

    Here is a list of some of the important keyboard shortcuts that all of you should memorize.

    Ctrl + X or Shift + Delete
    Press the control key and X or shift key and delete key on the keyboard to cut the selected text or selected item.

    Ctrl + C or Ctrl + Insert
    Press the control key and X or control key and Insert key to copy the selected text or selected item.

    Ctrl + V or Shift + Insert
    Press the control key and V or shift key and Insert key to paste the selected text or selected item that we had cut or copied.

    Ctrl + A
    Press the control key and A to select all text or items present in the program or device.

    Ctrl + Z
    Press the control key and Z to undo any change that we had just implemented.

    Ctrl + Y
    Press the control key and Y to redo the change that we had just undo-ed.

    Ctrl + S
    Press the control key and S to save the document or other file in any program. This can be used anytime when you are doing something important.

    Ctrl + N
    Press the control key and N to open a new bank document in the current program.

    Ctrl + O
    Press the control key and O to open a file within the current program.

    Ctrl + P
    Press the control key and P to print the document which is opened right now.

    Ctrl + F
    Press the control key and F to open the find option in any program.

    Alt + Tab
    Press the alt key and tab key to switch between open programs moving forward. Press Shift key along with these two to move backwards.

    If you are Windows Vista or & or higher, you can use the Windows key and tab key to switch your programs in full screenshot mode.

    Ctrl + Tab
    Press the control key and tab key to switch between the tabs of a programs moving forward. Press Shift key along with these two to move backwards.

    Windows Key + D
    Press the windows key and D to minimize all open programs and show the desktop.

    Windows Key + Down Arrow & Windows Key + Up Arrow
    Press the windows key and down arrow to minimize the program. First it comes to its "normal state"; then press the down arrow again to minimize it completely.

    Press the windows key and up arrow to maximize the program from its normal state.

    Windows Key + Left Key or Right Key
    Press the windows key and left or right key to slide your program to the left side or the right side of your window.

    Ctrl + Shift + Escape or Ctrl + Alt + Delete
    Press the control key along with shift key and escape to bring the task manager up front with any intermediate step.

    Press the control key along with alt key and delete key to bring the task manager in Windows XP, whereas we have to choose the task manager in Windows Vista, 7 and higher versions.

    Ctrl + Escape
    Press the control key and escape key to open the start menu. It is an alternate way of using the windows key.

    Windows Key + L
    Press the windows key and L to lock your PC and it immediately displays the login screen.

    Windows Key + P
    Press the windows key and P to switch setting if you are giving a presentation or using multiple monitors.

    Windows Key + Plus sign or Minus sign
    Press the windows key and plus sign or minus sign to zoom in or zoom out.

    Ctrl + Backspace
    Press the control key and backspace key to delete a full word instead of a single letter.

    Ctrl + Left Key or Right Key
    Press the control key and left or right key to move the cursor one word at a time instead of one character.

    Ctrl + Shift + Left key or Right key
    Press the control key and shift key along with left or right key to highlight one word at a time. Press the shift key and down to select one line instead of one word.

    Shift + Home key or End key
    Press the shift key and home or end key to highlight the line in which the cursor is instead or selecting one word or a character at a time.

    Ctrl + Home key or End key
    Press the control key and home or end key to bring the cursor to beginning or to the end of the document.

    Page Up, Page Down
    Press the page up key to move up one page at a time. Press the page down key to move down one page a time.

    Press the space key also to move down one page at a time.

    Alt + Enter
    Press the alt key and enter key to open the properties of selected item.

    Alt + F4
    Press the alt key and F4 to close the current program.

    F1 to F12 (Function Keys)
    F1: Used as help key for Windows and also for most programs.
    F2: Used to rename files and folders
    F3: Opens the search feature for Windows and most programs.
    F4: Opens find window in Windows 95 to XP, Opens address bar in windows.
    F5: Refresh or reload Windows or the current document.
    F6: Moves the cursor to the address bar of most programs.
    F7: Commonly used to spell check or grammar check.
    F8: Used to enter Windows startup menu, commonly to enter Windows safe mode.
    F9: Refresh document in MS Word and send and receive mail in MS Outlook.
    F10: Activates the menu bar of Windows.
    F11: Enter and exit full screen mode in most browsers.
    F12: Open the save as window in MS Word.

    CSS List

    WebLearn Tech

    The CSS List property allows you to set different list item markers for ordered and unordered list. In HTML, there are two kinds of list, unordered list and ordered list. With CSS, it can be styled further and images can be used as lists.

    List Style

    The list-style property is used to set all list styles in one declaration. The properties are in the order: list-style-type, list-style-position, list-style-image.

    For example:

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    ul
    {
    list-style:square url('square.gif');
    }
    </style>
    </head>
    
    <body>
    <ul>
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
    </ul>
    </body>
    </html>
    

    List Style Image

    The list-style-image property replaces the list-item marker with an image.

    For example:

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    ul
    {
    list-style-image:url('square.gif');
    }
    </style>
    </head>
    
    <body>
    <ul>
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
    </ul>
    </body>
    </html>
    

    List Style Position

    The list-style-position property is used to specify if the list item markers should appear inside or outside of the content flow.

    For example:

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    ul.a {list-style-position:inside; }
    ul.b {list-style-position:outside; }
    </style>
    </head>
    
    <body>
    <p>The following list has the list-style-position inside:</p>
    <ul class="a">
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
    </ul>
    
    <p>The following list has the list-style-position outside:</p>
    <ul class="b">
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
    </ul>
    </body>
    </html>
    

    List Style Type

    The list-style-type property is used to specify the type of list-item in a list.

    For example:

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    ul.a {list-style-type:circle; }
    ul.b {list-style-type:square; }
    ol.c {list-style-type:upper-roman; }
    ol.d {list-style-type:lower-alpha; }
    </style>
    </head>
    
    <body>
    <p>Example of unordered lists:</p>
    
    <ul class="a">
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
    </ul>
    
    <ul class="b">
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
    </ul>
    
    <p>Example of ordered lists:</p>
    
    <ol class="c">
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
    </ol>
    
    <ol class="d">
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
    </ol>
    
    </body>
    </html>
    

    HTML Sections

    HTML elements can be grouped together for various content. Some of the common used tags are <div> and <span>. We can use <div> to display the header section or footer section. But, in HTML5, new tags such as <nav>, <header>, <footer> reduce the tag consumption used in <div> element.

    HTML <div> Tag

    The <div> tag is used as a block level element that can be used as a container for grouping other HTML elements. The <div> tag has no special meaning, except that it displays a line break before and after the tag. When used with CSS, it can be styled to our desire. It is also used to describe web page layouts.

    For example:
    <div>
    <h1>This is a heading</h1>
    <p>This is a paragraph</p>
    </div>

    HTML <span> Tag

    The <span> tag is an inline element that can be used as a container for text. When used with CSS, it can be used to style the text.

    For example:
    My friend has <span style="color: brown">brown</span&gt: eyes.

    HTML5 <header> Tag

    The <header> tag is used to specify the header of the document or section. It should be used as the container for introductory contents.

    For example:
    <header>
    <h1>HTML</h1>
    <p>HTML means Hyper Text Markup Language</p>
    </header>

    HTML5 <section> Tag

    The <section> tag id used to define a section in a document. A section is a used for grouping of content, typically with a heading.

    For example:
    <section>
    <h1>HTML</h1>
    <p>HTML means Hyper Text Markup Language</p>
    </section>

    HTML5 <article> Tag

    The <article> tag is used to specify independent, self-contained content. An article should make sense on its own and it should be possible to distribute it independently.

    For example:
    <article>
    <h1>HTML</h1>
    <p>HTML means Hyper Text Markup Language</p>
    </article>

    HTML5 <aside> Tag

    The <aside> tag is used to specify some content aside from the content it is placed in.

    For example:
    <aside>
    <h1>HTML</h1>
    <p>HTML means Hyper Text Markup Language</p>
    </aside>

    HTML5 <footer> Tag

    The <footer> tag specifies the footer of the document or section. A footer usually contains the name of author, copyright information, links to term of use, contact information etc.

    For example:
    <footer>
    <p>Posted by: Hege Refsnes</p>
    <p>Contact information: <a href="mailto:someone@example.com">someone@example.com</a>.</p>
    </footer>

    HTML5 <details> tag

    The <details> tag specifies additional details that the user can view or hide on demand. It can be used to create an interactive widget that the user can open and close. Any sort of content can be put inside the <details> tag.

    For example:
    <details>
    <summary>Copyright.</summary>
    <p>by Edwin Ronald Lambert.</p>
    <p>HTML is fun.</p>
    </details>

    HTML5 <dialog> Tag

    The <dialog> tag is used to define dialog box or a window. The <dialog> element makes it easy to create popup dialog and modal in a web page.

    For example:
    <dialog open>This is a dialog!</dialog>

    HTML5 <summary> Tag

    The <summary> tag is used to define a visible heading for the <details> element. The heading can be clicked to view/hide the details.

    For example:
    <details>
    <summary>Copyright 2014 </summary>
    <p>Posted by: Edwin Ronald Lambert</p>
    <p>All Rights Reserved</p>
    <details>

    HTML <iframe> Tag

    The <iframe> tag is used to display an inline frame. That is to display a web page within a web page. It is used to embed another document inside the current document.

    For example:

    <iframe src="http://weblearntech.blogspot.in/"></iframe>
    

    Friday 24 April 2015

    What is Bootstrap?

    Bootstrap is a powerful free front-end framework for faster and better web development. Bootstrap includes HTML and also CSS based designs for typography, layout, forms, buttons, images etc. It also contains many JavaScript plugins. Bootstrap also has the ability to create responsive websites. Responsive websites are those websites that automatically adjust their design so as to work perfectly in all devices ranging from smart phones to desktop PC.

    Bootstrap was developed by Mark Otto and Jacob Thornton at Twitter, and released as an open source product in August 2011 on GitHub.

    Advantages of Bootstrap

    • It is easy to use: Anybody who knows basic knowledge in HTML and CSS can design using Bootstrap.
    • Responsive: Used to create responsive pages which adjust automatically as the device needs.
    • Mobile-first framework: Mobile-first are also a part of the core framework.
    • Browser compatible: Bootstrap is compatible with all browsers now a days.

    Get Bootstrap

    There are two ways by which you can access Bootstrap.

    Bootstrap CDN

    You can also host Boostrap yourself, you can just include it from a CDN (Content Delivery Network). MaxCDN provides the CDN support fot Boostrap.

    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    
    <!-- jQuery library -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">

    Thursday 23 April 2015

    HTML Multimedia

    Multimedia comes in different format. It can be pictures, audio, video, animation and much more. Modern web pages often have embedded multimedia elements and supports various multimedia format.

    Multimedia Formats

    Multimedia elements like audio and video are stored in media files. The most common way to look up a media file is to look its extension.

    HTML5 <audio> Tag

    Before HTML5, audio was played with a plug-in. HTML5
    <audio controls>
    <source src="song.ogg" type="audio/ogg"></source>
    <source src="song.mp3" type="audio/mpeg"></source>
    <source src="song.wav" type="audio/wav"></source>
    </audio>
    

    Audio Formats
    MIDI .mid
    .midi
    MIDI (Musical Instrument Digital Interface) is a format for electronic music devices.
    RealAudio .rm
    .ram
    RealAudio was developed to allow streaming of audio with low bandwidth.
    WMA .wma WMA files can be delivered as a continuous flow of data, which make it practical for use in Internet Radio.
    AAC .aac AAC was developed by Apple as the default format for iTunes.
    WAC .wav WAV is compatible with Windows, Macintosh and Linux.
    Ogg .ogg Ogg was developed by Xiph.Org Foundation.
    MP3 .mp3 MP3 is the most popular sound format. It is supported in all major browsers.

    HTML5 <video> Tag

    Before HTML5, video was played with a plug-in. HTML5 <video> element is used with which one can embed video files on a web page. HTML5 on supports MP4, WebM and Ogg video file.

    For example:
    <video height="240" width="320" controls>
    <source src="movie.ogg" type="video/ogg"></source>
    <source src="movie.mp4" type="video/mp4"></source>
    <source src="movie.webm" type="video/webm"></source>
    </video>
    

    Video Format
    AVI .avi AVI was developed by Microsoft, therefore can be played in Windows Computer.
    WMV .wmv WMV was developed by Microsoft, therefore can be played in Windows Computer.
    Quicktime .mov Quicktime was developed by Apple, therefore can be played in Apple Computer.
    RealVideo .rm
    .ram
    RealVideo was developed to allow streaming of audio with low bandwidth.
    Flash .swf
    .flv
    Flash was developed by macromedia.
    Ogg .ogg Ogg was developed by Xiph.Org Foundation.
    WebM .webm WebM is a project by the web giants Mozilla, Opera, Adobe and Google.
    MPEG .mpg
    .mpeg
    MPEG is the most popular video format in the internet.
    MPEG-4 or MP4 .mp4 MP4 is the upcoming video format of the internet.

    HTML5 <source> Tag

    The <source> tag is used to specify multiple media resources for media elements such as <audio> and <video>. The <source> tag allows you to specify alternate video or audio files which the browser may choose from, based on its media types and codec support.

    For example:
    <audio controls>
    <source src="song.ogg" type="audio/ogg">
    <source src="song.mp3" type="audio/mpeg">
    <source src="song.wav" type="audio/wav">
    </audio>

    HTML5 <track> Tag

    The <track> tag is used to specify text tracks for media elements. This element is used to specify subtitles, caption files or other files containing text, that should be visible while the media is playing.

    For example:
    <video width="320" height="240" controls>
    <source src="movie.ogg" type="video/ogg">
    <source src="movie.mp4" type="video/mp4">
    <source src="movie.webm" type="video/webm">
    <track src="subtitles_en.vtt" kind="subtitle" srclang="en" label="English">
    </video>

    HTML Plug-ins

    Plug-ins are used to extend the functionality of the HTML browser. A plug-in is a small computer program that can be used for many purpose: to display maps, scan for viruses and much more. Some of the well-known plug-ins are java applets and Adobe flash player. Plug-ins are added using the <object> tag and <embed> tag.

    HTML <object> Tag
    The <object> tag is used to define an embedded object within an HTML document. It is supported by all major browsers. It is used to embed plug-ins in Web pages.

    For example:
    Audio:
    <object height="50" width="100" data="song.mp3"></object>
    
    Video:
    <object data="movie.mp4" height="200" width="200"></object>
    
    HTML <embed> Tag
    The <embed> tag is used to define a container for an external application or interactive content. It is supporteddi in all major browsers

    For example:
    Audio:
    <embed height="50" width="100" data="song.mp3">
    
    Video:
    <embed src="movie.mp4" height="200" width="200">
    
    HTML <param> Tag
    The <param> tag is used to define parameters for plug-ins embedded with <object> tag.

    For example:
    <object data="song.mp3">
    <param name="autoplay" value="true">
    </object>