39 ms·

Old CSS, New CSS

• thdrdt 7y ago
  Damn, I miss those days. There were no big walled gardens, no Twitter or Facebook. If you had anything to say to anyone, you had to put together your own website. It was amazing. I also created websites back in the day with spacer gifs and framesets, but I don't understand this qoute. People still create their own website. There are still a lot of forums with a wide range of topics. For example: not so long ago I was into reef tanks. There are a ton of forums and websites about that subject. Maybe even more than in the old days.
  • prox 7y ago
    My personal take on this, I think this quote stems largely from the fact that a lot of people funnel into their social media walled garden without second thoughts, and simply publish there. Without it, you have to self publish on what we know as a website. (Just think of it, what would you do if you have something to say but there are no social media behemoths) Further, your audience was potentially everyone with a browser. You had full reign in your creativity, your means to style your page to your like was limitless, even if that meant 20 rotating gifs that took forever to load on dial up. All the social media bubbles score low on self expression- I personally feel this is what is missed most on those platforms. Yes, even if some were butt ugly. :)
    • type0 7y ago
      Myspace scored big on self expression and eventually that's what's killed it. What's missing from the so called social medias is genuineness, when you have your own website you don't usually post crap there (well some ppl do shit where they eat but that's an exception).
  • qwertox 7y ago
    > People still create their own website It's not the same. Those who create their own websites today do so by buying a domain and some equally cheap webspace. Back then this was not an option, and we were glad to have sites like Geocities. Many of us were kids or teens with no access to credit cards or PayPal, and the web was really new. The animated "under construction" GIFs served a purpose, and the topic we posted on felt different. As if it was for fun, saying "I'm here", instead of "Look at what a pro I am, what knowledge I have, book my time".
    • thdrdt 7y ago
      I don't agree. There are a ton of people on Wordpress, Blogspot and other free places. Geocities was also a walled garden, but the scale was totally different. It is amazing how many people are online today.
      • crtasm 7y ago
        And beside the blog platforms, lots of people making fully custom sites on services like https://neocities.org/ https://neocities.org/
  • onion2k 7y ago
    People still create their own website. Far fewer than back in the late 90s and early 2000s. I think the reason for that is because people didn't actually want to make websites - they wanted to have a voice on the internet and making a website was pretty much the only way to do that. Now if you want to publish your ideas about reef tanks you could learn to write HTML and CSS and make a website, or you could write on Twitter, or you could make YouTube videos, or you could do a podcast, etc, etc. There are fewer people making websites but there are more people publishing something on the web. I think when the web industry's old guard lament the fact that no one really builds homepages any more it's genuine and heartfelt because they (and I include myself in this) really enjoyed looking at what people made. For me to see what interesting and exciting ideas people have that they can do with HTML and CSS is much harder now. There's Glitch and Codepen and stuff, but I feel like I'm still missing loads of the best stuff.
    • papito 7y ago
      And it was great. It was a barrier of entry for speech. You could do it, it was free, but you had to apply some effort, you had to have something to say. Now the Web is flooded with morons on Twitter who's opinion is just the noise you have to filter through.
      • anderspitman 7y ago
        There are a lot of intelligent, interesting people who would be filtered out by the barrier of learning HTML.
        • papito 7y ago
          It doesn't have to be raw HTML. Even creating a blog post with existing hosted tools is a barrier enough.
        • GoblinSlayer 7y ago
          There were many sites written in Word. Also intelligent people don't tend to create SPA blogs with angular and webpak.
  • deleted 7y ago
    [deleted]
  • adrianN 7y ago
    Making your own website today is still possible, but the chances of people actually reading your content is really low unless you invest a lot of time into SEO. A large part of the browsing population never leaves their walled garden and only reads what's posted there. So unless you get crossposted into their filterbubble, your content is just invisible.
    • thdrdt 7y ago
      Well in the old days this was way worse. Maybe you could get your site on a link list or in a link ring but that was all.
      • airstrike 7y ago
        On the flip side, I was personally always venturing out into the Wild Wild Web to find new, interesting content. It had this sense of adventure that is pretty much gone nowadays
      • type0 7y ago
        Link rings were great because often it stayed on topic, if you visited an aquarium blog you would usually encounter other aquarium sites.
  • geogra4 7y ago
    AOL and CompuServe were huge walled gardens
• pablobaz 7y ago
  Nice article. Surprised it does not mention the acid tests https://www.acidtests.org/ https://www.acidtests.org/
  • rjknight 7y ago
    I'm surprised you didn't notice the acid tests being mentioned repeatedly from about half-way through the article!
  • methyl 7y ago
    Interestingly enough, it seems my Chrome 80 on Safari does not fully pass neither ACID2 nor ACID3 test.
    • Andrew_nenakhov 7y ago
      Firefox 72 had just failed them both :-\ Chrome 79 passed Acid2, but scored 97/100 in acid3, just like firefox.
      • glandium 7y ago
        ACID3 is impossible to score 100/100 while respecting modern standards: https://news.ycombinator.com/item?id=15256890 https://news.ycombinator.com/item?id=15256890 ACID2 looks fine to me in Firefox 72, but then, it doesn't show a score, so...
        • gsnedders 7y ago
          Acid2 fails in a strict sense if 1 image pixel != 1 device pixel != 1 CSS pixel. For Acid3 there's http://wpt.live/acid/acid3/test.html http://wpt.live/acid/acid3/test.html which reflects what browsers are actually targetting (and is what runs in everyone's CI system): see https://github.com/web-platform-tests/wpt/commits/master/acid/acid3/test.html https://github.com/web-platform-tests/wpt/commits/master/aci... for the history.
        • Andrew_nenakhov 7y ago
