Nifty little database of screen specifications for popular devices: screensiz.es by @typecode http://screensiz.es
A very nice online book written by Stoyan Stefanov to help you improve the performance of your web application or websites.
Before we actually define the role of a Front-End developer let us take a look at different roles which are involved in developing a website or a web application.
- Product Manager
- Usability Analyst / User Experience Design
- Visual Designer / Web Designer
- Web Developer / Web Programmer
- Database Analyst
What is front-end?
As far as a customer is concerned, the interface is the product – Jef Raskin
The frond-end is every bit of the website that a user can see or interact, this includes the design, images, colors, typography, buttons, forms, animation and content.
Front-end development is also referred as client side development.
Different names of a front-end developer are :
- Front End Engineer
- Front End Developer
- User Interface Engineer
- Web Developer
- Web Producer
The role of a front-end developer starts after the visual design of a projects are completed. The visual designer provides the designs of screens/pages in the form of .jpg/.png/.psd format to the front-end developer. The front-end developer does the following:
- Converts the design into html’s by using standardized mark up/semantics html tags
- Styles the pages using CSS – Cascading Style Sheets
- Optimizes the pages to make sure that it renders properly on different OS platforms, browsersand devices
- Develop animations using css3
- Make sure the code is scalable
- Optimize the performance so that it loads quickly as possible
- Make sure that the pages accessible by Search Engines
- Make sure that the pages can be accessed by disabled users
- Integrate the code with the back end
- Develop e Mailers and make sure it is accessible on various email clients and versions of different browsers
The iconic font designed for use with Twitter Bootstrap
A nice presentation by Jatinder Mann, Internet Explorer, Program Manager on how to improve web performance.
These performance tips and tricks apply equally to Web sites that run on standards based Web browsers, and Windows Store Apps, which are also just the Web. There are six principals detailed in the talk that will help you improve the performance of your apps and sites today:
- Quickly respond to network requests
- Minimize bytes downloaded
- Efficiently structure markup
- Optimize media usage
- Know what your application is doing
dabblet is an interactive playground for quickly testing snippets of CSS and HTML code. It uses -prefix-free, so that you won’t have to add any prefixes in your CSS code.
Twitter cards make it possible for you to attach media experiences to Tweets that link to your content. Simply add a few lines of HTML to your webpages, and users who Tweet links to your content will have a “card” added to the Tweet that’s visible to all of their followers.
The service is currently in the process of slowly rolling out the technology to 100% of users. Not all users will see Cards for the time being.
For more details, please visit https://dev.twitter.com/docs/cards
Code copy paste tool
Pastebin.com is a website where you can store text for a certain period of time. The website is mainly used by programmers to store pieces of sources code or configuration information, but anyone is more than welcome to paste any type of text. The idea behind the site is to make it more convenient for people to share large amounts of text online.
It cleans the junk character that takes place in the code when you exchange it on messengers like skype, yahoo chat.