惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Cloudbric
Cloudbric
T
Threat Research - Cisco Blogs
Simon Willison's Weblog
Simon Willison's Weblog
AWS News Blog
AWS News Blog
P
Privacy & Cybersecurity Law Blog
H
Help Net Security
云风的 BLOG
云风的 BLOG
G
GRAHAM CLULEY
Spread Privacy
Spread Privacy
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
A
Arctic Wolf
Project Zero
Project Zero
Engineering at Meta
Engineering at Meta
P
Privacy International News Feed
Blog — PlanetScale
Blog — PlanetScale
Stack Overflow Blog
Stack Overflow Blog
M
MIT News - Artificial intelligence
The Register - Security
The Register - Security
Recorded Future
Recorded Future
cs.AI updates on arXiv.org
cs.AI updates on arXiv.org
C
Cisco Blogs
PCI Perspectives
PCI Perspectives
Recent Announcements
Recent Announcements
Martin Fowler
Martin Fowler
A
About on SuperTechFans
W
WeLiveSecurity
GbyAI
GbyAI
V
Vulnerabilities – Threatpost
The GitHub Blog
The GitHub Blog
D
Darknet – Hacking Tools, Hacker News & Cyber Security
C
Check Point Blog
Y
Y Combinator Blog
月光博客
月光博客
Scott Helme
Scott Helme
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Google DeepMind News
Google DeepMind News
F
Fortinet All Blogs
U
Unit 42
G
Google Developers Blog
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
T
Threatpost
Application and Cybersecurity Blog
Application and Cybersecurity Blog
Google Online Security Blog
Google Online Security Blog
Recent Commits to openclaw:main
Recent Commits to openclaw:main
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
Cisco Talos Blog
Cisco Talos Blog
博客园 - 三生石上(FineUI控件)
Hugging Face - Blog
Hugging Face - Blog
MongoDB | Blog
MongoDB | Blog
博客园 - 司徒正美

Bryan Robinson's Blog

Does our technology still work for us? Product pricing, dev bad habits, and the role of the pit of success Astro Server Island for latest Bluesky post (heavily cached!) Type-safe environment variables in Astro 5.0 New Website, but really is it? Netlify Durable Cache: Caching for a third-party world Introducing the Hygraph Astro Content Loader Integrating Astro.js Starlight Documentation into a Next.js Project Using Proxies Jamstack is meaningless 😱 Book Release: Eleventy by Example – Learn 11ty with 5 in-depth projects 11ty Second 11ty: Creating Template Filters 11ty Second 11ty: Global Data files (JS and JSON) 11ty second 11ty: The Render Plugin Part 1 Help needed: Netlify Frontend environment variables with Astro.js Quick experiment with the Slinkity 11ty plugin Creating a dynamic color converter with 11ty Serverless Using 11ty JavaScript Data files to mix Markdown and CMS content into one collection How to show your template code in 11ty blog posts New City, New Job, New Content Using Nunjucks Climbing the 11ty Performance leaderboard with Cloudinary, critical CSS and more Three JAMstack movements to watch in 2020 Create a Codepen promo watermark with no additional HTML, CSS or JS 3 underused CSS features to learn for 2020 Use CSS Subgrid to layout full-width content stripes in an article template Adapt client-side JavaScript for use in 11ty (Eleventy) data files CSS Gap creates a bright future for margins in Flex as well as Grid Create your first CSS Custom Properties (Variables) Use CSS Grid to create a self-centering full-width element Creating an 11ty Plugin - SVG Embed Tool Now offering design and code reviews at PeerReviews.dev Routing contact-form emails to different addresses with Netlify, Zapier and SendGrid Create an Eleventy (11ty) theme based on a free HTML template Client work and the JAMstack Grid vs. Flex: A Tale of a "Simple" Promo Space Using Eleventy The Tech Barrier to Entry Let Practical CSS Grid - Launching My First Course Build Trust on the Web incorporating User Worries with your User Stories 2019 The Year of Markup-First Development Refactoring CSS into a Sass mixin Starting a new journey with Code Contemporary Dynamic Static Sites with Netlify and iOS Shortcuts Top 3 uses for the ::before and ::after CSS pseudo elements How To: Use CSS Grid to Mix and Match Design Patterns Use CSS ::before and ::after for simple, spicy image overlays Modern CSS: Four Things Every Developer and Designer Should Know About CSS 3 Strategies for Getting Started with CSS Grid CSS Tip: Use rotate() and skew() together to introduce some clean punk rock to your CSS The 5 Stages of Grid Love How To: A CSS-Only Mobile Off Canvas Navigation How To: Use CSS Grid Layout to Make a Simple, Fluid Card Grid Make a More Flexible Cover Screen with CSS Grid Can CSS Grid open up interesting CMS Layout options? Firefox 52 to Introduce New Box-Alignment Values Falling Forward — Rethinking Progressive Enhancement, Graceful Degradation and Developer Morality Start Exploring the Magic of CSS Grid Layout I Converted My Blog to CSS Grid Layout and Regret Nothing Feature Queries are on the Rise CSS Shapes — Let the Text Flow Around You Flexbox -- Let Memorializing Prince and Print vs. The Web I went to Italy and noticed UX fails How to Get Designers to Contribute in Open Source The True Gift of Your Former Code
What Can We Learn from CERN
2019-02-21 · via Bryan Robinson's Blog

