Alternative to the HTML Bold tag

Question

Okay  so I know that in HTML you can use the  lt b gt  tag  but isn t there a  weight bold  attribute that I can use in the  lt p gt  tag     Or is that in CSS  or Javascript

User · Answer

lt b gt  is a last resort  You can use  lt b gt   but only as a last resort   There are a variety of elements that work as good alternatives to  lt b gt   here they are in order of most usefulness   More useful alternatives   For important text   lt strong gt  For stress emphasized text   lt em gt  For headings  not just page headings but paragraph headings and others of all kinds   lt h1 gt  through  lt h6 gt    The practical edge case for use of  lt b gt   The only case where I would advocate using  lt b gt  is if    you have styled  lt strong gt  in a different way that you don t want displaying for the text that you have in mind   you don t want italic emphasis or a heading  and  you are about to use an inline span or a span with a class just for bolding text    For example   lt span class  bold  gt       Then it s reasonable to use  lt b gt  instead  because in that case it ll probably be cleaner shorter and more semantic than an unsemantic span  and terceness readability is a good reason for making that choice  since b has been redefined for use as an element denoting printed emphasis

User · Answer

Its in CSS you have to set font-weight  bold  as style

User · Answer

What you use instead of the b element depends on the semantics of that element s content    The elements b and strong have co-existed for a long time by now  In HTML 4 01  which has been superseded by HTML5  strong was meant to be used for  strong emphasis   i e  stronger emphasis than the em element  which just indicated emphasis   In HTML 5 2  strong  represents strong importance  seriousness  or urgency for its contents   the aspects of  seriousness  and  urgency  are new in the specification compared to HTML 4 01  So if you used b to represent content that was important  serious or urgent  it is recommended that you use strong instead  If you want  you can differentiate between these different semantics by adding meaningful class attributes  e g   lt strong class  urgent  gt     lt  strong gt  and  lt strong class  warning  gt     lt  strong gt  and use appropriate CSS selectors to style these types of  emphasis  different  e g  using different colours and font sizes  e g  in your CSS file  strong warning   color  red  background-color  transparent  border  2px solid red        Another alternative to b is the em element  which in HTML 5 2  represents stress emphasis of its contents   Note that this element is usually rendered in italics  and has therefore often been recommended as a replacement for the i element    I would resist the temptation to follow the advice from some of the other answers to write something like  lt strong class  bold  gt     lt  strong gt   Firstly  the class attribute doesn t mean anything in non-visual contexts  listening to an ePub book  text to speech generally  screen readers  Braille   secondly  people maintaining the code will need to read the actual content to figure out why something was bolded  If you used b for entire paragraphs or headings  as opposed to shorter spans of texts  which is the use case in the previous bullet point   I would replace it with appropriate class attributes or  if applicable  WAI-ARIA roles such as alert for a live region  with important  and usually time-sensitive  information   As mentioned above  you should use  semantic  class attribute values  so that people maintaining the code  including your future self  can figure out why something was bolded  Not all uses of the b may represent something semantic  For example  when you are converting printed documents into HTML  text may be bolded for reasons that have nothing to do with emphasis or importance but as a visual guide  For example  the headwords in dictionaries aren t any more  serious    urgent  than the other content  so you may keep the b element and optionallly add a meaningful class attribute  e g   lt b class  headword  gt  or replace the tag with  lt span class  headword  gt  based on the argument that b has no meaning in non-visual contexts    In your CSS file  instead of using style attributes  as some of the other answers have recommended   you have several options for styling the  bold  or important text    specifying different colours  foreground and or background   specifying different font faces  specifying borders  see example above   using different font weights using the font-weight property  which allows more values than just normal and bold  namely normal   bold   bolder   lighter   100   200   300   400   500   600   700   800   900  etc    Note that support for numeric font-weight values has not always been great

User · Answer

Nowadays people tend to use website builders  CMS like Wordpress  instead of coding their own blog from scratch  Even professional web developers do it because it s faster  It would be nice if you could mention the advantages and things to keep in mind when coding your own blog in real life  for example   More flexibility  customization  Pay a domain name Pay and choose a web hosting Security and maintenance Copyright and license of some website builders  templates and graphics  Your website could be locked to a particular web host if you used your host s website builder  So you cannot move to another web host  because if you do you could no longer use that template  Experience trouble when asking for website builder s tech support when the website goes down  Some templates are not search engine friendly and this affects your website ranking  SEO   Anyways  you can use css css3 or JavaScript for making interactive webpage  Even you can upload your all sort of code into a server formatting the default blog theme

User · Answer

You can use following     lt p id  p1  gt Some Text here  lt  p gt   p1     font-weight  bold      OR   lt Strong gt  lt p gt Some text here  lt  p gt  lt  strong gt    OR  You can use  lt h1 gt  tag which is somewhat similar to bold

User · Answer

x000D   x000D       bold  x000D        font-weight  bold  x000D        x000D       custom  x000D        font-weight  200  x000D        x000D   lt body gt  x000D     lt p id  bold  gt  here is a bold text using css  lt  p gt  x000D     lt p id  custom  gt  here is a custom bold text using css  lt  p gt  x000D   lt  body gt  x000D   x000D   x000D    I hope it s worked

