Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add reference to responsivness #40

Open
TomGranot opened this issue Nov 28, 2020 · 3 comments
Open

Add reference to responsivness #40

TomGranot opened this issue Nov 28, 2020 · 3 comments

Comments

@TomGranot
Copy link

I might or might not have scrolled through the entirety of the list to check whether the stylesheets are responsive or not.
Foolishly, I only noted for a few of them the result of my check.

Is there any smarter way to add a mention of whether a stylesheet is responsive or not? Maybe add a (Responsive) next to the ones that are?

@dohliam
Copy link
Owner

dohliam commented Feb 10, 2023

@TomGranot thanks for raising this issue! Just paraphrasing this from a different comment as I think it probably applies here: some frameworks may have different definitions of what "responsiveness" means, but it may be helpful to grade each framework on a range of criteria so that people looking for frameworks that don't create a horizontal scrollbar (see #47), for example, could find one that matches their requirements.

The easiest way to do this would probably be something similar to what you did, in other words, go through each of the frameworks and compare it to a checklist of responsiveness criteria (presence of horizontal scroll, media elements resized or not, readable font size on mobile etc). We would probably want to decide on a fixed set of criteria first, though. 😄

Once that data has been collected it would be pretty straightforward to add it to the Readme to help people choose between frameworks. Of course we could also do something a bit fancier and add the resulting responsiveness grades for each framework to the YAML file so that a badge or something could be auto-generated, but either way it would probably take a while to go through everything so someone would need to be willing to do this! 😄

@waldyrious
Copy link

frameworks that don't create a horizontal scrollbar

Heads-up: that link doesn't work when provided as #47 (it's interpreted as an anchor to an ID in this page). The full URL needs to be used, i.e. https://github.com/dohliam/dropin-minimal-css/issues/47.

We would probably want to decide on a fixed set of criteria first

Another option could be to simply check the page's result in Google's mobile-friendly test, or at least get inspiration for the checklist from the list of issues they check for.

@dohliam
Copy link
Owner

dohliam commented Feb 11, 2023

@waldyrious Thanks, fixed the link -- might be a GitHub bug because that link was autocompleted by the UI but seems to only work as expected outside of actual markdown link syntax.

Google's mobile-friendly test

This is an interesting approach. The downside is it doesn't seem to have an API to allow automated testing, and it took a relatively long time to test one URL (almost 2 minutes). So testing each of the frameworks in turn would not be trivial.

the list of issues they check for

This looks promising! The items on this list mostly seem like they would be fairly straightforward to test. Doing this manually would still be pretty time-consuming, but there must be automated tools out there that can test for things like "page specifies a viewport" that we could string together to give a quick report on each framework.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants