6 ms·

https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fwww.fmboschetto.it%2F https://developers.google.com/speed/pagespeed/insights/?url=...

https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fwww.fmboschetto.it%2F https://developers.google.com/speed/pagespeed/insights/?url=... 100 Points. Mobile First. Better than React Native.

stabbles 7y ago
This is hilarious! Turns out 18 year old websites were mobile friendly after all
- jsaldes 7y ago
  Have you actually tried the site on a mobile device? It's impossible to read the text and navigation is hell. Wouldn't classify that as "mobile friendly".
  - dchest 7y ago
    I just tried, it works well (Chrome/Android on a 5.5"-something screen).
  - vesinisa 7y ago
    It's not so bad if your mobile browser supports pinch to zoom.
    - rchaud 7y ago
      Most mobile browsers support it out of the box. If the site designer set "user-scalable=no" in the meta viewport property, than that will prevent zooming. It's an accessibility issue and should be avoided.
      - mcintyre1994 7y ago
        iOS has ignored that meta tag for a while now.
  - dahart 7y ago
    Just tried on iPad, the site works great. Did you mean ‘phone’ and not ‘mobile device’?
    - jaypeg25 7y ago
      ohhh so pedantic. Love it.
      - dahart 7y ago
        I am sorry, you’re totally right, is it pretty unreasonably nit picky to differentiate between 10 inch screens and 3 inch screens when it comes to web UX. Smart phones do count as all mobile devices and the only thing that matters when determining if a site is mobile friendly. And of course it’s usually a good idea to broaden the argument categorically to something larger than your personal experience to make the stronger point that most people would agree with you and the other person is obviously up in the night.
    - joegahona 7y ago
      Would you also consider a laptop to be a "device" that is "mobile"?
      - dahart 7y ago
        You say that as if it’s weird to call an iPad a mobile device. Would you say that a tablet is not a mobile device? What do you define as mobile device, and what devices would you use to determine if a web site is “mobile friendly”? The common definition of mobile device is phone or tablet. The common definition of laptop is computer. These despite the fact that phones and tablets are computers and despite the fact that laptops and even desktops can be moved. It’s pretty easy to find lots of examples of the common definitions. Here’s a good one: https://en.wikipedia.org/wiki/Mobile_device https://en.wikipedia.org/wiki/Mobile_device
        lccarrasco 7y ago
        Does that definition matter if tablets are probably less than 1% of all mobile devices?
  - Mirioron 7y ago
    What do you mean? The text isn't much smaller than on HN on my 5.5" phone. It's entirely readable.
    - frosted-flakes 7y ago
      HN is hardly a good example. It's terrible on mobile.
      - Mirioron 7y ago
        I find HN to be one of the best mobile websites. It's fast and text isn't massively oversized. You can actually fit information on screen. Many mobile websites I've seen are horrible to use, because they have very poor information density and the sites seem to be designed for 4" or smaller screens.
        matsemann 7y ago
        I tried to upvote you about HNs great mobile design, but the buttons are so small I accidentally downvoted ;)
        SilasX 7y ago
        Then zoom in, which most "mobile optimized" sites prohibit. My further comments: https://news.ycombinator.com/item?id=22328505 https://news.ycombinator.com/item?id=22328505
  - Y-Bopinator 7y ago
    Works fine for me. Might be time to see the doctor and get your eyes checked.
  - SilasX 7y ago
    What do you mean? It has reasonable column width so you can zoom in and out as necessary, often with a double tap. That is, it leaves it up to the client to adjust as necessary -- in contrast with the typical mobile site, which: 1) Forces a particular size/resolution, locking out zoom capabilities 2) Has a floating header with a constant size relative to your device screen, blotting out the same real estate no matter how much you zoom. And, of course, using the same header pixel height for portrait vs landscape, making the latter practically unusable. Yes, this site is better than 99% of mobile sites out there. Edit: Some further comments: It's generally better to have a site that obeys the standards and thus plays nice with any client, than one that locks you into the hip designer's meth-addled decision. This site in particular works well with my extensions like VimFX for clicking links from the keyboard.
    - duckmysick 7y ago
      > so you can zoom in and out as necessary That's the thing - it shouldn't be necessary. I don't do that on desktop browsers; why should mobile devices be any different? If the site is not legible, I set the desired zoom once and I'm done. There's no need to go back and forth. Now, I can't do that if the elements stay mismatched on mobile. I have to zoom in and then back when I want to interact with small elements - each time. It gets old when I have to click tiny links or upvote arrows more than a few times. It's jarring and not a good user experience. > And, of course, using the same header pixel height for portrait vs landscape, making the latter practically unusable. The floating header issue notwithstanding (I don't like them either), this is exactly why the web designers should tailor their elements to different viewports. > It's generally better to have a site that obeys the standards Yes, and that also includes accessibility guidelines. Compatibility with keyboard navigation is one of them, but so is the size and spacing of the controls, links, and buttons.
      - SilasX 7y ago
        True. Zooming in shouldn’t be necessary. And mobile sites shouldn’t use floating headers or footers. And they shouldn’t hijack interface modes. And they should pick sizes that don’t feel like a straitjacket or make it seem like you’re peering at it through blinds. And they should be accessible and standards compliant. But I wasn’t comparing to the three or four mobile-optimized sites that satisfy all that. I was referring to the more typical millions that don’t. And yes, given how bad they are, I’d much rather have suboptimal design that I can recover from with a pinch or a double tap than one I can’t. What would you cite as an example of a mobile site that is more usable than this one?
- pmlnr 7y ago
  Pre frames and table-layout designs are pretty good, because they are dead simple HTML - and thus, they allow reflow, being responsive as a result. This is not one of those.
  - godzillabrennus 7y ago
    The first wysiwyg editors (front page, golive, dreamweaver, etc..) were heavy abusers of tables.
- pjc50 7y ago
  Almost all of the performance-unfriendliness has been designed in. Especially for monetisation.
- sakarisson 7y ago
  More like 18 year old websites are so rare that page rating services don't even work for them.
  - achairapart 7y ago
    Sure they work! It's very easy to get 100/100 when you don't use any blocking CSS or JavaScript and all images are optimized for 56k modems.
- mister_hn 7y ago
  Just because mobile phones got same (or better) screen resolution than in 1990s/2000s desktop PCs
- gorbachev 7y ago
  Back when Netscape 0.9 was new I had daily arguments with some of the "web designers" who insisted on using HTML targeting browser bugs and other invalid HTML tricks to optimize the aesthetics of their sites. All you needed to do then, and today, is make sure your HTML is valid and that you don't break things on purpose ("this site optimized for MSIE1.0" type of stuff) and your site will forever be mobile and any-other-html-rendering device friendly.
- ozim 7y ago
  In 2002, 1024×768 and 800x600 were mostly used resolutions for computer screens so yes, those were mobile friendly...
