Why to use CSS selectors instead of adding styles inline

Why to use CSS selectors instead of adding styles inline


At this point I’m pretty happy with what we’ve
come up with. This is very close to the design. So now it’s time to capture all of the style
changes that we’ve made into our file. So far we’ve made these changes in the browser
but as soon as we refresh these changes will be gone. I’m going to jump back to our text editor.
Now earlier on in this series what we did to add styles was use the style property.
So we’d do style, equals and then quotes and we’d put our styles right in there, and we
can do that now, let’s give that a shot. I’m going to jump back to the browser and
what I’ll do here is highlight all of the styles. So notice I’m starting from where
this bracket begins and ending this selection before the ending bracket, and then I can
right-click and copy and then I’ll jump back to the editor and I’ll paste right inside
this style section, and I’ll save this. Now we can jump back to the browser and refresh,
and you see that all of our changes persist because we have it in the style tag inside
of our code right here. Now the style property is very useful but in general it’s not the
way that we want to apply styles in our HTML, for a couple of reasons. The first is the one that should be kind of
obvious here, which is that as we get longer styles it becomes harder and harder to tell
what our HTML structure is. We could remove all of the extra lines in order to make this
all one line but then it would be even harder to read, and if you imagine HTML elements
nested in other HTML elements this is going to start to get a bit unwieldy. But that’s not the biggest reason why we don’t
use the style tag. The biggest problem is when we want to reuse styles. So let’s say
we have three heading two tags and we can simulate that by copying this H2 tag and pasting
it in here a couple times, so now we have three of them. I’ll save this and we’ll go
to the browser and refresh. So you’ll see qualities three times. Okay, all is good so far, right? Well let’s
say now we want to change the letter spacing in all three of these. Because we’re just
a little bit short of what we want and we’d rather extend it out a little bit, what will
we need to do? Well we have to go back into our code and
we’re going to need to change it in three different places: so letter spacing here,
letter spacing here and letter spacing here. Now that doesn’t seem like a huge deal because
we only have three headings and they’re all right next to each other. But when we’re done with this template the
H2 tags are going to be distributed throughout a whole bunch of other HTML code, and it’s
going to be a surprising amount of work trying to find all of the headings that use this
style in order to modify it. So ultimately we’ll end up using something
called a selector in order to tell the browser which elements get certain styles, instead
of putting the styles in-line with the element. Let’s do that. So if you remember from before
when we were explaining why we use the HTML head-body structure inside of our document
part of it was that our head is useful for other things besides just the title, and one
of them is for putting styles in it. So what we’ll start with is a starting style
tag, and we’ll just go ahead and end that as well, so we don’t forget, and then within
the style tag we’re going to use a selector. I’ll go ahead and type out the selector now
and then explain what it means. Okay, so what we have here is H2 which you
should be familiar with by now, it’s our heading two tag, and so we’re saying with this selector
that we want to apply any styles that are inside of these curly brackets to H2 tags.
We could put any tag here if we wanted and we can do a lot more with selectors which
you’ll see shortly in this series. So now, instead of having our styles here,
let’s cut out these styles and we’ll paste it inside this selector. Notice how everything
gets indented properly – this is another benefit of using an IDE, instead of a plain text editor. And now that we have this we can remove the
style tag from all of our H2s. Okay, let’s save it and jump back to the browser and refresh,
and you’ll notice that nothing changed here. Down here, instead of all of the styles appearing
in element dot style, we’re seeing it inside of this selector, and we can demonstrate very
quickly how powerful it is to be using a selector instead. So let’s say we wanted to change the color
to blue. So I’m going to highlight the value and type in blue, and you can see that the
styles change across all of our headers at once. So hopefully you can see the power of switching
from using the style property to using the style tag and specifying selectors to apply
styles too. Now like I said we can do a lot more with selectors and we’ll need to in just
a few steps in order to get what we need. But for now this is pretty good.

How to use the text-align CSS property

How to use the text-align CSS property


The next thing we can tackle is alignment.
If we look at our mockup – zoom back out again here – our headings are centered on the page. So we’ve already seen how we can do this with
the text align property. So I’m going to go back to the browser and we’ll test it out
here just to give it a shot before we add it to our code permanently. So I’ll do text and it chooses align for me
in the auto complete, and we’ll do center. Okay, so that looks good. Eventually though
we’d find that this is a little bit off. If we reduce the browser size for example you
can see that there’s a little bit more space on the left-hand side than there is on the
right, and that’s because we added this text indent in order to align this with our design
clip up here. So we’ll also want to remove that. I’m going
to go back to our code and let’s add the new property here, text-align, center, and let’s
remove our text indent. We’ll save it, go back to the browser and refresh, excellent.

