ohskylab + css   706

Modularity and Style Guides – David Bushell – Web Design & Front-end Development
"Style guides (or pattern libraries) are the perfect place to start a website build and a modular base. They bridge the gap between design and development. They’re somewhat similar to a traditional brand guidelines but contain less fluff & nonsense and 100% practical code examples."
web  css  styleguides  modularity  smacss  oocss  from instapaper
27 days ago by ohskylab
Stubbornella » Blog Archive » Cross-Browser Debugging CSS
"CSS has an underlying design and when you work with it, with the natural flow of how CSS is meant to be used, you will find you have a lot less bugs."
web  css  bugs  testing  debugging  from instapaper
28 days ago by ohskylab
The single responsibility principle applied to CSS — CSS Wizardry—CSS, Web Standards, Typography, and Grids by Harry Roberts
"Loosely, the single responsibility principle states that every module or chunk of code (a function etc) should do one job well and one job only. The benefits of this are mainly in the way of maintainability and extensibility. If we don’t adhere to the SRP then we are likely to end up with code which does more than it should, this means that altering one part of that code could negatively impact a seemingly unrelated part of the same snippet."
web  css  modularity  srp  from instapaper
4 weeks ago by ohskylab
5 years later: print CSS still sucks / Stoyan's phpied.com
"Ditch media="print" if you have one! (Hey why isn't this a yslow/pagespeed rule?). Ditch it because in the best case scenario it will only block onload. In the worst case it will block initial paint, onload and DOMContentLoaded. Sitting in front of a white page with no feedback is the worst possible user experience."
web  css  print  hpw  performance  from instapaper
5 weeks ago by ohskylab
Google HTML/CSS Style Guide
Not revolutionary but solid. Some moderately contentious parts.
web  css  html  google  style  styleguide 
5 weeks ago by ohskylab
Web Standards Trifle | And all that Malarkey
Hadn't seen this 2005-era post before.

Web standards: trifle.
Not web standards: fruit cake.

I'm not the only one who's fond of a good cake analogy.
web  css  standards  trifle  cake 
8 weeks ago by ohskylab
Gimme Bar
A collection of styleguides.
web  css  design  styleguide 
10 weeks ago by ohskylab
One-com/assetgraph
Potentially useful. "An AssetGraph object is a collection of assets (nodes) and the relations (edges) between them. It's a basic data model that allows you to populate, query, and manipulate the graph at a high level of abstraction. For instance, if you change the url of an asset, all relations pointing at it are automatically updated."
web  css  http  js  performance  hpw 
10 weeks ago by ohskylab
About normalize.css – Nicolas Gallagher
Ever wondered why HTML5 Boilerplate is based on normalize.css instead of reset.css? Read about the differences: http://t.co/TJEGDUMl
web  reset  normalize  css  from instapaper
february 2012 by ohskylab
LiveReload
"Monitors changes in the file system. As soon as you save a file, it is preprocessed as needed, and the browser is refreshed."
web  css  development  mac 
january 2012 by ohskylab
jorgebastida/glue - GitHub
"A simple command line tool to generate CSS sprites".
web  css  sprites 
january 2012 by ohskylab
Perfection kills » Profiling CSS for fun and profit. Optimization notes.
.@kangax did some amazingly thorough research on CSS performance, using @operadfl’s new CSS profiler: http://t.co/ctXLRb1z /via @chriscoyier
web  css  hpw  from instapaper
january 2012 by ohskylab
CSS media queries in JavaScript, Part 1 | NCZOnline
Great overview on detecting CSS media queries (changes) via JavaScript http://t.co/QsomEmdv #css3 #html5 #javascript
web  css  js  mediaqueries  responsive  from instapaper
january 2012 by ohskylab
Uniform - Sexy forms with jQuery
"Have you ever wished you could style checkboxes, drop down menus, radio buttons, and file upload inputs?" Not really, no.
web  css  forms  javascript  jquery 
december 2011 by ohskylab
Niceforms :: Personal projects :: Emblematiq
"Niceforms is a script that will replace the most commonly used form elements with custom designed ones." Oh dear.
web  css  forms  javascript  jquery 
december 2011 by ohskylab
Styleguide — Paul Robert Lloyd
A well-structured styleguide. Need more of these.
web  css  design  styleguide  via:infovore 
december 2011 by ohskylab
Styling buttons in iOS WebKit and -webkit-appearance:none | 456 Berea Street
"It turned out that the buttons that looked the same in iOS Safari as in the desktop browsers all had a background gradient. For some reason, applying a background gradient makes iOS for Safari drop its native styling of buttons and apply all of the CSS properties you have specified instead of just a few of them."
web  css  ios  safari  buttons  from instapaper
november 2011 by ohskylab
CSS3 PIE: CSS3 decorations for IE
"PIE makes Internet Explorer 6-9 capable of rendering several of the most useful CSS3 decoration features."
css  css3  ie  ie6  javascript  web 
november 2011 by ohskylab
320 and up
"The ‘tiny screen first’ boilerplate extension."
html5bp  web  mobile  css  css3  responsive 
november 2011 by ohskylab
Font-Embedding Icons
Not entirely convinced. See related HN discussion.
css  typography  web  fonts  icons  from instapaper
october 2011 by ohskylab
responsivepx - find that tricky breakpoint
"Enter the url to your site - local or online: both work - and use the controls to adjust the width and height of your viewport to find exact breakpoint widths in pixels. Then use that information in your media queries to create a responsive design."
css  web  design  responsive  tools 
september 2011 by ohskylab
cjohansen/juicer - GitHub
"A command line tool for JavaScript and CSS developers"
css  javascript  web  tools  shell 
september 2011 by ohskylab
CSS3 Transitions Without Using :hover
With :active, :focus, :checked, :disabled and media queries.
css  css3  web  transitions  from instapaper
august 2011 by ohskylab
scottjehl/Respond - GitHub
The light one. "A fast & lightweight polyfill for min/max-width CSS3 Media Queries (for IE 6-8, and more)".
css  css3  web  mediaqueries  javascript  responsive  from delicious
august 2011 by ohskylab
lojjic/PIE - GitHub
"A behavior for Internet Explorer allowing it to recognize and render various CSS3 box decoration properties".
web  ie  css3  css  hacks  from delicious
july 2011 by ohskylab
CSS Pivot
"Add CSS styles to any website, and share the result with a short link"
web  tools  design  css  development  from delicious
may 2011 by ohskylab
Layer Styles
"Just like your favorite graphics editor but in your browser. And it creates CSS."
web  tools  design  css  javascript  from delicious
may 2011 by ohskylab
Front End Development Guidelines
paul_irish: Very finely compiled Frontend Dev Guidelines from @taitems : http://goo.gl/QYuuW
web  design  development  guidelines  css  javascript  from instapaper
may 2011 by ohskylab
« earlier      

