recentpopularlog in

garrettc : html   196

« earlier  
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 
2 days ago 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 
10 days ago 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 
23 days ago by garrettc
Kickstart Cheatsheets
A selection of printable, one-page development cheatsheets.
html  css  python  javascript  programming  webdevelopment  cheatsheet  learning  reference  es6 
5 weeks ago 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 
9 weeks ago 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  flex 
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  flex 
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  flex 
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
Drupal 8 - An intro field guide for front-end developers
Drupal 8 is almost here, and it’s bringing big front-end improvements, including new methods to display data on mobile devices using breakpoints, build flexible templates in Twig and better management for tools and libraries. Most importantly, changes to the display layer mean that Drupal has become much more agile and extendable for Front-end Developers.
drupal  drupal8  webdevelopment  php  html  css  javascript 
october 2014 by garrettc
A group of plugins for responsive tables.
html  css  javascript  responsivedesign  table  userinterface 
october 2014 by garrettc
combines 43 reference documentations in a fast, organized, and searchable interface: HTML, CSS, JavaScript, PHP, Ruby, Python, Go, C, C++, etc.
javascript  python  css  documentation  html  jquery  reference  php  ruby 
september 2014 by garrettc
The Truth About Multiple H1 Tags in the HTML5 Era
'Whether you're a webmaster or a web designer, there's a question you've most likely either asked or answered many times over the years. That question is, "How many <h1> tags can I use per page, and how exactly should I implement them?"'
html  html5  webdevelopment  markup  outline  sectioning 
september 2014 by garrettc
Grid by Example
Simple usage examples for the CSS3 Grid Layout Module from Rachel Andrew.
css  css3  grid  layout  html  w3c  specification  webdesign 
september 2014 by garrettc
Transactional HTML Email Templates
From Mailgun:

* Action emails e.g. activate your account, reset your password
* Email alerts e.g. reaching a limit, there was a problem
* Billing emails e.g. monthly receipts and invoices
css  html  email  template  tools 
august 2014 by garrettc
What Every Frontend Developer Should Know About Webpage Rendering — Frontend Babel
Rendering has to be optimized from the very beginning, when the page layout is being defined, as styles and scripts play the crucial role in page rendering. Professionals have to know certain tricks to avoid performance problems.
browser  webdevelopment  performance  css  javascript  dom  html  http  https 
july 2014 by garrettc
GOV.UK elements
Component based style guide from Gov.UK for outside services.
css  html  markup  webdesign  process  styleguide 
may 2014 by garrettc
&what: Discover Unicode & HTML Character Entities
amp-what is a quick, interactive reference of HTML character entities and common Unicode characters, 8859-1 characters, marks, symbols, and the like
html  reference  search  unicode  display  tools 
april 2014 by garrettc
« earlier      
per page:    204080120160

Copy this bookmark:

to read