How to use compound CSS selectors and set a background color

How to use compound CSS selectors and set a background color


Okay, let’s implement this. So I’m going to
go back to our editor and scroll down to where we have our headings here, and I’m going to
add a section around each one of these headings. I’ll go ahead and do that and fast forward. Now that we have our sections it’s not going
to change anything about our output: I’ll jump to the browser here and go to our example
and refresh, and we don’t see any changes. That’s because we’re just adding these empty,
unstyled containers around our headers. So now we want to style this middle one. Now
the way we did that before was with a class. Let’s do that again. Now if you’re a veteran
of HTML and CSS and you’re watching this for review some of the things that we’re going
to be doing on our way to the ultimate solution are problematic in the long run. So if you see some things that raise red flags
just realize that we’re going to come back around and look at what we’re doing and talk
about the long term implications. But for now for the rest of you it’s important to
look at these simplest implementations because one, they can be useful, and two, you need
to see these before you can understand what might be wrong with them as our template gets
more complicated. So before what we did was we added a class
to our H2 tag. Let’s do the same thing for this section. Now we’re going to go through
a couple of options here: first of all, what would we name this class? Right now all that
we know about it is that it’s different. So let’s use a class called different, and then
we’ll adjust our styles so that they apply either to this H2 tag or to this section. So I’m going to add class equals different.
Now if we just left it like this the same classes that applied to this H2 would be applied
to this, which is that it would change the border bottom color, which isn’t a big deal
because this section doesn’t have a border yet. But that can become problematic later. But what we want to do is be more specific
with the selector so that it only applies to H2 tags that have the class different.
And the way we can do that is by stringing two selectors together. So I’m going to click
here and I’ll type H2 and then we’ll use dot different, and this is the way that we say
apply these classes only to H2 tags that have the class different. And now we can create a new style for this
section using the same format. So use section dot different and we’ll create an opening
and closing bracket, and then we’ll put our styles in here. Now the only thing we want
to change right now is the background color. Let’s go back to Photoshop and I’m going to
use a color picker to find out what this grey color is. So the hexadecimal value is this. We’ll copy
this, I’ll close this and jump back to the editor, and I’ll put the hexadecimal value
in here. Now we’ve seen the property that we want to assign this value to in one of
the examples of W3Schools. It’s the background color property. Now there’s more properties that we can apply
to backgrounds and we’ll talk about those later, but for now we’ll stick to background,
color, and we’ll assign it this grey value. I’ll save this and jump back to the browser
and refresh.

Image Accessibility with Alternative Text

Image Accessibility with Alternative Text


So in this video we’re going talk about the
importance of adding alternative text to images for accessibility. So when you upload an image using the “E”
button, you will notice that there is a section for alternative text and so within that you’re
going to want to make sure that you are providing a caption that is giving screen readers enough
information to correctly identify what is in the image and the context of the image. So I’m going briefly talk about the different
types of images and the kind of text that you should write in relation to those. But please do reference the documents that
we’ll provide on this page as well. So complex images are images like this shown
on the screen it’s a graph. We recommend whenever possible not adding
images like this just because it’s very difficult. Everything displayed in the graph has to be
correctly annotated in the alternative text. So you’ll see here it says “bar chart showing
monthly and total visitors for the first quarter 2014 for sites 1-3” So you have to provide
a very in-depth alternative text option for these kind of images. The next image is an image map. These are increasingly difficult as well because
any text displayed in this type of image has to be in the alternative text as well. So whenever possible please just use text
and leave out images with these sort of text on them and information chains. The next type of image is an informative image. So this one is showing a process of something. So you’ll notice alternative text is written
very descriptively, “Push the cap down and turn it counter clockwise from right to left.” Functional image is like this printer sign
you’ll see and right here it just says “Print this page” it’s very descriptive and succinct. Images of text that’s if you have text on
your image, if you have a poster that you’re uploading for an event—all of the information
on that poster has to also be in the alt text and on the page as just plain text. So remember that if you’re adding a poster
with different dates and descriptions of events, instead of uploading that poster that’s going
to be hung on the wall, just consider making a page with the text directly on the page
and then accompanying images that don’t have text on them. And that makes it easier for screen readers
to understand. Another important and helpful resource for
adding alternative text and properly adding alternative text is you can reference with
WC3 decision tree. It kind of talks about—you look at your
image and decide if it’s decorate, if it’s a functional one, if it’s has image of text
and then what you do from there. But as always, you can email [email protected]
with any questions and thank you.

