Content feed | Comments Feed

Easiest way to speed up HTML/CSS coding time

Posted by Zobayeda Gulshan Ara 31 January 2014

Do you know the easiest way to speed up your HTML and CSS coding time? If you are a web developer and have work pressure, you definitely need to know the fastest way of coding. You have to write code correctly too. Most of web developer use notepad++ as their text editor. To speed up your HTML/CSS coding time today I am going to share a easy way to add Zen-Coding Plugin in Notepad++ text editor  this amazing speed up your codig time

Easiest way to speed up HTML/CSS coding time, add Zen-Coding Plugin in Notepad++ text editor, zen coding, html css coding, high speed coding
You can See a video tutorial to enabling zen code plugin in notepad++

Or just follow the instructions below,

1.    Download the latest version of notepad++ from here and install it.

2.    Now download zen-coding plugin


3.    After downloading zen-coding plugin, unzip the folder, copy all files.
4.    Go to C:\Program Files\Notepad++\plug-in and paste all files here.
5.    It’s done.
You can check now, open notepad++ and type html:5  then  press ctrl+E you will see it will open a html 5 document.

I think this is an amazing tips who don’t know how to speedup HTML and CSS coding time. You can download a pdf file to get all zen-coding shortcut lists and then can implement easily.
If you like these tips please share with your friends.


Share/Bookmark

Link Building method is the best SEO method

Posted by Zobayeda Gulshan Ara 15 October 2012

Is link building method the best SEO method? The answer is still confusing and most webmaster still looking for actual effective SEO method.


As we know that, SEO is the best way to grab higher page rank, generate huge targeted web traffic and boost up any business. Though, there have thousands of SEO methods but it’s not that much difficult for any SEO specialist to know which one is right and most effective SEO process after evaluating the website they are working for.

Image from istockphoto


Most Webmaster assumes that, link building is the best method to improve search engine ranking and to improve overall web traffic. Though, it’s very time intensive and Frustrating, Boring process, but you have to stick with it because this is your master key to open the door of success.

There have lots of link building method such as blog commenting, article submission, forum posting, directory submission and reciprocal link building service . Building links is a difficult, time-consuming process. It's also essential in achieve high organic search rankings for any targeted keyword and improve the SERP’s result.

Link building is a continuous process, if we start building several links and suddenly stop working further, it may harm your website, that means, you may loose your ranking and can’t  see your site on top search engine  results, Because, It is very competitive sector, if you stop working, some one else take your position immediately. 

link building method is very slow and arduous SEO method and takes lots of times to see the result but eventually it will be your term card if you know how to use it.


Share/Bookmark

How to show HTML CSS Source Code in blogger(blogspot) blog posts

Posted by Zobayeda Gulshan Ara 24 April 2012

Yesterday, When I was write about "Change your Blogger Blog as Dofollow" I face a problem to show Html Css Source Code in my blogger blog post. I got the solution and Now I will show you how to add any source code(for instance Html Css or Javascript Source Code) into you blogger blog  post.

Put Html Css Source Code in my blogger blog post
Put Html Css Source Code in my blogger blog post

You May Want To Read Following

 

There are basically Two Steps, 
 1. Paste Some Code Into Blogger
 2. Convert your Html/ JavaScript Source code into (escapeable) Special Characters

 I know, This is not enough to understanding, so read the Explanation Now-

 1. Paste Some Code Into Blogger

1. log in your Blogger account.Go Dashboard. Then Click on Design and then Edit Html 
2. Click the check box to expand Widget.
3.Hit Ctrl+F to find the following code
 ]]></b:skin> 
4. Place the following code before ]]></b:skin> 
 
 /*--Code View--------------*/
code {
color: #000099;
font: 108% "Courier new",Courier,mono;
padding: 0 2px;
white-space: nowrap;
}
pre code {
-moz-box-shadow: 0 0 10px #DDDDDD;
background: repeat scroll 0 0 #FFFFFF;
border: 2px solid #CCCCCC;
clear: both;
color: #333333;
display: block;
font-size: 12px;
line-height: 15px;
margin: 10px auto 10px 30px;
overflow: auto;
padding: 15px;
white-space: pre;
width: 85% !important;
word-wrap: break-word;
}
code .comment {
color: #888;
}
code .class, code .rules {
color: #ff00ff;
font-size: 100%;
}
code .value,  code .title, code .string {
color: #0000FF;
}
code .tag {
color: #000099;
}
code .keyword {
color: #000099;
}
.html .attribute {
color: #006600;
}


5. Now Click on Preview button. If you don't face  any error, Click on  Save Template Button. Now your blogspot blog is ready for Showing any Html Css or JavaScript source code.  

 2. Convert your Html/ JavaScript Source code into (escapeable) Special Characters


Now Every time When you want to place any source code in your blogger post you just need to make it readable for browser. For this reason, you need to convert the angular bracket and other special character. If there is a few angular bracket then you can convert it manually , just like that , use &lt;  for <   and use   &gt;  for > .
See the Complete HTML Escape Characters list from W3Schools,

