Social media killed website creativity

There was a time when the internet felt like an art gallery. Every site was a reflection of someone’s taste — a messy collage of colors, typefaces, GIFs, and music that was very personalized, character integrated visual storytelling to share with visitors. Web developers and designers were trying their very best to express themselves while pushing the browser to its limit depending on the capabilities of HTML, CSS, and JavaScript. Now with all the new features of CSS, WebGL, JavaScript, HTML at our fingertips the sky is the limit on what we can do as developers. Then came social media, and the web started to look the same everywhere.

A brief history

The handmade web

As I turn on the wayback machine, I remember my first time seeing websites in the late 90’s and early 2000s. It was AOL, Yahoo Mail, Space Jam, Pixar’s Toy Story. I also saw a wide range of clunky looking sites, with comic cans or serif fonts, with audio effects, overly high contrast colored backgrounds, animation crafted with Flash, very slow loading times, but 8-10yr old kid entering these portals (with the permission of my parents of course) was an absolute blast.

The platform era

Then comes my generation of newbie developers and designers who tried their hands in HTML and CSS around 2005 - 2012. In junior high school, having a MySpace and/or Tumblr was the state of social currency back then and who had the coolest page. I was really into making sites for myself and others. I would see people’s pages and I would ask “How did they do that?“ I would inspect other pages, reverse engineer CSS, experiment with inline styles just to see what happens. It was incredible especially for artists who were sharing their music such Tyler, The Creator, Frank Ocean, and so much more. The blogger era was its peak during this time. Music curators had so much fun discovering artists especially because people enjoyed the creativity. Kanye West had an incredible blog called Universe City during the arc of The College Dropout, Late Registration and Graduation. It felt like this era came and went so fast.

Facebook, Twitter, and Instagram just hatched but the growth was exponential. We migrated from hacking sites and building experiences from scratch to now simply uploading photos, videos and status updates for likes.

From “My Site“ to “My Feed”

Websites had a feeling of entering someone’s personal living space that was built in the most honest way possible. Now we all live in homogenous rented spaces. It felt as though social media has gentrified the web where the web has to comply with the user expectation and experience social media and mobile apps provide. Design thinking, colors, typography, layout has been decided for us and the only thing left for creativity is the curation of a lifestyle which may or may not be true - but clicks, visibility, instant gratification is what matters.

It affected the creativity of web developers including myself because we’ve fallen victim to a system that works and has a transition into the corporate space.

man sites used to have so much personality, specific to them. background music, blog informing the world, the store had shapes that werent just white backgrounds. and they were all specific to them, not all multi media. most now are front page product shots with white background.… https://t.co/O3PMgSXKeq

— T (@tylerthecreator) October 16, 2025

In the corporate space

Now as an adult working as a developer, most companies want the most efficient website, a strong brand, high conversion and SEO, fast, and responsive. Right before the emergence of AI, every site you see has a white background using Inter font or some font pairing curated by typewolf, with a minimalist layout. Design systems and grids have also contributed the homogenization of web applications. Every major company like Shopify, Adobe, Atlassian, Google Material UI, and Apple have set the standard on what other corporations should do to optimize the design in their products. Reusable component libraries such as shadcn have now risen where developers don’t have to reinvent the wheel anymore. AI now can repeat these patterns and develop working prototypes within minutes just entering a prompt describing your product.

Don’t get me wrong, the technology of the web under the hood of all these sites and applications are efficient. Accessibility, user experience, design thinking and performance is off the charts. But where’s the humanity in design now?

What now?

Now that AI has emerged I have a hunch people are craving hand crafted artifacts again. The fast production supported by AI has opened everyone’s eyes to see what we’ve given away amongst the slop. We’ve given away our sense of the human ability to think critically and creatively in UI/UX design, storytelling, and we’re no longer being curious.

So what do we do?

Explore print design

There’s some gaps I feel we have filled in graphic and print design. I don’t think we have gracefully transitioned and maintained the wonderful explorations done by previous designers. Jen Simmons has exposed this in her experiment lab where she explores Jan Tischold’s grid systems using the grid property in CSS. Your mind will be blown by the things you can do today and it opens so many ideas for what you can on your next website.

