People spend a lot of time on their phones but that still has not made web pages irrelevant.
<\/p>\n\n\n\n
On the contrary, websites have come to look as sleek as mobile apps in recent days due to new CSS specs and UX trends.
<\/p>\n\n\n\n
As a front-end developer, you\u2019d need to be on the lookout for these emerging techniques. You\u2019d have to go beyond style sheets and templates, framing pages dictated by the UX.
<\/p>\n\n\n\n
And so, here are a few simple hacks and tricks that you can employ in your code to make your creations look current.
<\/p>\n\n\n\n
Let\u2019s jump into it.<\/p>\n\n\n\n
<\/p>\n\n\n\n
Forms are all over the internet. Whether you sign up for a new social media account or a magazine subscription, you have to deal with date-of-births and addresses.
<\/p>\n\n\n\n
To make it easier on the user\u2019s end, you can use the pattern attribute and invalidate wrong user inputs.
<\/p>\n\n\n\n
Look at this code here:
<\/p>\n\n\n\n
<form action=\"\/front_page.php\">
Password: <input type=\"password\" name=\"pw\" pattern=\"[a-z].{1,15,}\">
<input type=\"submit\">
<\/form>
<\/pre>\n<\/div><\/div>\n\n\n\n<\/p>\n\n\n\n
Here, you create a field that accepts text that is lowercase and not longer than 15 characters.
<\/p>\n\n\n\nYou can customize your field to contain different parameters. The [] lets you choose the range while the {} lets you set the limit on the input.
<\/p>\n\n\n\nLoad above-the-fold assets quicker for better PageRank<\/h2>\n\n\n\n
Making your webpage load faster, especially the very first elements that a prospective user would view is important.
<\/p>\n\n\n\nThis is because these load times are taken into consideration by Google\u2019s search bots as they rank your website.
Here are a few suggestions:
<\/p>\n\n\n\n
Instead of using an index.html file, you can dispatch a .zip that would be unpacked by the browser.
<\/p>\n\n\n\n
To do that, first locate your htaccess file on your web host and then use this snippet to modify it:<\/p>\n\n\n\n
<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text\/.*
mod_gzip_item_include mime ^application\/x-javascript.*
mod_gzip_item_exclude mime ^image\/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
<\/ifModule>
<\/pre>\n\n\n\n<\/p>\n\n\n\n
Use HMTL5 Local Storage to decrease bandwidth usage<\/h2>\n\n\n\n
Cookies are used to store user information and to enable their sessions on your websites. However, cookies are resource-intensive, as they are constantly sent back and forth between you and the user.
<\/p>\n\n\n\n