Jumping header text

[charles m]

Hi there

We are finalizing the general layout of our site. Its a portfolio website.

Homepage, Projects, Journal (sketches), Contact etc.

The pages make use of two types of master page to create a consistent header (one type is fixed for the homepage the other type used in all the other pages is floating). Something thats really frustrating is that its all consistent and flowing until one particular page in Chrome where the header shrinks a little. Its fine in IE and Edge but not in Chrome.

Ive tried copying a page through with all the settings needed and this didnt seem to help.....

Any help would be appreciated.

Many thanks

Charles

[crispy68]

Very hard to give any constructive advice based on your description without actually seeing what you are talking about. Do you have a link to the page in question? A demo project would also be very helpful. Which page is having the issue? The fixed header page or the floating header pages? Are there any differences between the 2 other than one is fixed and the other is floating? is it noticeable no matter the size of the browser? What are you using for the fixed header and floating header? Layout grid? Flexcontainer? Header object?

[charles m]

Tanks for the reply. I guessed it was going to be too vague to answer without some sort of demo. Ill have to work out how to upload it onto my domain so I can send a link.
Any advice on that as well would be appreciated! (crying laughing emoji)

[crispy68]

I usually just create a folder on my server (ex: demo) and upload the files to this folder. Then the link would simply be something like:

www.mydomain.com/demo/

If you upload a project file, simply upload the .wbs project file to the same folder and provide a link like such:

www.mydomain.com/demo/myproject.wbs

[charles m]

thanks thats great.
ill give that go.

[charles m]

hi there.


I have managed to upload it with the following link

https://www.meloy.co.uk/meloydemo/index.html

Interestingly the title bar seems to be ok now and consistent between the pages (home, projects and journal). I have checked it in IE and Edge

I think I probably really need to reduce the image sizes (approx 400K each) as its very slow to load on first view.... Also I need to work out how to get the title bar to remain gray once a link has been followed....

best wishes

Charles

[charles m]

Sorry can I ask a question on sizing though.

Would you concentrate on pixel size or image size? I was working on the basis that if the images are reduced to no more than 250K say and are still good enough quality then it doesnt matter what pixel size they are. Is this a wrong way of thinking about it :-/

Thanks in advance

Charles

[crispy68]

When it comes to images, you want the image to be as big as it is needed in the project (pixel size). In other words, if the image is only going to be 600px wide, then make sure to resize the original image down to 600px before adding it to the project. Use .jpg where you can and only use .png when you need some transparency.

Once an image is resized, you still may need to optimize (compress) it (image size/weight). A good free online resource is this:

https://tinyjpg.com/

Simply upload your image and it will reduce the size. It does a very good job at reducing and keeping good quality. Once completed, then download the optimized image to be used in your project.

[charles m]

Thank you - great tool for optimizing. Much quicker than photoshop