Display issues with responsive mobile site

  • 1
  • Problem
  • Updated 4 years ago
  • Solved
  • (Edited)
I published my site for mobile, the result on mobile looks terrible. Please help this is urgent and it needs to look normal.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes

Posted 4 years ago

  • 1
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Hi Negar,

You really have to either describe the issue or tell us your site name. How does it look terrible? 

The Yola staff can trace your site if your forum login is the same as your sitebuilder login but others in the community depend on a description or a link. 

Yola people generally don't respond on the weekends to forum calls. 
(Edited)
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
The site name is JanoBaghoumian on the domain name of http://janobaghoumian.yolasite.com/
thanks a lot, I really appreciate your help.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Hello Negar,

I really like the feel of your site. There's a unique atmosphere.

The mobile publishing with Yola is quite intolerant of custom coding. The mobile model is quite rigid. You have added a lot of custom CSS and this works beautifully for widescreen viewing devices but I see your issue with phones. 

If you have a look at the native code in your site style there are descriptions by the designers of how layout is affected in mobile publishing. Once you add custom coding the rules get tangled and this I suspect is happening to your site in mobile publishing.

The solution? Simply the Yola mobile publishing doesn't allow for your vision of site artistry or probably more accurately, your solutions and it really plays havoc with your published site on mobile devices. I think you have to make a compromise here if you wish your site to display well on both formats. The compromise is to step back and see what works, one step at a time. If the mobile presentation of some custom styling doesn't work then you can make the decision to leave it off or accept the imperfection. It's a hard choice I know.

The desktop format is very tolerant as you can see but not the mobile.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
in mobile I just want to see the title (the composer part) correctly, and the menu to be able to switch between the pages, this is not much to ask.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Please help me to fix my mobile version, as if I knew this wont be supported I would not use Yola for this website and put this much time.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Hi Negar,

The menu navigation is displaying. The colour contrast maybe preventing you from seeing it. The menu is indicated by a stack of horizontal lines:



I don't know how to fix your title issue. I'll leave it for the Yola people.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Thank you so much please leave a note, I need assistance to fix this and issue and some advice about text pages ...
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hi Negar

This is how I see your website on an iPhone 5:



The only thing I need to do is use my fingers to set the enlarged view back to normal.
Please let me know if you have any questions.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
The title part "Musician Composer" is not readable, also how do we enhance the texts and content view in other pages, especially page Music, Biography, Gallery, Video, and Articles even if I have  to pay to have the mobile version fixed I would like to do that.
(Edited)
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Please help me to fix the problems on mobile: The menu should be always on one place  (in this case Top right corner as the grey color of the menu shows well on the darkness of this corner in all pages) margins of all the text and image container should be 0 so we can see as much text or images of the gallery as the width of the mobile size can hold.
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hi Negar

I've asked my colleague Rodvan to look into this for you. Please allow some time for him to follow up with you. Thanks.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
This reply was created from a merged topic originally titled Mobile Version of my site ....

Please help me to fix the following major problems on mobile version of my site at http://www.janobaghoumian.com/
1- The menu should be always on one place (in this case Top right corner as the grey color of the menu shows well on the darkness of this corner in all pages)
2- Margins of all the text and image container should be 0 so we can see as much text or images of the gallery as the width of the mobile size can hold, specially in BIOGRAPHY and ARTICLE pages.
3- A part of title "musician composer" is only readable in page ARTICLE although everywhere else is designed the same.

Thank You
Photo of Laura Thomas

Laura Thomas, Social Media Coordinator

  • 4536 Posts
  • 211 Reply Likes
Hi Negar,

We are committed to working through this with you and would like to keep the conversation all together here. Thank you for the added details, we will get back to you after we investigate further.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Thanks a lot and looking forward to achieve the result.
Photo of Laura Thomas

Laura Thomas, Social Media Coordinator

  • 4536 Posts
  • 211 Reply Likes
Hi Negar,

We've had several support experts and an engineer look over your website and we all believe that the source of this issue, along with others you have reported here are due to the excessive amounts of CSS code you have used along with extreme margin settings. We're all wowed by the design aesthetic of your site but the way you have gone about achieving it is likely to continue causing display and functionality issues. Our team believes that we can help you achieve a very similar, if not identical, looking design without using custom CSS and extreme margin settings which will address your current concerns and prevent future ones. Please let us know if you are interested in working with our team on this and we will reach out to you direct.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Hi there, thanks for following this issue up. If course I am interested to resolve this issue however there is no excessive amount of CSS being used I just used the margins to make my designed lay out appear. What eas changed in CSS are just to change the font colors that can not be source of lay out problem in mobile.
But anyways let's resolve this as soon as possible as what I can see on mobile is not acceptable.
Thank you and I truly appreciate your hard work to make Yola a better place for us.
There are so many other issues that I reported and need them to be resolve please look through and help all to be fixed.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Please let me know what am I supposed to do, I just notice that all my site layout and font spacing is out of the order it used to be. Should I start redoing all I have done? How can I rely that this does not happen again and again? Should I just start building my site from scratch somehow else out of Yola? Please advice me as I feel I wasted 3 weeks of my time.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
My animated background now does not work in non of the browsers ...
H E L P 
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
What's up with the mobile version, what should I do to fix this issue?
The only acceptable page in Contact page of http://www.janobaghoumian.com/
Photo of Laura Thomas

Laura Thomas, Social Media Coordinator

  • 4536 Posts
  • 211 Reply Likes
Hi Negar,

