recentpopularlog in

garrettc : html   210

« earlier  
Historical Browser Bugs
"A complete list and demonstrations of more than 1000 browser bugs, plus a bug table, Netscape bugs, CSS and HTML guides and much much more"
browser  bugs  compatibility  css  html  webdevelopment  webdesign  history 
4 days ago by garrettc
Create a semantic “breakout” button to make an entire element clickable
"…using the magic of CSS to give us the desired fully clickable element effect, while also using proper semantic elements and JavaScript and as an enhancement."
webdevelopment  buttons  interaction  accessibility  html  css  javascript  userinterface 
october 2019 by garrettc
Going offline with microformats
The h-entry microformat and the Cache API are a perfect pairing for offline pages.
api  javascript  microformats  offline  caching  webdevelopment  html 
september 2019 by garrettc
Can I email…
Support tables for HTML and CSS in emails.
compatibility  css  email  html 
september 2019 by garrettc
Useful Pens for Everyday Front End Development
"This collection is a way of bookmarking some techniques that will be useful in practice in everyday dev."
css  html  javascript  webdesign  webdevelopment 
august 2019 by garrettc
Storybook: UI component explorer for frontend developers
Storybook is an open source tool for developing UI components in isolation for React, Vue, and Angular. It makes building stunning UIs organized and efficient.
javascript  react  webdevelopment  vuejs  html  css  designsystems  designpatterns  component  webdesign 
august 2019 by garrettc
HTML & CSS Is Hard
A free web development tutorial for complete beginners
html  css  tutorial  education  learning  webdevelopment  webdesign 
july 2019 by garrettc
Start Performance Budgeting
"If you're building a web experience and want to stay fast, a performance budget can be critical. For success, embrace performance budgets and learn to live within them. Network & CPU limits on mobile can require asking hard questions like, "what is really important to my users?"
javascript  webdevelopment  performance  css  html  images  network  internet  worldwideweb  architecture 
july 2019 by garrettc
Materials and tools; client and server; declarative and imperative; inclusion and privilege.
css  culture  design  html  javascript  worldwideweb  creativity 
april 2019 by garrettc
"Water.css is a just-add-css collection of styles to make simple websites like this just a little bit nicer."
css  html  template  responsive  webdesign  webdevelopment 
april 2019 by garrettc
How A Screen Reader User Accesses The Web: A Smashing Video
"In this Smashing TV webinar, join us with Léonie Watson as she explores the web alongside some unexpected properties of HTML elements that have a huge impact on accessibility and performance."
video  accessibility  userexperience  webdevelopment  html  semanticweb 
february 2019 by garrettc
The practical value of semantic HTML
"If the importance of good HTML isn’t well-understood by the newer breed of JavaScript developers, then it’s my job as a DOWF (Dull Old Web Fart) to explain it."
accessibility  html  html5  semantic  webdevelopment  worldwideweb 
february 2019 by garrettc
Table Design Patterns On The Web
"Tables are a design pattern for displaying large amounts of data in rows and columns, and have not yet seemed to fall out of favor, so let’s take a look at how we can create tables on the web in 2019."
css  data  table  layout  webdesign  webdevelopment  markup  html  javascript 
january 2019 by garrettc
Kickstart Cheatsheets
A selection of printable, one-page development cheatsheets.
html  css  python  javascript  programming  webdevelopment  cheatsheet  learning  reference  es6 
january 2019 by garrettc
Web components still need to be accessible
Eric Bailey explains why developers need to consider accessible web components in their work, and not to needlessly reinvent the wheel.
html  webdevelopment  accessibility  equality  userexperience  browsers  webcomponents 
december 2018 by garrettc
Braces to Pixels
In this installment of our “From URL to Interactive” series, Greg Whitworth explains how cascading actually works, and then some.
html  http  javascript  webdevelopment  network  browser  dom  css  parser 
november 2018 by garrettc
Tags to DOM
"Continuing our “From URL to Interactive” series, the second part dives into how HTML is parsed."
html  http  javascript  webdevelopment  network  browser  dom  css  parser 
november 2018 by garrettc
Server to Client
"Kicking off our “From URL to Interactive” series, we take a look under the hood to find out how our code makes it to the browser."
html  http  javascript  webdevelopment  network  browser 
november 2018 by garrettc
BackstopJS - Visual regression testing
"BackstopJS automates visual regression testing of your responsive web UI by comparing DOM screenshots over time."
css  javascript  html  webdevelopment  testing  chrome  headless  automation  regression  tool 
july 2018 by garrettc
Getting to Know a Legacy Codebase
Excellent advice from Harry Roberts on getting to know a new (but legacy to you) codebase.
css  legacy  html  webdevelopment  worldwideweb 
july 2018 by garrettc
Why GOV.UK content should be published in HTML and not PDF
"Compared with HTML content, information published in a PDF is harder to find, use and maintain. More importantly, unless created with sufficient care PDFs can often be bad for accessibility and rarely comply with open standards."
accessibility  pdf  govuk  gds  html  publishing  webdevelopment  bestpractice 
july 2018 by garrettc
Interneting Is Hard
Friendly web development tutorials for complete beginners
html  css  learning  webdevelopment  javascript 
july 2018 by garrettc
Making Avengers ID Card In HTML And CSS
"In this tutorial, we will build a sci-fi ID card for Avengers. You will learn Flexbox, Nested Flexbox, CSS animations, and a ton of other CSS techniques while building this interesting project."
css  flexbox  html  tutorial  webdesign  webdevelopment 
june 2018 by garrettc
Getting Started With CSS Layout
Whether you’re fairly new to CSS or an experienced developer from elsewhere in the stack who wants to make sure your understanding of layout today is up to date, this guide covers everything you need to know about CSS Layout today.
css  layout  flexbox  float  grid  html  webdevelopment  webdesign 
may 2018 by garrettc
Make Frontend Shit Again
"We used to make websites because it was fun and at a point we lost the way. We need to make dumb shit! Make useless stuff, make the web fun again!"
css  fun  html  webdesign  webdevelopment 
may 2018 by garrettc
Inclusive Components
A blog trying to be a pattern library. All about designing inclusive web interfaces, piece by piece.
accessibility  reference  css  components  html  webdevelopment  webdesign  bestpractice  patternlibrary 
april 2018 by garrettc
MJML - The Responsive Email Framework
The only framework that makes responsive email easy. MJML is a markup language designed to reduce the pain of coding a responsive email. Its semantic syntax makes it easy and straightforward while its rich standard components library fastens your development time and lightens your email codebase. MJML’s open-source engine takes care of translating the MJML you wrote into responsive HTML.
email  framework  css  html  newsletter  webdesign  webdevelopment 
january 2018 by garrettc
Turning Design Mockups Into Code With Deep Learning
"In this post, we’ll teach a neural network how to code a basic a HTML and CSS website based on a picture of a design mockup. Here's a quick overview of the process."
deeplearning  machinelearning  artificialintelligence  webdesign  webdevelopment  automation  mockup  html  css 
january 2018 by garrettc
As We May Link
The history of hypertext reaches as far back as the history of storytelling. Its future, in turn, is characterized by the power of building connections across an ever-expanding body of knowledge.
html  worldwideweb  hypertext  technology  history  society  knowledge 
november 2017 by garrettc
Interactive marginalia
"The presence or absence or part-of-speech of every word under a hyperlink matters in hypertext fiction:
annotation  html  literature  worldwideweb  hypertext  designthinking  inspiration 
november 2017 by garrettc
Front-End Checklist
Front-End-Checklist : 🗂 The perfect Front-End Checklist for modern websites and meticulous developers
checklist  webdevelopment  bestpractice  webdesign  html  css  javascript  devops  sysadmin 
november 2017 by garrettc
“HEML is an open source markup language for building responsive email. It gives you the native power of HTML without having to deal with all of the email quirks.”
email  html  design  markup  tool 
november 2017 by garrettc
Morgan Fillman
Morgan Freeman image placeholder for your website - You can never have enough Morgan Freeman in your sites. Just specify any size as per the examples below and make your website Mogan Freeman-tastic.
css  html  placeholder  webdevelopment  webdesign  generator  cinema  film  actor 
august 2017 by garrettc
Fill Murray
Sizable, dynamic placeholder images featuring Bill Murray, with additional variations for grayscale
css  html  placeholder  webdevelopment  webdesign  generator  cinema  film  actor 
august 2017 by garrettc
The website for Keynote Extractor, the tool to export standard-based HTML out of Keynote documents.
html  keynote  tools  presentation 
august 2017 by garrettc
Handling headings in a UI component library
"Building a highly consumable UI component library is no easy feat and this article will focus on one particular aspect of it: headings (<hx> elements)."
html  css  webdesign  webdevelopment  semantics 
august 2017 by garrettc
Indieweb system to post Instagram posts back to your own site.
html  service  indieweb  photography  instagram 
may 2017 by garrettc
Best Practices for Horizontal Lists in Mobile
Many Android and iOS apps have horizontal scrolling lists. Maybe it’s also combined inside a vertical list. But is it necessary? Even assuming it is, are you doing it right?
medium  article  css  html  userinterface  pamoja  webdesign  webdevelopment  appdevelopment 
may 2017 by garrettc
"Mavo extends the syntax of HTML to describe Web applications that manage, store, and transform data. Store data in the cloud, locally, or not at all by just changing an HTML attribute. Edit data right in the website, with an intuitive, auto-generated, customizable interface. No more wrestling with CMSes and servers!"
cms  data  html  webapp  webdevelopment 
may 2017 by garrettc
20 Useful CSS Snippets for Responsive Menus
You'll find CSS snippets for vertical and horizontal navs with dropdowns, slideouts and also some animated menu systems.
webdevelopment  navigation  webdesign  css  html  responsivedesign 
may 2017 by garrettc
Total HTML Agnosticism | CSS-Tricks
A couple of good posts on technology agnosticism lately. Brad Frost says the design system itself is higher level than any particular technology: ... it do
html  progressiveenhancement  webdevelopment  bestpractice  designthinking 
april 2017 by garrettc
Responsive Data Tables
Tables of data can only squish horizontally so far, so they can be a pain to browse on small screens (like mobile devices) where you may need to scroll both horizontally and vertically to browse the information at readable text sizes. We'll explore a CSS-based possible-solution to this issue.
css  html  table  responsivedesign  data  webdevelopment  webdesign 
february 2017 by garrettc
A Complete Guide to SVG Fallbacks
The following is a guest post by Amelia Bellamy-Royds and me. Amelia and I recently presented at the same conference together. We both covered SVG, yet nei
svg  css  html  imagery  webdesign  webdevelopment 
february 2017 by garrettc
Magazine Layouts
Visually interesting magazine layouts that are created with HTML/CSS.
webdesign  webdevelopment  html  css  inspiration 
january 2017 by garrettc
Fixed Scrolling Disappearing Banner
I recently saw a very interesting visual effect that I can only describe in a series of antonyms: a fixed, scrolling, disappearing banner. This article details my recreation and explanation of the effect.
css  css3  html  html5  scrolling  webdesign  inspiration 
november 2016 by garrettc
You Might Not Need JavaScript
"we take a look at the power of modern native HTML and CSS as well as some of the syntactic sugar of Sass. Because, you might not need scripts for that task at all!"
css  html  javascript  webdesign  webdevelopment 
november 2016 by garrettc
Build cross platform desktop apps with JavaScript, HTML, and CSS.
javascript  atom  desktop  nodejs  application  html  css 
october 2016 by garrettc
Web Platform Feature Availability
Powered by data from and StatCounter, this page indicates the percentage of users who have a browser that natively supports various web platform features.
browser  css  html  webdevelopment  statistics 
october 2016 by garrettc
Using CSS's object-fit and object-position Properties
Asha Laxmi explains and demonstrates how to use two CSS properties that can help when creating responsive layouts – object-fit and object-position.
css  html  layout  webdesign 
may 2016 by garrettc
Styling Broken Images
Using CSS to improve the default broken image experience.
css  html  image  userexperience  webdesign  webdevelopment 
march 2016 by garrettc
Frontend Guidelines Questionnaire
A one-page questionnaire to help your team establish effective frontend guidelines, so that you can write consistent & cohesive code together.
webdevelopment  webdesign  bestpractice  guidelines  frontend  html  css  less  sass 
january 2016 by garrettc
US and Canada states
Free downloads of US states, Canadian provinces, territories, and minor possessions in formats you can easily integrate with your project.
data  development  html  php  geodata  geography  csv 
december 2015 by garrettc
Putting My Patterns through Their Paces
Ethan Marcotte dashes through the wintry landscape, his sled of flexboxed content drawn faithfully by a team of well-ordered hierarchical HTML huskies. For when it comes to structure and presentation, we must take care not to put the sleigh before the hounds.
css  html  flexbox  webdevelopment  webdesign 
december 2015 by garrettc
Accelerated Mobile Pages Project
The Accelerated Mobile Pages (AMP) Project is an open source initiative that makes it easy for publishers to create mobile-friendly content once and have it load instantly everywhere. –
css  html  mobile  performance  webdevelopment 
october 2015 by garrettc
Static site generator to build project documentation with Markdown.
documentation  html  markdown  python 
september 2015 by garrettc
Classy Theming in Drupal
Great overview of all the new standards based theme goodness in Drupal 8.
drupal  drupal8  webdevelopment  webdesign  css  bem  markup  html  learning 
september 2015 by garrettc
Welcome to Madoko
"Madoko is a fast markdown processor for writing professional articles, books, manuals, webpages and presentations, with a focus on simplicity and plain text readability.

With Madoko you can write complex documents completely in markdown and get beautiful PDF and HTML output. "
markdown  content  writing  tools  html  pdf  latex 
september 2015 by garrettc
Caniuse for the command line
"Just what you've always wanted, it's a caniuse command line tool! All the power of with none of the nice UI or interactivity!"
caniuse  webdevelopment  browser  css  html  html5  css3 
june 2015 by garrettc
Abstraction in web apps: an idea, not an ideology
"When did simplification & removal of dependencies become subversive?"
webdesign  webdevelopment  bestpractice  http  html  css  javascript  simplicity 
may 2015 by garrettc
Let's build a browser engine!
Matt Brubeck builds a simple browser engine.
browser  html  programming  tutorial  examples 
november 2014 by garrettc
An open source code editor for the web, written in JavaScript, HTML and CSS.
css  html  editor  javascript  webdevelopment  tools 
november 2014 by garrettc
« earlier      
per page:    204080120160

Copy this bookmark:

to read