37 votes

This is a web page

30 comments

  1. [13]
    Whom
    Link
    I've always liked this one better than the fuckingwebsites. It gets at the beauty of what can be done so simply rather than just showing you that simplicity is possible and good. Bless everyone...

    I've always liked this one better than the fuckingwebsites. It gets at the beauty of what can be done so simply rather than just showing you that simplicity is possible and good.

    Bless everyone out there (shoutout to my peers over on Neocities) working to make the web beautiful by expressing what they have to express in their own spaces under their own control, fully willing to make something as simple as this page.

    16 votes
    1. [12]
      unknown user
      Link Parent
      I, on the contrary, cannot stand websites with default fonts. (For me, on Windows, the default font is Times New Roman, which isn't too bad on its own, but it's a solid dogwhistle for an...

      I, on the contrary, cannot stand websites with default fonts. (For me, on Windows, the default font is Times New Roman, which isn't too bad on its own, but it's a solid dogwhistle for an aesthetics nerd like myself. I'm that pissy bitch who can't stop whining about when kerning is a tad off, or line height is too sparse, or...)

      It's not about font elitism. It's not about the desire to be with the cool kids and use a fancy font... even though it's from Google Fonts and everyone is fuckin' using it. The default font tells me the person didn't put enough work into making the thing look good.

      This sort of attention to beauty in work matters deeply to me. I've abandoned tools and potentially-useful websites 'cause they looked ugly. As far as I'm concerned, beauty is a function of utility.

      It's why I spend days picking the right font. It's why I spend hours to add the little motherfuckin' effect to key presses: 'cause it matters deeply to me, and I know it matters to people 'cause they all react very well to little things like that.

      Like salt in the soup: you can live without it, but you notice when it's missing.

      7 votes
      1. [9]
        onyxleopard
        Link Parent
        Is there no argument to be made for websites that consist of purely textual content to defer to the consumer to decide how to present it? I think your concerns are valid, but all the more reason...

        Is there no argument to be made for websites that consist of purely textual content to defer to the consumer to decide how to present it? I think your concerns are valid, but all the more reason for you to consume content such as this with your own personalized CSS.

        This is the motivation behind various “Reader” modes and extensions of web browsers that allow the user to represent textual content (and potentially other media) using fonts, colors, and layout of their choosing. I, for one, am very happy if sites don’t bend over backwards to stylize their content when it is mainly text, so that my browser can present it to me according to my preferences. If a site has its own design that I like, I can respect it, and view it as the designer intended. But, I think the vast majority of web design is bad, and most sites would be improved if they spent more time improving their content rather than their styling.

        5 votes
        1. [8]
          unknown user
          Link Parent
          Web defaults at this stage are the fallback for any form of styling. It is no longer acceptable for a user-facing site that's looking for any sort of wider reach to maintain its default styling....

          Is there no argument to be made for websites that consist of purely textual content to defer to the consumer to decide how to present it?

          Web defaults at this stage are the fallback for any form of styling. It is no longer acceptable for a user-facing site that's looking for any sort of wider reach to maintain its default styling.

          The only acceptable option I can think of right now is partials: HTML "components" which are interred into the main page HTML. Then again, they aren't meant to be user-facing.

          This is the motivation behind various “Reader” modes and extensions of web browsers that allow the user to represent textual content (and potentially other media) using fonts, colors, and layout of their choosing.

          Reader-type extensions don't allow you to choose your own styling much. You get a preset of options you can choose from; options that someone else had to choose beforehand because of how readable they are in conjunction, under different conditions, for a small subset of preferences.

          Which, again, is why you do styling for web text: readability. Right now, the Web is garbage when it comes to readability: most popular sites stick pages chock full of ads, autoplay videos, share buttons, images, "related" article links, and banners for GDPR compliance. It's horrible for the user, but it's oh so mighty fine for the CEO and their pocket. So, you get reader mode.

          It's perfectly possible to make a readable article with minimal styling. You need something like 10 declarations to make the default Web text page look pretty and readable: yes, they're the same declarations. The fact that many sites don't do that is not based in the overhead of styling: it's based entirely in chasing superficial metrics like user retention, reading times, "related" clicks etc.

          But, I think the vast majority of web design is bad

          The Web as a whole has been steadily improving for however many years I'm been looking into HTML and CSS. Overall, the Web looks better than ever.

          3 votes
          1. [7]
            onyxleopard
            Link Parent
            Which is why I prefer to just use the reader mode in Safari on most sites, but the added benefit is that it also overrides any sites that use the browser default styling. Basically, since I don’t...

            Right now, the Web is garbage when it comes to readability: most popular sites stick pages chock full of ads, autoplay videos, share buttons, images, "related" article links, and banners for GDPR compliance. It's horrible for the user, but it's oh so mighty fine for the CEO and their pocket. So, you get reader mode.

            Which is why I prefer to just use the reader mode in Safari on most sites, but the added benefit is that it also overrides any sites that use the browser default styling. Basically, since I don’t trust website designers to do a good job, I’m happy let a small set of styles in my reader mode override them, and I don’t mind at all if a site doesn’t provide any styling at all.

            The Web as a whole has been steadily improving for however many years I'm been looking into HTML and CSS. Overall, the Web looks better than ever.

            It’s just my opinion, but I think overall the web is over-designed.

            1 vote
            1. ohyran
              Link Parent
              [designer Ohyran] "Am I a joke to you?" ;) This is me talking late at night about a subject I like but probably can't describe well. Sry. Ignore if not in the mood ... I mean yeah, it is. Not...

              It’s just my opinion, but I think overall the web is over-designed.

              [designer Ohyran] "Am I a joke to you?" ;)


              This is me talking late at night about a subject I like but probably can't describe well. Sry. Ignore if not in the mood

              ... I mean yeah, it is. Not saying this as a justification - but we are stuck with engineers who have a penchant for flinging every little bit of engineering in to projects until you have a Rube Goldberg machine, one expectant engineer, and the question "Ok can you make it look pretty?" hovering at your door in the office.
              I guess its also an effect of the professionalization of design and the focus on research and testing. Which sounds really great, it sounds like previous design was made by crayon wielding psychos and now, finally we have some kind of facts to hold them off. The issue is that testing and research, although critical, have become a sort of justification for the designers existence and too much weight have been put on them.

              A few decades ago there was research in to colours and how people reacted to them, this was done with a heavy handed form of testing where subjects where forced to look at differently coloured prototypes or just paint test boards and try to summarize their sensations. Awesome. Until you get that humans are notoriously crap when asked a question. If you've ever worked freelance you know: never give the client an open ended question without clear alternatives. If you ask someone, who is paid to make sure what you do went well, if they have any input instead of thinking "Do I?" they go hard for "I need to figure out some input to give!". Which isn't me trying to say "boo clients!", rather that humans ... humans are complex little beings.

              So of course they all had opinions. A lot of opinions on all the colours. The testing went on until some base emotions could be supplied to the colours and in the end my home town had ATM machines coloured in this odd grimy looking vaguely offputting shade of light blue because that was a colour testing had proven "most people associate with stability, trust and safety". Sounds absurd if you're not stuck in that world of perpetual, more and more complex testing and I am sure that like slowly boiled frogs they where dutifully swimming along calmly. For good reasons! What else can you do after the first motivated research? Go "hey so the base concept of this research, how WELL can we justify it? Won't people just be fine whatever colour it is?".
              At the end they stuck to it because for a long time that is what "everyone" knew an ATM machine looked like. The first alternative ones was mistrusted for NOT looking like that (or the one other alternative).

              Same with aesthetics for webpages. Do you remember those little dancing babies used as gif's? How everyone had one? Like it was some kind of stock choice? I think they where chosen because they where expected for a a certain kind of webpage. It's sort of the same as massive hero images now. Sure you can avoid them - but what will the viewer expect that the page is? The rationale is that the information, the PURE information, is the core objective of any visitor who will - no matter what - look it out and focus on it. But in practice people don't work just like that. Information is never really pure and the sender who just put it down somewhere and expect it will be gobbled up by the receiver is either very very well informed about the receivers (if they are people who prefer that) or not at all and will be perpetually annoyed that people just don't seem to read the information available.

              Information is hinging on, not just the core message, but also the packaging and the medium. (oh here we have my contribution to "designers are asshats" btw - me barbling communication theory like its the absolute truth, sry :) )

              That said I am a FIRM believer in that these kinds of webpages have a perfect spot to fill. They deliver trust in certain circumstances. If you know that your readers will enjoy it - then it is perfect. But if its just "I like this better" then the risk is that most visitors will simply ignore it and try to ask questions to the sender directly trhough an alternative path to get to the information they simply think they can't find.

              4 votes
            2. [5]
              unknown user
              Link Parent
              Could you show me a website that you think is overdesigned? Could you also tell me why you think it is, or at least point at the parts that you think make it so?

              Could you show me a website that you think is overdesigned? Could you also tell me why you think it is, or at least point at the parts that you think make it so?

              1 vote
              1. [4]
                onyxleopard
                Link Parent
                https://weather.com/ Oof. That would take a lot of effort. Suffice to say, it is not trivial to navigate or find the things I would want to find. It has a strange, persistent floating tray at the...

                Could you show me a website that you think is overdesigned?

                https://weather.com/

                Could you also tell me why you think it is, or at least point at the parts that you think make it so?

                Oof. That would take a lot of effort. Suffice to say, it is not trivial to navigate or find the things I would want to find. It has a strange, persistent floating tray at the bottom (on mobile).

                I could probably write hundreds of pages on the usability and design issues I encounter on websites like this all the time.

                2 votes
                1. [3]
                  unknown user
                  Link Parent
                  ...huh. You could be a much better designer than me, 'cause yeah, it ain't pretty, UX-wise, but it's as terrible as you describe it. In any case, if you ever take the time to write down the...

                  ...huh.

                  You could be a much better designer than me, 'cause yeah, it ain't pretty, UX-wise, but it's as terrible as you describe it.

                  In any case, if you ever take the time to write down the problems you see with this or any other website, please link me to it. I'm eager to read your perspective.

                  1 vote
                  1. [2]
                    onyxleopard
                    Link Parent
                    I think I’m a much more of a critic than a designer. The sheer magnitude of the number of decisions that require consideration usually prevents me from getting started with designing anything...

                    I think I’m a much more of a critic than a designer. The sheer magnitude of the number of decisions that require consideration usually prevents me from getting started with designing anything substantial.

                    I find that really good design is obvious, but only after every alternative has been thrown out. You’re essentially boiling down infinite to something finite, which is very challenging. You need to justify what must exist after throwing away everything that could exist, but isn’t essential.

                    2 votes
                    1. unknown user
                      Link Parent
                      See, I'm more of a "practical advice" guy. I like theory very much, but it only works for me once I can grasp it on my own, through the lens of my own perception, and that works better when...

                      See, I'm more of a "practical advice" guy. I like theory very much, but it only works for me once I can grasp it on my own, through the lens of my own perception, and that works better when practical applications of the idea are considered.

                      Which is why I want to read whatever you may write up. :)

                      2 votes
      2. [2]
        Whom
        Link Parent
        I don't want to argue with your preferences (so I won't), but I don't think it's fair to reduce this to form vs function. To me, this page is beautiful. I like the aesthetics of the early web, and...

        I don't want to argue with your preferences (so I won't), but I don't think it's fair to reduce this to form vs function.

        To me, this page is beautiful. I like the aesthetics of the early web, and I appreciate the ability to modify it client-side if I want to (which I don't do because I already like it, but anyway..). My preference for this kind of design is as much about beauty as it is utility.

        2 votes
        1. unknown user
          Link Parent
          Our vision of the matter is actually not that far from each other. I consider an accessible (read: easily understand without having to rely on manuals or years of experience with the Web),...

          Our vision of the matter is actually not that far from each other. I consider an accessible (read: easily understand without having to rely on manuals or years of experience with the Web), well-presented page to be beautiful. It's like a good knife that sits well in your hand when you take it for the first time: you know you've just won in some sort of ephemeral lottery.

          Does it have to be pretty? Good visual design and good UX design are inseparable: the prettiest page you can't navigate is as ugly as the most useful tool you can't stand to look at. How others get by with only one or the other is beyond me: design is design, its parts are abstract and don't exist in a vacuum; the thing is a whole.

          and I appreciate the ability to modify it client-side if I want to

          You can do so with any page.

          1 vote
  2. [4]
    Wes
    Link
    Page looks to be 24.3 kB to me. I managed in 17.6 kB. :) Includes a print stylesheet, dark mode, and responsive design. Not much else!

    I wrote this in a text editor. It's 6 kB.

    Page looks to be 24.3 kB to me. I managed in 17.6 kB. :)

    Includes a print stylesheet, dark mode, and responsive design. Not much else!

    9 votes
    1. [3]
      unknown user
      Link Parent
      You can shave off a a kilobyte or two by using element selectors instead of classes where appropriate (.sidebar → aside, .sidebar .bio → aside header). The reduction in class usage also reduces...

      You can shave off a a kilobyte or two by using element selectors instead of classes where appropriate (.sidebaraside, .sidebar .bioaside header). The reduction in class usage also reduces the corresponding HTML, so the gain is double. You also get the benefit of semantic HTML.

      Consider using an SVG for logo instead of a PNG. That's a kB and a half off.

      Look into caching for your fonts. Source Sans Pro appears to redownload on page reload.

      As an aside, <section> elements are supposed to be descendants of <article>s because of their semantic purpose.

      5 votes
      1. [2]
        Wes
        Link Parent
        Thanks for the feedback! This one is really more of a design choice. I know it's seemingly redundant to have <aside class="sidebar">, but past experience has taught me that it's safer to define...

        Thanks for the feedback!

        You can shave off a a kilobyte or two by using element selectors instead of classes where appropriate

        This one is really more of a design choice. I know it's seemingly redundant to have <aside class="sidebar">, but past experience has taught me that it's safer to define classes for specific jobs rather than styling generic elements. I wouldn't go so far as to do <body class="body"> or anything silly like that, but asides could have multiple uses.

        Consider using an SVG for logo instead of a PNG. That's a kB and a half off.

        Now there's an idea. I don't have a lot of experience writing SVGs by hand, but I'd be willing to take a crack at it. Alternatively I could work in something like Inkscape and work backwards, removing unnecessary lines to make it as minimal as possible. I'll consider that!

        Look into caching for your fonts. Source Sans Pro appears to redownload on page reload.

        It shouldn't be doing that... Do you have your dev tools up with "Disable cache" set?

        That would be a big problem if true. I have optimized the font as much as possible by subsetting it to restrict glyphs, but it's still the largest resource I load by far.

        As an aside, <section> elements are supposed to be descendants of <article>s because of their semantic purpose.

        That's interesting. I did a lot of testing with screen readers to try and get the accessibility right. I found <section> tags were the best way to allow quick jumping around by, well, section. I'd like to be as semantically-correct as is reasonable, though.

        I browsed MDN but it doesn't mention this rule. Do you know where I could read more about that?

        I love getting feedback. Thanks for your review!

        3 votes
        1. unknown user
          Link Parent
          False alarm. It was indeed the disabled cache. New browser, wasn't able to catch that the first time. Apologies. I don't remember where I read that, either. If it's not MDN, I'm going to have to...

          It shouldn't be doing that... Do you have your dev tools up with "Disable cache" set?

          False alarm. It was indeed the disabled cache. New browser, wasn't able to catch that the first time. Apologies.

          I browsed MDN but it doesn't mention this rule. Do you know where I could read more about that?

          I don't remember where I read that, either. If it's not MDN, I'm going to have to look it up. Meanwhile, feel free to disregard my words on the matter.

          I'll let you know if I find anything.

          1 vote
  3. [2]
    susam
    Link
    I used to host my blog on https://www.blogger.com/ once upon a time. Then as I got better at web development, I wrote my own PHP application to host my blog. Then one day, I realized that all of...

    I used to host my blog on https://www.blogger.com/ once upon a time. Then as I got better at web development, I wrote my own PHP application to host my blog. Then one day, I realized that all of this was unnecessary when my entire content was static. After this realization dawned on me, I went for a very minimal website consisting of static HTML files. No header, a minimal footer, and the content. Here is a random post picked from my website in its current form: https://susam.in/blog/a-kid-who-could-read-my-mind/.

    6 votes
    1. freddy
      Link Parent
      I like the minimal theme. Personally, for me it was a mixture between Google Sites and Wordpress. I now use write.as though I'm in the process of moving to a static site.

      I like the minimal theme. Personally, for me it was a mixture between Google Sites and Wordpress. I now use write.as though I'm in the process of moving to a static site.

      3 votes
  4. [3]
    weystrom
    Link
    I never understand why people would use something like Wordpress for a blog. Just render a static html with something like hugo and be done with it! Why the bloat, php, mysql, apache, nginx, it's...

    I never understand why people would use something like Wordpress for a blog. Just render a static html with something like hugo and be done with it!

    Why the bloat, php, mysql, apache, nginx, it's all too much just for a text and a bunch of pics.

    2 votes
    1. Wes
      Link Parent
      I agree with you on the topic of requiring a bloated stack, but keep in mind that basically any web host already has that part set up for you. Hugo is great but you need Go and a process for...

      I agree with you on the topic of requiring a bloated stack, but keep in mind that basically any web host already has that part set up for you.

      Hugo is great but you need Go and a process for syncing files to a server still. Jekyll + Github Pages takes care of a lot for you, but you have to learn git.

      With Wordpress, you just set it up once. Most hosts will automate that for you now. Then you're off to the races, installing useless plugins and abusing formatting tags because they make it so easy. And that's how it should be, really.

      5 votes
    2. unknown user
      Link Parent
      Easy: you have to not be proficient in making your own websites.

      I never understand why people would use something like Wordpress for a blog.

      Easy: you have to not be proficient in making your own websites.

      3 votes
  5. [8]
    nothis
    Link
    I consider the fact that the squirrel story link does not work to be a powerful statement about the web as well. And I'm only being half sarcastic!

    I consider the fact that the squirrel story link does not work to be a powerful statement about the web as well. And I'm only being half sarcastic!

    1 vote
    1. [7]
      unknown user
      Link Parent
      Is this a complete thought? I'm finding it difficult to map it onto any meaningful framework in my head.

      Is this a complete thought? I'm finding it difficult to map it onto any meaningful framework in my head.

      1. Diff
        Link Parent
        I parsed it just fine. There's a link to a story about a squirrel that's broken, and nothis finds that fact to be a powerful statement about the web.

        I parsed it just fine. There's a link to a story about a squirrel that's broken, and nothis finds that fact to be a powerful statement about the web.

        1 vote
      2. [5]
        nothis
        Link Parent
        I mean, it's a whole website about the beauty and the simplicity of the web. And it's broken. That's it.

        I mean, it's a whole website about the beauty and the simplicity of the web. And it's broken. That's it.

        1 vote
        1. [4]
          unknown user
          Link Parent
          It didn't load for me at all. Is that what you were referring to?

          It didn't load for me at all. Is that what you were referring to?

          1. [3]
            nothis
            Link Parent
            Yea...

            Yea...

            1. [2]
              unknown user
              Link Parent
              I see. I thought you were referring to the contents of the page at first. I'm not familiar with what it's supposed to say.

              I see. I thought you were referring to the contents of the page at first. I'm not familiar with what it's supposed to say.

              1. nothis
                Link Parent
                It was a stupid joke, I regret starting it. The website has a great message.

                It was a stupid joke, I regret starting it. The website has a great message.