deleted 7y ago
[deleted]
nyuszika7h 7y ago
> Unable to process request. Please wait a while and try again.
pmlnr 7y ago
100 points on pagespeed is not that hard with static sites. - drop 99% of the JS (PWA, lazy-loading, infinite scroll, jquery, you don't need any of them for a webpage), convert the remaining for 1% to vanilla js and use it as progressive enhancement. - use EM or % as layout width/height - inline css, js, and svg EDIT - no webfonts! The only thing that'll remain as an issue are tables wider, than viewport, on mobile. My site: https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fpetermolnar.net%2F https://developers.google.com/speed/pagespeed/insights/?url=...
- freeone3000 7y ago
  Gee, maybe that's sort of an indication on how far backwards the user experience on web has fallen.
- ravenstine 7y ago
  Don't know about PWA. Service workers are pretty lightweight and help with caching. But yeah, lazy-loading, infinite scroll, etc., are all designed to cover up design flaws that impact performance. I think lazy-loading can be potentially done right, but almost none of us do anything right. > use EM or % as layout width/height Why? EM/REM is good for handling font sizes, but for anything else it may not make sense and a custom font setting in the browser can break layouts if the size of boxes are based on font sizes. PX is perfectly adequate for layout, and is actually a relative unit(PX !== hardware pixel). Same for borders, padding, margin, etc. Even REM is better than EM for most cases. People who adjust the font size in their browser don't necessarily want their layout to change and potentially degrade as a result. > inline css, js, and svg Can be a good idea, especially if you can somehow identify the CSS used on page load and discard anything nonessential. Though maybe HTTP/2 makes inlining obsolete. IDK > no webfonts! Thank you! Web fonts are perfectly sufficient in 99% of cases.
  - pmlnr 7y ago
    > Why? EM/REM is good for handling font sizes, but for anything else it may not make sense and a custom font setting in the browser can break layouts if the size of boxes are based on font sizes. PX is perfectly adequate for layout, and is actually a relative unit(PX !== hardware pixel). Same for borders, padding, margin, etc. Even REM is better than EM for most cases. People who adjust the font size in their browser don't necessarily want their layout to change and potentially degrade as a result. I had a lot of bad experience with px, but it is true that for borders it's the only reasonable choice. REM is not that well supported, especially in awkward browsers (Dillo, for example). Imo EM is nicer for padding/margin; it keeps the text/layout ratio even if the font is resized, unlike px. But point taken, it cannot be used as the only unit.
deleted 7y ago
[deleted]

stabbles 7y ago

This is hilarious! Turns out 18 year old websites were mobile friendly after all

jsaldes 7y ago
Have you actually tried the site on a mobile device? It's impossible to read the text and navigation is hell. Wouldn't classify that as "mobile friendly".
- dchest 7y ago
  I just tried, it works well (Chrome/Android on a 5.5"-something screen).
- vesinisa 7y ago
  It's not so bad if your mobile browser supports pinch to zoom.
  - rchaud 7y ago
    Most mobile browsers support it out of the box. If the site designer set "user-scalable=no" in the meta viewport property, than that will prevent zooming. It's an accessibility issue and should be avoided.
    - mcintyre1994 7y ago
      iOS has ignored that meta tag for a while now.
- dahart 7y ago
  Just tried on iPad, the site works great. Did you mean ‘phone’ and not ‘mobile device’?
  - jaypeg25 7y ago
    ohhh so pedantic. Love it.
    - dahart 7y ago
      I am sorry, you’re totally right, is it pretty unreasonably nit picky to differentiate between 10 inch screens and 3 inch screens when it comes to web UX. Smart phones do count as all mobile devices and the only thing that matters when determining if a site is mobile friendly. And of course it’s usually a good idea to broaden the argument categorically to something larger than your personal experience to make the stronger point that most people would agree with you and the other person is obviously up in the night.
  - joegahona 7y ago
    Would you also consider a laptop to be a "device" that is "mobile"?
    - dahart 7y ago
      You say that as if it’s weird to call an iPad a mobile device. Would you say that a tablet is not a mobile device? What do you define as mobile device, and what devices would you use to determine if a web site is “mobile friendly”? The common definition of mobile device is phone or tablet. The common definition of laptop is computer. These despite the fact that phones and tablets are computers and despite the fact that laptops and even desktops can be moved. It’s pretty easy to find lots of examples of the common definitions. Here’s a good one: https://en.wikipedia.org/wiki/Mobile_device https://en.wikipedia.org/wiki/Mobile_device
      - lccarrasco 7y ago
        Does that definition matter if tablets are probably less than 1% of all mobile devices?
- Mirioron 7y ago
  What do you mean? The text isn't much smaller than on HN on my 5.5" phone. It's entirely readable.
  - frosted-flakes 7y ago
    HN is hardly a good example. It's terrible on mobile.
    - Mirioron 7y ago
      I find HN to be one of the best mobile websites. It's fast and text isn't massively oversized. You can actually fit information on screen. Many mobile websites I've seen are horrible to use, because they have very poor information density and the sites seem to be designed for 4" or smaller screens.
      - matsemann 7y ago
        I tried to upvote you about HNs great mobile design, but the buttons are so small I accidentally downvoted ;)
        SilasX 7y ago
        Then zoom in, which most "mobile optimized" sites prohibit. My further comments: https://news.ycombinator.com/item?id=22328505 https://news.ycombinator.com/item?id=22328505
- Y-Bopinator 7y ago
  Works fine for me. Might be time to see the doctor and get your eyes checked.
- SilasX 7y ago
  What do you mean? It has reasonable column width so you can zoom in and out as necessary, often with a double tap. That is, it leaves it up to the client to adjust as necessary -- in contrast with the typical mobile site, which: 1) Forces a particular size/resolution, locking out zoom capabilities 2) Has a floating header with a constant size relative to your device screen, blotting out the same real estate no matter how much you zoom. And, of course, using the same header pixel height for portrait vs landscape, making the latter practically unusable. Yes, this site is better than 99% of mobile sites out there. Edit: Some further comments: It's generally better to have a site that obeys the standards and thus plays nice with any client, than one that locks you into the hip designer's meth-addled decision. This site in particular works well with my extensions like VimFX for clicking links from the keyboard.
  - duckmysick 7y ago
    > so you can zoom in and out as necessary That's the thing - it shouldn't be necessary. I don't do that on desktop browsers; why should mobile devices be any different? If the site is not legible, I set the desired zoom once and I'm done. There's no need to go back and forth. Now, I can't do that if the elements stay mismatched on mobile. I have to zoom in and then back when I want to interact with small elements - each time. It gets old when I have to click tiny links or upvote arrows more than a few times. It's jarring and not a good user experience. > And, of course, using the same header pixel height for portrait vs landscape, making the latter practically unusable. The floating header issue notwithstanding (I don't like them either), this is exactly why the web designers should tailor their elements to different viewports. > It's generally better to have a site that obeys the standards Yes, and that also includes accessibility guidelines. Compatibility with keyboard navigation is one of them, but so is the size and spacing of the controls, links, and buttons.
    - SilasX 7y ago
      True. Zooming in shouldn’t be necessary. And mobile sites shouldn’t use floating headers or footers. And they shouldn’t hijack interface modes. And they should pick sizes that don’t feel like a straitjacket or make it seem like you’re peering at it through blinds. And they should be accessible and standards compliant. But I wasn’t comparing to the three or four mobile-optimized sites that satisfy all that. I was referring to the more typical millions that don’t. And yes, given how bad they are, I’d much rather have suboptimal design that I can recover from with a pinch or a double tap than one I can’t. What would you cite as an example of a mobile site that is more usable than this one?
