Mobile Website Showcase [IMAGES]
 

Now we have a forum section dedicated to mobile marketing, I thought it would be a great idea if we had a thread where we can all post examples of mobile website designs we have either created ourselves or seen around the Internet.

IMPORTANT!
********************************************
Please ONLY post images of the mobile website - NO links.
This way we are not exposing anyone's code unnecessarily.
Also please do not include any actual links to the domain.
********************************************

To post an example image you can download the free mobile website emulator at: Mobilizer Mobile Emulator

This emulator will allow you to take a PNG screenshot right from within the program. Simple.

You can then upload the image to a free image hosting service such as: http://imgur.com/

Here's a simple one to get us started:

http://i.imgur.com/dW4c9.jpg

Re: Mobile Website Showcase
 

How about another thread for mobile apps showcase (i.e. NOT websites)? I could definitely post some screenies there :)

Re: Mobile Website Showcase
 

I think there's a much bigger demand for mobile websites & the more resources we can put together, the better =)

Re: Mobile Website Showcase [IMAGES]
 

Mobile websites are fine. But apps are really where it is at. A website can work only so good on one phone and then AWESOME on another. Personally, I see apps as the way to go. A website as a back up is cool but with mobile just taking apps are better use of time.

Re: Mobile Website Showcase [IMAGES]
 

That's your opinion and you are welcome to it... however I strongly DISAGREE.

Apps are great for big corporations but they are NOT a sensible solution for the average small local business owner. Think about if for just one second. Do you really think I am going to download apps for all my favorite local restaurants, bars, my plumber, my locksmith, my dentist, my mechanic, etc, etc? My phone would be full of these useless apps I use once in every blue moon.

A MUCH more sensible AND cost effective solution is for small business owners to have mobile optimized versions of their website. This way we need only bookmark our favorite sites and we don't need to download a separate app for each and every business. We can then easily access their website whenever we need to.

Besides, when I (the typical person) am looking for a service provider in my local area do you REALLY think I would go to the app store and search there? Of course I would not. I would go to Google and do my search. What am I searching for at Google? A website!

Sorry to say but websites are definitely where it is at for small local businesses - there is no denying it.

Let's not get off topic. This thread is for mobile website design examples.

http://i.imgur.com/y3IiQ.jpg

Re: Mobile Website Showcase [IMAGES]
 

This is a great idea ! once I have something worthy I will contribute. BTW I use that mobilizer mobile emulator all the time. Thanks for the resource

Re: Mobile Website Showcase [IMAGES]
 

I have to disagree with this as well. Many mobile apps are quite expensive and you need to create different versions for different mobile platforms (iPhone, Android, BlackBerry, Windows Mobile...). A mobile website can be programmed to look like an app, yet can be viewed on most phones. Yes there will be the occasional phone where things won't look right, but if you follow general mobile standards, it will look correct on 95% of phones.

Additionally, studies have shown that people are more likely to stay within their mobile phone browser and visit sites in that framework than load up different apps for different businesses. There are some exceptions where apps make sense, but I would say those are for much larger companies with huge marketing budgets. For most small businesses an app is not cost effective when you have to essentially quadruple the price for getting one for all different types of phones.

-Ben

Re: Mobile Website Showcase [IMAGES]
 

I also wanted to add to the forum a sample that I use:

http://i.imgur.com/K3Tz4.png

Re: Mobile Website Showcase [IMAGES]
 

And some more...

http://i.imgur.com/X2m69.jpg

Re: Mobile Website Showcase [IMAGES]
 

Re: Mobile Website Showcase [IMAGES]
 

Here is one that I am currently making for a client. Basic stuff but looks nice on the phone!

http://imgur.com/Ek9ep.png

Re: Mobile Website Showcase [IMAGES]
 

Hey WillR,

Did you create those great looking mobile sites with only your php product or are they a mix and match of other design techniques?


Also what image format works best form mobile sites. Im just starting a mobile design for my day job employer and i just ran the url through the validater and im only getting a 55% score? Im using png because i need the transparency .

