Sunday, January 31, 2010

Writing on a Background Image: Blogger

Writing on a background image
May look nice on some blogs.


How to create a GIF image with transparent background in PhotoShop: Video

Hi, welcome to my first video tutorial. Comments and feedback appreciated.
Tree Brushes used in tutorial were downloaded from Brusheezy visit their site for a great selection of brushes.
Color Cop  Makes ease of matching colors exactly.



This is the image created in the tutorial.

How to place text next to an image Blogger

How to now get the text near the tree?
This could be a good subject for a tutorial.
      Tutorial to follow soon.

Saturday, January 30, 2010

My Personal Blog Clock

Customizing Blogger templates: Part 3

Note of caution, backup your blog before editing HTML.
Ok now for the fun part, go to your Blogs layout tab and select edit html.

















Next scroll down the code and find the id you wish to look at. In my case I wanted to change the width of the sidebar, which was 30%.

Things to remember if you change the width setting to 20% from 30%, you will also need to change the main section from 70% to 80%.
Once any change is made save it have a quick look if you don’t like it change it back.
The semi colon at the end of each line is important do not leave it out.
 
I hope you have enjoyed this tutorial and have found it useful. Though at this stage very basic, if I find a demand for it I will do some more in depth tutorials.

Thursday, January 28, 2010

Customizing Blogger templates: Part 2

 Looking at our blog we have no idea what the divisions(div’s) are called.
With Firefox loaded and the Web Developer add-on installed, we can see the Web Developer tool bar.
It looks like this.


If it is not visible go to the Tools menu at the top of the browser window and you should be able to access it from there.
Click Information on the Web Developer tool bar then Display Element Information.
You will then have a crosshair cursor and as you hover over the different page elements it will place red border around the element.
When you click the element, information about the element will be displayed in the orange box.

Here you can see I have clicked on the blog heading and the box has displayed the information about it. 

Now I click the white section on the right hand side of the page.
 

The information that is displayed has what I need to find that section in the CSS code.



The first line is what we are interested in here.
div #sidebar .sidebar section
When writing HTML code div’s usually have either an id or a class. Any particular div id can only be used once per page. A class can be used more than once; this would be used say for several paragraphs on a page where you would like to give them a different formatting to other paragraphs.
Div is written as div id=”whatever” in HTML and in CSS this is written as #whatever.
A class is written as class=”something” in HTML and in CSS .something. The name with a period or dot before it.

Customizing Blogger templates: Part 1

Before we jump into editing the html for our blog let’s get some great tools.
Personally I use Firefox as it is the preferred browser of many web designers. Internet Explorer is a designer’s nightmare.
Type ‘internet explorer quirks’ into your search engine, I got 1,010,000 results.

Once you have Firefox installed, get the Web Developer add-on and install it also.

So what does it do? It makes editing your template via the html easier.
WebPages and your blog are made up basically of Hypertext Markup Language(HTML) and  Cascade Style Sheets(CSS) code.

This is the html code that makes up a div, a div could be likened to a box.
<div id="main-wrapper" >
Text and Images can be added inside the box.
</div >

And this is the CSS code, this tells your browser how big the box should be and what to do with the elements inside it.
#main-wrapper {
  width:64%;
  float:$endSide;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
  }
Sometimes identifying the divs and page elements can be difficult this is where the Web Developer tool comes in handy.
This will be explained in Part 2

Wednesday, January 27, 2010

Changing file size of an image in PhotoShop

Original file size was 27.8mg width 3872 pixels height 2592 pixels

By going to Image > Image size I changed the dimensions to 400 pixels wide and a height of 268 pixels.

Change the resize measurements to suit your needs.

File size is still 314.1kb.
By saving for web devices

We can then have a final image of 17.9kb having the quality setting left at 60% and JPG.

And the final image


Hope you find this helpful.

When is content not king?

With the millions of blogs that make up an ever growing internet, it is hard for new bloggers to get their blogs first visited and then have people return. Many people search the internet and find blogs that are no more than a fungus created by people with only one thing in mind, getting money. Ok so we all want money, but let’s not pollute the web with pure garbage.

Get ten people to visit your blog and want to return repeatedly is better than 100 people just visiting and clicking straight out of it. Many blogs have flashing lights, bells and whistles. There is no structure just eye distracting nonsense everywhere.

If you have good content, and it is the content that will get people to return than don’t distract them from it. Steve Krug has written a fantastic book called Don’t make me think!  it is basically about web usability, and it is full of ideas to make a website better, which in many cases also apply to a blog.

Another problem that many people do not think about, however, do commonly is send people away from their blog. How! people may ask? With hyperlinks that are not opened in a new page or tab. Imagine someone visits your blog, and you have a link to another site, blog or whatever, if the link displays the page on the one they had opened you have just shown them different content. After following that content, they may not return to yours. To open a link in a new tab or page the html code is target=”_blank” this is added to the end of the URL. Blogger does not do this by default so it will need to be added in the html code.



Slow loading graphics is another thing that can make people leave, the internet stores information that is available instantly (depending on your connecting speed). With the click of a button you can jump from blog to blog. People will not wait too long for a page to load before they click out of it. Images can be reduced in both dimension and file size, with many programs such as PhotoShop and Gimp by saving the image for web devices.

Many blogs also add things that many people do not understand such as recent viewers, this can be useful if you want to see who is visiting, remember though it will show the latest viewers from one community it is not a true indication of what traffic you are receiving. If the latest visitor from a community was five days prior and people see that they may think the blog is not that interesting and leave. This may also apply to hit counters and the like, if you really feel you like them then place them at the bottom of the page.

In conclusion, blogging really is about getting people to read what you have to say if not why blog, keep it on your PC. You want people to visit and return try everything within your control to have them stay long enough to read your latest post title.

Sunday, January 17, 2010

Privacy Policy

Privacy Policy
We take your privacy seriously. This policy describes what personal information we collect and how we use it. (This privacy policy is applicable to websites falling under the primary holder Ardan's Blog Talk

Routine Information Collection

All web servers track basic information about their visitors. This information includes, but is not limited to, IP addresses, browser details, timestamps and referring pages. None of this information can personally identify specific visitors to this site. The information is tracked for routine administration and maintenance purposes, and lets me know what pages and information are useful and helpful to visitors.

Cookies and Web Beacons

Where necessary, this site uses cookies to store information about a visitor's preferences and history in order to better serve the visitor and/or present the visitor with customized content.

Advertising partners and other third parties may also use cookies, scripts and/or web beacons to track visitors to our site in order to display advertisements and other useful information. Such tracking is done directly by the third parties through their own servers and is subject to their own privacy policies.

Controlling Your Privacy

Note that you can change your browser settings to disable cookies if you have privacy concerns. Disabling cookies for all sites is not recommended as it may interfere with your use of some sites. The best option is to disable or enable cookies on a per-site basis. Consult your browser documentation for instructions on how to block cookies and other tracking mechanisms.

Special Note About Google Advertising

Any advertisements served by Google, Inc., and affiliated companies may be controlled using cookies. These cookies allow Google to display ads based on your visits to this site and other sites that use Google advertising services. Learn how to opt out of Google's cookie usage. As mentioned above, any tracking done by Google through cookies and other mechanisms is subject to Google's own privacy policies.

About Google advertising: What is the DoubleClick DART cookie? The DoubleClick DART cookie is used by Google in the ads served on publisher websites displaying AdSense for content ads. When users visit an AdSense publisher’s website and either view or click on an ad, a cookie may be dropped on that end user’s browser. The data gathered from these cookies will be used to help AdSense publishers better serve and manage the ads on their site(s) and across the web. Users may opt out of the use of the DART cookie by visiting the Google ad and content network privacy policy.

Contact Information

Concerns or questions about this privacy policy can be directed to Peter Martin information here for further clarification.

Tuesday, January 12, 2010

My Favourite Blogs

TheTAZZone
http://www.thetazzone.com
The place to go to read Security Tutorials, Photoshop Tutorials,
Hacking Tutorials, General Tutorials; play over 1000 ad-free full-screen games;
access to free to use smileys,
avatars and photos; 20 one-hit wonder and classic rock lists;
and a friendly, laid-back ad-free Computer/Security/Community Forum

Blog's About Blogging










Helpful Information for Newbies
http://helpfulinformationfornewbies.blogspot.com
Help for blogger newbies and those needing answers
to questions on both blogger and adsense.
A place to get help when you need it.

 
















Blogging Without A Blog
http://bloggingwithoutablog.com
Follow me down the path of blog creation. I'll share lessons I've learned,
hints and tips to make blogging easier,
and links to great sites that both inspire and teach you more about blogging