Author: Adam

Black Friday: Is Your Website Ready?

Black Friday: Is Your Website Ready?

Black Friday sales have become a huge success globally and slowly seeped over the waters from the USA around four to five years ago.

So what is a Black Friday sale? This event is the day after Thanksgiving in the US and highly regarded as the floodgates to the Christmas shopping season. With the influx in technology and ever increasing for consumers to demand low prices, these types of sales are bigger than ever and appear both online and offline.

In the UK we have adopted this tradition of Black Friday as a way to buy goods at a reduced cost or as a merchant, to make as much profit prior to the Christmas period and typical quieter January after all the expense of December.

In this article, we are going to look a little deeper as to how you can make your website Black Friday ready for the internet as well as ensuring your website is ready for Cyber Monday and the rest of the festive period.

Is your hosting suitable?

Black Friday sales typically cause a frenzy of buyers to come to your website with one aim of grabbing a bargain as well as getting that perfect gift for a loved one. However, before you get carried away with offering rock bottom low prices you need to ask yourself one question, can your website handle the extra volume of visitors?

If your website is not suitable for high volumes of traffic you may need to look into having discussions with your hosting partners to figure out how you can get your website ready for the festive period. If you are paying a nominal fee for your hosting and expects this to handle 20-30% more traffic you may find yourself in a sticky situation where the website will crash whilst the visitors are browsing or at the checkout stages of your website causing a huge headache. Being prepare for the whole of the festive period and upgrading your hosting could be vital preparations and most reputable hosting companies will advise you based on your current amount of users what to expect during the Black Friday sales.

If you have the time to prepare for the festive period or know roughly how many users you would expect to your black Friday event, you can look into speaking with your hosting company to run some load/stress tests on your hosting platform. These load tests are designed to simulate real-life situations on servers to see how many users it can hold. By doing this you will alleviate the stress of a frantic sale and the website having downtime.

Other tools can also help get your website up and running if the worst case scenario is your website goes down. If your website does fall over tools such as StatusCake will tell you if you have any downtime on the server. This means you do not have to wait for floods of complaints to come in or to keep refreshing to see if it has. This will email you and alert you if you have any issues.

Is your website prepared?

Once you have sorted the hardware and hosting provider for your website, you need to make sure is your website ready? You may have all the best hardware and hosting solutions in place but is your website the main issue? If your website performance or security is a problem this may cause you to have downtime during the Christmas period.

Website Performance

Having a suitable host provider is great preparations for a successful Black Friday event, however, if your website is poorly coded or has not been speed optimised this can have a huge impact on how site visitors use your website. Performance is key as shoppers will want to buy items quickly in fear of losing out on a particular purchase. If your website sluggish this will instantly annoy people, causing them to go elsewhere, potentially a competitor. Using speed tools such as GT Metrix or Pagespeed will give your web designer a good indication of what things they need to do to improve the load time of the website as well as improve the overall score.

Website Design & Usability

Most website visitors nowadays look to do most of their Christmas shopping or find that perfect Black Friday deal on their mobile phone to and from work or on the school run. As we gravitate towards being hooked up to the internet most of the day people expect the website to work correctly whatever device they are using. If your website isn’t a bespoke purchase the likelihood is, the website may have some poor design choices for mobile and tablet users. For a successful festive period, you need to make sure you are getting this right so that you do not exclude any potential customer from being to use your website in any form. If you have a website design agency such as Mosaic Digital Media we build all of our website with a mobile-first approach ensuring that no matter what device your eCommerce website is viewed on, your customer will have a good experience all-round.

Marketing & Design

Now you have all the hardware ready for your website, you now need to market your Black Friday and festive events. If you have a good following on social media platforms this will be a good place to start with generating additional attraction to your black Friday sales. An additional advantage on your website is to make sure all of your Black Friday deals are clear and visible once traffic does come through to your website.

I would also suggest looking at getting some good artwork generated to promote your event. Festive artwork and sale banners will help drive traffic to your website. Also whilst on your website create a call to action banners where if a site visitor clicks on a banner, it takes them through to all of the deals available.

Summary

In summary, Black Friday is the great kick-off event for the festive period. Utilising this to your advantage will help the sales of towards the end of the year and will always help your business in more difficult months where typically you see a decrease in sales.

If you want to find out more on how we can help your business contact us today.

What is a Branding Kit?

What is a Branding Kit? | Graphic Design | Mosaic Digital Media Ltd

In today’s day and age, image and how we are perceived is becoming the forefront for most people. With the introduction and increasing growth of social media platforms such as Instagram and SnapChat, the world is becoming more and more focused on appearance. Even though in the past what we wore, ate, drank or did was important to friends and family, with these powerhouses of social media becoming an everyday need to use. Instagram is all about showing people a sneak peek into your everyday life and many people are becoming in there own right a brand.

Before we delve deeper into the understanding of what a brand identity and what a branding kit is, we need to first understand what branding is.

 

What Is Branding?

Branding is something that is memorable to the person looking to buy a particular product. If you were to buy a mobile phone most people would say buy an Apple iPhone or a Samsung device. If you were to buy trainers, Adidas or Nike would sure be at the top of your list. Brand awareness and exposure are critical to a business’s success. For you as a business being able to see the general public identify your business against a product or service shows the great success of this.

 

This is why branding is first and foremost important but also gives identity to your business.

With any small business, their image is important to improve your revenue and for people to remember your business. A catchy name and a Yellow Pages advert used to be all a business needed to get leads or work flowing in but this kind of marketing does not work as well anymore. Consumers are looking for professionalism on all fronts to invest their money and time into a product or service.

 

Below are seven different steps you can take to improve your brand identity and utilise a branding kit.

 

Brand Identity

Even though the idea of building a branding kit is to coincide with the overall brand identity, you first of all need to look at what you want your brand’s image to be.

 

Who are our businesses target audience

Helps identify how your brand’s image is perceived. If you a young App development agency you would be appealing to a younger demographic whereas a catering company for the elderly will need to cater to this target audience. It is important to find this as your brands use of language across emails, website, letters, leaflets, vans, etc will need to reflect this narrative and audience selection.

 

Consistency is king

Most businesses start off with good intentions and develop a branding kit which will allow them to build different marketing strategies but over time due to many different factors, the branding toolkit can forget about. By misusing the branding kit or using the incorrect logos, colour or fonts you could come across to your client as sloppy and unprofessional.

By keeping the consistency optimal your brands image across all different mediums such as your website and social media platforms will come across well to potential prospects and turn them into clients.

 

Keep it simple

This has to one of my golden rules for brand kits and business identities. If you take some of the biggest brands such as Apple, their whole is based on simplicity. Lots of small to large companies invest lots of man-hours and cost to create brands that are overcomplicated and fussy causing them to miss the mark with potential clients. If you keep your brand message, look and persona clean and simple this will portray your brand’s identity well across all of your branding toolkits.

 

Develop a branding strategy

Lots of businesses jump at the chance to improve their image by throwing themselves directly into a rebrand or chance their branding kit without a second thought. This can prove to a be a costly mistake as with anything you need to prepare and plan your strategy for a branding toolkit.

 

Research different media and brands

You may feel that looking up your businesses competitor is like cheating but all research is important. By investing time in looking at what your competitor is doing is a worthy step to better your branding success going forward.

Other avenues to take in developing a successful branding kit is to make sure you look at different media outlets such blogs to ensure your branding is bang on trend rather than several years too late and instantly looking outdated to your potential prospective clients.

 

Brands Always evolve

If you feel like a business you have navigated your way through the whole branding maze successfully and have a brand toolkit that demonstrates your business in a nutshell, this is great news. However, this is something that needs to evolve as time passes. Brands in today’s market cannot remain static as the image of your brand can be seen as ‘stale’ as more time passes. If you take Nike there marketing and branding are always evolving and taking a new direction and keeping up to date with current trends. As a small business owner, you will need to make sure your brand and branding kits also do the same.

 

Invest In a Digital Agency With Graphic Designer

My final point to wrap this up is if you are unsure on anything always invest in a digital agency such as Mosaic Digital Media Ltd as we have some of the top talents in the NorthWest who can help your business develop a branding kit to shout about.

How long does it take to design and build a website?

