Autonomtech´s Logo
The Art of Technology

Link Library

A link library of useful quality links within web coding.

Code References
Can I use Check the cross-browser support of HTML and CSS tags, and SVG and JS API commands - as CSS inline-block.
W3School Html5, CSS, JavaScript, XML, Character Sets, Php, SQL & ASP referenses, syntax, tags, code examples and tutorials.
HTML Entity, aliases for special characters, as for & is & used WDG Intities is very detailed and with both Latin symbols and Greek characters.
HTML Character Entities shows probably the most special characters in the ISO Latin character set and its HTML entities, clearly divided into categories.
HTML Named Special Symbols Aliases for: Characters with Special Meaning in HTML, Punctuation, Interesting Characters and Symbols, Foreign Characters, Card Suits, Mathematical Symbols, Arrows & Greek Alphabet.
Javascript Key Codes Javascript Key Codes, Interactive Demonstration and Lookup Table.
KeyCodes, what keyboard events report based on what keys are pressed. KeyboardEvent Value (keyCodes, metaKey, etc).
HTML DOM Element Object In the HTML DOM (Document Object Model), everything is a node. In the HTML DOM, the Element object represents an HTML element. (JavaScript) - W3Schools
HTML DOM Events HTML DOM events allow JavaScript to register different event handlers on elements in an HTML document. Events are normally used in combination with functions, and the function will not be executed before the event occurs (such as when a user clicks a button). - W3Schools
HTML DOM Style Object The Style object represents an individual style statement. (JavaScript) - W3Schools
Window Object The window object represents an open window in a browser.
Window Object Properties
Window Object Methods
(JavaScript). - W3Schools
Php header header() is used to send a raw HTTP header. See the HTTP/1.1 specification for more information on HTTP headers.
Mime Types MIME types described at Mozilla.
The Complete MIME Types List.
Php Operators All Php Operators:
Arithmetic Operators
Assignment Operators
Comparison Operators
Increment / Decrement Operators
Logical Operators
String Operators
Array Operators
JavaScript Operators All JavaScript Operators:
Arithmetic Operators
Assignment Operators
String Operators
Adding Strings and Numbers
Comparison Operators
Logical Operators
Bitwise Operators
Measuring Element Dimension & Location Measuring Element Dimension and Location with CSSOM:
Understanding Properties That Measure Element Dimension and Location.
This topic is designed to help web developers understand how to access the dimension and location of elements on the page through the CSS Object Model (CSSOM).
Also: Determining the dimensions of elements.
Performance Timing API Navigation Timing gives access to timing and navigation information for the overall document. Thus one can easily calculate where time is spent between the start of the navigation in the user agent until the end of the load event processing.
Having timing metrics for the main page is great, but to diagnose real world performance issues it´s often necessary to drill down into individual resources. Thus, we have the more recent Resource Timing spec. This JavaScript API provides similar timing information as Navigation Timing but it´s provided for each individual resource.
Test, Verify & Optimize
Respons-isualizer Free tool to use: A responsive web page multi-unit screen simulator.
Visualizes a web page in 18 different screen resolutions simultaneously.
Views web pages in real world restricted browser viewports, in scale 1:4.
Magnify a device screen to scale 1:1 in lightbox mode for detailed check.
Uses 18 popular browser viewports from real world tracked visitor data!
Mobile-Friendly Test Google analyzes whether a website is mobile friendly programmed, regarding responsive functionality and CSS media queries.
PageSpeed Insights Google analyzes the content of a web page, and gives suggestions on how the page can be made faster.
GTmetrix, website performance analyze Everybody deserves a fast web experience. GTmetrix can help you develop a faster, more efficient, and all-around improved website experience for your users. Enter the address of any website and GTmetrix will give you a Performance Report.
Detect my Browser Presents the Capabilities of your browser in: Plugins, HTML5 Audio, HTML5 Video, CSS3, Advanced HTML5 interfaces & HTML5 Forms.
security headers .io "There are services out there that will analyse the HTTP response headers of other sites but I also wanted to add a rating system to the results. The HTTP response headers that this site analayses provide huge levels of protection and it´s important that sites deploy them. Hopefully, by providing an easy mechanism to assess them, and further information on how to deploy missing headers, we can drive up the usage of security based headers across the web."
Observ­atory by Mozilla Observatory by Mozilla is a project designed to help developers, system administrators, and security professionals configure their sites safely and securely.
SSL Server Test This free online service performs a deep analysis of the configuration of any SSL web server on the public Internet.
Web Page Test "Run a free website speed test from multiple locations around the globe using real browsers (IE and Chrome) and at real consumer connection speeds. You can run simple tests or perform advanced testing including multi-step transactions, video capture, content blocking and much more. Your results will provide rich diagnostic information including resource loading waterfall charts, Page Speed optimization checks and suggestions for improvements."
Color Contrast Checker "Simply select or enter a foreground and background color in RGB hexadecimal format (e.g., #f7da39). Select the lighten and darken options to modify the colors slightly. You can use the color picker to change colors or change luminosity.
WCAG 2.0 level AA requires a contrast ratio of 4.5:1 for normal text and 3:1 for large text. Level AAA requires a contrast ratio of 7:1 for normal text and 4.5:1 for large text. Large text is defined as 14 point (typically 18.66px) and bold or larger, or 18 point (typically 24px) or larger.
Hint: ColorZilla for Firefox is an excellent tool for extracting the color value from any page element."
WAVE access­ibility tool WAVE, web accessibility evaluation tool. Type in your web URL and get the result presented graphically on the web page.
Powered by WebAIM - "We have web accessibility in mind. Our mission is to empower organizations to make their web content accessible to people with disabilities."
jpeg io Jpeg.io is a free online interface for rapidly and conveniently converting your images into highly optimized JPEGs using Kraken.io's proprietery JPEG optimization algorithms. It has been engineered with simplicity in mind: simply drop your image into the drop space and a short time later you'll get a progressive JPEG compressed to the smallest possible size without perceptible quality loss. Convert any major image format into a highly optimized JPEG.
JPEGmini JPEGmini is a patent-pending photo recompression technology, which significantly reduces the size of photographs without affecting their perceptual quality. The technology works in the domain of baseline JPEG, resulting in files that are fully compatible with any browser, photo software or device that support the standard JPEG format. There are free trials to download for the three different version, before buy.
Coding Hints, Tips & Help
Front End Web Help "Front End Web Help is a voluntary website dedicated to helping front end web developers solve everyday technical problems and challenges. The posts may seem random, but they are all technical issues us front end developers have come up against in our professional experience and have solved. All material on this website is free to use for anyone to use on personal and commercial websites.
We hope to help others, just as we got help from others during our careers as front end developers."
Fluid Typography Using viewport units and calc(), we can have font-size (and other properties) adjust their size based on the size of the screen. So rather than always being the same size, or jumping from one size to the next at media queries, the size can be fluid. CSS-TRICKS
The original source at Mike Riethmuller:
Fluid type calc examples, with some really nices code examples!
A deeper description: Interpolation in CSS without animation.
More: Precise control over responsive typography
Individual CSS Transform A Trick: Individual CSS Transform Functions
We get a lot of power through the single transform property in CSS - allowing us to rotate, translate, scale, and more all at once. But allowing all of those different transform functions into one property can trip us up.
Detect touch device In the era of mobiles, tablets, 2-in-1 Laptops & Laptops with touch screens: "If you ask stack overflow "to detect touch with JavaScript" you´ll get a lot of answers that all have one thing in common: they have nothing to do with humans.
In my not-even-close-to-humble opinion, all of these answers are wrong, but it´s not the fault of the answerers. It´s the fault of the askerers. Why on earth would you want to know if your user is looking at a device that responds to the touch?
We want to detect human touch, not device touch. I reckon that´s important enough to be repeated in a big font."
Browser Capability Detection Browser Capability Detection with JavaScript Although browser vendors have made a concerted effort to implement common interfaces, the fact remains that each browser presents its own capabilities and flaws. Browsers that are available cross-platform often have different issues, even though they are technically the same version. These differences force web developers to either design for the lowest common denominator or, more commonly, use various methods of client detection to work with or around limitations.
Feature Detection: State of the Art Browser Scripting The goal of feature detection in browser scripting with JavaScript is straight forward. Before our code uses an object or object reference we want to know that our use of it will execute without error and behavior as we are expecting. If we don´t know these things before we use the object or object reference then we don´t want to use it because using it would risk a broken page and ultimately an unsatisfactory user experience.
Building Apps with HTML5 - No Browser Left Behind: An HTML5 Adoption Strategy Today there are alternatives to UA sniffing, and one that´s growing in popularity—thanks in part to both jQuery and Modernizr—is called object or feature detection. These terms are mostly interchangeable, but I´ll stick to "feature detection" for this article.
PHP The Right Way PHP: The Right Way is an easy-to-read, quick reference for PHP popular coding standards, links to authoritative tutorials around the Web and what the contributors consider to be best practices at the present time.
Web Tips Design & UI Google Developers Web Fundamentals: Web design and UI encompasses a few broad areas. What does a page look like? How does it behave? How does it respond to different screen sizes, input types, and devices?
• Responsive design, • Basics of UX, • User input, • Animations, • Icons & browser colors
Webb­rikt­linjer Vägledning för webbutveckling, PTS: De officiella riktlinjerna för hur man bör arbeta med webbplatser i offentlig sektor i Sverige.
Vägledningen (även kallad Webbriktlinjerna) sammanfattar erfarenheter från mer än ett decennium av webbutveckling. Därmed kan även den privata sektorn ha mycket att vinna på att följa riktlinjerna.
Blogs & Security
CSS-TRICKS CSS blog, code snippets, forums and a CSS Almanac.
Snippets for: HTML, CSS, Sass, htaccess, JavaScript, jQuery, WordPress & PHP.
HTML5-Rocks Latest Articles
Tutorials
Mobile
Performance
Mike Riethmuller Stuff I wrote: A range of unique and possibly interesting web development ideas of varying quality. Basically "I think stuff and sometimes I write it down".
Dan Wilson I´m looking to all things web and mobile. I love web standards, progressive enhancement, and anything that improves usability and accessibility for all users.
Paragon Initiative Blog "Paragon Initiative Enterprises is the home of leading industry experts in secure PHP development. Our specialties include applied cryptography and web application security."
"Remember Me" - Long-Term Persistent Authentication
Securing a PHP Application in 2016: The Pocket Guide
On the (in)security of popular open source Content Management Systems written in PHP
IDE, Integrated Development Environment
CodeLobster Our goal is to create a product which would simplify and speed up to the maximum process of developing full-featured web sites on php.
For now, it includes all standard abilities for operating with code and many advanced features for PHP developing.
In three versions: Free, Lite & Professional.
Visual Studio Code Code editing Redefined: Microsoft Visual Studio Code is a streamlined code editor with support for development operations like debugging, task running and version control. It aims to provide just the tools a developer needs for a quick code-build-debug cycle and leaves more complex workflows to fuller featured IDEs.
Free, Open source that Runs everywhere.
PhpStorm All PHP tools: The editor actually ´gets´ your code and deeply understands its structure, supporting all PHP language features for modern and legacy projects. It provides the best code completion, refactorings, on-the-fly error prevention, and more.
Available for purchase in commercial and personal licenses.
PhpDesigner PhpDesigner 8 is a lightning fast and powerful PHP IDE and PHP editor boosted with all the features to help you create amazing websites. Combine all your web-development into PhpDesigner 8 with built-in editors for PHP, HTML5-, CSS3- and JavaScript!
I have been using PhpDesigner 6 & 7 for more than 10 years and I am very happy with it! But unfortunately is its latest version 8.1.2 released 19 May 2013 (2017-02-26) and begins to be utdated. At mail-contact in February 2017 with Michael Pham, the man behind it, he says PhpDesigner still is alive and he is working on updating version 8. But I now tries out the CodeLobster IDE meanwhile.
PhpDesigner is only for purchase.
Best PHP IDE Comparison "The Best PHP IDE 2016 and 2017 Comparison - The Most Popular Editors for Development under Windows, Mac and Linux either Open Source, Free or Commercial."
"Most PHP developers use an IDE (Integrated Development Environment) to become more productive. There several PHP IDEs, some more advanced than others, some are commercial and others are free."
"Read this article to compare the features of some of the most popular IDEs being used by PHP developers, so you can decide which one suits you best."
"This is a live article. This means that the article will be updated once and republished here again once there are relevant updates to the features of the currently listed IDEs or others that may not yet be listed."
Free Resources
Icon Fonts IcoMoon - Pixel Perfect Icon Solutions.
Code Frameworks & Libraries
CMS Airship CMS Airship - Secure Content Management for the Modern Web
CMS Airship is a secure-by-default content management system, blog engine, and application development framework written for PHP 7.
CMS Airship is Free Software (GPL 3) developed and maintained by Paragon Initiative Enterprises.
Commercial license are available for purchase if your company requires an alternative to the GNU Public License.
PHP CMS Out-of-the-Box Security Comparison Chart: CMSAirship, WordPress, Drupal, Joomla!
Blog of news of CMS Airship
Joomla! Joomla! is an award-winning content management system (CMS), which enables you to build Web sites and powerful online applications. Many aspects, including its ease-of-use and extensibility, have made Joomla! the most popular Web site software available. Best of all, Joomla! is an open source solution that is freely available to everyone.
BesöksStatistik

Här kommer statistik när jag kodat färdigt...

 .....
AutonomTech, version: 4.5
Webbsidan uppdaterad: 2017-03-25, 11:50
Copyright © 2003-2017 Bosse at www.autonomtech.se
Valid XHTML 1.0 Strict ||
Webpage: server time: 437 ms, (incl. log: 5.4 ms) ||  Liten husvagn = Stora upplevelser längs vägen!