How to prepare images for web using photoshop

Posted by Atif Nazeer | Posted in How Tos | Posted on 28-01-2012

Before uploading your images (from Camera/Other Sources) to your CMS, you need to prepare or resize them properly to upload at your website. In our case, our clients most commonly add product images so I’ll talk about product images only throughout this tutorial. There are various methods to achieve this but for now, I’ll focus on the preparation of image using Adobe Photoshop only. For other methods and batch image preparation, I will write another tutorial. Lets start mentioning the steps:-

1.) Get the required image dimensions. You can ask your web developer to provide you the dimensions or you can get these from the images which are already placed by your web developer. You can yourself get the dimensions using latest version of Mozilla Firefox by right clicking on the image. The image that you’ll right click on will be the product image because you are preparing product images.

2.) Get your image ready and open image in Adobe Photoshop

3.) Go to Image -> Image Size or simply press shortcut ( Alt+Ctrl+I ). You will see a dialogue box like this:-

Image Rezie Dialogue

Image Rezie Dialogue

4.) Make sure that ‘Contrain Propotions’ is checked and change only height or width of the image. With ‘Contrain Proportions’ on, if you’ll change height of the image, its width will be automatically adjusted.

5.) If you are satisfied, save this image and add it into your CMS.

At times, you need to crop your images to add in CMS. I will cover this topic in next tutorial.

Feel free to ask in case you have any question.

How to upload your website/data using FTP

Posted by Atif Nazeer | Posted in How Tos | Posted on 02-09-2010

Every hosting comes up with some FTP accounts. To know that how many FTP accounts are allowed, you need to log into your hosting cPanel or you can contact your host to get technical details of your hosting.  Most of the time, FTP username/password is same as of your default hosting username/password.

There are various methods to transfer data through FTP like there are specialized commercial products like CuteFTP and WS FTP. Most of the development tools like Microsoft FrontPage, Adobe Dreamweaver also come up with built in FTP transfer capability.

As the focus of most of these tutorials is to get you working without delving more into technical details, I’ll today demonstrate that how can you upload your website/data through FTP? The requirements are:-

1.) FTP Account ( FTP username/password )
2.) Mozilla Firefox
3.) FireFTP
4.) Your data ( Of Course )

As stated above, I am assuming that you already have a FTP account. If you don’t know yet, please contact your host to provide these details

FireFTP is an add-on to Mozilla Firefox so to run FireFTP, you first need to download Mozilla Firefox. You can download it from this link.

Once you’ve installed Mozilla Firefox, click on this link:-

https://addons.mozilla.org/en-US/firefox/addon/684/

You’ll see something like this:-

FireFTP Install Window

FireFTP Install Window

Click on Add to firefox button and you’ll see a similar window:-

Add to firefox

Add to firefox

Click on Install Now button, It’ll take a little to get installed and you’d be required to restart your Mozilla Firefox in order to successfully install FireFTP. After restarting Mozilla Firefox, you should see an option ‘FireFTP‘ in Tools menu of Mozilla Firefox. If you can see FireFTP in Tools menu that means you have successfully installed FireFTP.

FireFTP under Mozilla Firefox Tools menu

FireFTP under Mozilla Firefox Tools menu

When you’ll click on FireFTP, you should see a similar window:-

FireFTP Main Window

FireFTP Main Window

In the next part of this tutorial, I’ll show you how can you actually upload your files to your server.  Meanwhile, if you need any information, please feel free to ask!

Short for File Transfer Protocol, the protocol for exchanging files over the Internet. FTP works in the same way as HTTP for transferring Web pages from a server to a user’s browser and SMTP for transferring electronic mail across the Internet in that, like these technologies, FTP uses the Internet’s TCP/IP protocols to enable data transfer.

Creating email accounts in cPanel

Posted by Atif Nazeer | Posted in cPanel | Posted on 01-07-2010

Every hosting which you buy comes with some features like maximum number of emails, mySql databases, Ftp Accounts. cPanel enables you to automate your web tasks like setting up email accounts, forwarders and auto responders.

You can access your cpanel using any of these urls:-

1.) http://yourdomain.com/cpanel
2.) http://yourdomain.com:2082

cPanel URL

cPanel URL

To start using email addresses, you first have to create desired email account using control panel provided you with your hosting. Follow these steps to create your email account.

1.) Login to cPanel using any of above written url in your browser. You must replace ‘yourdomain’ with your actual domain.

2.) It will pop up a username/password dialogue box. Enter your cPanel username and password which should be provided you by your host. After successful log in, you should see a similar interface to this image:-

cPanel Home

cPanel Home

3.) Click on Email Accounts. You should see a similar interface to this image:-

Create Email Accounts

Create Email Accounts

4.) Enter your desired prefix. Say you want to create an info@yourdomain.com, enter ‘info’ in email prefix box.

5.) Enter your desired password. Password should be strong enough so can not be guessed.

6.) The next choice is of Mailbox Quota. You can limit a quota to this email account or you can set it to unlimited. In any case, quota will be within the space which you have bought from your host.

If you specify a quota then that amount of space will be reserved to that specific email account. Say you have bought a 300mb space and created an email account with 100mb then the remaining space for all your tasks like uploading would be 200mb. Even if that email account stores a few email, 100mb will belong to that specific email account.

On the other hand, If you set email quota ‘unlimited’ then email account will adjust space according to overall available space which means complete 300mb will be available for email and for other tasks like uploading.

I would recommend you to set your email quota ‘unlimited’.

That’s all. You should now able to check your email using webmail or any other desktop email like Outlook Express.

How to configure your email account in Outlook Express

Posted by Atif Nazeer | Posted in Settings | Posted on 25-06-2010

In this step by step guide, I’ll let you know how can you configure your email account in Outlook Express. Please follow steps as described:-

1.) Run Outlook Express by click on Start button and then selecting Programs -> Outlook Express

Start - Programs - Outlook Express

How to start Outlook Express

2.) If this is your first run or if you don’t have any account configured in outlook express then it will pop up account creation wizard. Use that or you can anytime click on Tools -> Accounts -> Mail -> Add to create account.

Outlook Express Tools Menu

Tools Menu in Outlook Express

Configure Email Accounts

Configure Email Accounts

3.) Enter your company name in Display Name. Type a descriptive name because this will be shown to all of your senders.

Display name which will apear to your senders

Display name which will apear to your senders

4.) Then enter your email address which you want to configure.

Enter your email address

Enter your email address

5.) Then enter your incoming/outgoing servers. Ask your webmaster to provide your these details or if you have registered a domain with iNTERFACE then enter your domain name without www in incoming/outgoing server and in server type, select POP3.

Incoming / Outgoing Servers

Enter Incoming / Outgoing Servers Provided By Your ISP/Host

6.) Then in Account Name, enter your username. Most commonly, this is your complete email address.

Enter your username and password

Enter your username and password

7.) Then enter your password and press next and then select finish.

Click to finish email setting wizard

Click to finish email setting wizard

Now you are almost done.

Outlook Express would now be showing your newly created account in Accounts. Double click on it and:-

1.) Goto server tab and select ‘My server requires authentication’

Outlook Express Server Tab

Outlook Express Server Tab

2.) Select Advanced and in server ports, enter 26 in Outgoing mail (SMTP). Most common outgoing port is 25. Some servers use different ports.  If you have registered a domain with iNTERFACE then enter 26 in Outgoing mail (SMTP).

Outgoint Port Settings

Outgoint Port Settings

That’s all. Your email account should start working now.

In case you need any further help, Please post in comment. I would love to assist you!