Sunday, October 30, 2011

What Resolution Should Your Mobile Site Be Designed For?



as a front-end web developer, I have struggled with trying to accommodate for various screen sizes and resolutions. It's a hassle, but it is necessary to ensure your work is available to the largest amount of people possible. This is no different from the mobile web and can actually be a bigger challenge because it has a wider range of screen sizes for the development of a desktop than a traditional design.

can not find what works best with the desktop and translates well to mobile devices:. Cater to the most common size and number of your site in a manner that will degrade nicely for other devices

Making the mobile web is not about finding new ways to fit the tone whistles uu these devices. About his decision as a valuable place and what is expendable in this format. This often means the removal of foreign elements, and really thinking about what is valuable in the core sites.

phones come in different sizes.

True, there are tons of cell phones out there. Different shapes, sizes, operating systems, web features. It is important to know when developing for mobile platforms, but what is more important to know how many of these people are really in your target audience. I found the answer is not much.

Do you need to focus all sizes?

I do not think so.

I chose to cater to mobile web development with the devices to really shine on. Smartphone.

This does not mean that you should strive to make the site accessible to as many devices as possible, but browsing the web on most phones is a trying experience, not the activity of most users, the lower end phones, and even participate in.

Let's look at the numbers from the article PhoneArea.com published in November 2009.

* Based on the findings, the iPhone accounts for half of all smartphone traffic worldwide.
* Symbian OS, Nokia acquired, account for 25%, but declined.
* Google Android based phone (Droid, HTC Magic, myTouch 3G and HTC Hero) were grown at 11% - and growing.
* BlackBerry OS accounts for 7% of turnover, a drop.
* Windows Mobile OS, Palm OS and others account for the other web browsers.

iPhone 50% share of a fairly large number. Fortunately for us, taking our site to shine on the iPhone is a relatively simple task. After all, a full featured Safari browser will do a good job providing our pages in the phone while but looks great on the desktop machine.

is not enough, though, as we want to create a web site fully optimized for mobile viewing. Do not just cut down the existing sites for display on the phone.

But the basic thing is, the iPhone offers an environment that is very suitable for showing a nice mobile websites.
What can we gather from this?

If you design and market web sites that cater to the iPhone, Android phone based on Symbian OS, and you've got more than 85% of your potential market covered.

Put forethought in building this site so standards compliant and they will degrade nicely for most devices. This should create an experience that ranges from elegant to tolerable to most people who will access your website.

a new standard resolution:. 240x320

With all this talk about the different screen sizes, it is important to note something important:

trend in the size of the display moves to the joint resolution of 240x320. It has become something of a standard in the same way that modern desktop web pages optimized for a display at around 1280x800.

75% of mobile phones provide a screen resolution of 240x320 pixels or higher. This number is only increasing. This will become more than the norm.

Bearing 240 pixels as the optimum width of the screen will provide the best user experience for most mobile web browsers.

Now, this does not mean that we should strictly for width 240 pixels in your divs or images, it just means they should be designed with this thought in mind that most people will be viewing your site in this rezoluciji.Standardima good looks in line will adjust to many sizes.
Word on the amount.

while the width is a real obstacle in designing for mobile platforms, the height does not seem like a challenge. Touch interface to make navigation and scrolling through the content a breeze. Common sense should tell you not to drop 5 inches tall header at the top of your mobile sites, but the height of the site is generally not much problem. They often browse the web from a well-equipped devices are used to move.
Advise on the creation seems to work on all phones.

So how do we deliver all of these devices? I create a separate site for each device, such as Netscape 4 days past?

No

The vast majority of modern mobile phones - over 80% offer a full XHTML (WAP 2.0) capability. Use this to create standards compliance, flexible CSS based layout.

This will allow you to write code semantic, separate content from presentation, and creating web pages that degrade nicely for most users.
Here are some tips:

* Do not limit the scope. We are established as 320 pixels wide for optimal mobile devices. Does that fix all the values ​​at 320, forcing the viewer to a small device on the side, scroll to see all of your content? No. Instead, create a fluid site that will be adapted to many screen sizes.
* Use a standard HTML tags like H1, H2, UL and strong for text formatting. Do not expect every device custom.title CSS class to format properly in every browser. However, they expect to have your browser will be sophisticated enough to show your H1 tags in larger font than the H2-A.
* Use CSS to redefine the standard of marking, but would not be bent out of shape if they do not all look the same. It can not appear in your font and color, but it'll still be in the H1 tag, and that is what is really important for SEO side of things.
* Web page design in a complex way. Do not float divs, or create a side-by-side layout using tables. There is just not a lot of real estate to work with the linear, or composite display the content more intuitive on a mobile device.

No comments:

Post a Comment