Acquia Cloud Hands-On Demonstration

Acquia Cloud Hands-On Demonstration


The Acquia experience platform provides
two key sets of capabilities designed to make it easy for you to bring digital
experiences to life the experience Factory and the marketing hub Acquia cloud a foundational part of the experience Factory is the best place to build and
manage your digital presence Acquia cloud is a complete platform that helps
your DevOps team gain velocity and efficiency to start building
applications immediately, it accelerates web development with scalable secure
hosting unparalleled reliability and robust developer tools your teams no
longer have to invest in configuring servers setting up database replication
managing backups patches and more in this demonstration you’ll see how
quickly a DevOps team can go from getting a site up and running to
managing a codebase to even scaling operations first you’ll see how an
Operations team can quickly assemble the pieces needed to deploy a new site then
you’ll use built-in tools to monitor how well it is running and informed
decisions to scale your environment next you’ll see how easy it is to setup your
local dev environment finally you’ll see how Acquia cloud can be extended to
support complex CI CD workflows required by enterprise class organizations
customers who are just getting started with Drupal frequently choose lightning
Acquia’s curated distribution it includes the most commonly used modules to get up and running quickly with a minimum of effort to provide the greatest
flexibility Acquia cloud is also optimized for decoupled Drupal apps and
supports NodeJS so you can have a single secure compliant cloud for both use
cases awk we lightning is your starter kit for building sites and digital
experiences more quickly than ever on a Clea cloud over time off Nia cloud
provides the insight you need to stay ahead of problems that can affect your
online presence before they happen this includes the ability to see how
well your site is scaling as user demand grows as your team creates applications
and updates them over time you’ll want a historical view exposing insight into
the performance of new deployments you can quickly get detailed data including
load balancer requests varnish cache hit rate CPU and memory usage and more to
easily correlate deployments and performance in addition to the
infrastructure reports Acquia insight offers a simple score that summarizes
the current state of your security performance and Drupal best practices
drilling down a level you’ll see a report that shows exactly what your next
steps are with guidelines and how to resolve them quickly this removes the
time-consuming guesswork in reducing risk and improving performance when you
run into trouble Aqua is ready with the world’s best experts in Drupal cloud and
networking we can advise you on your Drupal applications and even deliver
personalized advice through dedicated advisory hours to recap Acquia cloud helps Operations teams get up and running ten times faster with Acquia lightning or the
Drupal distribution of your choice respond faster with key insights into
how to maximize your application and infrastructure performance optimize the
efficiency of your teams by having a CLIA as your trusted adviser in short
Acquia cloud takes away the pain and cost of building and maintaining a scalable
secure cloud environment on your own with your site up running and optimized
your dev team can focus on iterating quickly in response to business needs to
get started developers first set up a copy of the Drupal application for local
development you’ll clone the code branch database and file system and then you’re
ready to start coding it’s that simple developers love the flexibility to work
locally with popular tools for Drupal and PHP development to add new
capabilities through Drupal modules once complete you aren’t burdened with manual and lengthy deployment and testing processes simply push the updates to the
cloud and complete your testing staging and production phases with a simple
drag-and-drop workflow to eliminate and automate otherwise
repetitive and time-consuming dev activities Acquia offers cloud CD it
supports continuous integration and development best practices to manage
multiple code branches simultaneously getting your code to production faster
you’ll first construct a Yama file describing all the steps necessary to
assemble the Drupal code base that you’ll deploy on Acquia cloud the yem
will file includes code base installations database setup testing and
cleanup events everything you need to build and deploy your artifact some
devops team’s prefer to keep their application source code with the
pipeline’s the MMO file in an external code repository like github while
maintaining your Drupal build source code in aqueous clouds git repository
this lets you decide the best practices and project governance for your Drupal
application once you’ve finished authoring your gamal files you’re ready
to execute the build using aqueous pipelines a key component of Acquia
cloud CD you’ll first connect pipelines to the github repo with the yellow file
you just authored along with the supporting code necessary to
successfully build next you’ll trigger on your pipelines
build you can review the logs in real time to ensure everything is proceeding
as expected Ok we cloud and cloud CD tie together
many of the disparate and manual steps necessary to coordinate dev teams while
managing your codebase once complete your code is deployed to Acquia cloud and you’re ready to test to summarise Acquia cloud helps development teams quickly
set up a local dev environment to begin pushing updates to off via cloud perform
advanced CI CD workflows to streamline cloud based application deployment in
short awk we allowed works hard to relieve developers of the pain and
effort of building managing and iterating on your cloud-based Drupal
applications so you can stop focusing on the how and start focusing on your
customers so that’s a quick overview of Acquia cloud there is so much more we
could dive into such as advanced build and deploy tools with Acquia cloud API and cloud hooks managing applications using the command line remote administration
using production mode to protect your live application setting up two-factor
authentication for the Acquia cloud dashboard and so much more Acquia cloud makes it easy to reduce the risk and cost of deploying Drupal applications
into the cloud while accelerating iteration and innovation to find out
more go to Acquia.com/cloud or schedule a live demo Acquia we bring
digital experiences to life for the world’s most ambitious brands

