April 29, 2020 I’ve always loved exploring how to make semantic, accessible elements aesthetically pleasing. And yes, it is possible. Challenging myself to do this has improved my CSS skills. Today we are going to talk about input[type=”range”]. These inputs where you select a value from a slider that has a thumb on it. You… Continue reading Creating an Accessible Range Slider with CSS
Tag: Edge
How to Use HTML5 “picture”, “srcset”, and “sizes” for Responsive Images
<picture> is an HTML5 element designed to give us more versatile and performant responsive image functionality. Instead of loading a single image and trying to resize it to suit all possible viewport sizes and layouts, the picture tag loads multiple images of different sizes and resolutions, choosing the best fit for different scenarios. How Does <picture>… Continue reading How to Use HTML5 “picture”, “srcset”, and “sizes” for Responsive Images
Best Practices For Optimizing Web Page Speed
A Moving Target The internet develops as computers develop: exponentially. If you don’t believe that, just use a search engine to explore “legacy” websites. One website still up since its inception is the Space Jam website; and it is extremely dated—but it’s also extremely fast. Part of exponential forward development in terms of technology is… Continue reading Best Practices For Optimizing Web Page Speed
Resize and Manipulate Images in PHP (With Examples)
In my previous tutorial, we discussed basic image manipulation using the PHP GD library. In that tutorial, I gave a brief introduction to the library and showed you how to load images from a file or create them from scratch in PHP. After that, we learned how to crop, rotate, scale and flip an image… Continue reading Resize and Manipulate Images in PHP (With Examples)
Filterizr – A jQuery Plugin to Apply Filters Over Responsive Galleries
Filterizr is a jQuery plugin that sorts, shuffles and applies stunning filters over responsive galleries using CSS3 transitions and custom CSS effects.You can write your very own, custom effects in CSS and watch your gallery come to life. Features: – Pluggable look & feel (write your CSS effects in the box on the right and… Continue reading Filterizr – A jQuery Plugin to Apply Filters Over Responsive Galleries
15 Cheat Sheets To Get An Edge On Other Designers
Cheat sheets. A simple way to remember something or help you learn. There’s always a useful shortcut you forget, a command you fail to remember, a newly introduced function that slips your mind or element you cease to think of. This collection of 15 cheat sheets for web designers has got you covered. If you’re… Continue reading 15 Cheat Sheets To Get An Edge On Other Designers
HTTP: The Protocol Every Web Developer Must Know – Part 1
* { box-sizing: border-box; } body {margin: 0;}*{box-sizing:border-box;}body{margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;} Learning the fundamentals of the World Wide Web is crucial, especially if you are planning to build web apps. And, HTTP is at the heart of any web application you could build. HTTP stands for Hypertext Transfer Protocol. It’s a stateless, application-layer protocol for communicating between distributed… Continue reading HTTP: The Protocol Every Web Developer Must Know – Part 1
New Features of Edge Reflow CC
Edge Reflow application is used by web designers to create a native web surface with CSS design and layout features in a familiar and intuitive way. Edge Reflow helps designers to create resizable layouts that simulate the look and feel of both desktop and mobile devices; control media query breakpoints in design for custom device sizes, add typography to their projects using the integrated Edge Web Fonts, and preview their work on desktops as well as mobile devices using the integrated Edge Inspect plug-in. You can extract CSS code and hand off to developers with confidence that your design vision will remain uncompromised throughout development.
Source: http://designmodo.com/edge-reflow-cc/#ixzz2Z0l3DYR3