• lordnacho 7y ago
  Wow, I wish I'd had this article a few years ago. Back in the 90s I wrote my high school's first website. We even got a scan of a picture of the school done in way too high resolution. It was a massive pain to get running, given my buddy and I were in our mid teens and the web was moving fast. Everything was a bunch of different hand crafted pages of tags, served from a machine sitting in the school. But basically we figured out how to do it by reading one or two pages about it. I left school and eventually did a lot of financial coding, which was mainly backend stuff plus a small amount of desktop GUIs, or very very basic web pages. Not until a few years ago did I have another look at the web, and it had of course changed enormously. It seems nowadays everything is a tool that compiles into something else. There's a zillion frameworks in js, there's webassembly, there's a bunch of things that you use to build the CSS. The page itself seems to be a load of divs, many tags from the old days are archaic now, only seen on old university sites. Sites themselves are served from a datacenter, and not from one machine. Static content doesn't even need to come from the same place. Security and privacy is a thing. There's no one place to learn the whole thing, which I suppose is expected.
  • vbezhenar 7y ago
    You still can write static HTML/CSS and host it on your machine (if you have accessible IP) or some cheap VPN. It'll work just fine. It's possible to write a very complex websites nowadays with those technologies. But not every website have to be complex.
    • unityByFreedom 7y ago
      Yeah but you don't get eyeballs with that anymore unless you have something really unique. When the web was new you could get a lot of hits with static content. It is not so easy to do that now.
      • dangus 7y ago
        How many hits is a lot? Not a lot of people had computers with Internet back then. So sure, you can’t captivate the same percentage of the entire World Wide Web - but why would you expect that to be a reasonable assumption? Sure, in a world where the web was a couple million nerds you’d expect your content to be a bit more visible. But the web is measured in billions of users now. I would also suggest that writing content just to ensure that people read it is looking at it the wrong way. That’s a shallow popularity contest. If the production of that content doesn’t bring you satisfaction on its own then it doesn’t matter whether you have 1 view or a million, it’s not making you happy.
• mathiasrw 7y ago
  What a great trip down memory lane...
• deleted 7y ago
  [deleted]
• rfsn-alex 7y ago
  What about spacer.gif?!
  • masswerk 7y ago
    A bit of explanation: In the old days of table layouts, the width attribute of a dt element would declare the maximum width of that element only. In order to provide a minimum width, you'd insert a transparent 1x1px image and give it the appropriate width. This could be used both for flexible (min, max) layouts and rigid designs, where everything would be positioned by a system of pole-like transparent images, much like in a Dali painting. Note on both frames and tables: Right from the beginning, you could declare width and height units in HTML both in percent and in absolute units, like "px". However, Netscape browsers used internally only percents! Meaning, if you you intended to span the entire width of a document, Netscape would convert your absolute units to percent and from this back to px (using integer math for speed) and you would end up with some rounding error depending on the width of the browser window, which could add up to a deviation of 4px or so. Which was, of course, a constant pain, when you intended to line up elements, like a logo on top and a structure with a navigation and a main content area in different colors below.
    • worik 7y ago
      Wow. I was doing Web development in 1999 for a year or too I never got that deep. But I recall clearly adopting a left/right column for static content and center column for the CGI output custom stuff. Choose that format because IIRC it was easy to implement in straight HTML I looked at CSS then, but it did not make sense business wise when we could make vanilla HTML work. It was a different world
• meerita 7y ago
  With CSS-Grid now you can do practically most of the things without using dozens of CSS properties. I barely use Flex, even. But it's late for current CSS techniques, because I'm abduced to functional CSS (http://minid.net/2019/04/07/the-css-utilitarian-methodology/ http://minid.net/2019/04/07/the-css-utilitarian-methodology/) and I don't want to look back anymore (http://minid.net/2019/08/12/in-defense-of-functional-css/ http://minid.net/2019/08/12/in-defense-of-functional-css/).
• thdrdt 7y ago
  CSS today is so good that I now design websites in CSS and just present a website to the client. If you use grids and flex you can rearrange content very quick if the customer wants to move it. My workflow is now much faster. Great for the client, great for me. The only design tool I use in the beginning is a pen and peace of paper to get some ideas of where I want to go. But after that it's all HTML + CSS.
  • simion314 7y ago
    >CSS today is so good that I now design websites in CSS There are so many things missing that people are forced to use Javascript and a div-mess to implement widgets. Ex elements like dropdowns, numeric input, the small scrollbar that appears for elements, I am wondering if browser makes are just ignoring css and focusing on JS.(I admit flexbox and grid layout is cool)
    • tyingq 7y ago
      Agreed. There remains many moments where I'm questioning why I have to use JavaScript. A css concept exists to accomplish what I'm doing, but it's incomplete. It is also often blind to stuff where css could be useful like basic-auth.
    • thdrdt 7y ago
      The moment people start building their own numeric input they create all kinds of problems on different devices. I think people should just accept the browser default. And dropdowns can easily be created CSS only. To me the use of JS to get the design right always smells like bad practice.
      • simion314 7y ago
        I know, it is not the developers at fault , we the devs pushed against this, we tried to get the native input to look as much as possible as the design but it was not accepted, we had no choice but to use JS and get teh pixel perfect design.
• z3t4 7y ago
  When the browser wars ended 15 years ago, not much have happened. The innovation has instead moved to userland, which achieve things with crazy hacks and meta/trans-compilation. We have committees writing new "standards" faster then anyone can implement them. But there is no natural selection. What browser engine are you going to switch to if you are unhappy with your current one? That said, most of the hard problems have already been solved, so writing vanilla html/css has been a breeze ever since things settled. And its also very stable.
  • feanaro 7y ago
    Let's not forget Firefox and Gecko still exist, though.
    • z3t4 7y ago
      Yes, but it seems like Firefox is only keeping up, they are playing defensive, while they really ought to attack weakness in Chromium or give users a reason to switch. Right now Chrome is slightly more efficient, slightly better feature coverage, etc.' One reason why I still use Mobile Opera is because it automatically adjust the text when I zoom in... A bold move for Mozilla would be to cut down expenses to a 3 year buffer, cut their funding from Google and force themselves to become independent.
      • worik 7y ago
        Reason to switch? Trust. Mozilla cf Google.
        • z3t4 7y ago
          95% of Mozilla money comes from Google. Last time I checked Firefox still sends everything you type into the address field to Google. So if you do not trust Google, how can you trust Mozilla!?
  • gsnedders 7y ago
    > We have committees writing new "standards" faster then anyone can implement them. This isn't really true; the committees writing the standards are primarily formed of implementers, and the implementers aren't paying anyone to write a standard they aren't going to implement in the near future. That said, the early idea-incubation committees too often end up with just a single implementer involved.
• petters 7y ago
  > especially now that flexbox and grid have solved all our problems. That is certainly not the case. Look at https://eev.ee/media/2020-02-css/thumbnail-grids.html#grid https://eev.ee/media/2020-02-css/thumbnail-grids.html#grid Large gaps of empty space. A manual layout would pack the thumbnails much more densely.
  • csallen 7y ago
    That's because the author intentionally added gaps via "grid-gap:10px" and changed the alignment via "align-items:baseline". You could easily undo either of these styles to achieve the desired effect.
  • onion2k 7y ago
    https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-flow https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-f... can do dense packing in a grid. Supported by all browsers except IE.
• Vinnl 7y ago
  > (Native buttons also went out of vogue, for some reason.) Ah, I still remember native buttons being introduced. Good times, back when browsers could introduce features that seem so obvious in retrospect - such as spell check in text boxes. Feels like all the low-hanging fruit has been picked by now. (Or is it? Firefox's integrating a password manager feels pretty similar.) Great overview, though. I feel like my history with the web has been almost the same as the author's, and this brought back a lot of good and not-so-good memories.
  • Vinnl 7y ago
    Oh, and to add to the author's list of upcoming CSS changes: apparently some people are very excited about Houdini: https://developer.mozilla.org/en-US/docs/Web/Houdini https://developer.mozilla.org/en-US/docs/Web/Houdini
    • reaperducer 7y ago
      Interesting. And it looks like it's already supported in Chrome and Edge. https://caniuse.com/#search=houdini https://caniuse.com/#search=houdini
  • vbezhenar 7y ago
    Browsers still lose my 15 minutes of typing when something goes bad and I'm returning back to page. I understand that it's usually caused by websites forbidding caching, so browsers have to reload page, but they still could save that data somewhere and present me an option to restore it, at least for some time. Something like auto-complete.
    • anticodon 7y ago
      For this reason I attempt to develop a habit to type every comment or post in vim first. This loss of typed text happens maybe once in 2-3 months but it's extremely annoying.
      • zoomablemind 7y ago
• tooker 7y ago
  Netscape ran on Unix platforms.. buggy or not its support was vastly more important than IE on an ethical level.
  • loopbit 7y ago
    I used NN3 and 4 back in the day (and still do, kinda, Firefox is still my main browser), but man, writing CSS for Netscape was a nightmare! I still remember that weird bug that forced everyone to create a single, empty, invisible DIV at the beginning of the page if you wanted to set absolute positions for the other DIVs in the page. In Javascript land, we all had our little script to detect the browser and do things like finding the element you wanted (IIRC, only IE had find by id). All in all, I miss the carefulness webdevs had to have at the time (I remember uglifying my files by hand to make everything weight less than 24KB, which was the self-imposed limit we had at the dotcom I worked at) but, in general, I don't miss those days at all.
    • stan_rogers 7y ago
      NN didn't actually do CSS, it did JSS (Javascript Style Sheets, something Netscape hoped would fly) with an added translation layer. That meant that you could only style an element through its hierarchy (since there was no equivalent of IE's document.all in Netscape's DOM). $DEITY help you if you were trying to do a hybrid tables/CSS thing, especially with nested tables.
• thomasfl 7y ago
  Great article! CSS has become so easy to work with after css flexbox and various css preprocessors became available. I remember how excited we were in 1995 when we discovered we could use ta les and gif spacers to achieve almost any kind of page layout for our clients. The web is a big stack of different hacks that slowly improves over the years. CSS has become wull continue to evolve for many years.
• forgotmypw15 7y ago
  If you ever feel nostalgic for using that beautiful thing which was IE3 or NN3 or pre-JS Opera, they're all welcome on my forum website.
• andai 7y ago
  Does anyone know if there's a "CSS Zen Garden" for Flash? I heard about Flash games archival efforts a while ago, so I wonder what became of that (and if they included weird websites in their efforts too). I remember a magazine I had that was full of crazy flash sites. I recently fondly remembered Fly Guy (still works in Firefox!) https://web.archive.org/web/20050317021634/http://www.trevorvanmeter.com/flyguy/ https://web.archive.org/web/20050317021634/http://www.trevor...
  • morelisp 7y ago
    https://bluemaxima.org/flashpoint/ https://bluemaxima.org/flashpoint/
• buboard 7y ago
  for layout , i still think tables did it right, because web is primarily a grid like newspapers. wish we had a <grid> type of element with responsive rows and cols, if only to help with vertical alignment and those missing </div>s
  • goto11 7y ago
    Html tables are not all comparable to newspaper columns. Newspaper-style columns (where text flows from the from bottom of one column to the top of the next column) can be achieved with the "columns" property in CSS. But newspaper-style columns are not as useful on the web, since it is really annoying if the columns are longer then the screen and you have to scroll up and down. In that respect the web is very different than newspaper layouts where the dimensions are fixed. As for <grid>, layout should be specified in CSS rather than through the html element, which is why we have "display: table", "display: grid" etc. in CSS, which should do what you want.
  • strenholme 7y ago
    Agreed. But tables in the HTML was a mess to maintain, and does not readily translate to a phone screen (which is well over half of Internet usage these days). What I did, in the early 2010s, was use “display: table” CSS for the elements in up to date browsers, then use some ugly “<!--[if lt IE 8]><TABLE><![endif]-->” for Internet Explorer 6 and 7.
• georgespencer 7y ago
  I loved reading this. My first job was mainly spent fixing IE box model problems (remember when Microsoft could only ship Trident updates as part of huge Windows updates?!). I now have an allergic reaction to any cross-site compatibility problems, because -- in a rare exception to the rule -- it genuinely WAS harder in my day, and we managed it.
  • bmn__ 7y ago
    > remember when Microsoft could only ship Trident updates as part of huge Windows updates?! They had the ability to parallel install all along, eliminating the need for updates as part of huge Windows updates: https://news.ycombinator.com/item?id=20495979 https://news.ycombinator.com/item?id=20495979
    • will4274 7y ago
      The link inside the link says that clicking on the favorites menu would cause the browser to crash. Not exactly ship-able.
• vwcx 7y ago
  Does anyone remember messing around with ‘chromeless windows’? A misleading phrase that means something completely different to a newer generation...
  • Izkata 7y ago
    I remember making a page that when browsed to, would pop up an all-black full-screen "chromeless window" and start slowly typing green text Matrix-style. Very neat trick in those early-teens years...
• Andrew_nenakhov 7y ago
  No, I don't miss those days. Making a website look the same in Opera/Mozilla/IE was an insane challenge. The approach I've found worked best was going Opera first, then adapt to Mozilla and IE, in that order. That way the amount of work was minimal. If you did go IE first, ... well, you wouldn't succeed anytime soon.
• otabdeveloper2 7y ago
  > Still, it was better than tables. Well, no. Nothing wrong at all with tables.
  • goto11 7y ago
    Yes and no, but there is some confusion due to terminology. There are HTML tables, created with the <table> tag, and then there are CSS layout tables created with the "display:table" property. Neither are inherently good or bad, it is just a question of when they are appropriate. The problem with tables back in the day was that browsers didn't support "display:table", so the only way to get a grid-like layout was to use the <table>-tag. In cases when the content wasn't semantically a table, you had a dilemma. Either you would have to abuse the <table> tag thereby hurting accessibility, or you would have to use CSS floats and hacks to achieve the desired grid-like effect. Neither was really desirable. Today we have "display:table", but we also have flexbox and grid which is are much more powerful, so the use of tables-for-layout are mostly irrelevant.
    • bmn__ 7y ago
      > browsers didn't support "display:table" Internet Explorer on Windows was the singular offender. ISTR that other ones with at least 0.7% market share were implementing the display property correctly. A desirable solution was to just paper over the bugs and other shortcomings with Javascript: https://github.com/seancoyne/ie7-js https://github.com/seancoyne/ie7-js That way one could simply write standard compliant code and not waste any time with hacks and float work-arounds.
      • worik 7y ago
        "Internet Explorer on Windows was"... 90% plus of the market
      • strenholme 7y ago
        The trick I did was “<!--[if lt IE 8]><table><![endif]-->” for older IE and “display: table” for anything standards compliant.
• unityByFreedom 7y ago
  Then there is new new CSS with styled-components where you don't need classes anymore!
• faitswulff 7y ago
  I feel like I learn a lot more about CSS from articles like these as opposed to books because it puts CSS features into context with the problems they were meant to solve. The historical context helps a lot, too. The way that I've tried to learn CSS in the past was essentially a random collection of tricks. Are there any more articles like this? I'd read them all day.
  • acid__ 7y ago
    My uncle likes to call it “fictional nonfiction,” saying that the human brain is better at following stories than piles of facts.
    • jonpurdy 7y ago
      Hence why The Phoenix Project was much better at teaching the basic concepts of DevOps than any DevOps how-to book or technical reference.
    • seanstickle 7y ago
      At St. John's College (back in the 90's anyways), we called this "teaching science and math historically" (as opposed to teaching the history of science and math -- which tends to emphasize dates and names). By telling the story of science and math, we gained the context of who did what for what reasons. Which unlocked my understanding of science and math in a way that textbooks never did.
  • Waterluvian 7y ago
    I have a slightly wild theory. I think that it has to do with my brain seeing the textbook topic as one item on a massive stack of items to study. Kind of like how much easier I find it to do a chore when it's not literally an infinifely looking sized amount of work ahead.
  • Vinnl 7y ago
    I've got this problem when teaching people things. When I need to explain a single feature, I feel it helps to give historical context for why things are the way they are, but it's hard to concisely give just the relevant context in that case - because there's just so much of it. Getting the whole picture in one go might be a lot better. (Interestingly, the historical context could also pre-empt much of the criticism of "the modern web", or lamenting about not every browser building on Chromium.)
• est 7y ago
  the webpages in the 90s and early 00s are so random. Today almost every goddamn webpage looks like something derived from bootstrap.
• papito 7y ago
  You guys ever saw the Captain Marvel promo site, made in the style of the 90s web? It's f---ing brilliant. https://www.marvel.com/captainmarvel/ https://www.marvel.com/captainmarvel/
  • bigwheeler 7y ago
    That is great, but how ridiculous is it that this microsite is made with 100% js dom manipulation instead of just static html? I wonder if they did that because using static html would have potentially not rendered the way they intended on all the current devices...
    • SPBS 7y ago
      that would only make it more authentic
• cjslep 7y ago
  Those gridded links remind me of the NeoPets site which would overlay a very busy "map" image with a tiny link, which would take you to a page with tons of powerful items. You used to be able to find the link with tab - the accessibility feature that barely highlighted / cycled through links. They simply removed that accessibility feature from their page.
• weeksie 7y ago
  Wild. I remember every single one of those milestones. Back in 04 I wrote some forum software with XmlHttpRequest back before gmail was released. The everybody thought I was a fucking wizard. Then gmail came out and it was like oh you did that gmail thing. Good times. But yeah, the long slow death of IE 6, crazy stuff. God, it feels like it's been a decade since I've had to seriously think about cross browser bugs, versus that eating up half my development time. Evert time I curse mobile Safari these days I remind myself of IE 6 and calm down pretty quick ;)