Jason Pamental, principal designer at Chewy.com did an amazing keynote at Smashing Conference 2025 in NYC talking about typographic design and efficiency on the web. He introduced a few examples in poster design, brochures, and how typography can be used as an element of expression in design. Which reminds me I need to check out the Poster House in NYC. He mentioned there are really inspirational pieces in there.

Recreate mobile app experiences

Another approach I’ve been thinking about is adding mobile app user experience to the web. There’s so many features I’ve yet to see more popularized such as seamless page transitions, scrolling capabilities and animations. For example, Adam Mosseri & Instagram introduced a new simplified navigation between its main pages (main feed, reels, DMS, explore, and profile) where the user can scroll left and right — I wonder if that’s something to introduce to the web. Navigation on the web is an area that can use a new perspective. CSS is so powerful now that I wonder if we can recreate some animations from SwiftUI.

Underline vs Border-bottom

While customizing a singular blog post item on here, I was trying to style the ‘Read More’ link. I was tinkering away in the Inspector of the browser to find the right way to display the link. As I was customizing, I spotted it had a height: 1px and a solid black background color as a pseudo element — which caused me to pause then proceeded to remove that and add border-bottom of 1px solid black. I took another pause and asked myself “is that even the rightway to style a link? Shouldn’t I be using text-decoration:underline ? What’s the difference between the two?” With these questions in mind I went on to explore the differences. Let’s look at the visual differences between the two. For the examples going forward I will use an anchor tag labeled Visit the page.

Underline

The underline text-decoration by default sits close to the text, respects text color contrast and intersects with descending characters like “p,q,g,y, or j” or any descending characters in other languages.

Visit the page

<style>
.underline {
text-decoration: underline;
}
</style>

<a class="underline" href="#">Visit the page</a>

Border-bottom

The clear difference is that the border underneath the text by default is created at the bottom of the anchor element’s height.

Visit the page

<style>
.border {
border-bottom: 1px solid black;
}
</style>

<a class="border" href="#">Visit the page</a>

I’ll assess them in a few categories: visibility, color contrast and maintenance. But I’d like to get this out the way and they both from an assistive technology standpoint they both pass in which they will both be recognized as a link because these are both semantically recognized as links. They will both be accessible via keyboard tab navigation and a focus ring will show on them when the tab key reaches them on the page.

Visibility

For visibility, you want to make it’s clear and understood by the user what the element is doing. Most user recognize links with a border closely tucked underneath the text.

• For dyslexic users, the underline skips descending characters by default.

• Engineers don’t have to fiddle with positioning. Using border-bottom in this case would have to adjust position relative to the baseline of the font used in the design. If the baseline of the typography is not understood that could lead to lots of inconsistencies and maintenance in CSS.

• Using a link with text decoration underline or the default link style is important for maintaining clear and accessible web navigation. Underlines are a widely recognized visual cue indicating clickable text, improving usability for all users, including those with cognitive or visual impairments.

Color contrast

• Color contrast between the background, canvas and surrounding text is established by default when using underline text decoration style especially in forced colors mode.

• Using border-bottom could potentially lead to inconsistency in styling. It’s easier to accidentally create low-contrast or offset underlines that users mistake for separators or emphasis on a string of text instead of link indicators.

Maintenance

We want to maintain legacy CSS code and less is more. This means styling just a semantic with its properties.

• When styling a link the underline is the same color as the text and all you would need to do is style using the color property.

• Using border-bottom leads to styling both the link and the border bottom. Now add the interaction states of hover, active and focus. The complexity of the styling has multiplied even more especially when styling in forced colors. Border-bottom needs to be defined in this state.

You can see where I’m going with this. The clear winner for styling links is text-decoration: underline. It’s cognitively accessible, clear distinction between surrounding text, and easiest to maintain in styling. So with that said, I’m going to make sure the links on my site are following WCAG as much as possible.

What if you want both aesthetics and accessibility?

The current state of links today don’t need to use borders, box-shadows, or background image to be creative. CSS allows for deeper styling of the underline if you choose to do so.