I was out of the office yesterday and while a member of our team was still working on your account I see they did not come here to update you. The changes you referred to above were never published to your site by our team but we were testing some things. Let me reiterate, the negative margins and custom CSS code you are using on your current site are the cause of your mobile view issues and they will continue to be. What we tested was deactivating your CSS and changing your margins to "rem" from "px" which did improve your mobile view. We realize how much work you have put into your website and don't want to risk testing further in your live site so we're now working in a separate test account to rebuild your website using the Style Designer to duplicate your design in a sane way that will allow your mobile experience to be inline with your desktop experience. This could take some time so we need to ask for your continued patience. We will update you next week and let you review the progress we have made.
(Edited)
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Hi dear Laura,
I appreciate your kind efforts. I am eager to learn more about Yola and its capabilities I hope you can help this issues to be resolved and tell me how exactly to be able to do create custom look and avoid such a problem on Mobile version.

Thanks again and looking forward to hearing your good news soon.
Photo of Rod

Rod, Employee

  • 22 Posts
  • 1 Reply Like
Hi Negar,

Thank you for your patience thus far.

We have managed to rebuild your site but we are still busy with some final tweaks to get the mobile view correct. However, I need to let you know that the desktop view will always look slightly different and therefore we are trying to find a balance for the desktop version and mobile.

We will update you as soon as possible.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Looking forward to see the result, I appreciate your effort I just need to know how long more it may take?
Photo of Laura Thomas

Laura Thomas, Social Media Coordinator

  • 4536 Posts
  • 211 Reply Likes
It's very close Negar. We should be able to have it finished and ready for your review in one more day, possibly two, at which time we'll transfer it into your account. We'll also want to talk through what we did in order to avoid using CSS and negative margin settings so that you can maintain it moving forward. We'll coordinate the best way to do that but I suspect a phone consult would be easiest.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Ok thanks a lot, I am eager to learn more about Yola.
Photo of Rod

Rod, Employee

  • 22 Posts
  • 1 Reply Like
Hi Negar,

Thank you for your patience.

We are pleased to advise you that we have completed your newly rebuilt website. Please take a look at the site on mobile as well as on desktop and if you are happy then we will transfer the site to your account. Here it is - http://siterebuild.yolasite.com/ .

We have achieved this without using negative margins as well as using "rem" size setting which is a more responsive setting for smaller screens as oppose to using "px". Here is a free chart to help with the conversation - http://pxtoem.com/ .

If you are interested in discussing this over the phone then we will be happy to contact you. Please forward your contact details as well as a suitable timeframe to support@yola.com.

We are available by phone Monday - Friday between 8am GMT (10am SAST / 3am EST / 12am PST) and 7pm GMT (9pm SAST / 2pm EST / 11am PST).

Please let us know which timezone you are in and we will do our best to accommodate one of your preferred times.

To convert your time zone, please visit the Time Zone Converter.



We look forward to your response.
Photo of Laura Thomas

Laura Thomas, Social Media Coordinator

  • 4536 Posts
  • 211 Reply Likes
Hi Negar,

I removed your post because it's not advisable to share your personal contact information on our public forum. The agent who rebuilt your website is not available for a call now, however I will leave him your number and timezone information and he will reach out to you tomorrow. We look forward to chatting with you.
(Edited)
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
thank you, tomorrow between 12:00 pm - 6:00 pm my time will be OK.
Photo of Laura Thomas

Laura Thomas, Social Media Coordinator

  • 4536 Posts
  • 211 Reply Likes
Excellent! I've passed that on to Rodvan and he will reach out tomorrow.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Please call me or provide a phone number that I can call.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Ok finally I could check the mobile view, it looks good. Thanks a lot. I appreciate your team hard work and support. I would like to add that to my yola sites, but at the same time have my original one to refer and add the new information to the new site. Also some tweaks needs to be done the font size and lay out of the site title and navigation, that I can explain on the phone and hear the explanation on your side.
Photo of Laura Thomas

Laura Thomas, Social Media Coordinator

  • 4536 Posts
  • 211 Reply Likes
Hi Negar,

I'm glad to hear you were able to view the mobile version. Rodvan did reach out to you today and there was no answer nor any option to leave a message. As such he sent a followup email. He will be happy to reach out to you again tomorrow to go over the website and we can transfer the website to your account once he has walked you through it.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Title; the second line Musician Composer should be grey and smaller "m" should be aligned with "B" on the first line and only "r" come out of under "N" in the first line
Navigation font should be smaller, closer to each other (Lines distance), and grey color.
I prefer not to have content on the background face, a solution is to bring the content area closer to navigation.
Background animation still does not work in new Chrome. 
All the white text also need to change to grey.
Copy right text should be smaller and grey color.
Submit button in contact page should have rounded corners (roundness "2" )
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Please call me on my phone, if you are using contact applications please let me know to be attentive to them it's passed 48 hours I am waiting to discuss this. I don't have more time to spend on this please reach out to me now, or contact me through email. It's better than nothing.
Photo of Laura Thomas

Laura Thomas, Social Media Coordinator

  • 4536 Posts
  • 211 Reply Likes
Hi Negar,

I see that you and Rodvan were able to connect and make excellent progress today. I'm so pleased! I see you have one more concern he plans to follow up with you about and then we look forward to featuring your mobile friendly redesign on our blog! I'm confident this will serve as an excellent learning experience for many more website designers in your situation.
Photo of Negar

Negar

  • 97 Posts
  • 3 Reply Likes
Hi Laura,

Yes thanks for your support.