Re: Mobile Website Showcase [IMAGES]
 

Mark,

They are not actually sites I created... I'm flattered you'd think that but... no!

I just want to give people a look at all the different mobile sites out there so we can all get some inspiration for our future designs.

The best image formats to use for mobile websites are gif and/or jpg. Try and steer clear from using png images. Some older phones don't render them very well. If you can get away with it then just use a gif or jpeg image and put the background color in that image rather than using a transparent ibackground.

Re: Mobile Website Showcase [IMAGES]
 

Here's a selection of my own mobile marketing landing page designs for offline businesses.


Neil B :cool:

Re: Mobile Website Showcase [IMAGES]
 

Hey Will, great idea for a thread. Here's my contribution, it's a site we designed for a tattoo studio:

http://i.imgur.com/u6rxN.png

- Josh

Re: Mobile Website Showcase [IMAGES]
 

Thanks for your reply willR, i will fire up cs5 tonight and change my images to gif and include the same background color to those images the same as the sites background color.

Cheers.

Some awesome examples being put up here.

Re: Mobile Website Showcase
 

Start it up and PM me the thread link. I have some to display too.

Jerry

Re: Mobile Website Showcase [IMAGES]
 

How about sharing the links to the mobile websites also?...please

Re: Mobile Website Showcase [IMAGES]
 

This showcase was a great idea for ideas WillR -
(too bad we can't navigate the site, but I see your point of fairness ;) )

How complicated are those Car dealer sites to create do you think?
using the car pic in an app button style makes thing really easy to navigate a dealer site.

Re: Mobile Website Showcase [IMAGES]
 

Re: Mobile Website Showcase [IMAGES]
 

Absolutely fabulous!!! Where do we learn how to make all these different types? I have yours already Will but would love some variations.

Re: Mobile Website Showcase [IMAGES]
 

After an hour of messing about in cs5 i made my changes from png to gif format. All good apart from my buttons.

Im using kompozer to build the mobile site and when i set the background color to my choice of #D4D4D4, a kind of light grey, and then go to cs5 and set the background layer of the button to the same #D4D4D4. But when i insert that image into the site the two colors are very slightly different!! which is a pain!

So just for those buttons im going to have to leave them at png. The site loads ok into all the emulators i know of and in the W3C mobileok checker im getting a score of 65% so its an improvement.

Re: Mobile Website Showcase [IMAGES]
 

oh my god how do you create these good sites what do you use?

Re: Mobile Website Showcase [IMAGES]
 

The reason I ask people do NOT include links to the mobile sites is to help protect the source code and hard work of those site owners. If someone is posting an image of their own website and they have created the code from scratch themselves, then they are more than welcome to post a direct link to their website.

I myself have had issues with people stealing my source code and re-selling it as their own on this very forum so I know how easily it can be done.

I hope you guys understand!

Re: Mobile Website Showcase [IMAGES]
 

wow awesome guys, Neil loving the sites the simple opt in splash will be great from night clubs and such. Ben I have been playing around with your very generous free template and realizing the css can be a bit 'finicky' so learning a lot!

Re: Mobile Website Showcase [IMAGES]
 

One thing to remember with a lot of the fancy sites here is they are phone specific in that they look great on an iPhone but try them on some other phones and they degrade a lot.

I have just been through testing the ones I could actually access on my HTC and in most cases it was pretty sad.

So looks arnt everything.

As you can see in this graph the android market is really starting to kick off so better to build fluid width sites to reach all phone styles.

StatCounter Global Stats - Browser, OS, Search Engine including Mobile Market Share

Q

Re: Mobile Website Showcase [IMAGES]
 

Is it okay to make fluid custom websites using tables ? do most of the new phones support those?

Re: Mobile Website Showcase [IMAGES]
 

Yes but try to do them in CSS.

CSS Styling Tables

Q

Re: Mobile Website Showcase [IMAGES]
 

Here are my meagre efforts. I actually thought they were quite good till I saw Neil's!

Towtruck is built with Quentin's script, restaurant built with Will's.

Both sites have menus underneath the text, but unfortunately the whole page doesn't load up on the emulator.


http://i.imgur.com/jN4VX.png http://i.imgur.com/APMBx.png

Re: Mobile Website Showcase [IMAGES]
 

http://i.imgur.com/QmEq3.jpg

http://i.imgur.com/FY3ed.jpg

http://i.imgur.com/CwNqX.jpg

Re: Mobile Website Showcase [IMAGES]
 

http://i.imgur.com/AX1zW.jpg

http://i.imgur.com/6KliM.jpg

http://i.imgur.com/sjPGZ.jpg

Re: Mobile Website Showcase [IMAGES]
 

Awesome idea and thread! :)

