Design Shack

designshack.net · Group blog · on HN since 2011

A web and graphic design site publishing tutorials, tool reviews, and resource roundups on CSS, Bootstrap, fonts, logos, and responsive design.

What HN saysHN links it for its Twitter logo geometry article and Bootstrap resource list; one commenter criticizes a grid layout article for lacking markup examples.
47HN people shared it
14linked it in comments
44stories submitted
326story points
2 years agolast shared
2011people per year2026

Most-shared posts

  1. 1
  2. 2
    Sass vs. Stylus: Who Wins the Minimal Syntax Battle?
    3 people · 2 points · first shared 2012 · discussion on HN
  3. 3
    20 Awesome Resources for Twitter Bootstrap Lovers
    3 people · 2 points · first shared 2012 · discussion on HN
  4. 4
    Zurb Foundation vs. Twitter Bootstrap
    2 people · 140 points · first shared 2012 · 50 comments on HN
  5. 5
    Tips for Combining Google Fonts
    2 people · 5 points · first shared 2011 · discussion on HN
  6. 6
  7. 7
    5 Really Useful Responsive Web Design Patterns
    2 people · 3 points · first shared 2012 · discussion on HN
  8. 8
    Does Adobe finally understand developers?
    1 people · 60 points · first shared 2012 · 27 comments on HN
  9. 9
    What the Heck Is CSS Specificity?
    1 people · 55 points · first shared 2012 · 20 comments on HN
  10. 10
    Bootstrap Goes Responsive
    1 people · 5 points · first shared 2012 · discussion on HN
  11. 11
    200+ Pinterest Boards for Designers to Follow
    1 people · 4 points · first shared 2012 · 1 comments on HN
  12. 12
    Responsive Design: Why You’re Doing It Wrong
    1 people · 3 points · first shared 2012 · discussion on HN
  13. 13
    Focal Point: Intelligent Cropping of Responsive Images
    1 people · 3 points · first shared 2012 · discussion on HN
  14. 14
  15. 15
    Meet CodePen: Dribbble for Coders
    1 people · 3 points · first shared 2012 · discussion on HN

What HN people wrote when they linked it

