Updated scouting site

[alan_sh]

I've finished (I hope) updating my site here https://www.penninescouts.org.uk/

Key new things are:

1. It has no breakpoints in the WBS file. It's made using layout grids to make it responsive. This means I only have one breakpoint to manage - so it's much easier for me to keep updated
2. There's no email addresses exposed. All contact forms are done using cognitoforms - so much harder for the black hats to use.
3. The menu is simplified and works on all sizes of devices.
4. Colours - nice and vibrant.

I hope you like it.

Alan

[GrahamW]

just a few things I noticed when viewing on my Oppo Find X3
1. on some pages if there is long links you have to scroll across to see the end of the link
2. Names on your team page split and go on a seperate line after the firstname and the surname is on its own on a different line
3. On the join us page there is an image of a boy that is far too wide and you have a lot of white space to scroll across to because of that.
4. On your groups page there is a table that is not responsive and you have to scroll across.
5. On the join us bage under squirrels the 2 colums of text look funny on mobile being centered

there is other issues on many other pages as well, maybe look at putting in breakpoints and it will fix a lot of them

Graham

[alan_sh]

Graham,

Thanks for the feedback. I haven't seen any of the above on my phone. What browser are you using?

cheers

Alan

[alan_sh]

Going through the detail.

1. I can't find these - can you point me out a page? - [edit] founds some on the resources area page but they don't go wider than my phone. Fixed anyway.
2. Fixed
3. Fixed
4. I need to look at the whole table. There's too much information. It is responsive - down to about 550 px and then stops. Now fixed
5. What two columns of text? I can only see one. I did fix an issue with the bullets.

I am not putting breakpoints in. It means editing every page as the master page would need updating too.

Thanks again for looking.

Alan

[GrahamW]

Alan

You might want to check the site with the developer tools in Google Chrome it shows a lot of the issues I mentioned and I can still see them present on many pages.
To access the developer tools do this
Click the the 3 dots top right corner in Chrome
Select More Tools
Select Developer Tools

Once you in there you can select preset devices or put your own resolution in, this will show you many issues with the site when it goes into responsive mode.
I know you dont want to put break points in but it will be the only way to sort a lot of the issues encountered with viewing on smartphone or tablets. I see the issues mainly Oppo Find X3 Pro, Galaxy Note 9, Galaxy Fold and iPhone 7

Graham

[alan_sh]

Thanks Graham,

I will take a look next week.

Alan

[alan_sh]

Graham,

I have looked, but I cannot see issues. Can you post me any screenshots so I know what to look for.

Cheers

Alan

[GrahamW]

Alan

here is a few obvious ones

https://grahamscomputers.net/wbissues/1.JPG
This one above shows the image I pointed out is to wide still

https://grahamscomputers.net/wbissues/2.JPG
These images could do with some padding so they all don't run together

https://grahamscomputers.net/wbissues/3.JPG
This one shows the 2 colums of text tat would look better left aligned

https://grahamscomputers.net/wbissues/4.JPG
Maybe center align these 2 buttons, this is on nearly every page in the site

https://grahamscomputers.net/wbissues/5.JPG
This is a very obvious one where the table wont fit the into the phone screen size

https://grahamscomputers.net/wbissues/6.JPG
The heading in this one is positioned wrong

https://grahamscomputers.net/wbissues/7.JPG
The top image in this in not the same size as others

https://grahamscomputers.net/wbissues/8.JPG
With the persons name it may look better under the heading so the name doesnt wrap to next line

https://grahamscomputers.net/wbissues/9.JPG
When you click on leaders then resources you see this error in the developer console

https://grahamscomputers.net/wbissues/10.JPG
On the same leaders/resources page you see this issue as well.

https://grahamscomputers.net/wbissues/11.JPG
This one shows the errors with the calendar your using onyour training page

There is a few more but might be a good idea to go right over it, I think you dont see them in your WB program because you have no breakpoints set to actually see what is going on and to be able to fix them.

Hope this helps to get them sorted out

Graham

[alan_sh]

Graham,

I don't think you are loooking at the current web site. I don't know how, but, for example, the first item you pointed out (1.jpg), the picture should have a purple border around like this (all screenshots are from a OnePlus :


The table (5.jpg) fits OK in my phone.


The news item looks fine to me.


If you still see the issues after you clear the local cache, can you please run https://whatismyviewport.com/ and let me know what it says and also what browser and version you are running?

I agree that some things (like left justifying text) could be changed, but I am not seeing what you are seeing.

Thanks for looking

Alan

[alan_sh]

Graham,
These are some detailed answers.

cheers

Alan

Alan

here is a few obvious ones

https://grahamscomputers.net/wbissues/1.JPG
This one above shows the image I pointed out is to wide still
>>> Not seeing this.

https://grahamscomputers.net/wbissues/2.JPG
These images could do with some padding so they all don't run together
>>> Fixed

https://grahamscomputers.net/wbissues/3.JPG
This one shows the 2 colums of text tat would look better left aligned
>>> Fixed

https://grahamscomputers.net/wbissues/4.JPG
Maybe center align these 2 buttons, this is on nearly every page in the site
>>> Not seeing these.

https://grahamscomputers.net/wbissues/5.JPG
This is a very obvious one where the table wont fit the into the phone screen size
>>> Works OK on my phone

https://grahamscomputers.net/wbissues/6.JPG
The heading in this one is positioned wrong
>>> Not seeing this on my phone

https://grahamscomputers.net/wbissues/7.JPG
The top image in this in not the same size as others
>>> Agreed - I'll sort it.

https://grahamscomputers.net/wbissues/8.JPG
With the persons name it may look better under the heading so the name doesnt wrap to next line
>>> Not seeing this on my phone.

https://grahamscomputers.net/wbissues/9.JPG
When you click on leaders then resources you see this error in the developer console
Ouch - yes, found this one. There's a bug in WWB somewhere, because the image is NOT in the source, but is seen in the object manager. Anyway, deleted it.

https://grahamscomputers.net/wbissues/10.JPG
On the same leaders/resources page you see this issue as well.
>>> once again, it works on my phone.

https://grahamscomputers.net/wbissues/11.JPG
This one shows the errors with the calendar your using onyour training page
>>> I see what you mean, but it doesn't seem to cause any issues with the page. I will report this to the teamup team.

There is a few more but might be a good idea to go right over it, I think you dont see them in your WB program because you have no breakpoints set to actually see what is going on and to be able to fix them.

Hope this helps to get them sorted out

Graham