Hacker News Reader

Comment by bbx | Hacker News Reader

Web Design is easy! You can learn it in 4 minutes: http://jgthms.com/web-design-in-4-minutes/

More seriously, if you fancy some reading, I wrote a free HTML and CSS tutorial: http://marksheet.io/

Before you dive into specific frontend feature like Flexbox or Grid or even a full CSS framework, I believe you should first understand the basics of markup and styling, which are very simple but not easy.

Because otherwise, you will start using tools you don't fully understand, and will struggle extending or fixing your design.

After that, you can simply Google whatever style you want to implement, or problem you're facing, "just in time", and end up on CSS Tricks or Stack Overflow.

View on HN

If he's talking about being able to fix float issues, he doesn't need to be told what an <img> tag is.

One of the frustrations with tutorials like yours is that it's assuming no knowledge, where I (and I assume he) has plenty of knowledge of HTML/CSS, it's just we don't have knowledge of modern css.

Yeah, I'm in the same boat as OP. I thoroughly understand the tech stack and even the modern wave of npm build tools. Where I am completely lost is if you ask me to match a comp. Like what do I with Photoshop or Sketch and how do design CSS rules to make it real?

That first link is nice if you're creating a simple informational page about one topic, and it's part of a website without much in the way of a header, navigation, footer, or widget elements.

But as useful as that is at some level, that's not the problem most people struggling with design have. They struggle to make a full website where everything logically fits together and where the structure of the site makes it easy for people to navigate between pages. One which also looks nice and modern compared to large platforms like say, Facebook, Twitter, Medium, etc.

For example, I could design a simple page about a single topic easily enough, but I struggle trying to create a full platform with a flat design aesthetic (or what not).

It's funny re: that "web design in 4 minutes" link; while the page got "prettier" over the course of the demo, I found it to get progressively less readable. I'll openly admit I have an astigmatism and have been having more and more trouble with pale/small letters, but I had no idea I had gone over the fold into things like high contrast mode being useful for me.

I'm curious as to if that's just my eyesight falling over as I get older, or trends in "modern design", as I still find the original text-on-canvas, 90's garage style of websites to be much more readable to me, as well as containing much less wasted whitespace.

We don't treat websites like documents anymore. Instead they're interfaces. The old document style is much more readable.

Do you have anything about the new flex or grid systems in some modern browsers like FF on marksheet.io/?

Reply on news.ycombinator.com