Re: Mobile Website Showcase [IMAGES]
 

Cool site..!

Is it only for Iphone? or Android as well?

Re: Mobile Website Showcase [IMAGES]
 

Hey thanks bud...

Neil B :cool:

Re: Mobile Website Showcase [IMAGES]
 

Vey well said Q...hope mine are ok lol

Neil B :cool:

Re: Mobile Website Showcase [IMAGES]
 

I like the right one that's in Swedish ;)
Have you created all of the mobile websites that you posted here, Will?
If you did I just have to say that they look awesome. Can you make sites like these with you templates? I'm asking cause I'm really interested in buying your WSO.

Re: Mobile Website Showcase [IMAGES]
 

wow that's cool. I liked it. Specially it's useful for us and also portable to use.

Re: Mobile Website Showcase [IMAGES]
 

Hi Quentin,

Do you use tables when building your mobile sites? Also do you teach how to do this in your training tutorials.?

Re: Mobile Website Showcase [IMAGES]
 

They look great Neil

Q

Re: Mobile Website Showcase [IMAGES]
 

Hey thanks Quentin, much appreciated...glad you like them.

Neil B :cool:

Re: Mobile Website Showcase [IMAGES]
 

Looks like I may have to get me some frilly wear!!!

Another great post Will. Thanks my friend :D

Sam

Re: Mobile Website Showcase [IMAGES]
 

NNNIIICCCEEE Neil!!! That is one awesome portfolio you have there buddy :D

Take a bow! What did you use to create them if you don't mind me asking?

Thanks again,

Sam

Re: Mobile Website Showcase [IMAGES]
 

Neil B, they are some great designs!!

All these are great for some inspiration.

Here's one for a popular wind-screen repair company here in the UK. This is the perfect type of business to go sell one of these sites to imo.

http://i.imgur.com/m1ogP.png

Re: Mobile Website Showcase [IMAGES]
 

Hey Sam...They're all created from scratch buddy and thanks so much for the compliments...I'm bowing as I type lol

Neil B :cool:

Re: Mobile Website Showcase [IMAGES]
 

Here's another one of my designs...

Neil B :cool:

Re: Mobile Website Showcase [IMAGES]
 

JT, Dude that "Assess My Damage" button has my head exploding with ideas for what can be done for a variety of service companies.

Totally awesome share!!!

You, Neil and Will are gonna cause me to lose a lot of sleep over this :D

Sam

Re: Mobile Website Showcase [IMAGES]
 

Sleep....whats that??? :)

Neil B :cool:

Re: Mobile Website Showcase [IMAGES]
 

Lol!! Glad to be of help!!! There is loads in this thread we can all get ideas from!! Good luck with the sleep ;)

Re: Mobile Website Showcase [IMAGES]
 

[IMG]http://i.imgur.com/ViUbu.png[/IMG]

[IMG]http://i.imgur.com/7Z093.png[/IMG]

Re: Mobile Website Showcase [IMAGES]
 

So Neil! - You're a "scratch" player eh?

Do you have any tips to help shave a few strokes for us who play with a big handicap? ;)


Great Stuff - Keep um' coming!!