Mobile App layout sizes for Android

Mobile Type	Size	X	DPI
ldpi	240 x 320
mdpi	320 x 480 (Base line)	1X	160
hdpi	480 x 800	1.5X	240
xhdpi	720 x 1280	2X	320
xxhdpi	1080 x 1920	3X	480
xxxhdpi	1440 x 2560	4X	640

ldpi : Low Density Pixel
mdpi : Medium Density Pixel
hdpi : High Density Pixel
xhdpi : Extra High Density Pixel
xxhdpi : Extra Extra High Density Pixel
xxxhdpi : Extra Extra Extra High Density Pixel

Best Monitor for Design work "Dell P2414H"

I wanted to buy monitor for my new company for design purpose. As I preferred Dell monitors I searched on net for the good monitors.

After a good research I purchased "Dell P2414H".

Following things helped me to consider this monitor for Design:

Display:

24 inch display size. Full HD 1920 x 1080 resolution. Sounds big screen size but it's perfect size monitor for design. I wanted to have good size monitor and also be able see and work on design properly. Hence I selected 24" display size is better option to work with. And its gives good space to design in Photoshop. This is Full HD display monitor.  

Design:

Nicely designed and good looking monitor. 

Create e-mailer design optimized for both Mobile and Web.

Daily we see many emailers in our inbox. Its easy to read emailers on web, but it is difficult to read mailers on Mobile, if mailer is not optimized for Mobile. We enlarge the view to read the content.

Basic of creating a DIV

We will learn here to create DIV structure. Creating a simple DIV with applying some basic CSS and one line code in HTML page.
Copy the code and paste it on you HTML page or Download Demo Page.

Linking external CSS to HTML page.

Following are the code to link external CSS for the HTML page.

Link:

<link href="css/style.css" rel="stylesheet" type="text/css">

What is responsive web design?

Now in a web technology, Responsive Design is very hot topic. As the devices to access internet are increasing and these devises are available in different sizes. Hence the responsive design has become very important.

Responsive Web Design:

Responsive design are the design that responses/ adjusts/ appears according to the size and type of devices.

How to optimize image for the website. Which format to prefer GIF, JPEG or PNG and why?

Image Optimization:

First lets understand what is image optimization. Image is saved in certain format such as GIF and JPG and while saving, amount of quality is selected as per the requirement. More quality means more clear and bigger file size.

Useful "Keyboard Shortcut" of browser window - Very useful for web surfer.

At many times we mistakenly close wrong browser window which was not supposed to be closed and then we regret oh! no!.
But if you know some of the important shortcut keys it will be very helpful.

Below is the some of the shortcut keys:

1) Ctr+Shift+T :  to reopen the closed tab (repeat to open all the closed tabs one by one)
2) Ctr+w : to close the browser tab

What is Print Screen? - Use of Print Screen button

Print Screen is very useful button available on computer keyboard. This button allows user to capture computer screen shot. In other words it helps user to create image of what is visible on the monitor screen.

What is FireShot? Features of FireShot application. - Usefull application for web designers:

FireShot application:

FireShot is a Wonderful desktop browser add-ons application. Its a add-ons available for the browsers Firefox, Chrome, Internet Explorer etc. Thourgh Fireshot you  can capture your browser screenshot (just like print screen) directly with one click of button.