That is a simple way to solve few anguler brackets problem. Another way is, just open your Notepad ,paste the source code and go to Edit then Replace and type <  in ‘Find what’ and type in  ‘Replace with' &lt;. Also  do the same for > with &gt;

Does it make you mad ? The easiest way to go any online and take any free service to get you code into escapble character.There have been  lots of, The best one is  Quick Escape  

So Use this tool and convert your source code . Now add the converted code into your blog post .But Add  <pre><code> before your source code and add
</pre></code> after your source code.


Though The post is so long, but don't think that is a tough job to show HTML CSS Source Code in your blogger(blogspot) blog posts. Just Read this post carefully and do exactly the same thing I mentioned above. If you have any problems doing that, leave a comment here, I will try to solve your problem.




Share/Bookmark

Do you have a High pagerank dofollow blog? If you have, then you can get huge traffic and lots of comments very easily, but the main fact is you need to more concern to prevent spammers. For this you can  add a secure commenting system in your blog. If you have blogger blog, you can add thirty party  commenting system like Disqus, Intense Debate, Facebook Commenting System  etc. By default many free blogspot templates  has nofollow commenting system but you can change your blog  nofollow to dofollow with a quick and simple html editing.
Do Follow

How to make your  blogger blog as High pagerank dofollow blog

To change you nofollow blogger blog  to dofollow is quite simple, just need to edit html in blogger dashboard,
Let's Start,
 1. Login your  Blogger account to go to Dashboard.
 2.Click on Design , Then Edit Html
 3. Take a backup for you template, to do that, click on Download Full Template link under the Backup / Restore Template line.
4 Check the little check box for Expand Widgets.
5. Now hit (ctrl+F) from you keybord and search for following  line

<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a> 



6. That' it, Just  change nofollow as dofollow.
7. See the Preview at first. Click Preview button at the bottom.
8. If Everything is ok, then clcik on Save Template button

When visitor comes to your blog and read some interesting , they would like to leave a comment about that writing, and also want to get a little bit benefit , so give them a chance to get a link.You will also get huge benefits to do that, Because this is the simple Formula ,

 High pagerank dofollow blogs=More Visitor+More comments
  


Share/Bookmark

Get Ready for CCNA Final Exam | Download CCNA Ebook

Posted by Zobayeda Gulshan Ara 13 April 2012

This guide will cover all the essential things that are necessary for the CCNA Final Exam preparation. First introduced in 1998 just after the increasing trend of information technology, CCNA certification became a start for the basic level certification in the networking field.

CCNA Final Exam
CCNA Final Exam
All companies requiring any sort of networking administrator demanded an individual with CCNA certification to qualify for the exam. CCNA certification basically covers all the important aspects related to the field of networking like TCP/IP protocols, switches, routers, LANs etc. This certification ensures that the candidate who has taken the certification exam has all the latest information about the networking field and is ready for the practical demonstration of its work.

Download CCNA Ebook

Achieving highest standards in CCNA

To get the maximum marks from a CCNA certification is not an easy thing to do. As this exam is basically conducted by CISCO, they have kept the difficulty level of the exam up to a certain point which evaluates the students very effectively. Every exam, they change the requirements, patterns, type of questions asked and also update the course material so that candidate can be tested at fullest. Many times student work very hard, paying for tuitions etc and in the end they fail the examination.
So the next thing that comes to mind is how to prepare for the CCNA Final exam. Well this article will cover all the essentials for the CCNA Final exam study.

Know the Basics about CCNA Final exam

The first thing to start with for the preparation of the CCNA Final exam is to get to know all the basic or main things related to networking. Read all the CISCO books, have a general understanding of how things work or interact with each other in a real time environment. Get admitted in some training courses that are CISCO certified. All these things will help you develop the basics that are necessary at every level.
This also includes knowing the exam pattern and topics that are needed for the Final Exam. You can get a complete pack by going to CCNA Flash Cards and Exam Practice Pack.

Talk to seniors to learn more

If you know any people who had given the exam before you, talk to them and see what they know about the CCNA Final Exam. Ask them what type of learning they did in order to pass the examination. A proper guidance is always handy especially from a person who has practically given the CCNA Exam.

Dedicate enough time to studies

This is one of most crucial and important things that you have to take care off while going through all this process. Time management is the key to passing the CCNA Final Exam. When you first make up your mind to take the Final exam, make a time schedule for yourself that how many hours each day from now on you will give to your studies. Divide the course topics into small chunks and learn them on weekly basis. You might also have to leave your entertainment life for a short period of time but here you have to trade off between either prepare for the CCNA Final Exam or keep on enjoying.

In the end, all that has to say is that passing this CCNA Final exam is no big deal if you follow the right path to study. Because this is the very first step that will decide where you stand in the market. So invest in it as much as you can so that you can have a solid base to start a successful career.


Share/Bookmark

Best Underwater Camera Packages. Buy it Now.

Posted by Zobayeda Gulshan Ara 11 April 2012

If you want to buy a camera then why not have a look on Underwater Camera Package. Learn some best features of it. I know you don't want to compromise with image quality .So this is the best option to choose underwater camera. They have excellent image quality , very small in size that, you can easily put in your pocket, work fine, easy operation that you can easily handle, also have video shooter.