How long does it take to design and build a website? | Mosaic Digital Media Ltd

[markdown]



I have been working in the digital industry for around ten years or so and find that one of the biggest and most difficult questions we as designers and digital agencies face is, “how long does a website take to build?”. In the last ten years, lots of clients I have worked with feel that building a website is a simple process and shouldn’t take the estimated timeframe we give for the milestones or completion of a project. This is something I would like to call the magic wand effect. The reason I call it the magic wand effect is that like a magician, some people believe like waving a magic wand, a website is built in next to no time. As people become more aware of the digital age, designers get a better appreciation on why a website build will take longer than expected.

There are many reasons why a website project may take longer than expected. In this blog, I will be going into detail about the lifecycle of a website build and how different factors can determine how long a website will take to be live on the internet.

## Website Design and Build Misunderstanding

One of the biggest misunderstandings for delivering a website is that one person is solely responsible from the first contact to the website going live. This may be the case for a freelancer or very new start-up but with an established business such as Mosaic Digital Media, we have a team of people who have the best skill sets to do particular tasks. Instantly your first thought would be that sounds expensive, but this is not the case.

A single person cannot guarantee to give you the same level of expertise across all the lifecycle of a website build. With a freelancer they are forced to take on all manner of tasks such as sales, marketing, design, build, SEO, customer support, hosting including technical, etc. A one-man band business may need to take more time in different areas of the website lifecycle to ensure you are looked after causing the price to inflate or the project to take much longer to deliver.

With having the right people looking after you in the different areas of a website design and build, you will find the cost of a project will be similar to a one-man band / freelancer or even cheaper. Not only can a website design / build be much cheaper but the overall factor of taking less time to complete is much easier when having a team able to handle the build with different section spread out evenly.

## Website Design and Build Lifecycle

It is difficult to provide an accurate estimate on how long a typical web design and build project will take, as every website has different requirements.

Below are several steps that we at Mosaic Digital Media like to take, with a brief understanding of each step of the work we do during the website design project to ensure it is done in a timely manner and on budget.





### Initial Meeting and website discussion

No website design can take place without an initial conversation about the requirements of the build. This normally starts with the business owner approaching a digital agency to discuss the requirements for the website build. They could provide a specification of what is required or this could be built up during the opening discussion. Using this specification allows us to research the project and build an accurate proposal for the website build.

This initial discussion and spec form the initial backbone of the whole website design and build. Without this, the project would be non-existent and as website designers, we always refer back to these initial conversations, documents and meetings for inspiration or understanding of the project.

### Research

Once the initial discussions have taken place regarding the website design and the scope of the project the next step is to research the project. For any web design project, the aim of the research is to scope out whether the build of the project is feasible first and foremost. Next, we need to establish can the project be achieved within the clients budget and within their expected deadlines.

This is a pinnacle point as the website design and build may not be deemed feasible if the client expects the build to be completed in too short of a timescale or the budget is far too low.

If at this stage all is agreed on how the website is to be built, the budget is sufficient and the expected timescales are realistic, a full proposal of the work can be conducted.

### Delivery of Website Proposal

The next stage is to feedback to the client exactly what work is going to be carried out, the timescales, and the cost of the intended website build. This document is usually a contractual agreement between the client and the digital agency agreeing to the work to be carried out.

Once the document has been signed and any relevant fee’s / deposits are exchanged the website can be put into the build process.

### Content Gathering

The next step is pretty critical to the build process. Without any artwork or content, the designer will not have any inspiration to proceed with the build. Normally the minimum requirement of content and artwork for the website design would be:

* Logo for your business
* Contact information for your business
* Colour schemes / branding guidelines
* Image library for use across the website
* Page content for each page on the website
* Example website designs and why you like them

These are just a small sample of some artwork that would help the designer build your website. Before any work can be carried out building design etc, we would require at least the majority of the above.

### Website Planning

This stage of the website design process usually coincides with the website design stage. During this stage, the website designer will review both the initial specification, the proposal and all artwork submitted by the client.






### Website Design

The next stage is where a designer initially starts the website build. At this stage in the website design process, the designer will take all the information and begin the process of creating wireframes and mockups for different pages in the website build.