Visit the page

a {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  text-decoration-skip-ink: auto;
}

This approach using these properties keep cognitive accessibility in mind for dyslexic users. You can add text-decoration-color and style if you really want but remember who you are designing for and what is globally understood as a link for users.

You don’t need to over-engineer your personal website

I can’t believe I’m saying this as a web developer and designer, but I made this site using Squarespace. For many years, I’ve explored building sites using Jekyll, Gitpages, Gatsby + Contentful, Eleventy, Vercel, and some other light weight site generators. As much as I love the creative freedom and not to mention the money saved using these generators. I want to highlight some reasons why it may be a good idea to optimize your time and focus on other aspects that are important to you.

The JAMstack Trap

JAMstack was supposed to make the web faster, simpler, and more modular. And for a while, it did and still do. Static generation, headless CMSs, deploy previews that changed how we build at scale.

But the key word there is scale. My personal site doesn’t need to scale. It’s not serving thousands of users across continents. It’s a quiet corner of the internet for my ideas, work, and story. I just need a space to let the work I’ve done speak for itself.

Yet somewhere along the way, we convinced ourselves that even a one-page portfolio needed:

• Continuous deployment

• TypeScript configs

• API routes for fetching blog posts

• Lighthouse audits and analytics dashboards

We turned self-expression into a DevOps exercise. Your website shouldn’t require npm audit fix just to tell the world who you are.

The Performance of Professionalism

Developers, myself included, fell for the illusion that a complex stack signals sophistication. That if your portfolio runs on the latest framework, it must mean you know what you’re doing.

But truthfully, what most of us want is not a showcase of our tooling, but a place to think out loud.
A space to publish something imperfect.
A home for your creative trail — not another side project with a backlog.

The irony is that the more powerful your setup becomes, the less likely you are to actually use it. The friction grows. You hesitate to write because the build broke or your Markdown parser changed. Complexity quietly kills creativity.

Simplicity Is a Creative Choice

I used to think a developer’s worth was reflected in the tech behind their site or how stunning their site looked. Now I think it’s reflected in how often they share something. Simplicity isn’t regression — it’s freedom. When you stop maintaining a stack, you start maintaining a voice.

There’s nothing wrong with wanting polish and structure. But you don’t need a full design system to publish a thought. You don’t need a component library to introduce yourself. You just need a surface that lets you focus on the work itself.

First website in 2014 - Gitpages

Second website in 2018 - Gatsby & Contentful

You can see I have a particular look and feel - black & white, grayscale with a touch of expression in typography and imagery. My message and presentation of identity became more clear as the years went by and so did what I want in the components I needed to display my work. But I grew to understanding that the work under the hood is completely unnecessary for me on a small scale.

Issues:

• Resolving security vulnerability flags

• Removing deprecated and incompatible plugins

• Building components from scratch or installing reusable component libraries to save time

• Resolving potential deployment issues with Netlify and CI/CD pipeline

Throughout my career I would find myself refining the site to not only just fix bugs but to make sure the site was ready for potential recruiters to see it. I found myself losing time in fixing things and making sure everything looked great instead of showcasing.

What matters most

There is a plethora of ways to build a website. Part of our skillset as web developers and design engineers is to properly assess the right tools needed to solve a problem. Your personal website is not a problem that needs to be solved — it’s a place to be yourself. Whether you are new or experienced finding the simplest way to showcase your work is the best approach. Picking a CMS like Squarespace works for me because I have experience in customization of the templates and CSS. It also covers things that are important for me right now:

• SEO and marketing tools are built in already

• Blogging is scalable whenever I choose

• The Squarespace community of developers have created so many amazing layouts to choose from even though the CMS itself has so many layouts to choose from

• Monetization tools are secure and built in

• No CI/CD pipelines, builds, or custom components to build from scratch

There’s other options like Framer, Notion + Super.so, Typedream, Cargo, and Popsy. Whatever you decide choose the platform that you know you will be the simplest to share your thoughts and ideas. Leave the developing to a repository on your Github and prototyping on Codepen or something where people can really see how you think.