Underwater Camera Package
 
.


Share/Bookmark

10+ Dropdown Menu Css Tutorial & css dropdown menu example

Posted by Zobayeda Gulshan Ara 26 February 2012

"Dropdown menu css” this is the actual phrase I am searching over the internet and wish to put together some excellent Dropdown Menu Css Tutorial to help boost up your designing skills. As we know that drop down menus play significant role on websites look and feel, therefore; to ease up and ensure visitors interactivity and comfort at site a well-designed & organized drop down menu bar is required.
For newbie’s those like to enhance their skills to create dropdown menu, some tutorials of dropdown menu css(created by Pure Css) are being presented here.

Easy Navigation

Download Amazing Premium CSS Templates from CssHub.com

10+ CSS Dropdown Menu Example

Here,I have listed some awesome CSS Dropdown Menu Example in below. I have taken those from some of the famous websites. All of those menus are very professionals in quality and highly constructed and also they have outstanding usability and eye-catching styling features.

creativelabs.com
An elegent menu of creative.com
www.alienwer.com
www.alienware.com
august dropdown menu
www.august.com
A clean and beutiful menu of redbrickhealth
redbrickhealth.com
a meur for samsung
www.samsung.com
dropdown menu oracle
www.oracle.com
Wonderful dropdown menu of
gomediazine
www.gomediazine.com

www.asus.com
 use very stylinh techniques in the dropdownmenu of epson
www.epson.com
wonderful menu of mediatemple
mediatemple.net
a drop down menu of goincase
goincase.com

10+ Dropdown Menu Css Tutorial

Here, I listed Dropdown Menu Css Tutorial, most of the menus built with pure and lean Css, Html, sometimes a snippet of javascript code. But don't worry, it's not that much tough  to catch at all. All of those tutorials follow very simple and understandable techniques.You can copy or download the source code and its free to download.

1.
How to build a CSS3 drop down menu
This drop down menu has created by CSS, the black color gives it an extra-ordinary look which will definitely make the visitor amazed at  his first impressions.
See the  Demo
 
2. Create dropdown menus with CSS only
This tutorial from jankoatwarpspeed.com, the author, JANKO’s gives a very simple and easy description about menu structure and put the source code of this drop down menu also. It's very nice and clean professional looking drop down menu that only uses CSS, quite Interesting! Isn’t it?

Here you go to see the  Demo 

3. Create a cool CSS-based drop-down menu
Well, this is really very cool as the author mentioned in title; I like the color though any one can change the color as their wish, You found the code here, just need to go through the instruction.  I know you like to See the demo first.
Before downloading the source code anybody would like to see how the design looks like and that's why I put the  Demo    link here. 

4. How-to: DropDown CSS Menu
I don’t want to talk too much about this dropdown menu, you would rather see the demo first. Now say, how excellent this is?
demo
 
5. CSS3 Dropdown Menu
This is very elegant Mac looking dropdown menu, the author used some new CSS3 features such as box-shadow, border-radius, and text-shadow and another important thing is this dropdown menu is compatible to IE7+.

  Demo  

6. Creating a pure CSSdropdown menu  
Exactly, There has no javascript , just pure css and html. Easy to modified with color and other style.
Demo

7.  Pure CSS DropDown Menu
See the demo and if you like this and want to learn how to create a drop down menu with css then click the tutorial link below.


Demo

8. CSS Express Drop-Down Menus
A very simple but well structured drop down menu and easy to learn the techniques. What you need, just change the color, text or you can use images also. See the demo and copy the code for you further use. 


See Demo

9. MTV.com horizontal css drop-down menu
 Here you can find some more drop down menu, which are very easy to learn.you can download the source code and do some modification as your choice.



 Learn More 


10. How to Create a Horizontal Dropdown Menu with HTML, CSS and jQuery

This is another very simple menu with simple css and a little bit jquery. In this tutorial, the author gives a very compressive description which definitely help you to understand the code and the basic structure, at the end of this tutorial you can find a link to download the source code  




See the Demo here.



11. Horizontally Centered Drop-Down Menus
An awesome tutorial witten by Matthew James Taylor and he using the horizontally centered techniques which really amazed me. I really like the way he demonstrated the whole tutorial as it is definitely help anybody to play with core css advanced techniques.




You will love to see the Demo, I know.

Get Learn More about Dropdown menu css


If you want to learn more about Dropdown Menu Css Tutorial I will recommend you to see these website. From here you will learn the easy  techniques, user-friendly, structured, Excellent design idea and many more.
1.  How to create a basic css horizontal drop down menu
Explain briefly of several techniques that is the vertical menu, horizontal menu, upsides or downsides, listed or nested,etc.
2. New horizontal drop down menu using css
This another website, you can achive some more tactice from it.
3. How to Create a Drop-down Nav Menu with HTML5, CSS3 and jQuery   
I always love net.tutsplus tutorials because of it's well organized and brief description that helps anybody to catch the tutorial without lots of effort. 
4. HTML5 and Css3 Menu


Share/Bookmark

Blog Archive

Followers