How to Create a Skill Bar: The Definitive Guide

Level 1: Pretend Percentages

Imagine you have a friend who says, “I’m 90% good at playing piano.” 🤨 That sounds a bit silly, right? You’d probably wonder how they came up with that number. Did they take a test that gave them a 90 out of 100? Or do they know 90% of all songs? It’s not clear at all – they just made up a pretend percentage to describe their ability. This meme is laughing at the same kind of situation, but with coding skills. On some résumés or personal websites, people draw bars or fill up gauges to say “I know this thing this much!” For example, a bar might be more than half filled with a label “JavaScript – 65%.” That’s like saying “I’m 65% good at JavaScript.” It looks fancy, but nobody really knows what it means – it’s just a made-up number.

The joke in the picture tells us step one of making such a skill bar is: “Stop right now. Forget about doing this. What the heck does ‘90% in PHP’ even mean?” In plain terms: claiming you’re “90%” skilled in something is as strange as a kid claiming they’re “90% good at riding a bike.” It doesn’t actually explain anything. Maybe the kid can ride without training wheels but still wobbles on turns? Who knows – the number doesn’t explain it. We’d rather hear how they ride or what tricks they can do on the bike. In the same way, instead of saying “65% at JavaScript,” a programmer could say “I’ve been using JavaScript for one year and know the basics of making web pages interactive.” That actually tells a story.

So, the funny part here is that those percentage bars try to make a skill look like a measured score – like a video game where your character is 65 out of 100 points strong in Strength or Magic. But real life isn’t a video game, and abilities can’t be summed up so neatly. We all kind of laugh because many of us have seen these bars and thought, “hmm, that’s cool-looking but kinda meaningless.” It’s poking fun at the idea that you can quantify knowledge or talent with a random percentage. Just as you’d giggle if your friend seriously said “I’m 73% good at cooking,” developers giggle when they see “73% JavaScript.” It’s a silly make-believe score that might end up confusing or amusing people more than impressing them. The advice? Maybe skip the pretend points and just tell or show people what you can actually do! That’s more honest – and it won’t make experienced folks roll their eyes and laugh as they do at this meme.

Level 2: Skills, Bars, and CSS Gimmicks

Let’s break down what’s actually in this meme for a newer developer or someone outside the coding world. The image is depicting a snippet from what looks like a tutorial or how-to guide titled “How To Create a Skill Bar.” You see two horizontal progress bars at the top: one red bar labeled JavaScript at 65%, and one gray bar labeled PHP at 60%. These bars are visual devices often used on personal websites or résumés to represent how proficient someone is in a given skill or technology. In other words, they’re resume_percentages – a way of saying “I believe I know JavaScript at 65% capacity, and PHP at 60% capacity.” The meme jokingly presents Step 1 of this guide as: “Stop immediately. Abandon any desire to create a skill bar. What the f**k is 90% PHP anyway?”

Why is that funny? Because it’s pointing out that claiming a percentage for your skill in a programming language (like PHP or JavaScript) is pretty silly when you think about it. There’s no official scale for measuring “how much” of a language you know. JavaScript and PHP are computer languages (JavaScript mostly for web front-end behavior, PHP mostly for server-side web development). You can’t hook up a thermometer or run a test that says, “Aha, you have 65% JavaScript mastery!” These percentages are self-assessed guesses. Newer folks often include them to make their résumé look modern and visually engaging – it’s a design trend. But the numbers are arbitrary. If someone says they are 90% in PHP, it raises questions: 90% of what? Did they leave out 10% of the PHP language features they haven’t learned? Does it mean they score 9/10 on a PHP quiz? Or they feel 90 out of 100 confident in their PHP coding? There’s no standardized meaning. It’s the epitome of meaningless_metrics: numbers that impress visually but don’t convey real information.

Now, on the technical side, how are these skill bars made? This is where frontend knowledge comes in. Those bars are basically just rectangles filled with color, and the fill amount is controlled by simple CSS (Cascading Style Sheets) rules. Front-end developers use HTML to structure a bar and CSS to style it to a certain width representing the percentage. For example, a very basic way to create that “JavaScript 65%” bar would be:

<p>JavaScript</p>
<div class="skill-bar">
  <div class="fill" style="width:65%;">65%</div>
</div>

In this snippet:

• The outer <div class="skill-bar"> is like an empty track (gray background perhaps).
• The inner <div class="fill"> is the colored portion (red, here) with a fixed inline style width:65% that makes it stretch 65% of the full bar’s width. The text “65%” might be placed inside it or beside it to label it.

The key point: that 65% is not calculated by examining your brain or your years of experience. It’s literally whatever number the person building the website decided to type in. You could change that width:65% to width:95% and suddenly the bar would display as 95% full — it doesn’t mean you mysteriously became better at JavaScript by changing the code! It’s all presentation. The meme shows a “Try it Yourself” button (in green) which is characteristic of interactive coding tutorials (notably W3Schools, a popular site for beginners to learn web snippets). That hint tells us the original template likely was teaching how to create a progress bar UI. The meme creator hijacked it to say: the first lesson of making a skill bar should be realizing it’s a bad idea to use one for self-assessment.