Once the website has been designed these will be sent to the client to review. This will be the first opportunity for the client to see how the website build will look. They will be able to submit changes to the design and once happy this can then be approved ready for the coding of the website to begin.

### Website Build

Once any designs for a website have been approved these will be handed over to a frontend developer who will take the flat designs and turn them into a fully functioning website. The designer will generally work with the developers to ensure the project stays on budget and within the timescales.

### Testing

At Mosaic we normally use an agile methodology to build the website meaning once on page or section has been completed it can be tested internally before passing this over to the client for testing. Between developers and the client, a full test of the website is performed; checking the functionality of the site, and making sure the website meets the requirements initially set out for the website design and build.

Once the testing phase has been completed and both the digital agency and client are happy the website is then able to be set live.

### Website Go live

This is the final stage for all website builds but does not mean the website is fully finished and never to be touched again. Normally once the website build is completed there will be minor snagging to be completed once the client has been using the website for a couple of weeks. These snagging pieces are usually minor spelling or grammatical errors, or minor bugs not found during testing.

Once the website has been live for some time the client may request new features, additional website content or minor image changes in the website.





## What affects the delivery time of a Website Design and Build?

A typical website design and build on the surface can take anything from one week all the way through to six months or maybe even longer. The initial indication of how long a website design and build should take would be decided on the two factors previously mentioned; when the client expects the website to be delivered and realistically when a digital agency can deliver the completed project by.

Some additional factors can also affect the delivery of the project however:

### Delays in build
During the website design and build stages, there are several points in which the ball is firmly in the court of the client and requiring them to action a task for the build of the website to proceed.

For example, during the content gathering stage, we ask for artwork to be supplied which can be a difficult process. Normally a client will find it difficult to envisage what content is required for the website design when they cannot see anything at this point. This process can take some time and can delay a project in getting started.

### Third Party involvement
Even though a lot of agencies such as Mosaic Digital media have an array of talented website designers, graphic designers, SEO specialists, customer support staff, and many other talented people, sometimes third-party involvement to complete a build may be required.

Some agencies may not a have a particular skill set in-house to do one small part of the website build and require this to be done third party or external. By doing this the website build could be put in jeopardy if the third party do not complete their part of the build.

### New focused urgency for completion
Sometimes the goalposts of any project can change after the initial proposal of the work and the schedule of the website build has been agreed.

This can sometimes happen if the website is required for an urgent marketing expo or event and would help them sell the product or service better. Ideally, any reputable design agency will try to revise the timescale based on the new requirements but sometimes this is not always a feasible task as other websites maybe planned in or other projects.

If a design agency is able to accommodate the change in circumstance a revised budget may occur to allow sufficient staff to complete the project without affecting the website design or build.

## Summary
In summary, a good digital agency is able to accommodate a website build within a reasonable timescale and fair budget. If your expectation is for a fully custom website with lots of different features a digital agency will be able to guide you well during the initial meetings and conversation on a rough average on how long a particular website design and build would take based on previously complete website projects.

The best course of action is to always be prepared and if you are requiring the website for a particular event or date make sure you give your potential web designers a good amount of time to complete the project to the best quality possible. It is also advisable before speaking to a digital agency to make sure you have a suitable budget for the project to ensure you get the best finish possible.

[/markdown]

6 Website Design Top Tips

6 Website Design Top Tips

When it comes to your website design there are several key factors and techniques which will help your website audience understand what your site is about. Many different businesses utilise their websites in several different ways including:

  • A website to sell digital or physical products
  • A research website for site visitors to find more information about their business
  • A contact reference website. A simple web design allowing for users to get contact information
  • A marketing tool

Some other types of businesses, generally long-standing established business do not see the value of having a website. A website is simply a 24 hours a day, 7 days a week window into your business, essentially a shopfront that never closes.

If you are small to medium size business and have a website but do not feel that it is giving you extra return on investment, you may need to evaluate and ask yourself the question, does my website meet the needs of my site visitors? In the rest of this article, we will try to answer this question by looking at the individual website design tips we are going to share.

Keep your target audience in mind