How to use the font-family CSS property

How to use the font-family CSS property


Let’s go back to the browser and refresh and
you should see your qualities heading here. It’s clear that it looks different than our
image so we have a few things to adjust. Now if you’ve never worked with typography
before inside of a webpage then there are several properties that will be new to you,
and if you’re starting from scratch probably what you’d do is go to Google and do a search
for text or font CSS properties. Let’s see what happens if we do that. So I’m
going to open up a new tab and I’ll do a search for text, or font CSS properties. So you can
see a few options that appear from W3Schools at the top, and if we clicked on this you
could go down this and learn a little bit more about some of the properties that we’d
adjust. For example you’d see right away that the
font that we’re using is a serif font. If we go back to our example here you can see
that there’s little ledges on the edge of every letter. I’m going to zoom in a bit so
we can see that up close. So on this u you can see that it kind of has
a lip and down here at the bottom the tail has a lip as well. So what we’re dealing with
is a font that has a serif. I’m going to go back over to the W3Schools page. What we want
though is a sans serif, which means without a serif, because if we look at our example
here you don’t see those ledges on any of the letters. If we go back to the CSS font page and scroll
down you’ll see the first example talks about how to set the font family, and if we looked
at the details it would tell us that we can use a keyword like serif or sans serif, and
then we can separate suggestions by commas. The thing is that when a font is used inside
of a browser that font has to be available on the client computer. It is possible to
include a font with your webpage for the user to download but on the whole it’s better to
avoid that if we can because font files are actually rather large, and if we can avoid
forcing the user to download that font file then our page will load quicker. So what this line says is that we’re setting
the font family property, and this example is using a selector which we’ll get into shortly,
but we can also use this inside of the style property in our heading tag. So we have the
font family property and then we’re setting the value to a series of suggestions. The first is Times New Roman, which almost
every computer has so there’s a pretty good chance that we’ll be able to use that. But
if the client computer, that is the computer where the browser is being used doesn’t have
this font installed then instead let’s try to use something in the times family. So this might be Times New Roman or a number
of other fonts that fall in that family. If none of those are available then we want to
use a serif font, and the client computer’s almost guaranteed to have a serif font installed. So the reason why we would be more specific
if we can is because we want to match what the users sees to the design as much as possible,
and if they have the right font for it then we’re good to go. If they don’t though we want to get close
to the design. We at least want the spirit of the font that’s being used to come through,
and the reason we might use a serif font is because we want it to look a bit fancier,
or official. Font that doesn’t have a serif looks more modern and casual. So for example
this page uses a sans serif font for almost everything. So let’s go back to our example and let’s
change the view to the actual size and let’s start by changing the font family here to
sans serif. So we could go back into our code in our IDE and adjust it here inside of a
style property, or if we want some live feedback as we adjust our styles we can do it right
in Chrome. So if I right-click this element and select
inspect element then we’ll be able to adjust the styles by changing them right here. So
first what I’m going to do is click on this, and this is the element dot style, so this
is the style property of the H2 element that we’re working with here. And when we click on it it sets the cursor
to the first property that we want to use. So let’s set font family, and you can see
that it auto completes and we can hit tab in order to finish typing that out. You can see a list of options here. We’re
going to select sans serif and then I’ll hit tab in order to apply it, and you can see
when we did that it changed up here. Now instead of those little tails being added to the tops
and bottoms of the letters it’s smooth.

