[Define New Theme] 12. In-Depth Design study on each block of content semantics + modularity

[Sumanai]

An icon is a piece of content that can be used in several ways and place throughout the html.

I do not agree. I think that icons apply to design.

you missed the point by declaring an icon element you are not restricting your self to an icon font having to be one way and a sprite based concept another. They both can utilize the same object.

I used the icon font for example. No problem instead use sprites to be even easier to replace them the text when it's needed. Can do for you an example, if you wish.

OOD

Please explain.

their is no such thing as a fictional situation when it comes to OOD its meant to be self contained and infinitely configurable. This actually comes in handy when working with complex icon concept like that of the forum imagesets

I do not see any need for more than two icons of a single button. If you need more, you can change the layout. You also have to change the layout from the outset.
I do not see the benefits.

We clearly not overpersuaded each other. I would like to hear the opinion of others in this regard.

[callumacrae]

all icons should be in one sprite. so count the number of icons and the fact that they are different sizes and used in different ways in prosilver. you will end up with a very complicated extremely large file full of a lot of white space. With mine all the icons fit on a single row with no spacing in between.

To be honest, I doubt this will make it into phpBB before HTTP 2.0 is supported in major browsers, and so using sprites would be an anti-pattern.

[hanakin]

@callumacrae
mehe we will see. either way font-awesome will require it in 3.2.

@Sumani
OOD = Object Oriented Design

and icons are used in more places than just buttons, IE logos, headers, imagesets, etc... <-- this is why its its own object as it has several uses and as such is its own element

also give this a read
http://css-tricks.com/html-for-icon-font-usage/

and ask questions on the community side of the font-icon projects submit an issue with font-awsome to change it to your method and see what you get back!

[Sumanai]

and icons are used in more places than just buttons, IE logos, headers, imagesets, etc... <-- this is why its its own object as it has several uses and as such is its own element

also give this a read
http://css-tricks.com/html-for-icon-font-usage/

and ask questions on the community side of the font-icon projects submit an issue with font-awsome to change it to your method and see what you get back!

The language barrier does not allow me to understand this message, sorry.
Method using data-icon and content: attr (data-icon) liked me, thank you. Did not know that you can do so. Although not see any sense.

[hanakin]

its referring to the fact that when dealing with screen readers we need to provide the icon with its own markup as speak is not fully supported by all of them. and aria-hidden would apply to everything within the a tag if you do not have the <i> to apply it too in-order to prevent them from attempting to say the icon.

[Sumanai]

I doubt that the reader will read the icon of style. However, I'm not sure.

[DavidIQ]

I doubt that the reader will read the icon of style. However, I'm not sure.

It will not. This is why he is suggesting that the icon be a separate element instead of a stylesheet rendered icon.

[hanakin]

The goal is for it to not be spoken as it obviously will be speaking a random character.

It will be spoken in some, but not others even when you have speak:no applied to the :before. You can test this in voiceover on a Mac. The goal is for the icon to not be spoken so in order to prevent this we need to also add aria-hidden. However we can not just apply it to the container as it stops everything in the containing element from being spoken. so we need the icon element in order to provide more control over the icon and the text separately.

weather we choose to apply the icon via css or via data-atribute is another discussion.

[Sumanai]

It will be spoken in some, but not others even when you have speak:no applied to the :before. You can test this in voiceover on a Mac.

Sounds reasonable. Admit your arguments.
I wonder how to relate to this specification and standards. But it does not matter if a screen reader violate them.
But I'm still against the additional element <span> around the text.

weather we choose to apply the icon via css or via data-atribute is another discussion.

Number of the next theme will be 12.1?

[hanakin]

the span is required to be fully extensible as you can not hide the text without affecting the <i> without giving the text its own span element