Many businesses look to create a piece of art when it comes to their website utilising some of the latest design techniques which are at the cutting edge of development. Some of these things include parallax, jQuery carousels, custom animations, etc. This is all well and good if your trying to create a state of the art website, but is this really what is needed? If you are a plumber the likelihood is your client will require an emergency service and will not have the time to appreciate all of the effort put in. Again this applies to other business sets such as driving schools. Most people looking to learn to drive will want to find an instructor with a decent car and a good price and will maybe find the website nice but in the sum of things, all the fancy gimmicks do not help with the ROI (return on investment).

If you are a web design agency looking to showcase how skilled you are then this would be a good idea to show your design flair.

The rule of thumb generally when building websites is to make sure the design is simple. This does not mean your website has to have a boring look and feel, but you can utilise imagery and colour to make a good website.

Consider your website usability

This then leads to my next point and coincides well with “website design with the target audience in mind”. When it comes to good web design usability is one of the key factors in making sure website visitors get a good experience when using your website. If your site visitors cannot use your website, they will most likely jump off your webpage and go to a competitors website.

You want to allow your clients freedom to explore your website easily with good navigation menus and click to action banners and buttons across different sections on your website. If a website visitors are able to navigate around your site with ease, this will increase their return rate, lower website bounce rate and overall lead to a conversion.

One technique, post website launch is to monitor the website with heat mapping to track how website visitors use the website. This way you can make you get the most out of your website.

Website consistency

One of the biggest issues I find when using websites across the internet is there are lots of inconsistencies on different businesses websites. The biggest negative on a website is confusing your site visitors by inconsistencies which will lead them to move away and find a website that will appeal and be much easier to use.

Different elements of consistency in your webpage are important. You need to make sure your content is consistent throughout and clear to site users. Another key factor is to make sure the design and the branding are clear and not different across the different pages of your website. This way clients will feel the security that they are still on your webpage.

Be Mobile and Tablet Website Friendly

The whole internet has changed dramatically over the last 4-5 years with a demand on the mobile-friendly website being at its highest. Mobile websites and responsive are seen a minimum requirement nowadays with Google preferring a single code base website.

More and more of us are using mobile devices to access websites on the go whether it’s on a train during the daily commute or in the evening whilst watching TV. As the way, we use websites has evolved business need to evolve to make sure the site visitors again have the best usability when using the website and in particular on any device type.

As you can see from this website the percentage of web pages served to mobile phones from 2009 to 2018 has dramatically increased: https://www.statista.com/statistics/241462/global-mobile-phone-website-traffic-share/

Most reputable website designers including Mosaic Digital Media Ltd always consider building websites to be responsive no matter how big or small the project is.

Website Content Is King

One of the biggest factors of your website will increase the conversion rate or make website visitors want to pick up the phone to you is genuine content. If a website is able to buy into your business it will be the approach to your content. Content is also a huge factor in gaining natural Google positioning as Google likes genuine content that does not look like it has been manufactured and manipulated to just gain positioning.

If you can strike the balance between good content that isn’t too long but yet is informative enough you will find more and more visitors to your website will enjoy the experience and pick up the phone or fill out a contact form on your webpage.

Use The Right Images For Your Website

Time and time again I will see hundreds and hundreds of websites using poorly shot camera pictures to display their products or services. I also see lots of website designs using far too much stock imagery across the website making them look fake or genuine.

Good website design requires a good balance of carefully picked stock imagery for backgrounds and hero sections and good photography of your products and services. I would always recommend what sells best is to make sure your website design uses around 70% of your images to 30% stock images. If you need too I would recommend getting a photographer or amateur/college photographer to come and takes some pictures rather than using blurry images from an old smartphone.

By using this balance we can make sure you come across genuine to your website visitors.

Overall website design isn’t too hard to do, you just need to keep everything simple and make sure you come across genuine to all of your site visitors. By striking a good balance between well-written content and good use of imagery you are on a good path to ensuring you get the best return on investment.

Why is Design Important?

Why is Design Important?

