-
1 Attachment(s)
The right page sizes for proper transistions
Hello all (again :( )
Sorry might be a stupid question....
I have a 3 size site
Mobile 500px (says to 690)
Tablet 880px (says to 1000)
Main 1000px (an up)
Issue is as you may guess that pages 690 an up jumps to the the 880 size and do not fit.
No idea what to do to fix it. I did not tell it to go to 690 and change to the 880 version
ps to see the issue https://steamqualityinnovations.com/index.htm
Thanks
One last question is it possible to make xara generate html not htm files?
TimAttachment 130215
-
Re: The right page sizes for proper transistions
Ok I think I see the issue trying a fix
Sorry to waste anybody time on the page size html question still valid
NOPE did not fix it back to asking for help...
-
Re: The right page sizes for proper transistions
Tim, when you export your website you can name it index.html to load it to your hard-drive, rather than the default index.htm
Then if you go publish website to your hosts server it will upload as index.html and contain a subfolder index_html_files (not index_htm_files) as well as contact.html, about.html pages etc
-
Re: The right page sizes for proper transistions
Tim, would exporting your site with Scale-to-fit-Width resolve the scale issue?
Gary
-
Re: The right page sizes for proper transistions
Hi Gary
Scale to fit worked to an extent but the issue now is that the nav bar does not keep to the same size as the rest of the page and the main page does not keep centered as the page gets larger than the set width. It hugs the left side.
Tim
-
Re: The right page sizes for proper transistions
Tim,
Maybe post a XAR/WEB file here with the issue?
Gary
-
Re: The right page sizes for proper transistions
Hi Seems the file is to big for here
I placed it on my drive
https://drive.google.com/file/d/13-T...ew?usp=sharing
-
Re: The right page sizes for proper transistions
Tim,
Try changing export Scale-to-fit-Width maximum to be at least the size of your main page 1120px. I changed this from 1000px to 1200px and the scaling issue across your 3 variants looked OK on the index page.
In the version I downloaded, on the mobile variant, MobileGif.gif would not render (checked via Inspect) and it cannot find it. Looked OK in the original URL you posted.
Gary
EDIT: downloaded the gif from your site and all now looks OK.
-
Re: The right page sizes for proper transistions
Cheers Gary
That fixed it!
Many many appreciations!!!!
Tim
-
Re: The right page sizes for proper transistions
Well I thought it was fixed...
In a PC browser, its resizes great. But going from portrait to landscape on phone it does not work.
Tim
Its live on the web now.
-
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
TimBox
Its live on the web now.
"About us" is blank.
Verity is about truth, variety is about variation.
Nothing on the resources page seems to result in a downloadable resource!
-
1 Attachment(s)
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
TimBox
Well I thought it was fixed...
In a PC browser, its resizes great. But going from portrait to landscape on phone it does not work.
Tim
Its live on the web now.
Tim,
I changed the Scale-to-fit-Width in your shared TG copy as I advised to a maximum 1200px and published it (temporarily) here as a test: https://initiostar.co.uk/demo/TB/
Appears to work in a mobile landscape format on my mobile (though not sure why someone would do this other than for a video).
For completeness:
Attachment 130226
I can't tell what you else you may have changed after you shared the file on TG; it seems to work for me, but I've not looked at anything else on your site.
Gary
-
3 Attachment(s)
Re: The right page sizes for proper transistions
Following a link from "steamqualityinnovations". A very poor experience on my iPhone.
Attachment 130227
and from the https version..
Attachment 130228
Attachment 130229
-
Re: The right page sizes for proper transistions
Paul, do you get a better experience with the test https://initiostar.co.uk/demo/TB/ ?
-
Re: The right page sizes for proper transistions
Just from looking at the deployed site, the smaller variant has a carousel sitting off right (https://www.talkgraphics.com/attachm...7&d=1627121404) where it is cut off by Clip to page edges.
This clipping is also telling me your page width sizes are (1280, 880, 875). On the smallest variant the NavBar is far too wide.
There is no Scale to fit width applied.
You seem to have different published material in http:// & https:// presentations.
I have no interest in having to check into your design as well until you have normalised what it presently askew as indicated.
Acorn
-
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
Initiostar
Initiostar, your rendering is fully functional across Desktop browsers. I only have Android but I see two of the sizes fitting perfectly.
Acorn
-
2 Attachment(s)
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
Initiostar
It now works as I would expect though the product page is not fit for purpose on my iPhone - product images with exclamation marks and no information.
Attachment 130231Attachment 130232
Good job.
-
1 Attachment(s)
Re: The right page sizes for proper transistions
Quote:
It now works as I would expect though the product page is not fit for purpose on my iPhone - product images with exclamation marks and no information.
If I hit the explanation mark (I personally think this needs to be an 'i') the information pop-up's work on my iPhone Paul. It would possibly be better if if the pop-up's weren't set to automatically close though.
-
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
Egg Bramhill
If I hit the explanation mark (I personally think this needs to be an 'i') the information pop-up's work on my iPhone Paul. It would possibly be better if if the pop-up's weren't set to automatically close though.
My initial big finger stabs at the exclamation mark did nothing, but you are right - hit it in the right place and the pop-up appears.
Right it works but from a UX perspective it really is poor.
It requires that I as a user understand that hitting a small explanation mark will give me more information, but initially I thought that the explanation mark denoted an error.
It's a really small target to hit - way smaller than is good mobile practice.
Finally.. THERE IS NO NEED TO HIDE THAT INFO IN A POPUP.
Put the info under the picture so only scrolling is required. This is why we have variants.
Egg, did you manage to download any resources?
-
Re: The right page sizes for proper transistions
Quote:
It requires that I as a user understand that hitting a small explanation mark will give me more information, but initially I thought that the explanation mark denoted an error.
Agreed Paul. That's why I suggested an 'i' as that is a more universal symbol for information.
Quote:
Egg, did you manage to download any resources?
No, but I didn't expect it too. This is a draft site posted by Gary. Not even Tims site has working links at present.
-
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
Egg Bramhill
Agreed Paul. That's why I suggested an 'i' as that is a more universal symbol for information.
No, but I didn't expect it too. This is a draft site posted by Gary. Not even Tims site has working links at present.
I agree that "i" is clearer. If there was an insistence that a (unnecessary) pop is used it would be clearer but the whole of the graphic area should be the hit target.
As far as using top-level domains for testing, I am going to say that is also bad practice. Always use a sub-directory - call it TEST or whatever and host your test sites there. Sites in development sitting on a top-level domain is never a good look. The visitor to a top-level domain for a business expects a completed site.
-
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
pauland
As far as using top-level domains for testing, I am going to say that is also bad practice. Always use a sub-directory - call it TEST or whatever and host your test sites there. Sites in development sitting on a top-level domain is never a good look. The visitor to a top-level domain for a business expects a completed site.
+1
Acorn
-
Re: The right page sizes for proper transistions
I think I'm missing the point here. Gary's draft site resides at "https://initiostar.co.uk" under a subdirectory "/demo" with a further subdirectory "/TB/"
Right or wrong?
-
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
Egg Bramhill
I think I'm missing the point here. Gary's draft site resides at "https://initiostar.co.uk" under a subdirectory "/demo" with a further subdirectory "/TB/"
Right or wrong?
Follow the link in the first post..
-
Re: The right page sizes for proper transistions
So Tims site as a draft is a nono. Garys draft is fine. Correct? ;-)
-
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
Egg Bramhill
So Tim's site as a draft is a no-no. Gary's draft is fine. Correct? ;-)
Not sure where we are headed here: Tim (OP) explained he had 3 variants; with Scale-to-fit-Width he had render issues with a main variant page size of 1120px and a maximum StfW of 1000px. This will not work! I simply pointed out the maximum cannot AFAIK be logically less than the largest page width - suggested maximum of 1200px and it worked.
I cannot see any difference now between https://steamqualityinnovations.com/index.htm and the demo/test I created to check the StfW issue was resolved - https://initiostar.co.uk/demo/TB/
There are other issues for the OP to sort for sure; true it would have been better to resolve these before the site was published and where necessary to temporarily restrict the menu to those pages that are complete.
We would likely all come up with a different design; I have simply tried to address the specific issue based on the XAR the OP provided.
Gary
-
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
Egg Bramhill
So Tims site as a draft is a nono. Garys draft is fine. Correct? ;-)
Err.. no
I'm not sure where we are going with this, either.
Tim I think you have a few pointers going forward and I wish you all the best with it.
-
Re: The right page sizes for proper transistions
Quote:
As far as using top-level domains for testing, I am going to say that is also bad practice. Always use a sub-directory - call it TEST or whatever and host your test sites there. Sites in development sitting on a top-level domain is never a good look. The visitor to a top-level domain for a business expects a completed site.
Things are getting very muddied here.
So we have two sites, Tims original which points to his top level domain is stated as being bad practice and I'd agree
The second is Gary's (Initiostar) draft site in a subdirectory of a subdirectory which I thinks fine.
So what is it?
-
Re: The right page sizes for proper transistions
Quote:
Originally Posted by
Egg Bramhill
Things are getting very muddied here.
So we have two sites,
Tims original which points to his top level domain is stated as being bad practice and I'd agree
The second is
Gary's (Initiostar) draft site in a subdirectory of a subdirectory which I thinks fine.
So what is it?
Gary's site solved the issue that Tim first mentioned. Good job.
As you say, top level domain as a test site -no, no, no.
I then went on to mention things I had found an issue. Some of the things which I mentioned were because the site is incomplete, but my mindset was that this was a finished site with an issue (otherwise why was it "live"?).
Forgetting the empty pages..
We had a discussion about the product page info - which is a very poor experience on my iPhone.
- Exclamation marks made me think there was an error
- The buttons for more info are tiny and hard to hit (if you use buttons in this context make the whole graphic the button)
- The pop-ups add friction to the user experience while adding the popup info below the image would allow easy access via scrolling because the necessity to click on something is gone.
I did go on to the resources page which doesn't seem to have any downloads enabled -but OK, a work in progress.
Tim you've not done anything people haven't done before so I raise the issues simply to try and make your site a better experience for the user - on mobile at least.
-
Re: The right page sizes for proper transistions
The temporary test site I setup has served its purpose and has now been deleted.
Gary
-
Re: The right page sizes for proper transistions
Thanks for the further clarification Paul. With you now.