Bernat Font - Diseñador gráfico freelance
spanish catalan graphic design freelancer. Nice unpretentious website. A Wordpress site - I guess that means he made it from a template. When I changed lang to English I was redirected to a scammy aggressive "virus detected" type site - has his WP installation been hacked?
graphic  design  web  inspiration  freelance  studio  own  site  designer 
1 hour ago
Sylvain Julé
Sylvain Julé, freelance graphic design and front end dev. Says he works a lot with Kirby and develops plugins for it.
graphic  design  web  inspiration  freelance  studio  own  site  designer 
4 hours ago
The Font Detectives | JSTOR Daily
about FontLab ceo Thomas Phinney who has sideline as font detective for lawyers, detecting fraud, collecting font evidence about docs as evidence
typography  fonts  detective  law  evidence  history 
Home Page | JSTOR Daily
They say: where news meets its scholarly match
academic  news  context  articles  scholarly  research  researched 
cubic-bezier(.17,.67,.83,.67) ✿ cubic-bezier.com
visual tool to generate cubic-bezier curve and copy the values for your css
webdesign  web  design  online  tool  cubic-bezier  cubic  bezier  curve  ease  css 
3 days ago
cubic-bezier(.17,.67,.83,.67) ✿ cubic-bezier.com
visual tool to generate cubic-bezier curve and copy the values for your css
webdesign  web  design  online  tool  cubic-bezier  cubic  bezier  curve  ease  css 
3 days ago
Safari brings Web Share to desktop | Web Platform News
about the Web Share API - available in some browsers, behaves like the share button in apps
webdesign  web  design  button  share  api  safari  browser 
3 days ago
<base> element
make all links in a page open as target="_blank" by using <base> tag in the head
webdesign  web  design  base  html  head  code  target  blank  tab  window 
6 days ago
Digging Into The Display Property: Box Generation — Smashing Magazine
about use of display:contents; and when you might want to use it and when you shouldn't. By Rachel Andrew
webdesign  web  design  css  display  contents  property  box  layout  accessibility  accessible 
9 days ago
GitHub - scaleflex/js-cloudimage-360-view: Engage your customers with a stunning 360 view of your products
they say: A simple, interactive resource that can be used to provide a virtual tour of your product. Their demo is impressive.
Effect is useful - I don't know how you generate the necessary images.
webdesign  web  design  graphic  360  view  spin  turn  image  degree  panorama  js  javascript  script 
11 days ago
simple popover — week 16/52
nice design for popover card on hover, like a tooltip. Uses css and vanilla js
webdesign  web  design  popover  pop  over  css  js  javascript  script  tooltip  hover  popup  card 
11 days ago
Fading out siblings on hover in CSS | Trys Mudford
Fading out siblings on hover in CSS - impressive css for fading the siblings of an element when that element is hovered
webdesign  web  design  css  fade  sibling  parent  hover  effect  fading  opacity  animation 
11 days ago
Diagonal Containers in CSS | CodyHouse
how to create full-width, diagonal sections in CSS using the clip-path property
webdesign  web  design  css  clip-path  diagonal  container  code  coding  angled 
11 days ago
Creating an aspect ratio CSS utility - Andy Bell
A component css solution to maintain aspect-ratio. Uses the vertical padding trick.
I didn't realise that object-fit can be used on img, not only on background
webdesign  web  design  img  object-fit  css  code  coding  aspect  ratio  proportion 
11 days ago
Duck Brigade
designed the web for 99percentinvisible
webdesign  web  design  graphic  studio  inspiration  portfolio  cv  promotion 
11 days ago
iPad Rehab
Jessa Jones apple iphone ipad repair business
apple  iphone  ipad  repair  diy  home  fix  data  recovery  device  training  parts  components 
12 days ago
Louis Rossmann - YouTube
Apple diy repair shop, youtube channel
louis  rossman  repair  apple  fix  home  diy  computer  iphone  ipad  mac  macbook  video  youtube  channel 
12 days ago
Rare Historical Photos - And the story behind them...
Historical photos organised by categories. The word 'rare' in site title seems pointless to me (some of the photos are famous, iconic), but there are good texts with the photos.
history  photos  photography  reference  images  historical 
13 days ago
CSS { In Real Life } | Controlling leftover Grid items with pseudo-selectors
controlling leftover grid items !?
Does grid really have left over items (like flex) ?
webdesign  web  design  css  grid  flex  flebox  display  layout 
14 days ago
Front-end Developer Handbook 2019 - Learn the entire JavaScript, CSS and HTML development practice!
1st para: This is a guide that everyone can use to learn about the practice of front-end development. It broadly outlines and discusses the practice of front-end engineering: how to learn it and what tools are used when practicing it in 2019.
webdesign  web  design  frontend  front-end  html  css  script  js  education  resources  learning  developer 
14 days ago
Edge Goes Chromium: What Does it Mean for Front-End Developers? | CSS-Tricks
about the impact of Edge going Chromium with list of css features now supported that weren't in older IE Edge.
webdesign  web  design  browser  edge  chromium  engine 
14 days ago
Under-Engineered Toggles | Adrian Roselli
css-only toggles using the checkbox default browser functionality
webdesign  web  design  toggle  css-only  css  accessible  accessibility  checkbox  default 
14 days ago
MVB Fonts: Home
Mark Van Bronkhorst fonts. MVB Sirenne used in Judith Schalansky's 'Atlas of Remote Islands'
foundry  fonts  type  typography  graphic  design  book  schalansky  judith  mark  van  bronkhorst 
15 days ago
Finally understanding PNG – Compress-Or-Die
all about the png format and tips on getting better compression
webdesign  web  design  graphic  image  photo  compression  compressed  png  about 
17 days ago
Compressive Images | Filament Group, Inc., Boston, MA
the original article by Filament about compressive images. From October 2012 so I wonder if there are arguments against this technique now?
webdesign  web  design  images  compression  srcset  technique  compress  jpg  jpeg 
18 days ago
Hamburger 3D CSS Switch animation
codepen example of an animated hamburger icon with a 3D turn effect
webdesign  web  design  css  code  hamburger  menu  icon  animation  animated 
18 days ago
Designing button focus states for better usability - DEV Community 👩‍💻👨‍💻
short, not very interesting piece about focus state, but has useful list of resources at end
webdesign  web  design  button  focus  state  accessibility  accessible  css 
20 days ago
Website Builder for Professionals - Duda
a drag-and-drop site builder offering hosting (on AWS) and other resources. Free and paid versions. Mentioned by Craig on golive list
webdesign  web  design  templates  draganddrop  drag  drop  builder  website  publisher  ready  made 
20 days ago
Art Direction For The Web Using CSS Shapes — Smashing Magazine
about using css shapes in web page layout. He mentions using the alpha channel of images - check that out
webdesign  web  design  css  shape  layout  shapes  graphic  alpha  channel 
24 days ago
Awesome accordion menu using only HTML & CSS
nice expanding/collapsing menu with no js. Has an extra 'accordion' effect which is daft, ignore it, the main expanding feature seems good (but test it thoroughly)
webdesign  web  design  menu  expand  collapse  css  vanilla  code 
25 days ago
The Hidden Power of CSS Text Align
some use cases for text-align. Handy sometimes for page layout
webdesign  web  design  css  text-align  layout 
25 days ago
Accessibility for Vestibular Disorders: How My Temporary Disability Changed My Perspective – A List Apart
by a person who suffered severe vertigo and the effect on their navigation ability - and consequent advice on web design
webdesign  web  design  accessibility  accessible  vestibular  disorder 
25 days ago
How to create clipped, blurred background images in CSS | CodyHouse
How to apply blur effects to images using CSS filters, and how to confine these effects to specific image areas.
Here they've used it under overlaid text panels - nice
webdesign  web  design  css  filter  clip  blur  effect  image  img  background  bg 
25 days ago
Make it hard to screw up driven development | CSS-Tricks
collection of tools for validating, checking and testing code
webdesign  web  design  tool  online  lint  automated  test  testing  valid  validate  code  html 
29 days ago
collection of ready-made css animations
webdesign  web  design  css  animate  animation 
29 days ago
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 
4 weeks ago
“Mi tejado solar es un tesoro”
La Vanguardia article: "Los usuarios del sistema de autoconsumo con energía fotovoltaica ensalzan las ventajas ambientales de su elección energética y no solo los beneficios económicos"
solar  energy  panel  roof  autoconsumo  environment  instalation 
4 weeks ago
Secure groups, files, and chat for everyone. Encryption for group data
webdesign  web  design  webdev  development  security  encryption  encrypt  group  chat  data 
4 weeks ago
25th International Conference on Oral and Maxillofacial Surgery
ICOMS 2021 conference website. Wordpress.
15/4/19 only 1 page, no other content yet
barceló  sergi  roca  glasgow  scotland  conference  congress  icoms  2021  oral  maxillofacial  surgery 
5 weeks ago
Quicksilver — Download
page for downloading latest version of Quicksilver
quicksilver  app  mac  download  trigger  shortcut 
5 weeks ago
Premium economy: is it worth the extra expense? | Travel | The Guardian
about value of premium economy seats. Some links and resources for airline comparison info.
flights  travel  long-haul  airline  seats  comfort  economy  premium  value  cost  price 
5 weeks ago
50 Best Buildings In London | Beautiful Buildings You Have To Visit
they say: The 50 best buildings in London
Take a tour of our 50 favourite buildings in London as chosen by city architects, leading authors, Instagrammers and the Mayor of London himself
london  timeout  time  out  guide  architecture  listing  list  visit  travel 
5 weeks ago
London Architecture Guide | Architecture Foundation
a free app based on the book The Guide to the Architecture of London by architectural writers, Edward Jones and Christopher Woodward. With an expanded set of entries, photography, walking directions and events listings
london  architecture  app  guide  travel 
5 weeks ago
Cool uses of the ::before and ::after pseudoelements
some curious uses of ::before and ::after, including use of attribute attr(aria-valuenow) that updates a value in realtime
webdesign  web  design  css  before  after  pseudoelements  pseudo  elements 
5 weeks ago
[no title]
scroll effects - OK on touchscreen but rather dull on desktop with mouse
webdesign  web  design  scroll  effects  js  javascript  script  animation  library 
6 weeks ago
HTML 5.2: 4.3. Sections
w3.org's reference pages about html semantic elements like <section> <article> <aside> etc
w3  css  elements  article  section  aside  html  construction  content  semantic  tags 
6 weeks ago
neat tool to play with flex-basis, grow and shrink and see the effect immediately
webdesign  web  design  css  flex  flexbox  online  tool  shrink  grow  basis 
6 weeks ago
Security Checklist
a checklist of security practices to follow to protect your own data and privacy. Some useful tips
web  internet  privacy  security  data  tracking  advice  tips  checklist 
6 weeks ago
Breaking CSS Custom Properties out of :root Might Be a Good Idea | CSS-Tricks
why you might need to use a variable with a more local scope than :root
webdesign  web  design  css  variable  custom  property  :root  scope  class  html 
6 weeks ago
Make your Google Fonts render faster · PerfPerfPerf
a script for immediate display - in fallback font - when you use google fonts, instead of foit
webdesign  web  design  font  google  webfont  foit  display  fallback  performance 
6 weeks ago
You probably don’t need input type=“number”
why using type="number" isn't always a good idea on form input fields
webdesign  web  design  input  form  number  type  field  usability  ux  touch  screen  numeric 
6 weeks ago
SVG Sprite Generator
online svg sprite creator - drop SVG files to create the sprite
webdesign  web  design  sprite  svg  online  tool  creator 
6 weeks ago
GitHub - leeoniya/dropcss: A simple, thorough and fast unused-CSS cleaner
takes your HTML and CSS as input and returns only the used CSS as output.
Not sure if this requires npm installer or if one can just download
webdesign  web  design  css  clean  used  unused  cleaner  optimise 
7 weeks ago
5 Tools For Automated Accessibility Audits
helpful tools and resources for checking accessibility of a site
webdesign  web  design  accessibile  accessibility  tools  automated  automate  check  checking  audit 
7 weeks ago
« earlier      
@font-face about accessibility accessible android animate animated animation app apple application archive art background barcelona blog browser button carousel cart catalunya client cms code coding colour compatibility competition conference congress content convert css css3 data design designer development device digital display drawing dropdown ecommerce edit editing editor effect effects element email embed example examples explorer facebook file flex flexbox font fonts form format foundry framework free gallery generator google graphic grid guardian guide height history host hosting hover howto html html5 http icon icons ie illustration image images inspiration internet ios ipad iphone javascript jquery js language layout learn learning library link list load loading mac management marketing media menu mobile modal music navigation network online optimisation optimise osx page pattern performance photo photography photos photoshop php pixel plugin popup privacy queries reference resource resources responsive screen script scroll search security seo server service shop shopping site size slide slider slideshow social software spain speed sticky stock studio style support svg syntax system technique template templates test testing text tips toggle tool tools touch transform transition travel tria triairemena tutorial tutorials type typeface typography ui user vanilla vector video viewport virtual web webdesign webdev webfont webfonts webpage website width window windows

Copy this bookmark: