Tampilkan postingan dengan label Template. Tampilkan semua postingan
Tampilkan postingan dengan label Template. Tampilkan semua postingan

Home » Posts filed under Template

Beginner Blogger Template Free Download

Diposting oleh Unknown

Blogger_Begginer_template_small_previewBlogger is a very simple and easy to use blogging platform. There are many beautiful templates that add to its value. The Blogger Beginner Blogger Template is a combination of three colors ( Orange, White and dark brown, which makes it look unique. Blogger Beginner is a minimalist, simple and super clean free blogger blog theme with focus on readability & very easy to setup. This theme is perfect choice for your personal blog,  corporate blog theme,  or creative blog. When you talk about pure Css3, this template is almost visible because we have used just CSS3 for making this template looking awesome. You Can also check out our previous blogger template.

 

Template Name: Blogger Beginner

Platform: Blogger / Blogspot

Release date : 25, OCT 2013

Author : www.myblogger-tricks.com

License : Creative Commons Attribution 3.0

 

Live Preview  Download Now

 

Image Preview

 

Blogger_Begginer_template_large_preview

 

Features
  1. Threaded Comment Style:- We have added an advanced  comment system to this theme, its beautiful design will force the users to comments on your blog. Threaded Comment CSS Designed By Mohammad Mustafa Zaidi and we have just customized Version.
  2. SEO Friendly: It is pre-optimized for on-page SEO. Including heading tags, Meta tags, Keywords and in-depth optimizing things. More importantly, the speed of this it significantly faster than the majority of other heavy-duty templates. 
  3. Related Posts: This theme has a built-in related post plugin which would display most relevant suggests to your visitors. It would not only decrease the bounce rate of your site but would increase your website credibility.
  4. and many more features also added in this Template.

 

Customization

ADSENSE BELOW POST TITLE
  1. Adsense Ad Dimensions: 336px X 280px
  2. Search for the tag <!-- Adsense Below Post Title -->
  3. Put your Adsense Code just after the it.
  4. PLEASE Encode the Adsense code before pasting into the Template using the HTML Encode Tool
EDIT DROP DOWN MENU LINKS
  1. Search for the tag  <!-- Start - Navigation Menu  -->
  2. And Replace the ( # ) with your respective links.

 

EDIT EMAIL SUBSCRIPTION BOX

  1. Search for the tag  <!-- Start � email subscription  -->
  2. and Replace The Highlighted Text below with your feed burner username.
  3. and text with your own text.

<!-- Start - email subscription  -->
<div id='subscriptionwrap'>
<div class='subscriptionbox'>
<h4>Ready To Be Make <strong>Elegant Blog</strong></h4>
<p>Subscribe to My Blogger Tricks to enjoy Free Tricks</p><center>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&quot;http://feedburner.google.com/fb/a/mailverify?uri=bl0ggertricks&quot;, &quot;popupwindow&quot;, &quot;scrollbars=yes,width=550,height=520&quot;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='bl0ggertricks'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='emailinput1' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}' onfocus='if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your email...'/>
<input class='emailbutton1' title='' type='submit' value='SignUp'/>
</form>
</center>
</div>
</div>

 

We Hope our readers enjoy this new blogger free template.

You can get further help from Comments. Please leave your Comments and share this Template with your friends. Thanks.  Stay Updated by subscribing our news feed or like us our facebook, Google Plus page.

NOTE:- Please do not re-share or Host this blogger template any where. !

More about → Beginner Blogger Template Free Download
{ Add komentar }
Label: , ,

Sky View Premium Blogger Template Free Download

Diposting oleh Unknown


Sky_View_Template_By_MyBloggerTricks


Sky View Blogger Template is a Free Premium Blogger template designed by me with some cool Features. This is ideal for Designing, web developing, and Magazine based website especially for those who stress more towards designing niche. Unlike our other Template. It has clean and sleek design and has a lot of gutsy utilities.


We hope this responsive template would help your visitors to make most of what you have for them. This theme takes few seconds to load and has a good enough page speed score.




Template Name: Sky View
Platform: Blogger / Blogspot
Release date : 07, October 2013
Author : www.myblogger-ricks.com
License : Creative Commons Attribution 3.0



Sky_view_template_large_view







Features



  1. Threaded Comment Style:- We have added an advanced  comment system to this theme, its beautiful design will force the users to comments on your blog. Threaded Comment Css Designed By Mohammad Mustafa Zaidi and we have just customized Version.

  2. Eye-Catching Social Profile Links With All Option:- At the Sidebar column, you can see social  Profiles arranged in such a way that it could bring an eye-catching spark in your visitors. We have added RSS, Pinterest, Facebook, Twitter, Google+ and email subscription form.

  3. SEO Friendly: It is pre-optimized for on-page SEO. Including heading tags, Meta tags, Keywords and in-depth optimizing things. More importantly, the speed of this it significantly faster than the majority of other heavy-duty templates. 

  4. Related Posts: This theme has a built-in related post plugin which would display most relevant suggests to your visitors. It would not only decrease the bounce rate of your site but would increase your website credibility.

  5. and many more features also added in this Template.




We hope this theme would help you in giving a new Look to your website. We have tested in Chrome, Firefox and Internet explorer. We have added almost all gadgets, so there is no need to do lots of editing. You Just Need to Change Social Profiles Links with your own links. You can follow the Links Editing Instruction Below.  If you liked this template, then do share it with your friends.




Customization For Template.





ADSENSE BELOW POST TITLE


  1. Adsense Ad Dimensions: 336px X 280px

  2. Search for the tag <!-- Adsense Below Post Title -->

  3. Put your Adsense Code just after the it.

  4. PLEASE Encode the Adsense code before pasting into the Template using the HTML Encode Tool



 


ADSENSE AT POST END


  1. Adsense Ad Dimensions: 250px X 250px

  2. Search for the tag <!-- Adsense Post Bottom -->

  3. After this Tag you will find the Default Adsense Code, Replace it with your Adsense Code.

  4. PLEASE: Encode the Adsense code before pasting into the Template using the HTML Encode Tool




EDIT DROP DOWN MENU LINKS


  1. Search for the tag  <!--Secondary DropDown Menu-->

  2. And Replace the ( # ) with your respective links.





CUSTOMIZING THE DO YOU LIKE THIS ARTICLE BOX



 


You just need to replace Facebook, Twitter, and RSS user names with your own user names.  and after that customize the email signup form.



CUSTOMIZE FEEDBURNER EMAIL FORM


  1. Search for <!-- Feedburner Email From --> code

  2. After the you will see the email form. In the form replace the Bl0ggertricks feed burner Id in Two places with your own feed burner id.





CUSTOMIZING THE Sidebar Social Profile links.





  1. Search for <!-- Social Profiles Start --> code



<!-- Social Profiles Start -->
            <div id='social' style='border: 1px solid #d2d2d2; -moz-border-bottom-right-radius:5px; -moz-border-bottom-left-radius:5px; -webkit-border-bottom-right-radius:5px; -webkit-border-bottom-left-radius:5px; border-bottom-right-radius:5px; border-bottom-left-radius:5px; width: 320px; height: 455px; box-shadow:1px 2px 3px rgb(188,188,188); padding: 10px 0 0 0px; margin: 15px 0px 0 0px;'>
<center>
<a href='http://feeds.feedburner.com/bl0ggertricks' imageanchor='1' target='_blank' title='Grab Our Rss Feed'><img alt='Icon' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuMm0YU3QEPa4BcyJQ3p96LLHIjiZu7Rdq-j88LXu1yWT9MG_ehJP3803WbjusL4eWTcbWdfscwdKFbo7lr2P5u30Guj1b7xT7vsHnScBp558IyGzziGXuoflYQ5GqMkNLk1J58YrZVm1Z/s1600/rssfeed.png' style='margin-right:5px;'/></a>

<a href='http://www.facebook.com/mybloggertiks' imageanchor='1' rel='nofollow' target='_blank' title='Like Our Facebook Page'><img alt='Icon' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_HxwvGB-b7dmfC6KwfacIlxa8pzIWrEP0rAB9RAiZf3bal5XiJ5kUMbO_hKaAN4UTpcPEvu-PfeG3jOLRyb41twku-NOknF8qEqN4YYCTlAYodFJWdQI3bkxTRQka5T_G_ANapVLUVzKW/s1600/Facebook.png' style='margin-right:5px;'/></a>

<a href='http://twitter.com/mybloggerstricks' imageanchor='1' rel='nofollow' target='_blank' title='Follow Our Updates On Twitter'><img alt='Icon' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZVGYELza3E6NAXsUEHBBxDTqrqN82CDSLQl6v-rCOZCg7p3fj5C6qrONe67tJLYuZZG0atme7fSbU7WoY2QOg4nN1jLxfbzGoKCBlaBPBjxtEhJ9hB07okTGvw6UBu_VwLC2l9WtMVfbj/s1600/twitter.png' style='margin-right:5px;'/></a>

<a href='https://plus.google.com/108204301284356444972' rel='nofollow' target='_blank'><img alt='Follow Me on Google Plus' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO49s66G1ThT0qSVVHxpWN9DX1dhoBwHR0LN2KDCPy_x65FB2Af0nUxkXGA2jIU1fa-AbfFchVTi_ztmg1ngCHh1_CQPUp6a7na2REVGF2E12Ax4EorQO_3NfRWBljDWLeq0ZdQn_ZqNlx/s1600/googleplus.png' style='margin-right:5px;'/></a>

<a href='http://pinterest.com/mybloggertrickx/' rel='nofollow' target='_blank'><img alt='Follow Me on Pinterest' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMfOVC4LR4I1yjMphx57a5z3NVyfSOhDZxv5StIZhErnd6wuUGPy4Fb9tkXLfROk1zsqpk1vzHJruadIht7gp5MGviAgqZb0WQ7KrU2zCf1cQPuDyXXe0aHZ6XFCoJgw9Q8J2emes8m-_c/s1600/pinterest.png' style='margin-right:0px;'/>
</a>
  </center>

<!-- Twitter Follow Button Start-->
<div style='width: 280px; float: left; padding:10px; margin-left: 10px;'>
<a class='twitter-follow-button' data-dnt='true' data-show-count='true' data-size='large' href='https://twitter.com/mybloggertriks'>Follow @MyBloggerTricks</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js?a4185c&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
</div>
<!-- Twitter Follow Button End-->
<!-- Facebook Like Button Start-->
<div style='width: 250px; float: left; padding: 10px; margin: 0 0 0 10px!important; '>
<div class='fb-like' data-href='https://www.facebook.com/mybloggerstricks' data-send='true' data-show-faces='false' data-width='280'/>
</div>
<!-- Facebook Like Button End-->
<!-- Google plus Badge Start-->

<div style='float: left; margin: 10px 0 10px 15px;'>
<div class='g-person' data-height='70' data-href='//plus.google.com/108204301284356444972' data-layout='landscape' data-rel='author' data-width='290'/>
</div>
             
<div style='float: left; margin: 0 0 10px 15px;'>
<div class='g-page' data-height='70' data-href='//plus.google.com/103598710564060829080' data-layout='landscape' data-rel='publisher' data-width='290'/>
</div>
<!-- Google plus Badge end-->

<!-- Email Subscription Start-->
<div class='row'>
<div class='email'>
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open(&quot;http://feedburner.google.com/fb/a/mailverify?uri=bl0ggertricks&quot;, &quot;popupwindow&quot;, &quot;scrollbars=yes,width=550,height=520&quot;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='bl0ggertricks'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='emailinput' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}' onfocus='if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your email...'/>
<input class='emailbutton' title='' type='submit' value='SignUp'/>
                       
</form>
</div>
</div>



and replace the all highlighted user names and ids with your own usernames and ids. You can get further help from Comments.

Please leave your Comments and share this Template with your friends.

Thanks. NOTE: Please do not re-share or Host this blogger template any where. !

More about → Sky View Premium Blogger Template Free Download
{ Add komentar }
Label: , ,

Premium Blogger Template Free Download 2

Diposting oleh Unknown

 New My blogger Tricks Template Blogger templates design and development of 2013! With the powerful of amazing templates, you can make your blog look exactly what you like. The design of any blog is one of the key factors to its success. For your browsing and inspirational delight, here is our awesome Blogger, Blog spot template for 2013. The have been selected because of their outstanding quality, attention to detail, super cool layout and feature-rich design. To keep the healthy tradition alive, we would love to gift all our loyal and million dollar worth readers a memorable gift. It took me around one week to Design, slice and then finally hard code a carefully structured Blogger template for the blogging community. Feel free to share your opinions and comments with us via comment section below. 

 

Live Preview

 

New Template 2013

 

Features

  • Nice and Elegant Template.
  • Fixed Width.
  • Adsense Optimized.
  • SEO Optimized.
  • 2 Navigation Menus.
  • 3 Column Footer Widgets.
  • Header banner Ads.
  • Infinite Scroll.
  • Custom Social Sharing Widget.
  • like This Article Widget.
  • Related Post Text Links.
  • Supports Default and Threaded Comments.
  • Cross Column Widget sections at top and bottom.
  • Default Jump Breaks for Post excerpts.
  • Breadcrumbs.

 

Download My Blogger Tricks Template

NOTE: Please do not re-share or Host this blogger template any where. !

Download

 

Uploading Template on Blogger Blog

  1. Go to Blogger Dashboard > Locate your Blog if you have more then one blog.
  2. Click on More Options Drop Down and choose Template
  3. Click on the Backup/Restore button on Top Right Corner
  4. Click on Download Full Template button to backup your Old template for safety
  5. Click the Browse button and locate My Blogger Tricks blogger template
  6. Click on the Upload Button. And you are Done!

 

CUSTOMIZATION

Basic Steps:This basic steps you need to follow for each customization.

  1. On New Blogger Dashboard Go to Template > Edit HTML Button

 

Header Logo

We are added default logo you change it with your  own blog log.

by uploading in blogger Default (Header) widget. Go to layout and edit header widget. header widget showing in layout look like this.

logo widgetand upload you blog logo. logo size must be 350px X 80 px.

 

Customizing Top Navigation Menu

Search for the tag.

 

<!-- Start top menu  -->

 

To change links title simply replaced the text with your page titles and replace the hash sign (#) with respective links.

 

Customizing Bottom Navigation Menu

Search For the Tag

<!�Start Bottom Menu-->

To change links title simply replaced the text with your page titles and replace the hash sign (#) with respective links.

 

Infinite Scroll

If you wish to remove auto scroll Feature just remove infinite scroll script.

Search for this tag

<!--infinite scroll start-->

and remove jquery plus scroll script for body section and save it. done!!!..

 

CUSTOMIZING ADSENSE ADS

ADSENSE BELOW POST TITLE

  1. Adsense Ad Dimensions: 336px X 280px
  2. Search for the tag
  3. <!-- Adsense Below Post Title -->
  4. Put your Adsense Code just after the it.
  5. PS: Encode the Adsense code before pasting into the Template using the HTML Encoder

Adsense post for post bottom end

  1. Adsense Ad Dimensions: 336px X 280px
  2. Search for the tag <!-- Adsense Post Bottom -->
  3. After this Tag you will find the Default Adsense Code, Replace it with your Adsense Code.
  4. PS: Encode the Adsense code before pasting into the Template using the HTML Encoder

 

CUSTOMIZING THE DO YOU LIKE THIS ARTICLE BOX

CUSTOMIZE SOCIAL ICONS

  1. Search for <!--Like box Links --> code.
  2. After the code, you will find the social links, Change the URLs of Rss, Twitter, Facebook links respectively.
  3. and also In the email form change the bl0ggertricks feedburner Id in Two places.

 

Customizing Stay Connected Widget

  1. Go to Blogger Dashboard > Locate your Blog if you have more then one blog.
  2. Layout>> Add A Gadget. and paste the following code in gadget content area.

<div class="mbtstaycon">
    <ul>
        <li class="mbtrss"><a href="http://feeds.feedburner.com/bl0ggertricks">RSS</a></li>
        <li class="mbtmail"><a href="http://feedburner.google.com/fb/a/mailverify?uri=bl0ggertricks" >Email</a></li>
        <li class="mbttwitter"><a href="http://twitter.com/bl0ggertricks">Twitter</a></li>
        <li class="mbtfacebook"><a href="http://www.facebook.com/pages/Blogger-Tricks/448418608553191">Facebook</a></li>
                <li class="mbtgoogleplus"><a href="https://plus.google.com/103598710564060829080">Google +</a></li>
                <li class="mbtpinterest"><a href="pinterest.com/mybloggertrickx">Pinterest</a></li>
    </ul>
</div>

<div style="float: left; margin-right: 15px; margin-top: -4px;">
<a href="https://twitter.com/bl0ggertricks" class="twitter-follow-button" data-show-count="false" data-size="large" data-dnt="true">Follow @BloggerTricks</a><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js?a4185c";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>

<a href='http://feeds.feedburner.com/bl0ggertricks'><img alt='' height='26' src='http://feeds.feedburner.com/~fc/bl0ggertricks?bg=088A4B&amp;fg=444444&amp;anim=1' style='border:0' width='80' float='right' margin-right='5px'/></a>

change all links with your own social media and feed burner links.

 

For Further Help

You can also get further help from comments. please feel free to post your queries in the comment box below. Its Very Handy, Light weight and Professional Template.

 

Copyright

Bloggers and developers are hereby advised not to sell or redistribute the Template codes. You are also instructed not to remove My Blogger Tricks Credits from the Footer. Removing the Credit links will break the Template URL of your blog, leaving all your efforts in futile.

Premium version includes no watermarks. If you wish to buy the widget for Wordpress, Joomla or even Blogger Blogs, then you may kindly contact us via our our Contact Us Page.

More about → Premium Blogger Template Free Download 2
{ Add komentar }
Label: , ,

Premium Blogger Template Free Download

Diposting oleh Unknown

Free Premium Blogger TemplateFree Premium Blogger Template from http://Bl0gger-tricks.blogspot.com I used this blogger template for Bl0gger-tricks.blogspot.com.  So many of our readers requested the Bl0gger-tricks Old blogger template. and Now it is here to Download for Free!!!. It was actually created on December 13, 2012 and I modified and tweaked today. Before i coded the template with Hard-coded, That�s means i edit the template and add menu links. Now i added the Secondary and page-lists widgets to easy customization. It took me around one week to craft, slice and then finally hard code a carefully structured Blogger template for the blogging community. The name chosen this time is "Blogger Template". Below is Customization Detail For blogger Template.

 

Update:- 03-08-2013

Download Link is Updated

Read More Button Issue Resolved and also added 2 New Feature.

  • 3 Column Footer
  • Related Post Text Widget
  • Improved SEO Tags

Live Demo�!!!!

Click On image for Live Demo

Blogger Template

SEO

Data Variables for Titles and Post Pages already swapped
The clean HTML structure would make it fairly easy for search robots to crawl and index the pages easily without useless scripts block access.
Entire structure follows a hierarchal flow of Heading tags as per Search Robot requirements. H1 for Blog title, H2 for post & sidebar titles and H3 for sub-headings
Labels, Comments, Archive Links and Archive Pages are well optimized by setting robot entries
Commenting system is well shielded from spammers.
Load Time has been kept in mind as per Google Webmasters latest Page speed requirements
In short this template is a repository of all SEO features that a blogspot blog can contain!

 

Feature

In this template my main focus on Increasing blog loading time  so You can check live demo and check loading speed�

This Template is Absolutely Free!!

 

Download Now

 

How To Upload The Blogger Template

1. Go to Blogger Dashboard > Locate your Blog if you have more then one blog.
2. Click on More Options Drop Down and choose Template
3. Click on the Backup/Restore button on Top Right Corner
4. Click on Download Full Template button to backup your Old template for safety
5. Click the Browse button and locate way2blogging�s blogger template
Click on the Upload Button. And you are Done!

CUSTOMIZATION

Basic Steps:This basic steps you need to follow for each customization.

On New Blogger Dashboard Go to Template > Edit HTML Button.

 

Customize Menu Links

1. Search For These Line  <div class='Bt-nav'>

and you will code look like This. 

<div class='Bt-nav'>     <div id='menu_wrap'>         <div id='menu'>           <ul>             <li>               <a class='current' href='http://bl0gger- tricks.blogspot.com/'> Home</a>
 
</li>             <li><a href='http://bl0gger- tricks.blogspot.com/search/label/Blogger'> Blogger</a></li>

<li><a href='http://bl0gger- tricks.blogspot.com/search/label/Adsense'> Adsense</a></li>
<li><a href='http://bl0gger-tricks.blogspot.com/search/label/Make%20Money %20Online'> Make Money</a></li>             <li><a href='http://bl0gger- tricks.blogspot.com/search/label/S.E.O'>SEO</a></li>

<li><a href='http://bl0gger-tricks.blogspot.com/search/label/Blogger %20Widget'>Widgets</a></li>             <li><a href='http://bl0gger- tricks.blogspot.com/search/label/Apps'>Application</a></li>             </ul>
</div>       </div>       <!-- End - Navigation Menu  -->       
 


<!--Start Secondary Menu -->

<div id='secondary-Menu'>         <div style='float:left;'>           <ul id='secondary- nav'>             <li><a href='http://bl0gger-tricks.blogspot.com/p/guest- post.html'> Guest Post </a></li>             <li><a href='http://bl0gger-tricks.blogspot.com/p/blog- page.html'>Downloads</a></li>             <li><a href='#'>Templates </a></li>
<li><a href='#'>FAQ</a></li>             <li><a href='https://plus.google.com/103598710564060829080'>About</a></li>
<li><a href='http://bl0gger-tricks.blogspot.com/p/required- field.html'>Contact</a></li>             <li> <a href='#'>Advertise</a></li>             <li><a style='cursor:pointer;'>Tools &#187;</a>
<ul>
<li><a href='http://bl0gger- tricks.blogspot.com/p/html-editor.html'>HTML Editor</a></li>                 <li><a href='http://bl0gger- tricks.blogspot.com/2013/03/HTML-EnCoder-Desktop- Application.html'>Encode HTML Characters</a></li>                <li><a href='http://bl0gger- tricks.blogspot.com/p/free-google-page-rank- checker.html'>Page Rank Checker</a></li>                 <li><a href='http://bl0gger- tricks.blogspot.com/2012/11/two-color-code-generator- tools.html'> Color Code Generator</a></li>               </ul>             </li>           </ul>         </div>       </div>





Replace Title with your title and link with your blog links.



One Little Issue in This template



When you are writing a post you need to add  <!�more�> where you want to add Read More Button.. You can Also See Video For This Tip�



you can get further help from Comments. Please leave your Comments and share this Template with your friends. Thanks.



NOTE: -Please do not re-share or Host this blogger template any where. !

More about → Premium Blogger Template Free Download
{ Add komentar }
Label: ,

Tips for avoiding Mobile Website Design mistakes

Diposting oleh Unknown

colorful-3d-sphere-with-the-word-design Mobile website design has its own unique requirements. People don�t access information on their mobile the same way as they access it on their desktop. Designing a mobile website alone will not solve the problem. Therefore, you must know that what are the things that site must be devoid of to remain effective in the competitive online market. we will tackle the design mistakes to avoid when designing mobile websites.

 

 

 

Choose a simple template:

When you use mobile website design software choose a simple template. A template with a standard menu, about us, contact us, news, and blog pages is easiest to navigate and avoids the mistake of putting too much information, tabs, and menus too close to each other.

 

Forgetting how long it takes to load a page:

This really frustrates the users. In this fast era almost everyone is surrounded with number of chores at one time. Do not embed large image files or heavy background images that make the loading of the startup screen unnecessarily long.

 

Show only your most important content:

As mobile devices have smaller screens, even reading a few paragraphs of text can require quite a bit of scrolling. Edit your content and completely remove pages and sections not conducive to effective mobile browsing. The aim should be to provide your visitors with the essentials, nothing more or less. After all, they can always visit your full website.

 

Avoid For Adding To Much Text

One thing to keep in mind is that websites that will be viewed in mobile devices should not be cramped with text. The tendency when the overall look is bombarded with words is that things seem so tight and cramped that it is not pleasant to read, or even to look at. It is best to learn to use techniques like bulleting or perhaps simple rephrasing to shorten word lengths. Technically, web programming using language like HTML have common commands like line break (<br>) or paragraph break (<p>) to dissect and arrange or bind words for a clean look.

 

Not testing for Mobile:

Your mobile creation may look amazing in Photoshop, validate with W3C, and perform superbly in a desktop browser, but you will never know how well your design actually works until you have tested it on a variety of devices and human beings.

 

Problem of Size:

The width of your mobile website design should be such that it should fit across mobile screen sizes of various dimensions. If the mobile site along with its elements fails to meet the criteria of size, then it may fail to keep the users engaged, as well.

With that info in mind, size your objects correspondingly to ensure it fits your target device�s screen width. To accommodate other devices, create a website that can adjust to any screen width, and HTML command like (content=�width=device-width�) is a way to do it.

 

Try to avoid these mistakes when beginning to plan your mobile website and you�ll be on the way to providing an alternative to your viewers that will fit their wishes to access your content when they want and how they want.

 

Image Credit : 123rf.

More about → Tips for avoiding Mobile Website Design mistakes
{ Add komentar }
Label: , ,