• hoorayimhelping 7y ago
  >No, Firefox really got a foothold because it had tabs. IE 6 did not have tabs; I don't think this is right. Firefox got a major foothold because it blocked ads. This was right as those ads that would open 4 new windows when you closed a previous window started showing up on the web and IE6 could not handle them. It would literally kill your browsing experience and sometimes blue screen your computer. Firefox was the first mainstream browser to block pop ups out of the box and it worked.
  • fcanela 7y ago
    Before switching to Firefox, I previously used Internet Explorer, which had no tabs support. In an era of frequent pop-ups, your desktop ended being a mess. It was annoying, but that is what I was used to. Then Firefox came and allowed to have all your browsing in the same window, without polluting the taskbar. In my case, I clearly remember that tabs were the reason to switch into Firefox.
    • prashnts 7y ago
      I had similar reasons with one more anecdote: my first internet access was through a Nokia 2G phone and I « dialed » to connect in Windows XP. Thank you Nokia PC Suite (which I could only get from the Byte magazine CDs and DVDs). But boy, IE6 was painful! And i needed tabs to open pages and do something else while I wait for pages to load. That made me switch to Firefox after Opera. It wasn’t that long ago, I think 2007 sorts? In my job now, I still try to make sure people can access my pages with as little resources as needed.
    • Izkata 7y ago
      > Internet Explorer, which had no tabs support. In an era of frequent pop-ups, your desktop ended being a mess. This is how I remember it: Firefox didn't block popups on its own, but they were constrained to another tab instead of a new window, which alone was a huge bonus.
  • timw4mail 7y ago
    You mean pop-up windows. Actually ad-blocking came a bit later.
