I made an email HTML template. It is developed using some tables with 2 columns.
If I watch this email with some clients in different devices everithing looks good. But if I watch the email with an iPhone (of my friend) my template become 1 column, images become bigger, tables with border and some other problems.
I don't have an apple device, so testing is very difficult. what I'm asking here is if exist a way to emulate the iOS mail client or other any suggestions are appreciate.
Thanks
Look into using Google Chrome. It's based on webkit, an open source browser engine which is also what IOS uses to render emails.
When you use Inspect mode, it gives you a list of devices it can emulate. I can't verify right now that it's the same list for Windows or linux. It's close.
It's not a replacement for using actual devices or a services like Email on Acid or Litmus, but it gets you some feedback on how your design looks on other devices and it's free.
Good luck.
Confirmed: I finally got Windows 10 working and I can confirm that Google Chrome allows you to Inspect your code and emulate the look on an iPhone, iPad, Galaxy or Pixel device. You can customize to add specific devices (if available).
This is exactly what you are after:
https://litmus.com/email-testing
I have used this a lot! And it works really well!
Also, try and take a look at this:
https://www.campaignmonitor.com/css/
Really nice tool to check what's compatible in different e-mail clients.
Related
I can't seem to find a good answer to this anywhere. When using the "none / custom" mobile app service in the configuration for MobileESP in Joomla! it seems like you are required to enter the "device detection functions used".
Instead of entering every mobile device specifically (windows phone 7 os, ios, blackberry etc), isn't there a single setting that covers "all" mobile devices? I haven't been able to find that, but kind of expected it to exist. If not I'd be pretty disappointed...
I have not installed the Weever App, because the only thing I need is to redirect to a mobile site and support mobile devices to also view the full version (by adding a url parameter like "?full=1").
Any help will be appreciated! I have very little PHP experience, and even though I know you can add this functionality with a bit of PHP code in the header I'd rather just use a plugin for now.
Have you contacted the Weever folks yet? That would be the best place to start first.
I'm the founder and maintainer of the MobileESP code library. However, I'm not familiar with how Weever has integrated MobileESP support into their plugin.
If you were interested in MobileESP all by itself, then I would suggest you use one of the generic detection methods, depending on your goals. Specifically:
DetectIphoneTier(): Use this only if you want to detect modern touchscreen smartphones like iPhone, Android, Windows Phone, etc.
DetectMobileQuick(): Use this if you want any mobile phone, including old BlackBerry and Symbian smartphones as well as feature phones.
Links:
Weever on Joomla: http://extensions.joomla.org/extensions/mobile/mobile-apps/17890
MobileESP API reference: http://blog.mobileesp.com/?page_id=53
I am building a website for a friend and it's just about done, apart from a bit more content, but now he tells me that it doesn't look right on his iphone. I have checked it on Safari, Opera, IE, Chrome and Firefox on laptop, and on my Android phone and on web-based iphone emulators and everything looks fine. I had him check on someone else's iphone and 1 of the problems goes but the other remains. My site is pretty basic, html and css only, but I am the first to admit that as I am new to this my code could probably be better.
The first issue is that above the header his iphone shows there are what's best described as 5 red bricks evenly spaced along the top. This doesn't show on his mates iphone.
The second issue is that on the "products" page, the right column text under the pictures isn't lined up properly, which is the case on his mates iphone. I don't know what to do here because if I alter the padding I used to line things up, it won't be right on every other browser/device.
I'm not sure what I'm best posting on here, the whole code for the site seems too much, but whatever needed to help answer just let me know. The site address for the products page is http://www.doortodoordrinksyork.com/products.html
Like I say I'm new to this so please keep answers simple.
Thanks in advance.
David.
PS Would appreciate anyone with an iphone telling me how the site displays on it.
If you use a Mac, you can use the iOS Simulator tool that comes with XCode to test out your site in a virtual iPhone/iPod. You can even compare different versions of the built-in browser, which I think is what's causing the difference between your mate's devices.
In general, well-built sites will 'work' without modification on mobile devices, but you may want to look into media queries, a CSS feature that lets you target specific screen sizes with different rules.
I'm using win7.
and i have website which i want to test it with iPhone browser environment.
which it's use most flash (jISFR).
this is the website i talking for,
http://www.hamuranalodge.com/
may you can see menu navigation is using flash jSIFR, which it's seems not work in iPhone, and want to fix it. of course i need iphone Testing for it.
Is there somebody know how i can test it with iphone browser?
may there is a software can do it?
or a website give service like that?
Thanks
Not a perfect solution but you might be able to test it on the Android browser instead. The SDK runs on all major OSs and is free to download and install. Just make sure that flash support is turned off. I'm pretty sure iPhone and Android both use WebKit so you should get similar behaviour on both.
You could use the iPhone simulator if you have access to a Mac.
There are sites like this:
http://www.testiphone.com/
but this one doesn't work very well, at least not for this particular request. Go there and point it at www.worldsbk.com - it renders the Flash block on the top right hand side just fine on my desktop computer (Firefox3 Mac OS X), but have a look here:
http://www.flickr.com/photos/bigiain/5037577763/
to see a screen grab of that page from my iPhone... Note the big grey block where the flash bit should be...
I need to develop a website which will be used exclusively on iPhone and iPad. I don't have those devices, neither do I have a Mac.
What are the possible free solutions for me to be able to test the website during development?
The most obvious one would be to use an iPhone SDK, but since it costs $100/year but since it is available only for Mac, it is not a solution in my case.
Download Safari 5 for Windows, enable the Developer Menu features and change the User Agent to Mobile Safari iPad or Mobile Safari iPhone. This will let you see how your website looks when an iPad or iPhone renders it. Just make the window smaller to get the full experience.
If analyst predictions are right, there will soon likely be an abundance of iPhone 3G devices on eBay as lots of people are eligible to upgrade to iPhone 4 tomorrow. Picking up a cheap 3G may be the best solution to your testing requirements.
Or you can test it out at an Apple Store if your website is accessible over the internet or available on a laptop with an ad-hoc WiFi connection.
You can test your website in any browser, but yes, mobile browser probably behave different at some points.
If you cannot find a mobile web browser simulator for iPhone than the "cheapest" alternative would probably be an iPod touch.
Update:
You might want to have a look at iBBDemo:
iBBDemo2 - Cross Platform iPad and iPhone Simulator
You could try using something like:
www.testiphone.com/
Recommend you use jsconsole
Remotely debug a mobile web app
jsconsole.com is a simple JavaScript command line tool. However, it also provides the ability to bridge across to other browser windows to remotely control and debug that window - be it in another browser or another device altogether.
In fact, mobile web app debugging is so damn tricky, that I gave up, and decided to build this very tool instead. See the videos examples if you'd rather see this in action now.
Creating a session
To create a new session, in the jsconsole prompt, simply run:
:listen
This will yield a unique key along the lines of FAE031CD-74A0-46D3-AE36-757BAB262BEA. Now using this unique key, include a anywhere in the web app that you wish to debug:
<script src="http://jsconsole.com/remote.js?FAE031CD-74A0-46D3-AE36-757BAB262BEA"></script>
Now any calls to console.log from your web app will display the result in the jsconsole session that is listening to your key. Equally, if you run a command in the jsconsole session, the code will injected in to your web app and the result returned to jsconsole.
In addition to generating a new code with :listen, you can also ask jsconsole to listen to a predefined code (but for your own security, try to chose something unique that only you know):
:listen FAE031CD-74A0-46D3-AE36-757BAB262BEA
Now I can use the same remote key in my web app to avoid having to regenerate a new code each time. Note that only the last remote client (i.e. your web app) to connect to jsconsole will recieve remote debug calls - previous windows will be ignored.
To know when the web app has connected, jsconsole will notify you by showing your the userAgent string for the device:
:listen FAE031CD-74A0-46D3-AE36-757BAB262BEA
Creating connection...
Connected to "FAE031CD-74A0-46D3-AE36-757BAB262BEA"
Connection established with Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en-GB; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8
A word of warning
Note that this technique is also injecting code directly in to your web app - this tool should only be used for debugging. I can't take respibility for how you use this tool, basically: take care!
Current known support
Remote debugging has been developed to work on all platforms, even if the technology isn't supported. However, jsconsole remote debugging has specifically tested and working on the follow mobile devices (feel free to add to this list):
iOS 4.2.x - iPad, iPhone 4
Andriod 2.2.2 - Nexus One
webOS - Palm Pre
There are some Video examples too
More detailed information please see this links:
http://jsconsole.com/remote-debugging.html
There are some obvious things here:
1)Work very hard to make your site work on all major browsers - including Safari and any other mobile devices other than iPad... this will let you make sure it works on smaller screens well.
2)Read up on known glitches in these browsers and see if you can avoid them.
3)Whenever you are with friends showing off their iPad, or who have an iPhone, ask to test your site on it.
I need to develop a website which will be used exclusively on iPhone and iPad
This seems a bad idea. if it's only used on iPad/iPhone, surely you should write an App and get all the benefits of UI, etc.
Websites should not be tied to specific devices.
This is not 1998 : Best viewed in I.E. In fact your suggestion is worse than that.
If you really want a website that only works on those devices then you'll need to check the user-agent string, but otherwise html is html and unlike what Apple may want you to believe, works just as well on Symbian, Blackberry, Android, S40, Windows, Windows Mobile, etc etc..
(In fact, it works better on Symbian as Symbian actually supports Flash.)
I was wondering if I could access the iPhones Core Location framework over a website?
My goal is to build a webapp/website that the iPhone would browse to, then upload its current GPS location. This would be a simple site primary for friends/family so we could locate each other. I can have them manually enter lng/lat but its not the easiest thing to find. If the iPhone could display or upload this automatically it would be great.
I don't own a Mac yet (waiting for the new Mac Book Pro) but would like something a little more automatic right now. Once I have the mac I could download the SDK and build a better version later. For now a webapp version would be great if possible. Thanks.
Why not simply use W3C GeoLocation API available in mobile Safari? This will work on ipod touch as well (suburb precision).
It's literally 10 lines of code and the javascript will work without change on Firefox 3.5. Far easier than scrape some third party website.
http://www.instamapper.com/iphone
iPhone App store
While this may not directly answer your question, there are quite a few iPhone apps that already do this kind of thing with GPS. Instamapper is the first one I pulled up from the app store, but I'm sure you could find something to fit your needs.
I'm pretty sure you can't do what you want directly.
The best idea I can come up with is to "reuse" an iPhone app that records location and makes it accessible on the web. Take Twitter for example. If I'm not mistaken, Tapulous' app Twinkle will grab your location and post it to your Twitter.com user profile. Here's an example of what that looks like:
From your webapp, you could then scrape the user page for each person whose location you're interested in. It's a pain in the butt, but like I said, this is the best I could come up with.
Again, if you don't want to mess with Twitter, there may be other apps out there that do this as well, but I don't personally know of any. Good luck.
We built a really thin iphone client app that simply calls a predefined .js file on our site. Works like a charm.
See arisgames.org for the project.