WorldWideWeb browser with a few different sites

Have you ever wanted to go back in time and see what it was like to browse the web using Sir Tim Berners-Lee’s first web browser? I have. Apparently so did the team at CERN.

For the 30th anniversary of the world’s first web browser, The European Organization for Nuclear Research (CERN) brought togoether a team to recreate WorldWideWeb in a modern browser.

You can read a decent bit about the project over at its site worldwideweb.cern.ch.

Check your sites in a purely text-based browser

I’m a fan of semantic, server-rendered HTML, so I had to see how my site would perform. I crossed my fingers, launched the browser and pulled up my site. I’m proud to say that this site and my company site (codecontemporary.com) perform admirably. Both seem to be well structured and surface content in a way that makes sense.

Image: the code blocks on this site don't show well-formatted code

There are a few exceptions. My code blocks handle formatting with JavaScript — which wasn’t invented yet. All the code examples are gibberish. My “Side Projects” in the footer are just links with images inside. The <IMG> tag (caps intended) wasn’t proposed until 1993 (3 years later). Check this site in the browser to see for yourself.

If you want to know how well you’re writing semantic HTML, see what it looks like in a web browser that understands almost no modern code.

Image: Amazon homepage

On a lark, I pulled up Amazon. Why yes, Amazon, I’d love to buy a Top Deal for $29.99 instead of $37.99… whatever it is, that’s a deal!

It’s not too surprising that a company the size of Amazon uses a lot of JavaScript, but I didn’t expect some content to appear and other pieces not appear.

Image: NYtimes homepage

A news site like The New York Times fares a bit better. If you can get passed the absolute glut of navigation, you’re presented with the news of the day. From a hierarchy perspective, all content is smashed together, but that’s not any different when you give them CSS and JS. You can’t blame an old browser for that! Oooh sick Journalism UX burn!

At a glance, a “topic of the day” looks like a random floating name. Their use of related stories also makes it really hard to tell to which stories the comment counts are attached.

The real site suffers from hierarchy issues, but it’s also interesting to see how design issues easily bleed over to HTML. In fairness, most of their content shows up, unlike Amazon.

What’s the point? Why should we look at our sites in WorldWideWeb and feel shame or pride?

If your site’s content flows properly in a browser as old as this, you can feel some sense of security that maybe screen readers and web crawlers can understand your markup.

This is no replacement for proper accessibility testing, but it’s an interesting side effect of a “Digital Archeologists.”

So what can we learn from this? If you write the basics properly, your content can stand the test of time. Don’t forget to at least think markup first.

If your markup is clean, semantic, and actually there then your content has staying power and reusability in any browser.

What are your thoughts? Should we care about how our markup is served?