recentpopularlog in
« earlier  
SMIL is dead! Long live SMIL! A Guide to Alternatives to SMIL Features | CSS-Tricks
Seems that SMIL is not a good way to go with svg animation. At end there's a chart of equivalent css and gsap attributes and values
webdesign  web  design  webdev  code  coding  svg  smil  css  gsap 
17 hours ago
Snap.svg - Home
they say: SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen. And the Snap.svg JavaScript library makes working with your SVG assets as easy as jQuery makes working with the DOM.
svg  animation  animate  animated  js  javascript  script  vector  webdesign  web  design  webdev 
17 hours ago
Free Dynamic DNS - Managed DNS - Managed Email - Domain Registration - No-IP
their headline:
Dynamic IP address got you down?
Create an easy to remember hostname and never lose your connection again.
dns, ip and email server services
ip  smtp  dns  email  server  address  services  networking  host  domain  hostname  network 
they say: PaperCall enables event organizers to easily manage their call for papers and talk submissions. Speakers are already using PaperCall to manage their talks, are you ready to hear from them?
speaker  event  congress  call  for  papers  organise  organiser  conference  meeting  submission  talk  tool 
2 days ago
WPCOM – Curated Directory of WordPress Resources & Tools
they say: Explore hundreds of WordPress resources, courses, deals.
Build your website with confidence and less pain.
wordpress  resources  cms  directory 
2 days ago
Shape Morph Button
an inline svg shape in a button morphs when clicked, using js for the toggle.
Handy, has the html, css and js code, linked from this article:
webdesign  web  design  code  svg  morph  shape  morphing 
2 days ago
Humaaans: Mix-&-Match illustration library
they say: humaaans
Mix-&-match illustrations of people with a design library
illustration  image  library  design  graphic  vector  editable  people  drawings 
2 days ago
Run your own newsletter engine - Mailcoach
they say: Mailcoach is a self-hosted email list manager. It integrates with services like Amazon SES, Mailgun or Sendgrid to send out mailings affordably.
Stand-alone, or integrated in a Laravel project, it's perfect for bloggers, artisans and entrepreneurs.
htmlmail  mail  mailing  list  self-hosted  manager  engine  newsletter  bulletin 
2 days ago
My Browser - Easy to digest browser details to help you with QA and tech support
generates a basic report about users browser, device, screen etc. Could be handy for helping a remote user
webdev  support  information  browser  tech  screen  device 
3 days ago
Simple Image Placeholders with SVG - Cloud Four
author says: a tiny, dependency-free library called Simple SVG Placeholder. It generates data URIs for placeholder img elements. (uses js)
You get a grey rectangle with image size written in middle.
webdesign  web  design  image  placeholder  generator  svg  js  javascript  script 
3 days ago
PlaceIMG | Easy FPO and Dummy Images for Any Project
generates placeholder images from 7 different categories. I couldn't make remote placement work but you can generate the image and download it
webdesign  web  design  image  placeholder  generator  dummy 
3 days ago
Understanding CSS Grid: Grid Lines — Smashing Magazine
Rachel Andrew article about layout using css grid lines
webdesign  web  design  code  coding  layout  css  grid  line  lines 
3 days ago
Staggered Animations with CSS Custom Properties - Cloud Four
I could ignore the variables part (don't understand it). Handy nth-child method for staggering animations on a list
webdesign  web  design  css  animation  stagger  staggered  delay  slide-in  code  coding 
6 days ago
Why You Should Choose HTML5 <article> Over <section> — Smashing Magazine
1st para: Browsers’ visual display of headings nested inside <section> elements makes it look as if they are assigning a logical hierarchy to those headings. However, this is purely visual and is not communicated to assistive technologies.
webdesign  web  design  code  coding  article  section  css  accessible  accessibility 
6 days ago
Uber’s Path of Destruction - American Affairs Journal
from 1st para: the widespread belief that it is a highly innovative and successful company has no basis in economic reality.
article  uber  about  business  economics 
6 days ago
How To Self-Host Your Web Fonts - Kev Quirk
This post will show you how to self-host web fonts so you’re not beholden to Google.
webdesign  web  design  webdev  fonts  self-host  self  host  @font-face 
6 days ago
Understanding the “Initial”, “Inherit” and “Unset” CSS Keywords
CSS has default keywords for various values. In this article I’m going to talk about three of them: initial, inherit, and the relatively new one, unset.
webdesign  web  design  code  coding  css  inherit  unset  initial 
6 days ago
10 of the coolest neighbourhoods in Europe | Travel | The Guardian
about some barrios of large European cities - maybe some tips if you're in those parts
guardian  travel  europe  area  neighbourhood 
6 days ago
Magic Flip Cards: Solving A Common Sizing Problem — Smashing Magazine
about coding non-absolute flip cards, with code examples. Some advanced css in here but could be v useful for learning/copying. The effect might come in handy sometime.
webdesign  web  design  code  coding  effect  flip  card  revolve  turn  hover  css  html  grid 
8 days ago
Grids - Learn web development | MDN
good explanation of grid using a page that you can develop and experiment in. V handy
webdesign  web  design  learn  css  grid  mozilla  learning  code  coding  webdev 
10 days ago
Coco Dávez
Coco Dávez website, real name Valeria Palmeiro (Madrid, 1989) but known as Coco Dávez, new promise of contemporary Spanish art. hmmm
coco  dávez  davez  creative  photography  art  artist  illustration  faceless 
10 days ago
How can I copy 1,400 DVDs to a new hard drive? | Technology | The Guardian
about copying from lots of CDs or DVDs to a hard drive. Suggestion for soft though it only helps a bit. Seems like manually is the only way.
backup  copy  dvd  cd  hard  drive  hd  external  multiple  guardian 
10 days ago
nifty animation of type on a path, by Michelle Barker
webdesign  web  design  animate  animation  path  loop  offset 
11 days ago
Design System Checklist
A checklist overview for approaching a brand/organisation's communication and image. 5 major headings. I'll probably never need this but it might focus my thinking on a project one day?
webdesign  web  design  graphic  system  philosophy  checklist  brand  tone  method  consistent  communication 
11 days ago
CSS { In Real Life } | Optimising SVGs for the Web
by Michelle Barker showing methods to optimise svg's, tips, relationship of artwork bounds to viewbox, inline use, and some other relevant resources
webdesign  web  design  svg  vector  optimise  optimisation  performance  css  inline  code  coding  illustrator  icon  symbol 
11 days ago
Icon Font & SVG Icon Sets ❍ IcoMoon
tons of icons available as fonts or svg. Michelle Barker says that icomoon will make sprites.
webdesign  web  design  graphic  icon  icons  app  online  font  svg  vector  free  glyph  sprite 
12 days ago
OCR extract text from image
the page is very sparse, just an option to upload an image for OCRing. It wouldn't bring up the Save to Pinboard window so this is set up manually
ocr  optical  character  recognition  image  text  extract  read 
12 days ago
Line Awesome — Free Beautiful Icon Font
their strapline: Swap Font Awesome for modern line icons in one line of code. Tons of useful icons in simple line style
webdesign  web  design  graphic  icons  symbols  illustrations  images  line  drawings  vector  font  awesome 
12 days ago
Accessible Dropdown Menu Component In Vanilla JavaScript - a11y-dropdown-component | CSS Script
heading: Accessible Dropdown Menu Component In Vanilla JavaScript – a11y-dropdown-component, with code
webdesign  web  design  menu  dropdown  accessible  accessibility  a11y  js  javascript  script 
17 days ago
All – Tiny Helpers
handy list of online tools for specific web design tasks. All kinds of mini code generators
webdesign  web  design  online  apps  tools  helpers  webdev  code  generator 
18 days ago
When fonts fight, Times New Roman conquers | Books | The Guardian
Guardian article, 29.1.20: writers explain which set of letters they work in – and why it matters
type  typography  times  font  writing  authors 
18 days ago
Curtis – Audiophile Cafe
Audiophile Café & Record Store
Interesting café with turntables and music, c. Mallorca 196
music  cafe  barcelona  vinyl  sound  album  café  audiophile 
18 days ago
Toggle Visibility When Hiding Elements | CSS-Tricks
article about accessible methods for hiding content. Useful table of accessibility of differents states
webdesign  web  design  css  hide  hidden  visibility  hiding  elements  accessible  accessibility  aria  screen  reader 
18 days ago
CSS-Only Carousel | CSS-Tricks
Jan 2020, a look at current state for making a css-only carousel
webdesign  web  design  carousel  slideshow  css-only  css  only  code  coding 
18 days ago
23 Congreso Ibero Latino-Americano de Dermatología
website of CILAD 2020 conference: Congreso Ibero Latino-Americano de Dermatología
cilad  2020  cilad2020  sergi  bco  congresos  congress  conference  dermatology  dermatología  latin  american 
19 days ago
UEMS Surgery - Transplantation
UEMS - their logo appears on sct page at bottom of Objectius Estatuaris
uems  transplant  transplantation  sct  trasplante 
20 days ago
A Developer's Introduction to the Twenty Seventeen Theme
quite detailed information about using and modifying twenty seventeen wp theme, including creating child theme
wp  wordpress  twenty  seventeen  about  theme  user  developer 
24 days ago
Twenty Seventeen | page about twenty seventeen theme, with more resource links
wp  wordpress  theme  twenty  seventeen  support  default  configure  configuration 
24 days ago
Find your FTP client Mac software
explains how to use built-in mac ftp to connect to remote server from Finder 'Go' menu. To disconnect choose 'Eject' on the desktop server icon.
server  connect  remote  mac  built-in  ftp  go  menu 
24 days ago
Library Detector - Chrome Web Store
Chrome extension: detects and shows js libraries functioning in a site
webdesign  web  design  webdev  js  javascript  script  library  tool  extension  chrome 
25 days ago
Material design style click effects with pointer events and CSS Custom Properties – Ben Frain
a howto build a 'material design' type of click effect (works also on touch). Useful to see the js and explanation of the construction and how you can pass classes from js to css
webdesign  web  design  code  coding  js  javascript  script  css  animation  click 
25 days ago
A11y Toggle
edenspiekermann page that explains how to use their accessible js toggle
webdesign  web  design  ally  toggle  accessible  accessibility  js  javascript  script  vanilla 
26 days ago - Automated Website Screenshots
free and paid screenshot service. Could be handy if I needed consistent size screenshots - easier than carefully resizing my browser window each time ...
webdesign  web  design  screenshot  automatic  automated  screen  shot  capture  service 
26 days ago
online tool to set a smooth box-shadow: get extra smoothness by using shadow layers and controlling their transparency, distance, spread and blur. Generates the code
webdesign  web  design  shadow  smooth  online  tool  box-shadow  generator  code 
26 days ago
Finally, a CSS only solution to :hover on touchscreens
media queries solution to the problem of hover on touchscreen
webdesign  web  design  ui  ux  hover  pointer  touch  touchscreen  media  query  @media  interaction 
26 days ago
Min and Max Width/Height in CSS
handy run-through of min-width and max-width, with use cases
webdesign  web  design  width  css  min-width  max-width  use 
26 days ago
Celery soup recipe | BBC Good Food
Made this, v tasy. If using 1l of stock, thicken it up with more spuds.
soup  celery  bbc  recipe 
4 weeks ago
Smooth Scrolling Sticky ScrollSpy Navigation –
article showing how to code for 'scroll spy' - effect that highlights your scroll position on a permanent sticky menu. Sort of a tail wagging the dog thing.
webdesign  web  design  scroll  spy  navigation  position  effect  css  js  javascript  script 
4 weeks ago
WebAIM: "Skip Navigation" Links
WebAIM article about options for 'Skip navigation' link
webdesign  web  design  nav  navigation  accessible  acessibility  skip  main  content  links 
4 weeks ago
Build a keyboard-accessible navigation bar with drop-down menus | Atomic Smash
Describes how to use :focus-within pseudo class to make a flyout submenu accessible and visible to keyboard tabbing. A drawback is that it obliges user to tab through whole menu and not to be able to select submenu with spacebar or arrows - I don't know yet how to do that. Add a skip nav feature?
webdesign  web  design  dropdown  flyout  menu  accessible  keyboard  tab  nav  navigation  focus  focus-within 
4 weeks ago
Fixing the iPhone CSS hover problem on iOS -
a hack/fix to make iOS :hover touchscreen tap behave like a desktop hover. Works perfectly and haven't found a downside. I used tabindex=0 on SCT site and will try it on Artworkers language menu instead of the js mouseover solution
webdesign  web  design  ios  hover  tabindex  tap  touch  touchscreen  dropdown  flyout 
4 weeks ago
« earlier      
per page:    204080120160

Copy this bookmark:

to read