recentpopularlog in

piperh : attribute   30

AddyOsmani.com - Native image lazy-loading for the web!
look at the new loading attribute which brings native <img> and <iframe> lazy-loading to the web.
Is it css or an image attribute?
webdesign  web  design  image  img  lazy  load  lazy-load  lazyload  css  loading  attribute 
april 2019 by piperh
See No Evil: Hidden Content and Accessibility - Cloud Four
article about hiding content in different contexts, with accessibility and screen readers in mind
webdesign  web  design  hidden  content  aria  accessibility  accessible  attribute  hiding 
march 2019 by piperh
When Is A Button Not A Button? — Smashing Magazine
nice reminder of how to use html's own semantics - good for accessibility and keyboard tabbing. Brush up on <button type="button"> ("submit" is default value for a button, he says). He suggests using "disabled" attribute for button or fieldset but I don't see how one would trigger it. 'disabled' attribute also removes element from tab order
webdesign  web  design  button  html  semantic  attribute  vale  accessibility  accessible  element 
march 2019 by piperh
Use the :lang pseudo-class over the lang attribute selector for language-specific styles
about using lang pseudo class and why it's handier than lang attribute (for styling), although it seems to me that the lang attribute must still be present in the html
webdesign  web  design  language  lang  css  pseudo  class  attribute  html  style 
february 2019 by piperh
The Actual Browser Problems with Unquoted Attributes | CSS-Tricks
about using quote marks to enclose attribute value in html. In html5 it's optional and only required if there's a space (and a few other characters as well). So if an item has two or more classes you must enclose in quotes.
If in doubt, use quote marks always (though you don't have to)
webdesign  web  design  webdev  development  code  coding  html  attribute  quote  quotemark  value  space 
february 2019 by piperh
Splicing HTML’s DNA With CSS Attribute Selectors — Smashing Magazine
useful look at attribute selectors, lots of code examples and howtos
webdesign  web  design  css  selector  attribute  html 
november 2018 by piperh
Valid CSS Content | CSS-Tricks
about stuff you can inject via the css 'content' property
webdesign  web  design  css  content  pseudo  class  valid  invalid  attribute  property  before  after 
october 2018 by piperh
Don’t Use The Placeholder Attribute — Smashing Magazine
intro says: The placeholder attribute contains a surprising amount of issues that prevent it from delivering on what it promises. Let’s clarify why you need to stop using it.
Quite convincing argument. He says put descrip text in between label and input
webdesign  web  design  placeholder  label  tag  html  code  coding  attribute  form  input 
june 2018 by piperh
Swapping Images with the Sizes Attribute | Filament Group, Inc., Boston, MA
brilliant use of css and js with srcset and size to achieve zoom effect or magnifying glass on hover. Requires jQuery
Consider this for barcelonaprints instead of fancybox
webdesign  web  design  js  javascript  script  jquery  enlarge  zoom  lupe  magnifier  magnify  glass  image  srcset  size  attribute  css 
march 2018 by piperh
CSS Selectors: Attribute Selectors
handy article about attribute selectors. There's a use case example that I should be using, for shared values with just a single change on some, where a hyphenated name could be used almost like a variable or a sassish type variable
webdesign  web  design  css  attribute  selector  select 
february 2017 by piperh
help - Perch CMS documentation
In addition to using the help attribute you can also use the perch:help tags to display a help section at the top of your page. You can put any kind of content in between these tags – including html – so you could add a screenshot or even a video.
webdesign  web  design  perch  help  tag  attribute  section  interface  editor  cms  text  html 
december 2016 by piperh
The Skinny on CSS Attribute Selectors | CSS-Tricks
css-tricks guide showing use of attributes to target an element instead of using a class or id.
webdesign  web  design  attribute  css  target  code  coding 
december 2016 by piperh
Declaring language in HTML
explanation of how to use lang="" in html
webdesign  web  design  language  attribute  ref  lang  html  code  syntax  span  declare  declaration 
august 2016 by piperh
Picturefill
polyfill to make picture element work in all browsers
webdesign  web  design  script  js  javascript  html5  html  polyfill  picturefill  picture  element  css  image  load  lazy  lazyloading  responsive  img  srcset  attribute  1x  2x  3x 
july 2016 by piperh
How to Use ARIA Effectively with HTML5
readable and easily understandable piece about adding aria attributes and semantic tags to html. Easy to execute stuff and worthwhile
webdesign  web  design  aria  accessibility  html  accessible  webdev  roles  attribute  semantic  tag  role  presentation 
march 2016 by piperh
We Be Scrolln' | by Stephen Scaff
a jquery scroller for one-page sites using attributes as targets
webdesign  web  design  scroll  scroller  jquery  js  one-page  single-page  website  target  attribute  animate  animated 
july 2015 by piperh
The Skinny on CSS Attribute Selectors | CSS-Tricks
Note on Quotes: You can usually get away without using quotes in attribute selectors, like [type=radio], but the rules for omitting quotes are weird and inconsistent across actual browser implementations. So, best practice, just use quotes, like [type="radio"]. It's safer and always works.
css  html  selector  attribute  code  coding  webdev  webdesign  web  design  href  declaration 
february 2014 by piperh

Copy this bookmark:





to read