Why ‘design’ has become easier in the past 9 Years, and longer..
Posted By JC - Web Design Director20/08/19
Why ‘design’ has become easier in the past 9 Years, and longer…
So, I learnt web design the hard way, I used a piece of software called Microsoft Front page, moving on to dreamweaver. A brief stint on notepad and then onto more gucci editors such a sublime, brackets and currently Visual Studio Code.
I used to use tables, and frames to make websites. All of my styling was inline. I remember a friend on MSN messenger introducing me to php and how we could upload a .txt file and have the html change ‘dynamically’. I owned my own visual bulletin site (pirated….) and I made a proxy site for miniclip games when they were banned in my high school, I would have loved to have seen the analytics for that site.
I didn’t have a mobile phone when I built my first site, responsiveness just wasn’t a thing.
A lot has changed from when I first built a website. So much so that when I got back in to web design, I was basically a n00b.
My job has become easier, in relation to the creation of a site once it has been designed, CSS is my favourite language, I’m definitely more of a front end guy. So, what’s made it easier, you ask.
CSS Grid.
CSS Grid is awesome, I doubt you’ll find a site I’ve worked on in the last 2 years that doesn’t utilise CSS Grid. I used to build layouts using floats and clearfixes, stupidly hard work and long-winded processes, now I type in display: grid; and magic happens. Literal, magic.
An awesome CSS grid example is here:
See the Pen It’s a Feature, not a Bug – CSS Grid Demo by Stacy (@stacy) on CodePen.
jQuery and Bootstrap
So, I’m not a fan of jQuery, I don’t like how cumbersome it is and imposing on your site, how a whole library is loaded and never fully utilised, I have the same feelings about bootstrap. However, starting back in to Web design these two tools made life much, much easier! I’m glad I no longer have the same level of reliance on them which I once did, but they made my journey back into web a little easier.
Display: none
A bit of a joke/tongue in cheek one this but yeah display: none is my best friend. I have a cool sticker on my small Macbook that’s like a tarot card saying: “Sleight of hand – Display: none”.
There’s been times when I haven’t understood how something has got there, working from a theme or a backend language I have no clue about and for me to make the site look how it should simply applying – display: none, has made that nasty element disappear (sort of).
I’m not advocating the use of Display: none but it definitely got me out of some hairy situations back when I was the only designer, developer, marketer etc at my old company.
The demise of Internet explorer
I’ve dealt with some nasty browsers in my relationship with the internet from Netscape Navigator to AOL Explorer and more recently Internet explorer. Thankfully nobody, at all, uses the first two browsers any more but IE still gets a sniff now and then, causing all sorts of issues for developers working in the 21st century. Microsoft’s own security chief has now stated that Internet Explorer should not be used anymore: https://www.telegraph.co.uk/technology/2019/02/08/stop-using-internet-explorer-warns-microsofts-security-chief/
The sooner everybody heeds this advice, the better. The title here is again, somewhat tongue in cheek, the demise of IE hasn’t made my job any easier but the introduction and improvement of modern browsers such as Chrome, Edge and Firefox (technically not that new..) has set the standard of browser higher and as a result a lot of modern/better CSS standards were picked up along the way.
With that, here’s a cheeky segue to things I am looking forward to in CSS, to make my job even easier…
Subgrid
So, like I said, Grid is amazing. However at the moment you cannot ‘subgrid’ (grid within the grid) but not for long. Subgrid is currently only available in Firefox nightly to allow for testing but eventually subgrid will be rolled out across the modern browsers, meaning even more possibilities when it comes to layouts without including hacky code.
Native Lazy Loading
So an excitable tweet got sent around the senior team at C&C this week when Carl stumbled upon this tweet
Lazy loading is something we’re big on at Code and Create. Both myself and Mark, our senior dev, have spoken about the expense of the internet, the effect I has one the environment etc. Lazy loading of images is one of the ways in which less processing power can be used by a website, only serving images when needed by the user.
The thought that this could be native, removing the need for additional code, is too exciting!
Bonus Section
Useful Resources:
Favourite Podcats:
Work in design/dev? What’s made your life easier when it comes to work? Tweet us at @codeandcreate or throw us a email on info@codeandcreate.co.uk