User · Answer

The  lt b gt  tag is alive and well   lt b gt  is not deprecated  but its use has been clarified and limited   lt b gt  has no semantic meaning  nor does it convey vocal emphasis such as might be spoken by a screen reader   lt b gt  does  however  convey printed empasis  as does the  lt i gt  tag  Both have a specific place in typograpghy  but not in spoken communication  mes fr  res   To quote from http   www whatwg org    The b element represents a span of text to be stylistically offset from the normal prose without conveying any extra importance  such as key words in a document abstract  product names in a review  or other spans of text whose typical typographic presentation is boldened

User · Answer

If the text s meaning is semantically strong  use the strong element  If not  use a semantic named class  one that clearly shows the meaning of the element  don t mix presentation and data by calling it bold etc  and reference it in your CSS    HTML   lt span class  important-message  gt I m important  lt  span gt    CSS   important-message      font-weight  bold      Some people still use the b element as a presentational hook  but it hasn t been deprecated  though most people favour the strong element nowadays  Just make sure they are used correctly

User · Answer

A very old thread  I know  - but for completeness   I use  lt span class  bold  gt my text lt  span gt   nbsp  nbsp  nbsp    as I upload the four font styles  normal  bold  italic and bold italic into my web-site via css   I feel the resulting output is better than simply modifying a font and is closer to the designers intention of how the boldened font should look     The same applies for italic and bolditalic of course  which gives me additional flexibility

User · Answer

The answer by  Darryl Hein is correct despite one point -  lt b gt  is not recommended at all since XHTML  because it s not semantic    lt strong gt  means semantically highlighted text  font-weight  bold means visually highlighted text   lt strong gt  can be css-tuned to not be bold  though it s a conventional default  It can be made red  or italic  or underlined  though all these possibilities are not really user-friendly   Use it for phrases   words in text  not because of visual design  but related to their meaning  font-weight  bold should be used for design-related bold parts  like headers  sub-headers  table header cells etc

User · Answer

You can make text or words Bold with using  lt b gt Text lt  b gt  tag   You can also use  lt strong gt Text lt  strong gt  tag  Head tags  lt h1 gt    lt h2 gt    lt h3 gt       are default bolded tags and make your text Bold by default unless you change their style with CSS  Above tags was available in HTML but if you like to change the style with CSS you can use  font-weight bold

User · Answer

Maybe you want to use CSS classes   p bold   font-weight bold      That way you can still use  lt p gt  as normal    lt p gt This is normal text lt  p gt   lt p class  bold  gt This is bold text lt  p gt    Gives you   This is normal text   This is Bold Text

User · Answer

It s all historical and dates from a time where dinosaurs walked the earth and CSS didn t exist   More seriously  forget about the  lt b  gt  tag and use font-weight bold in a CSS rule

User · Answer

Also consider the  lt strong gt  tag  It s much better for screen readers and therefore better for accessibility  Search engines also use  lt strong gt  tags to determine important content similar to how they use header tags  lt h1 gt    lt h2 gt   etc  although  lt b gt  will also have similar meaning to search engines   If you want to stress importance of text  use  lt strong gt   If you don t want to stress importance  use the  lt b gt  tag or use the font-weight bold  style on the element or in the CSS   Although  if you are bolding the entire paragraph  it s probably better to use the CSS option  This will reduce the affect on screen readers and it probably doesn t make sense to have an entire paragraph emphasized  But on the other hand  I ve seen bold used to emphasize an entire paragraph before for good reason  In which case  font-weight bold  is what you want to use  likely in a class style   In the end   lt strong gt    lt b gt  or font-weight bold  will all work and accomplish something similar visually  probably exactly the same   but they have slightly different meanings  Also  make sure that if what you re bolding is a header  use the header tags   lt h1 gt    lt h2 gt   etc

User · Answer

You can use the font-weight attribute on your   For example    lt p gt This is my paragraph lt  p gt    You can either have your CSS inline as below    lt p style  font-weight bold   gt This is my paragraph lt  p gt    Or have it in your external CSS stylesheet as below   p    font-weight bold

User · Answer

You can code like below     lt html gt    lt head gt    lt style gt   p boldstats   font-weight  bold        lt  style gt    lt  head gt      lt body gt     lt p class  boldstats  gt  The bold finder  lt  p gt     lt  body gt   lt  html gt

User · Answer

Use the  lt strong gt  tag because it s more semantic   lt b gt  has been depreciated so it s best not to use it  Also bold text is given more Search Engine Optimisation  SEO  weight so it s always best to use a real  lt strong gt  rather than making a  lt p gt  or  lt span gt  bold using CSS

User · Answer

you could also do  lt p style  font-weight bold   gt  bold text here  lt  p gt

User · Answer

You re thinking of the CSS property font-weight   p   font-weight  bold

User · Answer

lt p style  font-weight bold   gt  lt  p gt

User · Answer

On a sidenote the below code will also make it bold    lt strong gt  text here  lt  strong gt

[html] Alternative to the HTML Bold tag

`<b>` is a last resort

More useful alternatives

The practical edge case for use of `<b>`

Examples related to html

Examples related to css