Managing Web Communications Blog

[teambunt2]

Pixel Density, Demystified

How pixel density works and how it affects your designs.

Learning about your pixel density or ratio 🤓

Whilst developing my first bigger website as part of my last web authoring assignment, since it is essential for a good site to be responsive to multiple devices this also impact your images - thinking about the user on a budget cell phone on a slow internet connection vs the Silicone Valley hipster on their iPad pro has very different requirements... i.e. if you’ve paid thousands on the best screen then you want a quality image however if you are the other end of the scale, you shouldn’t have to wait to load a massive image file which you can’t even view!

This article was super useful to better understand how to adjust my approach to ensure that each of these different user types have an equally good (and appropriate) on my web sites.

Fascinating stuff!

[teambunt2]

Wire Frame Time...

So as part of my current Web Authoring assignment I’ve been creating my first wireframe and researching the process which has been fascinating!

I’m actually really benefiting from going old school and the analogue process of planning each pages format, dimensions and how everything is going to fit before going digital is surprisingly helpful!

Some key learning from my practice and research:

1. Always go for a mobile first design... Duh!!!

2. Wireframes don’t usually contain colour as we and need to stay focused on the arrangement and relationship between the various elements. 

3. Its evolutional (is that a word?)... Wire-framing is not an exact science (perhaps don’t tell my lecturer that!) and many times you will need to go through several revisions, especially if you have a client to please. It feels like the addition of notes is also super important as I left my V1 for a week and couldn’t understand my logic for a couple of elements!

[teambunt2]

The People Management Platform

Find out why Lattice is trusted by the best places to work.

No code website design ✍️

Have a look at this beautiful website - Great job by a talented web designer through hours of coding HTML, CSS and JS right? Nope. This was created with ZERO code… eeeek! No code web design may sound jarring, but it doesn’t mean the complete end of coding a website. Rather, it democratises the building of the web to persons of all backgrounds instead of leaving it up to the few who have a deep understanding or experience with complex coding and website design. Lattice.com is a brand that built its website with no code, and as you can see above, its website feels and looks no different than a coded one. I’m not sure how I feel about this: I love that web design is becoming more accessible but does this put the worth of coders at jeopardy???

[teambunt2]

Five biggest website development trends transforming 2021

Demand for web development services continues to rise into the new year

How to code in 2021... 😎

A few student on my course shared this article the other day which was super insightful. It summarises 5 of the highest impacting influences set to dominate our online experiences this year.

Of notable mention, and linking to my most recent assignment, CMS (Content Management System) is completely revolutionizing the web development industry due to its simplicity (its literally now as simple as drag and drop!) which makes website design so much more accessible to the masses. On balance, I wonder whether this will change market demands much and mean that web developers are no longer as valuable as its easier for any Joe Bloggs to make effective websites (using some beautiful wordpress themes).

For me this also links to LMS (Learning Management Systems) as I am currently building a Knowledge Base in work and I am delighted to be able to utilise some of my new HTML skills to really ramp it up and it now has gone from a plain jane confluence page to SHHHEEEEXXXYYYY... this course is really starting to pay off! #excited 

[teambunt2]

Who knew... the legion to WordPress themes 😲

Let’s talk WordPress. I’m currently building out my first WordPress site (pleasantly surprised and relieved how much of a user friendly process it is and looking forwards to really getting stuck into it and learning how to be a better developer).

One critical element of setting up your WordPress site is selecting a theme - and wow, aren’t there a lot... in fact, there are currently 8,019 listed in the library! Interestingly I’ve learnt that the older approach was a certain range of themes for your specific use case (such as portfolios, blogs or academics) but now people have got real clever and made themes which are totally flexible to any choice.

My issue has been to select an appropriate theme for my use case and it’s taken a fair amount of research and experimentation.

I’m currently enjoying the ‘Astra’ theme as it has an accompanying plugin called ‘Starter Templates’ which means you can literally have a world class template to build on in minutes which I would have previously expected to have to pay mucho dollar on!

Below is an image of a few of these ‘starter templates’. I’m currently playing with the ‘Mountain’ theme which looks so bloody professional and includes everything from interactive maps to elegant visual placement, menus and a nice contact form and whilst some will cost you, many great ones are totally free... bravo people!

So - what’s your go to theme?

[teambunt2]

Customers expectations have changed: how can your CMS keep up?

Digital-first experiences have been the future for a while, but add a global pandemic into the mix and digital-first experiences become the present. Relevant story-telling, agile communication, and a standout customer experience is the need of the hour. The new world is customer-centric.

Security becomes ever important since the pandemic 🔒

Here is a super interesting read which was shared by one of my college peers. There has been an uplift in in the focus of digital security and in particular there is a higher demand for advanced, more secure web sites for consumers due to influx of people relying on the online marketplace due to COVID-19 restrictions.

The question - can the industry keep up with market demands? The digital customer experience is only as good as your CMS.

[teambunt2]

Study Finds Bad Web Design is Killing Us All With Stress

A design company created test sites full of super-annoying issues, such as slow load times, auto-play music, and pop-ups, then measured how much each increased people's blood pressure.

Sharing an interesting article that I read this morning about a study which looked into the worst web design features which caused the most user stress (labelled as "Web Torture").

The highest impacting web design pitfalls which caused the most user anxiety were:

Slow load times (or photos not loading at all - perhaps due to file sizes being too big)

Excessive ads/ popups (prioritising revenue generation over user experience)

Auto-playing music/ content.

Interestingly, broken links and button were not as high impacting as I would have thought and only considered to be middling annoyances in comparison.

[teambunt2]

How to Track and Analyze Web Vitals to Improve SEO

Good news - we now have a brand new set of standards by which to judge our search engine's worthiness! ? If you're like me, you may not have been jumping for joy when you read Google's announcement of its upcoming search algorithm change. But after taking some time to breathe,

Optimising for the mystical GoogleBot 🤖

We were recently introduced to the method in which Google scans the web in order to inform its search engine results. “Googlebot” is the generic name for Google's web crawler (constantly searching the web for new pages and then adding them to its list of known pages into a central registry).

TLDR: Google has increased their transparency recently on this process which means that we now have a more concrete set of guidelines to follow for ‘SEO’ professionals and web designers. If your goal is to achieve high ranking on Google's search engine, then it's a good idea to utilize certain tools that Google recommends like ‘Lighthouse’ and ‘Web Vitals’ which enables you to see how the GoogleBot sees your site.

[teambunt2]

Shout out to the amazing Traversy Media!

Major shout out to Traversy Media who has developed such an amazing catalogue of video training for many coding languages.

So far I have got through three videos which has taken me through the basics of HTML and CSS, grids and flex boxes - I am enjoying the easy to understand course content but I am getting the most value out of building sites in realtime with the instructor... this is certainly my way of learning and I am absorbing so much more after the great initial introduction from my Interactive Design Media lectures... my knowledge is growing and I’m starting to enjoy myself!

[teambunt2]

Anti-patterns You Should Avoid in Your Code

Every developer wants to write structured, simply planned, and nicely commented code. There are even a myriad of design patterns that give us clear rules to follow, and a framework to keep in mind. But we can still find anti-patterns in software that was written some time go, or was

So, Spaghetti (code) isn’t always a good thing? 🍝

Firstly, just to note that I love Spaghetti Bolognese, sprinkled with a dusting of parmesan - what an absolute dream.

Secondly, and closer to the point here, I found a super interesting article on FreeCodeCamp.Org today which was all about what not to do and the types of habits that a successful developer needs to get into.

From spaghetti code (code with little to zero structure... similar like my desktop) which was actually touched upon in my ‘Web Authoring’ module already to newer concepts which I have just learnt about such as the proliferation of code (apparently, extremely different to the much loved profiteroles, apparently) where the code has a ‘middle man’ type complex with objects in your code that only exist to invoke another more important object.

Right - time to develop some smart coding habits

[teambunt2]

Codecademy Forums

Community discussion forums for Codecademy.

Gratitude for collaboration learning 🤝

The past decade has revolutionised the learning environment and front end development certainly feels like it is leading the race!

It has been super easy to explore so many FREE learning resources across the web which has complemented the initial learning that I am digesting in my Interactive Digital Media course. I am particularly blown away at the interactive learning facility on most of the sites (I am truly an active learner who needs to be doing things to absorb new knowledge) but also the active forums - I have not yet seen an instance of a learning coder be refused valuable guidance from a pro... what a great community!

Some of my fav sites (so far) have been Codeacademy.com (active forum) and FreeCodeCamp.org (super easy to follow interactive learning modules).

[teambunt2]

5 Crazy Hacks Using Inspect Element

There are millions of websites on the internet today. And while they may have varying purposes, they’re all built with similar…

Inspection tool - learning by doing 🧐

In my last two ‘Web Authoring’ lectures, I had the opportunity to learn about the inspection tool which is a handy facility which allows me to look at (and edit!) the HTML for (any!) site available on the net.

For me, as an active learner, this is an excellent method for me to ‘inspect’ how any element of a website is made BUT also we were guided on how to change the formatting on a site live to experiment which different styles and properties - this will considerably help in my growth as a web developer!

Note that here is an article which I read this afternoon which supports with some additional techniques or ‘hacks’ on how to further exploit this nifty function.

[teambunt2]

Learn by doing 👨‍💻

My past web authoring lesson was all about creating tables, links and images in HTML5 which was a useful next step in my coding development. I always find the most useful element of the lectures within the lab sessions where we get to apply the learning through a case study and I am definitely an active learner - it is all about learning by doing for me!

Top tip from week though was all about organisation and the importance of directory structure - this is historically something that I am terrible at which is certainly reflected how my desktop currently appears. However, the value of a clear and organised folder structure then you know where everything is which is absolutely critical to when it comes to linking pages and inserting media to your site... this was realised within my lab session where another colleague was having issues with her code working - due to her lack of folder structure.

Secondary tip (which I am not fond of and will take some change in habit) will be the user of lower case... I BLOODY LOVE CAPS but HTML (despite its capitalised name) is apparently all about lower case and no use of spaces - time_for_change_for_me!

Lastly - here’s a cool screenshot of me making some solid progress on freecodecamp.com - what a great resource, this is my new gym where I am now mentally working out... whilst eating chocolate biscuits in lockdown as the actual gym is closed (please, no one tell my personal trainer)

[teambunt2]

Think accessibility from day 0 👀🧠🦻

The biggest thing I learnt from week of my web authoring module was about accessibility and I was impressed how this has now been legislated.

Accessibility is super important and supports social inclusion for people with disabilities - in fact access to such technology, including the Web, is now defined as a basic human right in the United Nations convention on the rights of disabled people!

To better understand the importance of accessibility with some really use initial tips on how to deliver accessible web sites and technology, I found this great online training by Google.

The core message? Ensure your project team are ALL trained on accessibility and be proactive rather reactive which can be achieved identifying the required accessibility requirements of every part of your product, understanding the critical user journeys in advance and evaluating your product using accessible user studies.