Kagerjay · 2018-07-08
I find math-based designs to be really appealing for a timeless logo design A good example of this is twitters design https://designshack.net/articles/graphics/twitters-new-logo-the-geomet…
blaze33 · 2012-10-01
http://bootsnipp.com/ & http://designshack.net/articles/css/20-awesome-resources-for-twitter-b… were recently posted here although they doesn't perfectly match what you're suggesting.
lutusp · 2012-09-10
> A Brief Look at Grid-Based Layouts in Web Design Yes, most certainly "brief". Somehow the author managed to write the entire article without once showing an example of the HTML/CSS markup one would use to create a grid. Here's a bit more depth: http://designshack.net/articles/css/rolling-your-own-grid-layouts-on-t… It turns out that Microsoft has created their own vendor-specific version of grid CSS, all elements of which are prefixed with -ms- (as in -ms-grid). But I recommend that people avoid the vendor variations on the grid system, and I'm not the only one making this recommendation: http://www.quirksmode.org/blog/archives/2010/03/css_vendor_pref.html
cosmie · 2020-02-19
Google doesn't directly sell data in the first place - they leverage the data they have to improve the value of their ad network (in the form of enhanced targeting and attribution capabilities). It's actually in their best interest to _protect_ the data they have on you, as it's a primary competitive advantage they have over other ad networks. As far as the unsavory interpretation of how they could conceivably use Fonts data to further that end: calls to download their fonts are another touchpoint with the Google ecosystem, and a theoretical vector for further tracking the browsing behavior and device graph of an individual. That said, traditional font licensing for commercial use is absolutely bonkers[1][2][3]. Even if Google is using the data they collect from serving font files to feed into their user tracking, they've done a service to the web[4]. [1] https://designshack.net/articles/typography/what-is-a-font-license-and… [2] Working at a creative agency, I learned that we can't so much as legally use a client-dictated (and licensed) font in a mockup without paying thousands of dollars for a license ourselves. [3] Webfonts tend to be licensed on a per-pageview basis. One client got hit with a temporary flood of scraping/bot traffic, and the biggest economic impact was the unexpected six-figure font bill that month. We convinced them to put the site behind Cloudflare and used a Worker to strip out the font include for suspected bot traffic and…
amoitnga · 2019-01-29
Being able to produce nice, competent design requires a very different skill set from the one developer has. It's not our job to know what are complementary colors, what is hierarchy etc. But when handed sketch/photoshop design it's part of my job to implement it. It's not a coincidence that you brought up positioning. > I can't center my divs properly. I remember having a similar feeling. What made it click for me was searching for some articles like "how to master css". Btw, just did that search and this is the article I remember I went over https://designshack.net/articles/css/5-steps-to-drastically-improve-yo… which is the first result. Understanding how to position things I think was the biggest aha moment: floats, box model, the difference between positions such as fixed, static, absolute etc... I think if you go over resources mentioned in that article you'll be good enough. It feels like there is this idea that CSS is very simple, not a real thing, so we don't dedicate the time to learn it. You wouldn't expect to be good with React after one day, would you? It takes time to learn js, having that base it's easy to pick up React in a few days. And then you read articles on best practices, staying up to date with new versions etc. CSS requires much less, but still some time and effort. Treat it as technology, give few days, don't skip steps, just sit down and learn it. You can't solve `x + 5 = 10` when you don't know what `2 + 2…
armchairhacker · 2022-12-21
Is this related in any way to Flux, the now-defunct WYSIWYG website creator? (https://stacksocial.com/sales/flux-7, https://designshack.net/articles/html/how-to-build-a-website-with-flux…
theoh · 2017-03-16
I'm in the field (recent MA in art). Colour theory, beyond the important concept of complementaries, is very unscientific. I'm not aware of any credible, rigorous scientific findings about colour and emotion that are actually used by artists. (I'm not saying that no credible research will ever exist: see links here https://designshack.net/articles/graphics/the-science-behind-color-and… ) Painters (etc.) choose and apply colour in an intuitive way. Some artists are known as "colourists" for their skill in orchestrating colour effects. The way to learn is to look at that kind of work and absorb the aesthetic.
johnchristopher · 2015-06-23
A long time ago I did some googling (aka `research') on the subject and indeed I found out that using serif for printed documents is non negotiable ; it's supposed (and I agree with that) to let the eyes decrypt words faster and smoother than when reading sans serif. Oddly enough sans serif is easier to decipher on screens. I don't know yet which kind of fonts I should use on my e-reader though. The web seems to think it's a matter of taste and adequacy nowadays: http://www.webdesignerdepot.com/2013/03/serif-vs-sans-the-final-battle… http://designshack.net/articles/typography/serif-vs-sans-serif-fonts-i… http://www.fonts.com/content/learning/fontology/level-1/type-anatomy/s…
paultreny · 2014-12-05
The one I've found that I like the most so far is: http://designshack.net/articles/css/make-it-snow-on-your-website-with-… But I'll have to add start and stop buttons with javascript to toggle the classes on and off.
Goopplesoft · 2013-01-27
Consider it a solid base to build on thats fairly easy to skin later on. As a developer who hates design, I gotta say bootstrap was my kick into liking design. One major tip: put patience in design, dont expect things to happen in 5 minutes do lots of experimentation and tinkering. Also try to get into less css. Some resources: http://ajkochanowicz.github.com/Kickstrap/ https://wrapbootstrap.com/ http://bootswatch.com/ http://fortawesome.github.com/Font-Awesome/ http://jetstrap.com/ http://www.boottheme.com/ http://designshack.net/articles/css/20-awesome-resources-for-twitter-b…
joshwa · 2011-12-14
Related: When working out a UI idea, I work REALLY low-fi and REALLY fast. Quick thumbnail sketches of just the overall layout of elements, or the way an interaction works, done in < 2mins. The trick is to explore the problem space quickly before even getting to the level of sketching the full UI in context. Here's a good article explaining the process: http://designshack.net/articles/inspiration/close-photoshop-and-grab-a… trying to upload some sketches of mine but the szx airport wifi is oddly not giving me any upload bandwidth...

Keyboard shortcuts

/Search
j kNext / previous blog
EnterOpen selected blog
vVisit the blog site
fFollow / unfollow
lSwitch grid / list view
dSwitch dark mode
g hHome
g pTop posts
g tTopics
g fFollowing
g lLiked
g yHistory
g qFAQ
EscBack / close