For a junior developer or someone writing their CV: think twice about those pretty skill_bars or pie charts indicating you’re “60% proficient” in something. Because experienced folks know it’s just a bit of front-end eye-candy. Sure, they demonstrate you know a bit of web design (you can make a colored bar, congrats!), but they also hint you might not understand how unquantifiable skills really are. If I see “65% JavaScript” on someone’s profile, I wonder: have they mastered about two-thirds of the language’s concepts? Maybe they’re comfortable with the basics and some intermediate topics but not the advanced stuff? But everyone’s 65% could mean something different. My 65% might be another person’s 40% or someone else’s 90%, because there’s no objective ruler here.

The tags javascript_vs_php in the context suggest the meme is also poking at comparing skills in different languages side by side. If someone puts JavaScript 65% and PHP 60%, they’re implying “I’m slightly better at JavaScript than I am at PHP.” But can we really compare like that? One language might have a steeper learning curve or a broader ecosystem than the other. Is that 5% difference supposed to tell a hiring manager anything useful? Not really. It might only reflect personal comfort: “I feel a tad more confident in JS than in PHP.” That’s something you could just say in words! The numbers make it look scientific when it isn’t.

Let’s also clarify why the meme specifically says “What the fk is 90% PHP anyway?”** PHP is a programming language primarily used to build websites (often old-school ones or via frameworks like Laravel). Saying “90% PHP” is humorous because it sounds like you’ve somehow measured almost the entirety of PHP knowledge and decided you possess 90% of it. It highlights the absurdity: nobody can enumerate all knowledge of PHP (there’s core language, standard library, myriad frameworks, performance tricks, etc.) and then declare they have exactly 90% of that in their brain. Even certification exams wouldn’t frame it that way. The meme uses a bit of profanity and a blunt tone because it’s channeling the frustration or eye-rolling many devs feel when they see such self ratings. It’s like a friend grabbing you by the shoulders and yelling (in a funny way), “Dude, stop! Don’t do this to yourself.”

In summary, the image shines a light on a RelatableDeveloperExperience: many newcomers feel compelled to quantify their skills to look professional, often using neat front-end tricks like progress bars. But those who’ve been around longer realize it’s an empty form of CareerHumor – all style, no substance. It’s far better to describe your skills qualitatively or show projects you’ve done. A hiring manager or fellow dev can understand “built a personal website with JavaScript and PHP, including a dynamic contact form” much better than seeing “JavaScript 65%”. The latter just makes them scratch their head (or chuckle, as we see with this meme). So the meme’s Step 1 advice is essentially: save yourself the awkwardness – skip the skill bar gimmick entirely.

Level 3: Progress Bar Paradox

At first glance, those resume skill bars seem like a neat idea: “JavaScript – 65%”, “PHP – 90%”, presented as sleek colored progress bars. But any experienced developer who’s been around the block will smirk and ask: what on earth is 90% PHP anyway? This meme nails that absurdity by literally instructing: “Step 1) Stop immediately. Abandon any desire to create a skill bar.” The humor here comes from exposing the paradox of claiming precise percentages for something as complex and unquantifiable as programming skill.

From a senior engineer’s perspective, these percentage-based self-assessments are a classic case of meaningless_metrics. They provide an illusion of rigor or measurement but raise more questions than answers. A progress bar is usually a GUI element tracking actual progress (like file download 65% complete according to bytes transferred). But in a résumé, that 65% JavaScript bar is entirely self-assigned. There is no standard test or unit of measure to back it. It’s as if someone decided their grasp of JavaScript is a little better than half but not quite “expert” – an oddly specific self_assessment_ui with no calibration. The result? The viewer is left puzzled: Which 35% of JavaScript do you admit to not knowing? Are you missing 35% of the JS specification? Did you skip learning certain frameworks, or maybe you fail to understand closures exactly 35% of the time? The Career_HR folks might think it looks visually appealing on a résumé, but any technical hiring manager will arch an eyebrow and chuckle at the pseudo-precision.

Technically speaking, a skill bar isn’t some dynamically computed gauge of your coding ability – it’s pure front-end theater. A front-end developer knows that these bars are made with simple HTML/CSS, maybe a dash of JavaScript for animation, but with completely hardcoded values. If you claim “PHP – 90%”, that number is whatever you decided it to be – not the result of a rigorous exam. The meme’s image clues us in by mimicking a tutorial page (complete with a green “Try it Yourself »” button reminiscent of W3Schools) but then delivering the punchline advice: don’t even start down this path. The underlying gag is that creating a pretty skill bar is a trivial frontend exercise (just set a width in CSS), yet it’s being used to convey something it cannot truly quantify.

Let’s peel back the curtain with a quick peek at how easy it is to conjure a skill bar. You could literally write:

<!-- A "skill bar" for PHP -->
<div class="skill">PHP – <span class="percent">90%</span>
  <div class="bar"><div class="fill" style="width:90%"></div></div>
</div>

All we’ve done is explicitly set width:90% on that inner .fill div. That’s it – the bar magically fills to 90%. It doesn’t query a database of your knowledge or run unit tests on your code. It’s just you, the developer, choosing a number that “feels” right. In other words, the skill_bars on a résumé are about as scientific as selecting a random grade for yourself. The code above illustrates how any percentage can be fabricated with one line; a progress_bar_css trick that gives the appearance of measurement without the substance. So when a seasoned developer sees something like 65% JavaScript vs 60% PHP, they know it’s just self-decorative fluff. In fact, the meme specifically highlights the odd specificity: only a 5% difference between JavaScript and PHP? How was that determined? Perhaps our intrepid résumé-writer struggled slightly more with PHP quirks like $ sign syntax or got an extra question right on a JavaScript quiz? The tiny 5% gap is hilariously arbitrary – it suggests a false sense of precision, as if the individual has calibrated their JavaScript_vs_PHP comparison to two decimal places of expertise.

Beyond the technical facade, there’s an industry inside-joke here about how developers present themselves vs what actually matters. Hiring managers and senior engineers generally care about concrete experiences (“built a REST API in PHP and deployed it to production” or “developed a single-page app in JavaScript using React”), not some bar graph claiming expertise = 90%. In fact, a common interview quip is to probe such claims: “So I see you listed 90% in PHP – can you tell me about the 10% you haven’t mastered yet?” This usually leads to awkward laughter, proving the point that these percentages are nonsensical. The meme’s blunt phrasing “What the f**k is 90% PHP anyway?” echoes that exact exasperation from veteran devs: programming isn’t a Pokémon where your PHP skill is at level 90 out of 100. There’s no final boss battle after which you unlock the remaining 10%. Real knowledge is broad and cannot be linearly quantified. Ironically, the more experienced you are, the less you’re inclined to claim anything near 100% – because you’ve seen how deep the rabbit hole goes. Truly mastering PHP (or any language) could mean understanding everything from basic syntax to internals of the Zend engine and decades of accumulated libraries – an infinite journey. So anyone touting 100% looks naïve (and a bit arrogant). And if someone is at 90%, a grizzled coder might joke: “Ah, so you’re aware of how much you don’t know – maybe that last 10% is the weird segfaults and the entire PHP 8 changelog you haven’t caught up on.”

The satire cuts at a broader CareerHumor truth: tech résumés often chase gimmicks to stand out, but they can backfire. Those colorful bars and meaningless_metrics might impress a non-technical recruiter who just sees “Oooh, a mostly full bar for JavaScript, nice!” But to a developer on the interview panel, it screams “I’m a beginner who thinks skills are like HP bars in a video game.” It’s a relatable developer experience because many of us have been there – early in our careers, we saw fancy portfolio templates or LinkedIn profiles with skill percentages and thought we needed them too. (Some of us even cringe at our past résumés sporting bars or star ratings for skills – a rite of passage in learning what not to do.) The meme’s advice to “abandon any desire to create a skill bar” is the veteran in us telling our younger selves: focus on real achievements and projects, not arbitrary scorekeeping.

Finally, consider the front-end angle: building a progress bar is something you do in a beginner’s web tutorial. It’s literally one of those first fun things when learning CSS – you make a div, style its width and background color, and voila, you have a bar graph. The presence of the green “Try it Yourself” button in the image is a direct nod to tutorial sites like W3Schools, where newbies copy-paste code to create such bars. The meme hijacks that tutorial format to deliver a truth bomb: Yes, you can create a sexy skill bar with HTML/CSS in minutes, but no, you shouldn’t use it to quantify your knowledge. In other words, just because you can visually represent something doesn’t mean the representation is meaningful. This wink to FrontendHumor underscores that front-end developers (who know how trivial making a bar is) particularly enjoy the joke – it’s almost industry_satire of all those slick-looking but content-empty developer portfolios out there.

By highlighting the skill_bar shenanigans in a mock tutorial, the meme resonates on multiple levels. It’s teaching an implicit lesson through humor: If you’re tempted to put a “progress bar” on how well you know JavaScript or PHP, reconsider. Ask yourself: what is this really saying? Because to those in the know, it might be saying “I focus on style over substance”. Better to drop the pretend metrics and show real substance – or as the meme succinctly puts it, “Stop immediately.” The senior dev community is essentially laughing and nodding in agreement: we’ve solved countless RelatableDeveloperExperience bugs, refactored nasty legacy code, learned new frameworks – none of which can be condensed into a neat percentage. And that is the Progress Bar Paradox: the attempt to precisely quantify something that by nature is a continuous, unbounded learning journey.