• mr-ron 7y ago
  If you want to go back further, the best article on how the web and styling worked circa 1993 is this http://contemporary-home-computing.org/prof-dr-style/ http://contemporary-home-computing.org/prof-dr-style/ And alternate articles http://art.teleportacia.org/observation/vernacular/ http://art.teleportacia.org/observation/vernacular/ http://contemporary-home-computing.org/vernacular-web-2/ http://contemporary-home-computing.org/vernacular-web-2/
• paultopia 7y ago
  Retro HTML was great! You never had to figure out why your CSS inexplicably wasn't working, nobody complained when things didn't look beautiful, because beautiful was impossible. Bring it back! LOL, I particularly love the breakdown of Space Jam. Oddly enough, I very briefly considered breaking out an old-school imagemap, like, a month ago. I was trying to get one of those lightbox-style image galleries to work, including a clickable area on the side of each image to get to the next one, and I couldn't figure out how to do all the weird border-padding-whatever-else unholy CSS witchcraft to get the clickable areas aligned correctly with the images. Imagemaps may actually work better than the hacked-together solution I eventually came up with...
  • dehrmann 7y ago
    > because beautiful was impossible Definitely for forms, but for static content? Our design sensibilities weren't there--we were too busy adding animated gifs and blink--but the tech was. Look at a post on Medium. A lot of that style could have been done in 1998.
  • bigger_cheese 7y ago
    I'm somewhat ashamed to admit I still write HTML the same way I did in the 90's. i.e. In notepad using <table> to control the layout. I never learnt CSS at some-point I should learn it but I work with html so infrequently I never bothered. My "notepad html" is more than enough for anything I've had to do in last two decades. edit. One thing I do miss is being able to hit view source in browser and understand everything, nowadays all javascript.
    • coldpie 7y ago
      God, I'm in the same boat. I don't do web programming, so my web design skills stagnated around the end of the Space Jam Era documented here. I don't work with CSS often enough to memorize its inconsistencies (why is text colored with "color" but backgrounds are colored with "background-color"?), so it's mostly a baffling series of frustrated googling whenever I'm unlucky enough to work with it. I'm glad you all like it, though.
• iamgopal 7y ago
  I wonder what is the energy needs of css vs js vs rendering on morden browsers
• throwaway488383 7y ago
  eevee and her partner are well known on twitter for being pedophiles: https://twitter.com/diaboromons/status/982022148284809216 https://twitter.com/diaboromons/status/982022148284809216
• bla3 7y ago
  The grid version, praised as the best version, on https://eev.ee/media/2020-02-css/thumbnail-grids.html#grid https://eev.ee/media/2020-02-css/thumbnail-grids.html#grid renders incorrectly in chrome 79, the current stable release. (It looks fine on Canary and in Safari.) The more things change...
  • jtolmar 7y ago
    For me, the grid version is broken, I open dev tools and it fixes itself, I close dev tools and it remains fixed, I refresh the page and it remains fixed, I close and reopen the tab and it remains fixed, I close the tab and open it again from the link and it's broken again. Just plain haunted.
• patentatt 7y ago
  I think image maps are due for a comeback. There has to be a creative and beneficial use for this, right? That shit seemed like magic in 1998.
• davycro 7y ago
  Now I remember why Flash websites were popular in the early 2000s. I am glad css caught up!
• wired_devil 7y ago
  Hacker News "webmaster" stopped in 90's.
  • timw4mail 7y ago
    And it is better that way!
• pcurve 7y ago
  CSS has gotten great, but I feel things have gone in opposite direction for general web dev. Careful cascading styles and clean and readable markup have gone straight out the window.
  • developerdylan 7y ago
    Really? Tools like React and Angular have made my life much easier when it comes to styling and readable markup.
  • ftio 7y ago
    Like with all things, it depends! Since HTML5’s introduction of a bunch of new elements, I like to think markup has the potential to be a lot more readable and semantic now than it ever did when I first starting making websites in the 90s, even/especially given such a broad new range of element types.
• dehrmann 7y ago
  Considering how repetitive pre-CSS web development could be, I'm surprised a templating framework for compiling static HTML files didn't catch on. These days, we have things like Sass, but we also have CSS, so there isn't as big of a needs as there was in the late 90's.
  • giantrobot 7y ago
    It was called DreamWeaver.
• jstewartmobile 7y ago
  Web technologies are barbarianism. We've been laying out pages for hundreds of years. I suspect that this would be a much shorter article if Microsoft/Netscape/Opera/et.al had consulted with experts in that business first, rather than re-invent the entire process from first principles. Won't drop any shade on TBL for this mess though. V1.0 seemed more focused on information access than design.
  • goto11 7y ago
    Page layout for print is very different than for screen. It was designers with a print background which insisted on writing "Best viewed on a 640x480 monitor with 24bit color. Please maximize your browser window for the optimal experience" on websites back in day. Actually I think the designers of CSS consulted traditional print too much, by adding confusing and useless stuff like "pt" measurements.
    • jstewartmobile 7y ago
      Print people at the time had no idea what 640x480x24 even means. That was all IT dorks and amateur self-styled "designers." (i.e. barbarians) The Bringhurst book was published 1992. Web tech learned zero from that book.
• deleted 7y ago
  [deleted]
• pier25 7y ago
  Started doing HTML in 97 so this brings a lot of memories like using a lot of <marquee> and <blink> on my first Geocities site. :) Nice write up. I also learned a couple of things I didn't know about grids too!
  • bitwize 7y ago
    Ah, <marquee>, the Sonic to <blink>'s Mario.