Writing the CSS code for your Omega 3.0 Subtheme

Writing the CSS code for your Omega 3.0 Subtheme


You have your Drupal 7 installed and you set up a sub-theme using Omega version 3.0. This video will show you how to use CSS to style your website with your sub-theme. As you go along you will see that Omega automatically adapts for mobile as well as desktop video as well as everything in between. When we first installed the sub-theme for Omega you can go in and change appearance/settings/yourSubThemeName and then click on the name of your subtheme. If you scroll down you’ll see that you can toggle several displays on and off. We are going to turn off the site name and the site slogan to simplify things. If I want to use a custom logo I uncheck “Use the default logo” and put in the path to the custom logo. I’ll show you where I put my custom logo. I have that in: sites/all/themes/my sub-theme/graphic I put my logo in the graphic folder of the theme. Notice the path is relative to the root directory of the Drupal site. If you are in the root directory, Drupal will look in: sites/all/themes/subThemeName/graphic/name of the graphic file. I save the configuration. I go back to the home page You can see the logo displayed. If I want to get Oh, right away, people are concerned about these pink bars. Well you can turn these pink bars off, over here you can turn off the gird and you can also turn off the debugging blocks. You can see that these are all the blocks showing me where the various pieces go If that bothers you can turn these off, turn the grid off This is more of what the page will look like. I like having the grid so I can see what is going to happen. If I wonder what part of the HTML page this is, I right-mouse click on the element and choose “Inspect Element” (using the Google Chrome browser) I can see here, as I preview it, that the whole blue block is my class=“branding-data” I’m going to go into my CSS files. Here I am in my CSS file. I’m in sites/all/themes/ in my sub-theme folder and here is my css folder. I’m going to change my -alpha-default.css. It is used for all screens except for the mobile. The global.css file is used for all the screens So, if you are designing mobile first you want to put your CSS inside of global.css. I’m just going to set this up as my default Here I am in the default.css and I go back into my browser to get the class name class=“branding-data” In my CSS file I’m going to set up a class for branding-data and set the background to white and point to the mainBanner.jpg my background banner. I’m not going to have it repeat and I’m going to move it over 180 pixels from the left. That’s to make room for the logo Now, notice this path. This is relative to the sub-theme because it is the theme that is using this CSS code. Now I know that I’m in my CSS folder so I have to go up a directory to get to the graphic folder to get mainBanner.jpg. I’ll basically go up a level (..) to my sub-theme folder, then go into the graphic folder and find the mainBanner.jpg. When we set the settings for the whole theme (for example the logo) that was relative to to the site. When you are inside a theme and doing the CSS then you want to set your graphics relative to that CSS folder. I’m going to save that and do a refresh on my page Now you can see the background banner Let me change that. I’ll remove the 180px Save the CSS file and refresh the web page… And you can see how it overlaps. I’ll put it back in. Now, if I want to see or change this block right here. I right-mouse click choose “inspect element”. As I walk through the code I can see that this code goes to my menu my content. I want to go a little more specific. Here is my block title. My block If I do the “block-inner” [Typing in the CSS code.] Save the CSS and refresh the web page… But, you can see that it is getting every block on the web page. I’m going to have to go a little deeper to be a little more specific. There’s my block-inner, there’s my block block-system. You can see right here there is an id=“ “ attribute. block-system-navigation. I’ll double click on that copy that, and put that right in the CSS file. It’s an id (using the #) and I’ll paste in the name of the id Now you can see that I was able to change the CSS just on that one block. without effecting the rest of the page. One other thing with the Omega theme is that you can resize your browser and it will automatically change. Here’s the mobile version Let me turn these blocks off…. and as we go larger, you can see that this would be the tablet size and then onto the full size So, Omega automatically takes care of mobile first for you as long as you work within its div and regions.

A simple CSS example and what HTML attributes are

A simple CSS example and what HTML attributes are


You’ve probably noticed that these two bits
of content have different styles to them. The heading is bold and it’s big, the paragraph
is small and it isn’t bold. This is simply how the browser is interpreting the tags that
we’re giving to it. If I go back to our code we’re not really
seeing anything about how it should look, we’re just seeing that it is a heading up
here and this part down here is a paragraph. So when we want to have control over how this
HTML looks we’re going to use CSS, which stands for Cascading Style Sheets, and we’ll talk
about what that means a little bit later. Let’s go back to our file explorer and open
up the second step, which is called HTML with CSS. Copy this code and paste it over the
code that’s in your index dot HTML file and save it. Let’s go back to the browser and
refresh it to see what changed. Okay, so the heading looks a little bit bigger
and it has a yellow background. If we jump back to our code you can see how we’re doing
that here. So we talked about what a tag was. Within a tag we can use attributes. The structure
of an attribute is the name of the attribute – in this case style, an equal sign, and then
quotes around the value. So you see double quotes starting here and
ending here, and within that we’ll put the value that this attribute should have. Style
allows us to use any CSS property we want in order to give a particular look to this
element. So I just used the word ‘element’ to describe
this, and elements just describes the tag plus the content that’s inside of it. So this
element is going to be styled with a background of yellow and a font size of 40 pixels. Now the goal of what we’re doing here is just
to see simple HTML and CSS in action, and we will come back and look at how we even
knew that we could use a H1 tag, or that we could use a background property inside of
the style attribute. It’s just important to see an example so we
have something to build on.

Paul Wander on PHP and Open Source in the Enterprise

Paul Wander on PHP and Open Source in the Enterprise


to actually I think you’re right Jen that’s helpful i’m not sure i think you’re correct yes just when in doubt just say that yeah right yes still point welcome to the Acquia podcast drupal technology community and business welcome to the Acquia podcast drupal technology community and business there’s a module for that of course there is this is the Acquia podcast where I have the privilege of speaking with a lot of people about Drupal about open source technology community in business today I’m going to be having a conversation with paul wander from in vika in vika is the parent company of sin co.labs UK and between sentio labs and in vika they have a couple of really interesting things going on for one in vika has a growing Drupal business and Drupal practice and since your labs UK of course is the UK division of sin co.labs the arm parent organization that looks after the interests of the symphony to platform many components of which are being integrated into Drupal 8 Paul you’re the co-founder of in Vika right that’s right correct so how did you discover open source software do you have it you’re the first memory associated with that I do actually um it was in the annals of open source I thought it wasn’t so far back it was actually in about 2,000 and early 2000s I guess I came across sugarcrm as a potential candidate for my previous organization was working and looking for a new crm and that came across and that was just like whoa that’s interesting and and then by about two thousand five 2006 I’d got together with the guys from zen who it’s a slightly longer story of course with Rasmus etc but effectively have brought the PHP language to where it is today and I always like to stay at the forefront not bleeding edge but leading edge when it comes to new tech and actually enterprise level as well that’s mostly where my interest in my background lies so my earliest memories of that are getting together I guess with a Zen guys understanding what their back story was how the PHP language itself arose and what’s critical for me is that PHP seems to be the only language which is actually designed to be executed on the web so it’s perfect for gluing it plays well with lots of other technology it executes in it executes on the web servers themselves and it seemed to be the first I’m not sure it was the first but it is the preeminent language for executing web full stop so and we see that today with numbers that are astonishing and there’s various different measures but by any anyone will tell you that at least seventy percent of the internet is running PHP and from my purposes I’ve seen the rise of PHP in the enterprise I started this business around 2006 2007 delivering professional services around PHP helping large enterprises turn what they maybe didn’t even know they had in their IT estate and professionalizing it out of propping adding proper methodologies processes and standards around development of something new which is this pure web play language could you compare for a second PHP itself when you first discovered it to it being a language today that is used for mission-critical enterprise applications that reach an incredible audience yeah i mean the the there’s two sides of the coin in when it comes to PHP which is that it’s really easy to learn and that’s a really good thing and a really dangerous thing and what happened i believe in the earlier days were the hobbyists with hacking it around getting PHP to do things really cool and interesting but maybe not let’s say enterprise ready and and the maturity is not just the language itself there’s a lot of associated technology through the lamp stack itself and then browser technology as well through to the modern ph javascript frameworks so that all the the ecosystem around PHP is quite broad but at the heart of it you’ve got this incredible language which now with this with the it with the advent of popular and modern frameworks security is a non-issue today if you code bad applications you code bad applications and you can do that in any language of your choice but all the old issues all the all the it ease reliability security availability etc all of those are acceptable accepted and acceptable around PHP and as long as again if you you know how to use PHP in the right way then it’s a mature enterprise standard language I don’t see PHP frankly being used to deliver a giant ERP type applications particularly there are a few and in fact if you’re interested you can go to open erp and have a look at that which is in the obvious system being delivered and built on open source languages and there are plenty of others but what I see is that for the the parts of the business that need to be agile with a small a that’s where they favor PHP the marketing team who can never get campaigns landing pages social engagement omni-channel they want to do things quite quickly quite cheaply see if it works if it works they’ll do more it allows organizations startups and enterprises alike frankly to dip their toe in the water of web technology so so how did in BK get started well in vika got started actually as i was going around i was representing in the early days then in the UK Zen technologies and every time I went to a client and to talk about the IDE of the server products frameworks etc we started to see the teams there were needing help more help than just tooling so they wanted health and education around training consulting leadership development team practices coding standards how to engage with the business so we saw a need in my background is enterprise delivery of professional services so IT projects and as I realized quite quickly that there was an opportunity in the UK to deliver serious projects using PHP and we decided that time with my partner to start this company up and see if we could build a professional services business we started the business in the UK in conjunction with I buildings which are our friends of the Netherlands who continue today in the last 23 years we had we separated from our buildings who continue to do great things in the netherlands in beaker is now in the UK delivering quality PHP to large enterprises could you talk about the adoption of open source software in the enterprise and perhaps specifically about symphony yes so we sin co.labs UK was established I guess a little over a year ago in conjunction with the guys from senseo in France the symphony framework is extremely popular the top two frameworks are zend and symphony and symphony to has been adopted biased let’s say the leading open source projects in the world and obviously Drupal is the key example there since we established sense your labs because we saw a growing demand for symphony expertise in medium and large businesses in the UK and that was lovely to see that we we had seen that in France and continental Europe Symphony is extremely popular and we frankly hadn’t realized how popular it was in the UK so we’re delighted that were able to service that market now with leadership training consulting etc and best practices and standards and all the good practices of how to develop quality applications based on PHP and using a symphony what’s the business case in the enterprise for open source software for Drupal for symphony so why do enterprise is actually want to adopt open source technology and packages etc and at the outset I think there’s no getting away from this they imagine it’s going to be cheaper which it is a little bit to licensed software but that’s not the point enterprises now and thus I’ll call it the social revolution that’s happened everyone knows what I mean with all the the twitter linkedin facebook and snapchats and everything that’s going on especially around omni-channel and in businesses enterprises realize now that the old ways don’t work so where you used to have licensed technology so that that was a license technology is a model of a market that works you pay a company a lot of people pay a company a small amount of money and they’ll have a whole floor of developers producing an application for you maybe a word processing application or similar what’s happened is the flip the inverse is now happening of that where you have a lot of people involved in building those applications themselves for personal reasons to add to their CV for example or for whatever reason people are contributing towards these open source projects a lot of people are and the communities then around these projects are it’s like the onion skin layers so at the center you have the core committers people who can actually update the main trunk of the software but around that you’ve got all sorts of different layers of people who are contributing maybe two particular modules people who are producing documentation etc and because the software is let as free and easy to use and when I say free I mean free of encumbrances when it comes to the licenses usually they’re not commercially restricted so you it means that a very wide community adopts that that’s off with it means that to an enterprise they’ve got a piece of software which is better tested in the dark corners of that software they will have more people using that weird feature then you would ever have Anna pieces in a piece of licensed software and if we talk about a CMS a content management system that’s really vital you get complex work workflows and editorial sign-off process which have to be followed and if you’re customizing Drupal you can you just know that you’ve got thousands of cohorts out there who’ve done or are doing the same thing as you so your certainty or never love your level of confidence actually in the software is very high because you’ve got a massive community which is testing and hitting that software all the time licensed software vendors don’t like that so much when it comes to enterprises looking at open-source software they are particularly interested to have a throat to strangle they want to be able to go after an organization to help support their software and the community is a bit amorphous doesn’t really provide that level of support so it’s very important that around the Kia open source projects we’ve got organizations out there who do offer that packaged support the service level agreements attached to it etc for the large enterprises so clearly when it comes to Drupal a clear is the the company that’s providing that support and that’s everything from the hosting stack right through to I guess critical application support of 24 x seven two systems that are running so it’s it’s really important that enterprises see that maturity out there in the in the commercial marketplace in order for them to start adopting these projects into their environment thank you so much for taking the time to talk with me today thanks Dan all the best jam it for roughly limit okay okay I hear you now but I tell me don’t tell me I’m looking at my camera is that it is that acceptable edit that out