DEV Community

Cover image for “href” vs. “src” in HTML

“href” vs. “src” in HTML

Sung M. Kim on July 18, 2019

Last night, I vented out my frustration on <link> requiring href to point to a CSS stylesheet instead of src. I will share the help I receiv...
Collapse
 
karataev profile image
Eugene Karataev • Edited

css

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 • Edited

I wish.

I wish html import was still a thing as well.

Collapse
 
somedood profile image
Basti Ortiz

Why is this not a thing yet??? 🤦‍♂️🤦‍♂️🤦‍♂️

Collapse
 
vuild profile image
Vuild

There are a lot of other head elements that follow <link rel= like pingback & profile etc.

I prefer not to have "style src" as well.

Thread Thread
 
somedood profile image
Basti Ortiz

Yeah, I suppose you're correct there. It does seem to be consistent with the convention of <head> elements. I guess it's not entirely as inconsistent as I first thought it was.

Thread Thread
 
vuild profile image
Vuild

Yeah, it seems elegant at first glance but would be more error prone.

I'd suggest removing type='text/css' but I know there will be a specific reason to keep it.

Thread Thread
 
somedood profile image
Basti Ortiz

I'd say it's probably there for the sake of completeness.

Thread Thread
 
vuild profile image
Vuild

I guess originally it was a declaration for the early browsers as you could probably deliver other things. We should send @dance2die to figure it out.. 🤣

Thread Thread
 
dance2die profile image
Sung M. Kim

I am actually for the new <style src>
and thus I will let you two further pursue that topic 😉

Thread Thread
 
vuild profile image
Vuild

Why? (serious-ish).

Also, find me a similar question on TCP/IP.

Thread Thread
 
dance2die profile image
Sung M. Kim • Edited

I am for <style src> because HTML should be easy for devs to specify what we want to display (not focus on the browser only).

As @somedood mentioned, it's not intuitive (initially at least).
It take us off from our train of thoughts (lowering productivity).

I'd suggest removing type='text/css' but I know there will be a specific reason to keep it.

Markup should be simple enough that we don't have to worry about a possible "specific reason to keep it" but let us focus on getting things done.

I find <style src> more readable as you don't have to glance over verbose info such as text/css or rel=stylesheet (refer to img.src vs Tim Berners-Lee's anchor version).

That's why I am for <style src> as it makes it easy to remember more readable - thus make us focus on telling the browser what we want to show

Thread Thread
 
vuild profile image
Vuild • Edited

That means learning two things at the beginning. How <style src works & how <link ref works.

Seems more complex. There is no need for more than one or two stylesheets so a whole tag seems like overkill.

Look at my head, it has loads of link ref already, CSS just fits right in as another line. Seems a reasonable way to handle it. You could strip "text/css" or "rel=stylesheet" as far as I am concerned (depending on what the alternate values are here).

Also, I don't want to have to start supporting more legacy like that for no improvement to the user. It has worked very well (robust) for decades.

Easy to remember for devs? Low priority. A lot of devs seem to want everything easy, but that doesn't make you better. Easier dev does not generally result in better product. Almost all focus should be on users & anything that benefits them (including where you spend your time) regardless of dev (new things are hard so dev should be hard).

Thread Thread
 
dance2die profile image
Sung M. Kim

When someone is sick, treating the cause of the problem (as opposed to treating the symptom) a better way.

I consider the good DX (developer experience) as treating the cause, while keeping the same old way (by enabling stripping text/css or rel=stylesheet) as treating the symptom.

It has worked well for decades but we can make it better.
Web development has been around for decades and I believe it will so, we can make small improvements and in decades time, the DX will be better.
It's not just about the easy-to-remember part but also about readability.

Overtime, we probably might not even hand-code low-level HTML so it could be a moot point. We might as well focus on more important issues.

