#semantic html

In lecture 2, 3 and 4 we looked at HTML. I attended all of the lectures and since then I have re-read the lecture notes, I’ve looked through the material available on Moodle and then I have done my own research online as well in relation to HTML, HTML5 and Semantic HTML. 

Initially, I had just thought the HTML was used mainly for formatting and structure, but the more I read about Semantic HTML the more that I see that it is much more than that. This article is really helpful in explaining why Semantic HTML is important and why it should be used when building a website. 

From reading this article I understand that Semantic HTML defines specific tags to indicate as clearly as possible what is contained within different areas of content within a website. This Semantic Code helps search engines to determine what information is important, what is less important, and what is for navigation and so on. 

I now understand that Div and Span tags are non-semantic or generic unless given a class attribute. While Header, Footer, Nav and Article, among others are semantic elements.  

I also found it interesting to read about how screen readers have the ability to make Semantic HTML audible from the visual code. 

This article also mentions indexing and algorithmic indexing and how search engines like Google and Bing index websites. Helping search engines to index your website properly will help with your website’s SEO according to Jason. 

A link to the article: 

https://www.semrush.com/blog/semantic-html5-guide/ 

The link to Semcrush’s website: 

https://www.semrush.com/blog/

Well I guess since I'm back now I'll chime in on how I feel about the beta editor.

It kinda sucks

With the legacy markdown editor it's possible to mainly use markdown and then use HTML as a fallback. This is a very smooth experience. Those viewing on the blog page may have noticed that HTML up there sports an abbr tag letting you know what HTML means. This isn't something you can do with pure markdown and also appears to be the kind of thing you can't even do with HTML in the new editor as the supported HTML has been restricted to a very narrow subset of the available tags.

And I understand restricting tags. Having like <script> or <canvas> available in the dashboard would be a nightmare, and even subtle things like form elements or allowing tags to hijack the taborder attribute could cause problems. But like can I please have semantic elements like <cite> or <time> or <figure>? I still think about this as a blogging platform first and a social media platform second.

I realize there's technical requirements that I have no idea about that seem to be hinted at with the "content block" limits. And that really limits my ability to say any of this is constructive.

Feature Requests in a nutshell

Let me use markdown and html in the same editor.

Have a semi-wysiwyg editor for markdown+html like you get in Obsidian

Let me use some of the semantic tags, even if they get stripped out for the dashboard.

PS

I don't super resent the neue post format. Like what the fuck is a "quote post" or "conversation post" lol why is that different than a text post? Shame old themes will need to be patched though.

Brennan Carman '20 Demonstrates Web Accessibility For Visually Impaired by Brennan Carman

This video is really helpful in explaining why using Semantic HTML is really important for web accessibility, screen reading and in assisting people that are visually impaired. 

The link to the YouTube Video outside of my blog:

https://www.youtube.com/watch?v=JPCkZTwUFMw 

In lecture 2, 3 and 4 we looked at HTML. I attended all of the lectures and since then I have re-read the lecture notes, I’ve looked through the material available on Moodle and then I have done my own research online as well in relation to HTML, HTML5 and Semantic HTML. 

The Differences Between HTML and HTML5 by Domantas G.

This article explains the differences between HTML and HTML5 and how HTML5 uses semantic code. 

The article also explains some of the history and milestones of HTML from its inception to its current form in the present day. 

There are a bunch of very informative illustrations used within the article and also some HTML cheatsheets provided too. 

A link to this article: 

https://www.hostinger.com/tutorials/difference-between-html-and-html5 

The link to the main website: 

https://www.hostinger.com/tutorials/

A Cheatsheet: 

HTML is often treated as “just tags,” but good web pages start with strong structure. This HTML training in Noida focuses on helping learners understand how web pages are actually built—from writing clean, readable markup to using semantic elements correctly. Instead of jumping straight into styling, the emphasis stays on organizing content in a way that browsers, developers, and search engines can all understand.

[et_pb_section fb_built=”1″ _builder_version=”4.27.4″ _module_preset=”default” global_colors_info=”{}”][et_pb_row _builder_version=”4.27.4″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.27.4″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.27.4″ _module_preset=”default” global_colors_info=”{}”]  Effective website…

Semantic HTML: What It Is and Why It Matters!

🚨 NEW VIDEO ALERT! 🚨

In today's video, we'll introduce an important concept in web development known as semantics. Semantic HTML helps provide proper meaning to your markup, while also making your website more accessible, improving your SEO, and keeping your code clean and organized. Enjoy! 🎉

#coding #html #semantichtml #webdevelopment #cleancode