HTML elements and inline CSS in text fields [closed] - html

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed last month.
Improve this question
I'm trying to find ways to customize a website where I can only edit the content (text and image) via Contentful’s content management interface (the company that developed the website refuses to integrate the corporate identity and style guide and says it "might" be for future versions).
What do you think about adding HTML elements, inline CSS, or even adding style and loading fonts via style elements directly into the text fields? Given that these elements will obviously be in the middle of the body, is this really bad practice in terms of security and SEO (or other)?
Thank you a lot for your time.

I wouldn't say it's bad for security since it's just style (meaning how the users see the website).
Have you thought about linking the style file? It would maybe be a cleaner solution (don't forget you will have to maintain it later, and having it in a clear way will save you a lot of time reading and wondering what you did, so it's better to be clean) than adding everything inline inside body
As for SEO I believe it's more affected by the use of the elements than having the elements. I mean, if you want some content use instead of a tag that resembles by style to a heading.

Related

Differences between CSS images and SVGs [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 3 years ago.
Improve this question
I was wondering if there are any differences between CSS images and SVGs on your website.
By CSS images I mean images created with divs in HTML and styled in CSS (like this: https://codepen.io/andrewrock/pen/jOEZxrY).
Yes, CSS images are more time consuming, but apart from that they're both animatable, you can use CSS variables on them, make them dynamic with JS, ...
So what are the differences of those 2? (Performance, Rendering, ...)
There are countless reasons why you should use a svg instead of a group of html elements:
Creation
There are hundreds of svg editors that allow in a simple way to realize a drawing or an icon. This is not the case for html. So drawing a building icon in full css would be really painful.
Sharing
The fact that it uses a standardized file such as svg, allows you to export your work to other tools and easily be exploited by someone else. Use tricky css rules to manipulate some span or div can be difficult for a newcomer to your project to understand.
User experience
On a website that use svg, you will able to open it on a new tab or to download it. Thats very comfortable for an user for exemple. If you use html an user will not be able to manipulate and thats can be really annoying
Performance
Because the svg is called most of the time a file you can compressed it on your server to gain more space and performance with some tools like Appendix J

A confusion i have about HTML "classes" [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
Hello and thanks in advance. In HTML I know that a "class" will not really have an effect unless it is related to something in CSS or JS. At the same time, I find some "classes" that do affect the structure of a documents even without an associated CSS, such as "class="col-md-12" for example. Can someone explain why some classes work independent of CSS? And how to know them.
class="col-md-12" still requires CSS. That is a common class for a framework such as BootStrap. On its own without JavaScript or CSS, a class does nothing besides tell another programmer what an element is for.
The idea of classes ("class=''") and identifiers ("id=''") is part of DOM manipulation. You can put in classes and id's in each of the tags as you desire. Normally, the rule is an independent id for each tag, and a class for each GROUP of identical tags.
To make use of classes, you are required to use CSS, be it at the top of the page, or linked to another page. If you have your CSS at the top of the page, you do not need another CSS page, however most designers will frown from that.
See here for a more in-depth explanation: https://css-tricks.com/the-difference-between-id-and-class/

Generic Presentation Block vs Generic Structural Block [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I generally think generally think of div as a generic structural block, and my mental designation for a generic presentational block is different. In practice I use <div class='flair'></div> with a media query to hide most 'flair' on small screens. My use of the flair class seems more suited to its own tag (as opposed to a class), but there's nothing in the HTML element reference that fits this description, and the HTML spec in general seems to be moving away from presentational tags. I'm wondering if other people have considered a tag like this, or if the fact that I'm asking this question at all implies that I think of HTML elements differently than most.
For clarity, I think of a 'generic presentational block' as one that meets most of this criteria:
is not required to understand the content of the page
contains no text, anchors, buttons
is not flow content
So, I have some questions:
Do other people use a specific class to denote generic presentational blocks?
Do you feel like an existence of such a tag would improve the HTML that most developers write? (context: I generally consider div soup to be a negative)
How would you feel about browsers having a builtin feature that disables this tag. This feature would be a superset of tools like adblock and noscript
Regardless of whether the question is relevant or not - I understand what you mean about "div soup," but since your flairs are semantically meaningless I think it's technically fine.
I work with a developer who uses the <i> tag with a role="presentation" attribute added. Honestly, I haven't really looked into the use of <i> but using role="presentation" for accessibility purposes may be something to look into if you haven't already? And can be used to hide presentational flairs on mobile.
https://w3c.github.io/aria-in-html/#presentation

Designing layout in html [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I use CSS to stylize my pages. I use % style instead of using px values. However, since I need to add several elements of different sizes in different positions, I end up spending more time in designing the layout than the coding.
I tried using a WYSIWYG editor but it uses px style coding. Can someone help me with a solution so that I can design the layout quickly and proceed to real part? I use WordPad right now.
The best thing to do is practice more. Get better at coding them, and reuse parts from prior projects where it makes sense.
There is no WYSIWYG tool that will save you time, for most projects. They all write garbage code, because editing with such a tool is a bit ambiguous. It is up to you as a web developer to write your markup and styles in a way that will be interpreted correctly across many user agents.

Are you familiar with <ins> tag in html? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I just found that google uses this tag for adsense,
but seems it also works without this tag,why they prefer to use it?
The <ins> tag is used to indicate content that is inserted into a page and indicates changes to a document. According to the HTML spec this was intended primarily for use in marking up versioning of a document.
Clients that aware of this tag may choose to display content inside this tag differently or not at all depending on what they are designed to do. This is very much semantic HTML
As for why Google decide to use it I couldn't say
INS is semantic tag describing something that is inserted to the text after the text was already published. It is not a big deal, it is I guess used by their robots to understand something they care about.
Adding semantics to markup allows tools to extract more meta data from them. Google is in the business of writing such tools, so has good reason to encourage the use of code that they can use.