Improving DX would probably never provide any benefits to users directly (as refactoring your code doesn't) but it'd help improve our productivity, which gives us more time to focus on how we can benefit users.

Thread Thread
 
vuild profile image
Vuild • Edited

Nobody is sick. CSS linking works more reliably than anything else.

The code is correct to match the other head elements (paste & go). Adding complexity doesn't help. It's not easier to read or learn really (learn one principle or two).

Next there will be 20 <style something we have to deal with. Meanwhile, everyone is still just making a html page with a couple of images & an input field.

There are many more important issues.

Thread Thread
 
dance2die profile image
Sung M. Kim

Great point. <style src> isn't probably a good issue as it could add complexity as you mentioned.

Thank you for providing interesting discussion topic because I really haven't thought about what we discussed much until today.

Thread Thread
 
vuild profile image
Vuild • Edited

You can use tech to save thousands of lives easily, you can change lives substantially, you can make an immediate difference (not to show off, I have done all of these, thanks to tech).

Either you get hung up on the tiny things or you imagine tomorrow & make something for that, it doesn't have to be perfect. No utopian fallacy. Once you have saved 50 lives with your own code & saw it happen you realize it is important to 'get the job done well'. Your working with value code is the best version.

You don't have to be old or young or rich or poor, you can go out & do it immediately.

Collapse
 
dance2die profile image
Sung M. Kim

Spot on, Eugene 😀

Collapse
 
vuild profile image
Vuild

Yw. You should probably try Brendan's browser Brave:
brave.com
creators.brave.com & verify your site, get paid in BAT crypto.
batgrowth.com growing nicely.

& Håkon's (imagine being called Hak while you hack CSS together) Opera
opera.com

👍

Collapse
 
dance2die profile image
Sung M. Kim

Wow. Brave is another product/project spearheaded by Brendan.
I wasn't aware until you brought it up.

Thanks~

Collapse
 
vuild profile image
Vuild
  • Creator of JS
  • Mozilla/Firefox
  • Brave/BAT

Insane.

And willing to come along to give good advice to help people, small ego. One of the few people I have to read multiple times, do research to understand.

If I ask him for advice I try to always promote Brave too as it is good browser & seems like a nice way to pay back a little. I figure if we are promoting Brave, he can be giving out advice. Seems wise use of time to me.

Thread Thread
 
dance2die profile image
Sung M. Kim

Agreed on points described.

So just installed Brave & turned on the Reward settings :)

Thread Thread
 
vuild profile image
Vuild

Nice, they give rewards for browsing, others can pay your site for reading & you can tip. 👍

Checkout brave.com/about/ most are on twitter or somewhere.

Thread Thread
 
dance2die profile image
Sung M. Kim

Thanks for the follow-up info 👊

Thread Thread
 
jmcp profile image
James McPherson

This Brave browser looks very interesting, going to kick the tires and see how it goes. Thankyou @vuild for the pointer

Thread Thread
 
vuild profile image
Vuild

You are welcome James.

There are a bunch more here, but people are very happy with Brave rn.

vuild.com/web-browsers

Thread Thread
 
nickytonline profile image
Nick Taylor • Edited

I've been using brave on mobile for a couple of years. It's great. Earlier this year,once they switched the Desktop version from Electron to Chromium, I made it my main browser for web dev. It's supports everything that Chrome does with some nice extras. 🔥

Brave browser screenshot

Thread Thread
 
vuild profile image
Vuild

...with 2 extra hours you can waste. 👍

Collapse
 
chantastic profile image
chantastic

nice right write up!
I've always wondered this and never had the audacity to ask.
thanks for taking the time and care to chase it down!

Collapse
 
dance2die profile image
Sung M. Kim

Thank you for the kind words, Michael 😃

And I also gotta thank @vuild for starting up the "chase" 😉

Collapse
 
vuild profile image
Vuild

I appreciate the sentiment but there is no need, really.

The history should be recorded, studied & revisited by tech people.

Collapse
 
ben profile image
Ben Halpern

I just learned so much

Collapse
 
calebpitan profile image
Caleb Adepitan

Me too! I mean who hasn't "learned so much"

Collapse
 
dance2die profile image
Sung M. Kim

Thanks for the "so much" instead of "too much" 😉

Collapse
 
phillipseamore profile image
phillipseamore

Since linked stylesheets can be conditionally loaded (media queries) I think HREF might just be very approiate.

Collapse
 
dance2die profile image
Sung M. Kim

That's an interesting approach.
I can use that thought pattern to remember the syntax 😀

Collapse
 
kleene1 profile image
kleene1

Cool lol

Collapse
 
prelias profile image
Paulo Roberto Elias

Very nice article. Thanks and congratulations

Collapse
 
fly profile image
joon

Fantastic read

Collapse
 
dance2die profile image
Sung M. Kim

Thanks again Joon :)