related tags

1k  3d  24ways  37signals  @font-face  @media  accessibility  adblock  adobe  ads  advertising  advice  agencies  agile  ajax  alistapart  android  andyclarke  animation  ant  api  apple  applications  apps  architecture  aria  art  article  atmedia  attributes  audio  awards  background  bar  beautifier  bem  bloat  blueprint  book  bookmarklet  border-radius  borders  boxes  browser  browsers  bug  bugs  bulletproofing  bush  business  button  buttons  cache  cake  calculator  calendar  cameronmoll  campaignmonitor  campaigns  canvas  carousel  cascade  center  charts  cheatsheet  checkbox  christianheilmann  chrome  clean  clearfix  clearing  clearleft  clock  cms  code  collaboration  colour  columns  company  compass  compatibility  compression  context  contrast  conversion  cool  corners  creativecommons  css  css3  css4  dancederholm  data  data:  datauri  debugging  defaults  design  desktop  detection  development  diagrams  digitalweb  django  dock  docking  documentation  dom  drag  drop  editing  editor  effects  efficiency  elastic  electronica  em  email  enhancement  environment  equidistant  ericmeyer  explorer  extension  extensions  faux  fieldset  file  files  finder  fir  firebug  firefox  fisheye  flash  flexbox  flicker  flickr  float  floats  flowers  fluid  fold  font-face  fonts  foobarbazdummy  footer  footers  form  forms  fouc  fractionally  frames  framework  frameworks  free  friends  frontend  fun  gadgets  gallery  generator  github  google  googledocs  gradient  gradients  graphic  graphics  green  grids  guardian  gui  guide  guidelines  gzip  hack  hacks  haml  headings  hiddentext  history  hover  howto  hpw  html  html5  html5bp  http  humour  ia  icons  ide  ie  ie6  ie7  ie8  illustrator  image  imagemap  imagereplacement  images  index  inspiration  interaction  interface  internet  ios  ipad  iphone  java  javascript  jaws  jeremykeith  jquery  js  labels  lang  language  layout  layouts  learning  leaverou  legend  less  library  lightbox  lineheight  link  links  lint  liquid  list  lists  logo  mac  macro  mail  management  manager  maps  margin  margins  marketing  markup  mashup  maxwidth  maze  mediaqueries  memory  menus  mhtml  microformats  microsoft  min-height  minification  minifier  mobile  modernizr  modular  modularity  mozilla  music  myspace  myths  navigation  negative  newsletter  non-intrusive  normalize  ol  onload  oocss  opacity  opensource  opera  optimization  organization  osx  outlook  overflow  parallax  patterns  pda  percentages  performance  phark  phone  photo  photography  photoshop  php  pie  plugin  plugins  png  pop  popups  positioning  ppk  preload  preprocessors  presentations  print  process  productivity  programming  progressive  progressiveenhancement  progressiveenrichment  prototype  python  qa  quotes  radio  rant  readability  redesign  refactoring  reference  regex  replacement  reset  resources  responsive  rest  restoring  rgba  richardrutter  rollover  rounded  rows  rss  rubyonrails  s5  s60  safari  sass  screen  screenreaders  screenshots  scripting  scripts  search  sections  security  select  selectors  semantics  seo  server  service  shadows  shapes  shell  shopping  shorthand  showing  shrinktofit  sidenotes  sifr  silverback  sitemaps  sitepoint  size  sizing  skip  sl1200  slider  slides  slideshare  slideshow  smacss  snippets  social  software  sourceorder  spam  specificity  speech  sprites  squarefree  srp  stamps  standards  statistics  step  style  styleguide  styleguides  submit  support  svg  swf  tables  tabs  tagcloud  tags  tantek  teaching  technics  technique  template  templates  templating  terminology  testing  text  text-shadow  textarea  textmate  themes  thickbox  time  timezones  tips  toolbar  tools  tooltips  topstyle  training  transitions  transparency  travel  trifle  tshirts  turntables  tutorial  tutorials  twitter  typekit  typography  ui  uk  ul  unicode  unobtrusive  uri  usability  utilities  ux  validation  variables  vertical  via:alastc  via:blech  via:daneastwell  via:demwunz  via:gilest  via:ihart  via:infovore  via:momorgan  via:monospaced  via:nickandjess  via:paul.irish  via:scrubadub  via:smitchio  via:thegingerbloke  via:twoplusfour  video  visited  visualization  w3c  wai  web  webkit  weblogs  webmail  whitespace  widgets  windows  woff  wordpress  workflow  xforms  xhtml  xml  xp  yahoo  yepnope  yui  zebra  zoom 

Copy this bookmark:



description:


tags: