Comments (12)
I like the idea of having first an open discussion about the design! Thinking first about the colors and the mood we want the app to convey is important. And yes to fun, bright colors! π
from html-tag-quiz.
I had to learn about color combinations during the pandemic when I was a teacher using a LOT of color in my geometry lessons. Until a student let me know he was color blind. I love the combinations you suggested, they are the least likely to cause issues when we consider color blindness. (I'll have to go back to do some research, but I think a yellow closer to orange rather than a lemon-yellow is usually recommended.)
from html-tag-quiz.
I love the idea of orange & purple. It's perfect for a Halloween theme. For fonts , I was thinking a bold sans serif font like Monserrat for the heading and the regular version for the sub-heading. Also, I think that the text should stay in white for the best contrast. I added the logo but the placement is really up to discussion ,I did a quick draft on figma to visualize this. also I am not sure what's the best way to represent the inputs , maybe a grid?
from html-tag-quiz.
Sounds good! It can definitely wait until after this month. I was only thinking that long term it would be great to have both options. And just to be clear: I LOVE that we are going with a Halloween theme. Really great choice @medinamohamed!
from html-tag-quiz.
Hi, I'm looking into contributing to my first open source project. I would love to try to design this app and implement it.
from html-tag-quiz.
Thank you for your interest, @medinamohamed. This ticket is currently open for discussion, so only rough drafts should be done to discuss further steps in which direction it should go. Please feel free to upload your first draft, including what your thoughts on color and fonts are. π
from html-tag-quiz.
Two vague color combinations are currently coming into my mind:
- Kind of Complementary: Dark and light version of one color, a accent color added. What comes to my mind would be purple or blue, with accent yellow.
- Usage of the original logo color of HTMl in a monochromatic way, adding a complementary color
from html-tag-quiz.
I considered accessibility for the font, but it's not really fun π
from html-tag-quiz.
It's a nice start @medinamohamed. Thanks for making sure that color contrast is high enough for foreground color to background color to all combinations (white on purple, orange on purple, white on orange) π
Yeah, since it is Hacktoberfest and Halloween is coming up soon, the color combination seems got to go to me ππ½ We can figure out how to style the list in another issue. Just make sure that the text color is white as well in the meanwhile.
from html-tag-quiz.
I like how fast our once-little app is growing! So exciting!
Just a quick question regarding our design: will we have a dark/light toggle? π
Full confession: I am asking for very selfish reasons.
I had to do some research last year because of my experience as a user with dark mode designs. I had noticed that unless an appβs content was the only way to access particular info, I would otherwise shy away from them. I just find them hard to focus on. But knowing how popular dark/light themes had become, I was just curious what makes a user prefer one over the other.
At least according to research done in Germany in 2020, my experience is not that uncommon. While dark is certainly beneficial and recommended for some users, for the majority the so-called, βpositive contrast polarityβ was better with light mode. Hereβs the article I saved last year: Dark Mode vs. Light Mode: Which Is Better? Happy to explore more to see if this is still relevant ! And greatly appreciate your patience with me. π
from html-tag-quiz.
I am totally with you here, @CorinaMurg! I also prefer light-mode over dark mode. Let's keep it for Hacktoberfest sake with this colors but put our thought on it afterwards.
We do have the possibility to make this issue a discussion which then appears in the discussion section of the repo. But I do not try it out now in case something gets lost for earning the hacktoberfest badge. :)
Or we start a new discussion about color right away. I am excited to finally use certain CSS attribute like prefers-color-scheme and such, which will be useful here.
from html-tag-quiz.
The app is for user's to check how many HTML tags they know. It should be a fun app for them to use, nothing serious if they do not know that many (yet). So bright colors and a quite fun font would be nice I guess?
from html-tag-quiz.
Related Issues (20)
- [ENHANCEMENT] Clear input field HOT 2
- [FEATURE] Heading and Subheading HOT 8
- [FEATURE] Progress bar HOT 1
- [FEATURE] ReadMe file HOT 9
- [FEATURE] Congrats message HOT 6
- [FEATURE] Create Hint Button HOT 7
- [FEATURE] Refactoring the Code html/CSS/structure
- [BUG] h1-h6 not added to list HOT 5
- [Enhancement] Color of the app HOT 5
- [BUG] Missing document title element HOT 2
- [BUG] Missing label for input element HOT 1
- [ENHANCEMENT] Tags are sorted alphabetically
- [DOCS] Add content to PR Tempalte
- [ENHANCEMENT] Refactoring JS code HOT 2
- About page HOT 10
- [UPDATE] <Update tags data> HOT 2
- [FEATURE] Add linting to project HOT 2
- [FEATURE] <Add Favicon for Website to help distinguish it>
- [FEATURE] Add delete icon to input field
- [FEATURE] Add error handling HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from html-tag-quiz.