• baryphonic 7y ago
  Man, this brings me back. I started working on the web a couple years after Eevee did. I remember all of the pain points he did. (One note: when I was learning in 2001-2002, most of the tutorials and books still used <FONT>, <CENTER>, <BIG>, etc., even though CSS was around. I remember using CSS was extremely painful because of IE5, which was the default on my Win98 machine, so I didn't bother really trying till hearing about Firefox - I mean Phoenix.) I also remember that centering any block element within another block element with CSS was somewhat absurd. The trick was to do something like .centered { margin-left: auto; margin-right: auto; } And of course, there was no way to vertically center an element within another without hacks and HTML detritus that served no semantic purpose. It was almost worse than the table-based layouts. That's the only other painful thing I vividly remember behind what Eevee posted. Flexbox and Grid have made things a lot better, but I still run into weird inconsistencies and exceptions frequently. (The latest involved trying to set `max-height` on a `resize: vertical` element, and I couldn't get it to work without hacks or JavaScript. Chrome implements resizing by overriding the width or height on an element's style attribute.) Wonderful post! Would love to see more.
  • hanche 7y ago
    That’s still how I do horizontal centering, FWIW. I guess I have some catching up to do.
    • ajlburke 7y ago
      Take a look at FlexBox - if you've been around the CSS layout block a few times you might find yourself going "finally - they figured it out!"
      • dmix 7y ago
        Flex has indeed figured it out, I use it for everything now and rarely touch margin: auto unless I'm being lazy or there's a very simple usecase. But that said Flex still very much classic CSS: the awkward naming schemes, the excessive options for each parameter, the mixing of different options available, etc... it's still very much CSS in all it's quirky dirtiness. CSS Grids kind of shocked me that they weren't entirely convoluted. Maybe it's the design-by-committee stuff but even as CSS has gotten better: it still took way too long and it's still very weird. Maybe like JS this will slowly no longer become true, but I'm kind of happy I grew up without Flex/modern CSS because I'm unafraid of that quirkiness.
• Izkata 7y ago
  > Half the Web was fan portals about Animorphs, with inexplicable splash pages warning you that their site worked best if you had a 640×480 screen. This is an amazing reference. K. A. Applegate's post-series Animorphs site, hirac delest, is still online - and was originally written around this era (series ended in 2001, so its last update, if not creation, is a bit later). It has some newer stuff like CSS, but definitely check out the source here as well: http://www.hiracdelest.com/database/index_database.htm http://www.hiracdelest.com/database/index_database.htm Just with a quick scan on the main page, it has a mix of upper and lowercase tags, a "best views in" resolution, various font tags, and body tag similar to the SpaceJam one: <body text="#CCCCCC" link="#33CCFF" vlink="#33CCFF" onload="MM_preloadImages('../images/menu-v2/over_thumb/about.jpg')"> (hirac delest is from the period when I first started learning html/css/js, within a year or two)
  • pbhjpbhj 7y ago
    MM_preload... That's Dreamweaver I think, steaming pile of crap its pages were. Edit: actually, it was a very good IDE for writing html at the time I used it; it's wysiwyg led people to make pages that were a terrible mess under the covers though.
    • SlowRobotAhead 7y ago
      > MM_preload... Yep, just trigger some trauma for me there. Had long since buried that. >That's Dreamweaver I think, steaming pile of crap its pages were. ... seriously, this post brought up things I had long intentionally forgotten. I was one of those poor fools that fella for the WYSIWYGness of DreamWeaver
• mastrsushi 7y ago
  There should be less specialized languages. The web should work more on mediums like WASM so all supported languages share the same functionality. Everything CSS can define can be done in full programming languages.
• antibland 7y ago
  A friend of mine new to CSS was rebuilding the Google homepage using Flexbox. He asked me why Google uses <center> in their HTML, to which I told him it's most likely due to compatibility. Google is accessed by every web capable device and browser ever made. Yet, seeing <center> feels unacceptable.
• acabal 7y ago
  Wow, that took me back. Small nitpick, XHTML does live on in one important place: epub, which is the most commonly used file type for ebooks. I do a lot of epub work at Standard Ebooks, and at first I hated XHTML for the exact reason the article describes: A single tiny error makes the entire document invalid and it can be hard to spot it and recover. Also, namespaces were (and still are) a massive pain for little to no gain. But over time I've come to really appreciate XHTML, again for that exact same reason. It forces you to write correct XML, and there is no possible ambiguity or multiple ways of representing a tag like there is in HTML5. `<br/>` will always be `<br/>`, not maybe `<br>` or `<br/>` or even `<br></br>`. An XHTML document from someone else will be both human-readable (after pretty-printing) and easily machine parseable. You also get xpath, which is a way of selecting elements akin to CSS but even more powerful. Ultimately XHMTL is better suited to epub's use case, which is static documents that are written once and not dynamically generated by templating languages or libraries. Too bad there was some talk of epub switching to HTML5, though it's unlikely future revisions of epub will ever see wide adoption.
  • arnorhs 7y ago
    interesting. one question though, how is xpath more powerful than css for selecting elements?
    • emn13 7y ago
      Even xpath 1 let's you filter elements based on arbitrary sub-paths, so e.g. you can do stuff like //div[@data-marker]/span[i] - and match spans containing an i that are themselves the direct descendants of a div with a marker attribute. In css matching on content is in general impossible, with a few small exceptions like :empty, which is of course much less powerful. XPath will also let you select based on text-content, and select non-elements like text-nodes too. Also, it's likely much easier to make slow xpath selectors than css; oh well (but although I wrote quite a few XPath selectors back in the day, this was never a practical issue for me, which is perhaps also because unlike css - which is often used in huge quantities to match entire documents - XPath is more typically used to find just a few critical elements. I've never worked much with XPath 2, but it's even further in the direction of a kind of SQL for tree structures. By no means was XPath without weird limitations, make no mistake; but it's definitely more practical than css for finding specific elements in a messy tree especially when you don't control that tree. X-anything nowaways is pretty unfashionable, but in principle XPath would still be useful today; bit of a shame it's falling by the wayside without decent replacement. I actively try to avoid it nowadays even though I'm comfortable with it; usually the upsides XPath has aren't worth (to me) the lack of familiarity for other devs, and the potential lack of support in various platforms compared to css. But on the sidetrack the parent comment mentions: In any case, I can unequivocally, whole-heartedly, so-verbosely-you-hopefully-understand-my-conviction on the matter support the notion that the html5 syntax was a disaster of the highest order. XHtml is a much, much better idea, and unfortunately it died. Anybody who's ever seriously tried to compose html safely and understands all the weird gotchas that can occur (oh that wrapper p tag got auto closed because the tooltip span contained an icon and those were implemented as divs? yay!), not to mention a syntax with so many exceptions essentially 0% of web devs actually know them all is just asking for XSS issues. You think your client-side SPA can do server-side prerendering reliable? Ah, but only if it sticks to valid html: including nesting rules, because although it will work without error clientside - the dom-tree is really just a tree without as many weird exceptions - lots of DOM trees simply have no html serialization. Doesn't exist. To be perfectly clear: I don't think XHtml was particalarly brilliant; HTML5 is simply particularly atrocious. If I could switch to a more comprehensible data-encoding format I would, in a hearbeat - especially since nobody writes raw html anyhow nowaways, it's all frameworks and libraries. And then you pray they correctly implement the html5 spec, because if they don't... it's not something you want to reimplement yourself.
• sixdimensional 7y ago
  I've been away from front-end web development for a while now. I've been doing steadily less of it over the years, and by now it's probably been 4 years since I've touched it at all. As memory serves, the last project was gulp, typescript, SASS, and still jQuery. When the front-end work began to fork off into it's own real separate independent discipline, likely when we really achieved separation of the UI from the backend, things started to change and I ended up having to make a choice. With front-end build tools, CSS processing libraries, larger frameworks like React/Angular, I ended up on the back-end side of the equation - data platforms, databases, web services, application logic, integrations, infrastructure, etc. Seeing this reminded me of how much fun front-end development was, even with having to deal with the annoying quirks of HTML, CSS, JS and all the browsers. Did anybody else, like me, suddenly have a real hankering to sit down and break out all the new HTML/CSS/JS toys and start playing? :)
  • Izkata 7y ago
    > Did anybody else, like me, suddenly have a real hankering to sit down and break out all the new HTML/CSS/JS toys and start playing? :) Happened to me last year, with the steadily-increasing annoyance at how complicated it's gotten at work - just to see how easy/difficult it would be to put together that blog I'd been thinking about for years, without using a single frontend framework. (That blog isn't live, it got put aside for other projects in case anyone was wondering. But yeah, particularly with grid-template-area, it's not difficult at all anymore to do whatever layout you want. Even got some limited component-y goodness with inclusion templates and direct-descendant selectors.)
• LeoPanthera 7y ago
  Are we not supposed to use server-side includes anymore? I never stopped. I find them quite useful, and they use virtually no resources on the server.
• SlowRobotAhead 7y ago
  > With IE 6’s dominance, it was as if the entire Web was frozen in time. Hello Chrome. This is why I use Firefox. > The W3C’s solution was XML, because their solution to fucking everything in the early 2000s was XML. Ha! Man, got that right for sure. XML/JSX is one reason I just chose to avoid React Native in favor of Flutter, I’ve this avoided XML and would like to keep that streak going.
• c0ffe 7y ago
  I would like to add Bootstrap to the list, including other CSS libraries/frameworks. In Bootstrap case, it included a grid, and other UI components (like a dropdown menu, and a modal dialog), but most importantly, it took care that the page worked the same in all major browsers of the time. It helped me to prototype various projects over the years.
• winrid 7y ago
  Cool article. I remember waiting for things like border-radius to have the prefixes removed too. Also, flexbox has turned my world upside down. Chrome had just come out when I was learning web dev. Get off my lawn. :)
• arkh 7y ago
  I think the most important step was Firebug: the first good browser dev toolbar. http://positioniseverything.net/explorer.html http://positioniseverything.net/explorer.html saved me hours of debug multiple times when IE6 was the main browser around.
• Pxtl 7y ago
  I miss those days. In theory we're supposed to separate presentation from content, but I've never seen anything non-trivial that doesn't have a lot of nested inexplicable divs to workaround some confusing behavior. Nested tables were an ugly hack, but it was at least clear how their layout worked (until you wanted height 100% of course).
• mmphosis 7y ago
  IIRC, around the time of NCSA Mosaic, SGML was a developing standard for being able to do <b>bold</b> <i>italics</i> and <u>underline</u>. I think I like markdown better but I digress. Speaking of shady SEO leeches, "Block pop-up windows" was a dominant preference. In my browser TenFourFox (Firefox), this "off by default" preference has moved to about:preferences > Content > Block pop-up windows. But, it doesn't matter because JavaScript has brought back the annoying popup. At least, popups are constrained within the browser window. uBlock Origin and uMatrix help to the point where some/many "modern" web pages render as a blank page.
• _hardwaregeek 7y ago
  What a great article. It manages to simultaneously understand and debunk the nostalgia for the old web. I find it a little frustrating to hear people complain about how complicated the web has become and how simple things were back in the day. I mean, sure, there is a lot more complexity in certain areas, but that's because we've become significantly more ambitious and because we've pushed formerly pervasive complexity to the edges (and thus concentrated it to an extent). I'm so glad we don't have to resort to such hacks to get rounded corners. One could argue that the old-school equivalent of NPM dependency hell was all the little snippets one had to copy and paste to get somewhat portable, somewhat usable sites. Except those dependencies were managed in an entirely ad hoc fashion, without any versioning or attribution. And as the last section demonstrates, you can now write front end code that is so simple and yet flexible, maintainable and (mostly) portable. I'll admit, I'm a pretty adamant CSS in JS supporter, but I still do use CSS at the end of the day. This post demonstrates that I still have a lot to learn about proper CSS, but more importantly, there's a gigantic amount that I no longer have to learn. Which is a testament to the progress made.
• lukaszkups 7y ago
  This is something. I remember times when inline styling was the thing. I have started my journey with web development. Then I left, busy with high school social life. Then, at the university I came back. And everything has changed: css files, some crazy JavaScript + jQuery effects etc. And now here we are: front-end development is heavily focused on JavaScript only, powered by frameworks. Time flies like crazy.
• dionidium 7y ago
  I still have some of my stuff from this era up on the web. The source has all kinds of CSS hacks called out. * A two-column layout http://dionidium.com/design/leftbar/leftbar.html http://dionidium.com/design/leftbar/leftbar.html * A valid XHTML 1.1 version of that layout http://dionidium.com/design/leftbar/xhtml11/ http://dionidium.com/design/leftbar/xhtml11/ * Two-column layout with equal heights http://dionidium.com/design/column/ http://dionidium.com/design/column/ * My old "default styles" stylesheet http://dionidium.com/design/default.css http://dionidium.com/design/default.css This was a fun read!
• deleted 7y ago
  [deleted]
• ltriant 7y ago
  > This was also the era of “web-safe colors” — a palette of 216 colors, where every channel was one of 00, 33, 66, 99, cc, or ff — which existed because some people still had 256-color monitors! The things we take for granted now, like 24-bit color. Ah, I remember so many evolutions of my own websites using 336699 and 6699ff as the main colors. I still default to them even now when I just need _something_ that isn't default colors. And wow, I forgot all about image maps! I used to stare in awe of the super artistic websites that used image maps heavily, as if I was witnessing the blackest of black magic.