Within the last five or so years we have seen a huge focus set on the design of one’s websites in the business arena to attract new opportunities. I like to call this the Apple effect. Apple started to create beautiful devices and computers and this millennial generation value looks and feel of a design far more in choosing to purchase a product or use a particular brand than with previous generations. Other brands such as Nike, Adidas, Coca-Cola, etc have followed suit with popular design trends to offer products that not only look incredible, taste great, feel great but offer a demand and necessity to have a particular product or use a particular service of theirs.

Moving away from big corporate industries and how they use designs of products to increase revenue. Most small to medium size businesses are seeing how these big powers have such influence and utilising some of these design techniques into their online and offline marketing to increase their businesses revenue stream.

One important factor is that if you have an office you try to keep things tidy and look good for you clients visiting. In designing a website this is just as important as this is a 24/7 storefront for your business. We as consumers still look for that professional feel across all mediums whether we are visiting you in person, seeing the designs of your business cards or leaflets and your website.

So what is Design?

Design is a service that is offered usually by graphic designers or product designers. Design is a service that allows you to see how a website, business card, leaflet, vehicle decals, clothing, products, etc is to look prior to the finished online or offline product is made.

Have designs or mock-ups created prior to the main build will allow you to see how it will look. This can help reduce cost as design is normally a digital service which can easily be altered. For example, if you pay for your logo to be put on your new workwear but when you receive the finished garments the logo looks poor quality, this costly mistake could have been picked up at the design stage.

In terms of web design, this is just as important. Getting a graphic designer to create you a full mockup prior to building a fully functioning website will help you minimize costs, help you get a website that will appeal to your site visitors and let you have greater design/brand influence.

Design Tools

When you are looking for a reputable designer most will use a similar array of design tools within the build of designs. Most designers I have worked with over the last ten years will hold extensive knowledge of Adobe Illustrator, Adobe Photoshop, Adobe InDesign and Adobe XD. As you can see from the tools above all of these tools are Adobe packages. The reason for this is that Adobe tools have become the mainstream tools for designers and each program offer different abilities to design. Adobe does offer around twenty or so other products which have their own benefits but for a web designer, these are the best tools to build web design mock-ups.

If I was going to approach designing a website I would use Adobe Photoshop to build the full design. Photoshop is what I call a bread a butter of a web designers toolkit, this is the builder’s spirit level or tape measure. On a day to day basis, I will use Photoshop for around 5 hours per day building website designs.

Adobe XD is slowly becoming a strong replacement for rapid prototyping of web designs and is geared more around website mock-ups but for me, Photoshop will be around for some years before we switch to XD fully for designing interfaces of web platforms.

Illustrator again is another great tool of the design world but as this is a very heavy program I feel the biggest benefit this has to design is to create brandings such as logo’s, style tiles and vector-based objects.

One of the biggest drawbacks to using the Adobe cloud base suite of programs as a designer is that it can be costly to purchase. I strongly believe these costs are outweighed by the benefits of each program use and ability to give you a unique design.

If cost is an issue then you may want to look at some of the other design programs on the market:

  • QuarkXPress
  • Sketch
  • Pixlr
  • Coral Photo-Paint

If you are using reputable designer these will usually have the best tools of design trade ready to help you will all aspects of your website building.

Branding

Branding is the biggest key element to having a design made for your business website. Branding is usually what sets you apart from your business competitors and helps users of your product or service remember you.

Any good web designer such as Mosaic Digital Media Ltd will be able to take key components such as your logo, fonts, colours, images, etc and build you a bespoke design that incorporates all aspects of branding and highlights these to the best of their ability across your website. By increasing brand awareness, site visitors will remember your design and will grow a confidence in you from the start as your impression is great.

User Experience (UX)

Design isn’t just the key part of a designers job to build you a website. User experience is just vital in letting a site visitor make their mind up on if you are the right business for them.

So what is UX?

User experience goes hand with design and is a cornerstone of any good website design. When a site visitor lands on your website you want to make them get to where they want to go with as little ease as possible. For example, if you have an eCommerce website your goal is to get a site visitor from your homepage to the products, next to the basket and finally onto the full checkout process. Any good web designer will be able to map out user journeys such as this to give a site user the best experience when using your website.

This is why it is very important to make sure the design of your website looks great but also isn’t too over the top to where site visitors have such difficulty using the website they jump away.

At Mosaic, we look to make sure design and user experience are considered with just as much weight as each other when building website designs.

What is Liquid Template Language – An Introduction

What is Liquid Template Language - An Introduction

To really understand what liquid template language is, you need to delve into the world of eCommerce and take a good look at Shopify. If you are a new user of the Shopify eCommerce system, you wouldn’t know instantly what code sits behind all of the pretty interfaces and easy to build product options. But as a web designer or developer, you may wish to find out more about what goes on under the hood of Shopify.

Many developers make the mistake of believing that Shopify uses some elements of PHP in its main code base, similar to how most other eCommerce platforms do, some include WooCommerce, Magento, OpenCart and PrestaShop. Unlike these other eCommerce platforms, Shopify has its own purpose-built templating language called Liquid it uses for themes for your online store.

Is Liquid a language or engine?

Some developers call Liquid a type of templating language, whereas, other people believe that it is an engine for Shopify themes. In simple terms, this is just a label and both terms in their own right are correct. I prefer the term “language” as with other traditional coding languages such as PHP, HTML and jQuery, these have syntax with a common output, IF statements and loops. Even with these similarities to other coding languages, this is where the common factors end. Shopify’s Liquid Templating Language is intuitive and has so many benefits over conventional coding practices.

Liquid Files

Once you’ve managed to get under the hood of Shopify and start to look at the actual theme development aspect of the eCommerce platform where do you find these liquid files? Like HTML and PHP, the files will always end in the language extension. See below:

  • afilename.php
  • afilename.html
  • afilename.js

This is no different with liquid template files as these end in .liquid, for example, “afilename.liquid”. This is the easiest way to establish what code you will find inside the actual file.

Once you have opened a .liquid file you will find some code you will be familiar with, HTML. Liquid templating language is a mixture of normal HTML code and also liquid constructs. You can easily distinguish the liquid tags from HTML code as these will follow one of the following patterns:

  • The double curly brace delimiters {{ }} denote some output
  • The curly brace and percentage delimiters {% %} denote logic

For an established designer or developer with some past experience should be able to read this code easily without any extensive training.

How Does Liquid Work with Shopify?

Shopify eCommerce platform will decide which templates are to be shown to the frontend user of the website. For example, if the URL is http://myshop.myshopify.com/collections/tshirts Shopify will render the collections.liquid template.

Once Shopify understands which template to show to site user, the template will be parsed to look for Liquid placeholder tags. These placeholders are replaced with relevant data from your stored database. It does take some time to understand the connection between Shopify and how the templates work but once you get the hang of this, it will be much easier to work with.

What Are Placeholders?

Placeholder is the simplest form is a piece of code that will be changed when the template is sent to the browser to parse. The information sent to the browser will usually be some logic as discussed earlier using tags like {% %} or output using tags such as {{ }}.

[markdown]
“`html

{{ product.title }}

“`
[/markdown]

As you can see from the above example, this is a mixture of HTML tags (Heading 2) and .liquid code {{ product.liquid }}. This is using the simple output tags from Shopify’s coding language and when passed to the browser will change the Liquid into information pulled from the database. In the example below I have left the heading 2’s in:

[markdown]
“`html

My New Online Store

“`
[/markdown]

Unless you use a filter on the Liquid tag this will print exactly what is stored in that field in the database. Filters will allow you to adapt further.

Logic Tags

As with other languages, Shopify’s Liquid Templating Language allows you to apply some logic. Please see the example below:

[markdown]
“`html
{% if product.available %}
This product is available
{% else %}
Sorry, this product is sold out
{% endif %}
“`
[/markdown]

The logic example above is an IF Statement. By using Liquid logic we can determine the output that is rendered based on whether things such as product stock level is equal to in stock. Liquid code goes one step further and as well as IF, ELSE and END IF logic parameters, Liquid allows you to use boolean logic such as true or false.

Summary

Liquid, in a nutshell, is a very powerful offering brought to the table by Shopify’s ever-growing eCommerce store system. Liquid has so many benefits and advantages over its nearest rivals in terms of usability and adaptability. For any new web designer or developer with some HTML experience should be able to get off the ground quickly with Shopify theme development.

Website Design Trends For 2018

Website Design Trends For 2018

Website Design – What have we seen so far?

We are currently five months into 2018 and new and interesting website design techniques are slowly coming to the forefront. Business owners are having to find unique and bold ways to change the way their websites and website content works for any potential visitor to the website looking for a service or product.

Designers and website developers cannot rely anymore on plain content and imagery to bring new website visitors or keep the interest of current site visitors. During 2017 we saw a rise in simpler website design but with accents of striking colours. Website designers are becoming braver and bolder with website design choices.

As we are four months into the year any interesting and upcoming design traits from some of the leading companies and brands should be seeping through with smaller website owners/designers taking note of the new and exciting movements to keep users of the website keep coming back for more.

We take a look at some of these website design techniques below:

Animation and Video

Animation and video techniques in web design have been around for some years, however, site visitors are ever growing an increased thirst to see websites they visit using videos or animation. Whether you are small business owner such as a mechanic, interacting with your website audience to show them how to conduct simple vehicle maintenance such as changing a headlight bulb, will engage visitors and increase the potential for them to return to the website in the future.

A video does not require high-end camera equipment but a friendly face in-front to engage. If this is not suitable for your business your website could benefit from a day to day of your office or working environment to offer website users a rich and engaging experience on your website. Speaking from a designers perspective, we love to work with website video content and believe it has such good qualities to the conversion rate of a website as well as being a little bit different to a standard website.

Adventurous colours

Since 2017 adventurous colour palettes being used by designers in website designs and branding has hit the forefront with big names such as the Premier League (https://www.premierleague.com) making a big statement on their branding colour choice across all marketing and website medium. In 2018 lots of website designers are still holding onto the trend with the build of small to large website designs. Bold and beautiful colours excite site visitors and make someone keep coming back. This doesn’t mean that website must be a rainbow of colours but strong accents of colouring against plenty of white space create a strong vibrant interesting impact on websites design.

Website Typography

Typography in a website design is key. Poor choice of font will easily make it harder for a website visitor to read and the potential for them to go to a competitors website is far greater.

Website designers love to use different and interesting typography choices throughout a website to give definition to an important message within that part of the site.

Mobile and tablet resolutions are getting far more detailed, amping up the readability factor, is additionally opening the entryway for an ascent in custom text styles. Website designers are choosing typography with huge amounts of identity for accentuation, as well as for tasteful impact. The greater part of this, is managed by larger than average typefaces, demonstrates that 2018 won’t all be about boring typefaces within web design, and we can hope to see strong patterns keep on developing.

Illustration, Patterns and Textures

With a strong use of colouring in designing a website, illustrations are providing an alternative design inspiration for web designers and graphic designers to express a brands identity on their website whilst engaging the site visitors.

Take for example MailChimp, https://mailchimp.com, they recently rebranding the entirety of their website using bold and adventurous illustrations into their web design. As well as the illustrations they have working in some very clever colours, patterns and textures in their design, giving a website using an interesting website to spending time looking at.

We saw this trend for web design during 2017, but this is still going strong during 2018. The trend is about being whimsical offering intrigue but all a way to display information on the website in a manner that breathes life into ordinary or dry content.

Asymmetric layouts

Websites generally have conformed to certain layout constraints over the many years of the evolution of the internet. Small business owners feedback is true in essence that their website can feel a little too boxy in-places. Again speaking from a designer some small businesses owners like to play it too safe with there website and wanting it too much like a competitor out of the box, standard package website.

This can frustrate web designers who want to push the boundaries of website design to the limit.

We slowly see this become a stronger notion of more and more website becoming Asymmetric and the look and feel becoming more stand out. With the use of video, strong typography and colour a designer can really push the boundary of conventional website design to the next step.

I hope this trend of Asymmetric layouts continues to grow as I believe website design is becoming much more creative.

Summary

I believe website design has become a triumph over the last year and 2018 is lining up to be a success for web designers and graphic designers alike using new ways to engage website visitors.

I believe that Asymmetric layouts within web design is going to be the biggest influence on today’s designers but feel adventurous colours and illustrations will become a supporting actor in making the website stand out. Video and animation will always have a place in website builds but feel the shine this year goes to layout choice and colouring.