So i was reading about AMP on the official website and it looked broken as the ends of the sentences cut off some of the words onto the next line https://www.ampproject.org/docs/get_started/about-amp.html having looked at the code i see there is a word-wrap class telling it to break the word.
This seemed odd to me as it makes their page look messy and as though they haven’t bothered to check it properly. why would they do that?
I was reading that the other day and found that really annoying and difficult to read.
It would not be so bad if they used hyphens so you know a word is broken off.
But then I would only use hyphenation in cases here space is very tight, like a table cell on mobile.
It’s just plain bad typography what they have done. Who knows why?
Glad it wasn’t just me then.
also i copied the ‘basic’ html off of this page https://www.ampproject.org/docs/get_started/about-amp.html#amp-html to do a quick test and found it has some random lightening bolt icon in the html tag which isn’t valid. Unless this is just on my computer?!
Why put code there for people if it is junk.
That’s what it is. It does not display for me.
As I understand it, they have invented their own html which is not the same as regular html5 and won’t validate in the usual validator. But you are supposed to use their validator instead.
I looked into AMP, but I’m not sure about it. It seems a lot of hoops to jump through and restrictions.
Unfortunately, I think it’s a catch-22 that they don’t know how to handle. Since browser rendering isn’t (and probably shouldn’t be) smart enough to know how to wrap ridiculously long words, they needed to figure out how to handle the situation where they had to display content which went beyond their mobile viewport threshold when that css is displayed.
Do they force the user to try and scroll (which can be annoying) or do they wrap the content to keep the viewport smaller.
Personally, I think they made the right call. Word-wrapped text is easier to read than having to scroll back and forth.
(I think the lightening bolt is intentional - it’s in the spec on the github page, though <html amp> looks to be the alternative) - https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md
But why is it wrapping on the desktop? Fine use it in a media query for small screens (with hyphenation) but not on screens that are plenty big enough.
Where is it wrapping on desktop? I changed my viewport size multiple times and am not seeing that behavior…
ah chrome seems fine but on FF on my desktop the words are all cutting off and making it harder to follow.[quote=“DaveMaxwell, post:5, topic:223583”]
I think the lightening bolt is intentional
[/quote]
ah that’s confusing as i searched for boilerplate AMP and got this page https://www.ampproject.org/docs/get_started/create/basic_markup.html which does it that way. So on 2 different pages they show you how to do the same thing differently?!
This seems to dumb thing to do if they want me to learn/use this as how do i know which to use (i’ll use the one without the lighting bolt as it shows weirdly in my editor).
Not only is it wrapping weirdly on Firefox, but it does strange things at the bottom of the screen on scroll.
That does clear with scrolling further down but the end of the page (where there is no further down to scroll) gets thoroughly messed up and only clears with a refresh.
Firefox 46, with browser maximised on a 1280px-wide monitor.
That really doesn’t inspire me to want to try their coding methods on my sites.
I didn’t notice that, but now you mention it.
It’s things like that which make me wary of these new things. I expect Google have done something which may be great viewed on a Android device, but for everyone else is just 
So maybe not worth jumping through all Google’s hoops.
I guess they didn’t bother to check if it worked in FF then. I can understand you might want it to break if it is a really long url or something but it is just randomly breaking words up. I find it really distracting to read. especially when it changes context like this
The validator confirms that your page’s CSS does n’t exceed 50,000 bytes limit.
As you read ‘does’ first and it’s not til the next line you get the ‘n’t’ to change it’s context.
Oh well i guess that’s how it is. I certainly won’t be using break-word anytime soon after seeing it in use.
i want to ask some more about AMP but since my original question was about ‘break-word’ i’ll start another thread.
thanks all
I have used hyphens before, but it will sometimes happen unnecessarily so I only use it in a query for small screens in a container class that needs it.
I believe @John_Betong has done some work with AMP.
I looked at a few of those and can’t see any AMP code on their page. I tried the BBC and the Independent, and also Huffington Post (the UK version). The latter isn’t a responsive site; it has a separate mobile version.
I’m guessing that’s what they are doing. AMP is maybe not best for desktop.
So now everyone’s mastered RWD, Google wants us to go back to making separate mobile sites. 
But the BBC and the Independent are responsive, and I don’t see any mention of AMP. (Although I’m only visiting them on desktop; maybe it would be different if I visited on mobile?)
AmpProject sites offer far more than just RWD.
From what I understand extremely long pages are automatically paged and only when scrolled to “below the fold” does additional content become visible.
For the extreme “acid test” (I love oxymorons); an existing thumbnail web-page was adapted. Normally the web-page shows about thirty thumbnails in less than two seconds. The following AmpProject Test link requests the number of thumbnails in the trailing numeric parameter. Requesting thousands of thumbnails only shows about fifty thumbnails and takes about the same amount of time to render the “above the fold” content.
http://www.johns-jokes.com/pictures-amp/99999
Edit:
Unfortunately since adopting a Free CDN, the web-page is currently slightly slower than normal - conflicts are currently being investigated - watch this space 
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.