• cfv 7y ago
  CSS layout is, in more than one way, like string semantics in c++. A whole lot of innovation and a few gross missteps happened there, with the side effect of pushing everyone and also the language itself forward
• vhiremath4 7y ago
  lol https://twitter.com/eevee/status/1223913737540657153 https://twitter.com/eevee/status/1223913737540657153
• neop1x 7y ago
  "unless for some reason you use an iPhone, which forbids other browser engines, which is far worse than anything Microsoft ever did, but we just kinda accept it for some reason." - yes...what is that reason? How is it even possible?
  • dspillett 7y ago
    For a simply objective look at the different positions of MS than and Apple now, there are three significant points that spring to my mind: 1. Apple do not have anything like the monopoly stronghold on the phone & tablet market that MS had on desktop and laptop PCs. 2. They are not (that I know of) directly using the market power that they do have to try completely block competitors. While there is no doubt some coercion going on (if you give iDevices pride of place in your store we may give you preference over others when supplies are low) there isn't the outright "stock Android and we won't give you any iDevices to sell" equivalent to MS's behaviour with regard to DRDOS/BeOS/OS2/... in the 90s. 3. They are not being deceptive about their position, like MS quietly but very deliberately scuppering DRDOS during Win3.1 development (https://en.wikipedia.org/wiki/AARD_code https://en.wikipedia.org/wiki/AARD_code). Apple-land is officially a walled garden where MS were at least pretending to operate openly in a shared market. More subjectively, whether these objective differences are enough to justify the relevant authorities not going after Apple is a matter of opinion and/or complex legal wrangling concerning the interpretation of monopoly/anti-competition/other legislation and its wording.
• lillydecosta 7y ago
  I don't know more much about old new CSS and now this time study and joining coaching center and in coaching center they taught to me to mention a custom css in the head section and apply css in <style></style>tag
• inopinatus 7y ago
  Two decades ago I was overjoyed to discover that Scheme was finally going to have a useful application beyond illustrating SICP and writing koans to amuse myself, because DSSSL was on the cusp of evolving into the last document styling language anyone would ever need. Unfortunately following an incident with a broken Lisp machine, a liquid lunch, and an unlicensed particle accelerator, I became trapped in a parallel universe where the HTML ERB anointed CSS by mistake during a drunken night out in Oslo. The fundamental concept of CSS (best revealed by H.W.Lie's thesis IMO[1]) was to create a rich and versatile and non-Turing-complete set of structural selectors in lieu of DSSSL's recursive logic, and to allow styles to overlay one another; two design choices that only by the application of gallons of irony can explain why most web pages are composed of a bunch of nested DIV elements with hashed IDs and overloaded semantic class attributes, and everyone compiles their assets into a static file. I switched to Tailwind CSS months ago. Adam Wathan is the hero we deserve. [1] https://www.wiumlie.no/2006/phd/css.pdf https://www.wiumlie.no/2006/phd/css.pdf
  • blain_the_train 7y ago
    Can you elaborate on what problem tailwind is solving? My first impression is that it looks like a set of custom built css classes.
    • inopinatus 7y ago
      No, not custom at all. Quite the opposite - it's a well-curated set of standard classes. It's the focus on utility-based composition of style that sets Tailwind apart. For me the problem being solved is maintainability, recognising that CSS is tremendously brittle with regard to the application it serves and the context in which it is evaluated. Probably best to read https://adamwathan.me/css-utility-classes-and-separation-of-concerns/ https://adamwathan.me/css-utility-classes-and-separation-of-... which does a much better job of explaining the motivations, and the conceptual journey of its creator, than I ever could. Many folks (not all, but many, I'd even venture to say ... most) have a four step reaction to Tailwind: 1. That is the stupidest webdev idea I ever heard, and I've heard a lot. // 2. Fine, I'm trying it because everyone else keeps prompting me to and/or its creator seems competent. // 3. This is weird but actually quite helpful and totally not what I expected. // 4. You have ruined me for any other CSS framework and I never want to use anything else. All CSS is crap. Tailwind is (in my experience and opinion) the least crap and most productive approach yet.
• _ZeD_ 7y ago
  >>> [<br />] might lead you to believe that <script/> is an empty <script> tag — but in HTML, it definitely is not! ? What is "<script/>"?
  • ihuman 7y ago
    The script tag can't have an ending slash, so the browser turns it into a regular script tag. Since there's no closing one, the rest of the website becomes the content of that script element.
• mapleboi 7y ago
  such a good read. was always wondering how things went back in the 90s with internet and web development in particular. seems like an internet wild west
• m000 7y ago
  This was a redeeming article for me. I remember volunteering with a friend to update our university department's website back in 1997. The budget for that was 0, so volunteering sophomores like us was the best they could get. The result was a more consistent, but still fugly website. I always thought that this was because we were completely clueless, but now I realize that fugly websites was the norm back then.
• aloukissas 7y ago
  What's hilarious, it's mostly the same "old" css that you still have to work today for html emails :(
• m712 7y ago
  About map/area: Some websites still use them, and really well too. The Team Fortress 2 website[0] uses them with the images at the top of the page to link each of the characters' description pages. [0]: https://teamfortress.com/ https://teamfortress.com/
• commandlinefan 7y ago
  I still maintain that the only (not the "best", but the only) way to really learn something - even something technical - is to understand its history and understand how it got to be the way it is. Everything starts out about as simple as you expect it would be - probably the way you or I or anybody else would put it together if we didn't have any guidelines to work off of, and ends up being refined a bit at a time as more surprises are discovered. The problem is, what you end up with - like modern CSS - just don't make a lot of sense unless you understand what problems the current versions were refined to work around.
• mekane8 7y ago
  Yeah this was a wonderful trip back in time for me too. I graduated high school in 1999 so I got to spend a couple teenage years playing around with HTML. I identify strongly with the "copy cool stuff from other teenagers' sites". At my first web development job in the early 2000's I did some work with SGML. I forget now what I was specifying, but I remember finding it really interesting to be able to understand DTD's. It was like seeing the DNA of HTML. I also remember the miracles to productivity that were Firebug and jQuery!