pmlnr 7y ago
Pre frames and table-layout designs are pretty good, because they are dead simple HTML - and thus, they allow reflow, being responsive as a result. This is not one of those.
- godzillabrennus 7y ago
  The first wysiwyg editors (front page, golive, dreamweaver, etc..) were heavy abusers of tables.
pjc50 7y ago
Almost all of the performance-unfriendliness has been designed in. Especially for monetisation.
sakarisson 7y ago
More like 18 year old websites are so rare that page rating services don't even work for them.
- achairapart 7y ago
  Sure they work! It's very easy to get 100/100 when you don't use any blocking CSS or JavaScript and all images are optimized for 56k modems.
mister_hn 7y ago
Just because mobile phones got same (or better) screen resolution than in 1990s/2000s desktop PCs
gorbachev 7y ago
Back when Netscape 0.9 was new I had daily arguments with some of the "web designers" who insisted on using HTML targeting browser bugs and other invalid HTML tricks to optimize the aesthetics of their sites. All you needed to do then, and today, is make sure your HTML is valid and that you don't break things on purpose ("this site optimized for MSIE1.0" type of stuff) and your site will forever be mobile and any-other-html-rendering device friendly.
ozim 7y ago
In 2002, 1024×768 and 800x600 were mostly used resolutions for computer screens so yes, those were mobile friendly...

deleted 7y ago

[deleted]

nyuszika7h 7y ago

> Unable to process request. Please wait a while and try again.

pmlnr 7y ago

100 points on pagespeed is not that hard with static sites. - drop 99% of the JS (PWA, lazy-loading, infinite scroll, jquery, you don't need any of them for a webpage), convert the remaining for 1% to vanilla js and use it as progressive enhancement. - use EM or % as layout width/height - inline css, js, and svg EDIT - no webfonts! The only thing that'll remain as an issue are tables wider, than viewport, on mobile. My site: https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fpetermolnar.net%2F https://developers.google.com/speed/pagespeed/insights/?url=...

freeone3000 7y ago
Gee, maybe that's sort of an indication on how far backwards the user experience on web has fallen.
ravenstine 7y ago
Don't know about PWA. Service workers are pretty lightweight and help with caching. But yeah, lazy-loading, infinite scroll, etc., are all designed to cover up design flaws that impact performance. I think lazy-loading can be potentially done right, but almost none of us do anything right. > use EM or % as layout width/height Why? EM/REM is good for handling font sizes, but for anything else it may not make sense and a custom font setting in the browser can break layouts if the size of boxes are based on font sizes. PX is perfectly adequate for layout, and is actually a relative unit(PX !== hardware pixel). Same for borders, padding, margin, etc. Even REM is better than EM for most cases. People who adjust the font size in their browser don't necessarily want their layout to change and potentially degrade as a result. > inline css, js, and svg Can be a good idea, especially if you can somehow identify the CSS used on page load and discard anything nonessential. Though maybe HTTP/2 makes inlining obsolete. IDK > no webfonts! Thank you! Web fonts are perfectly sufficient in 99% of cases.
- pmlnr 7y ago
  > Why? EM/REM is good for handling font sizes, but for anything else it may not make sense and a custom font setting in the browser can break layouts if the size of boxes are based on font sizes. PX is perfectly adequate for layout, and is actually a relative unit(PX !== hardware pixel). Same for borders, padding, margin, etc. Even REM is better than EM for most cases. People who adjust the font size in their browser don't necessarily want their layout to change and potentially degrade as a result. I had a lot of bad experience with px, but it is true that for borders it's the only reasonable choice. REM is not that well supported, especially in awkward browsers (Dillo, for example). Imo EM is nicer for padding/margin; it keeps the text/layout ratio even if the font is resized, unlike px. But point taken, it cannot be used as the only unit.

deleted 7y ago

[deleted]