SEO performance, remove fading effect and messenger

This commit is contained in:
Moris Zen
2018-09-12 15:16:28 +02:00
parent 313ea8b03c
commit 83663ea5c0
7 changed files with 256 additions and 301 deletions

View File

@@ -25,9 +25,7 @@
"prismjs": "^1.15.0",
"react-headroom": "^2.2.2",
"react-helmet": "^5.2.0",
"react-messenger-customer-chat": "^0.6.2",
"react-responsive-mixin": "^0.4.0",
"react-reveal": "^1.2.2",
"react-typed": "^1.0.9",
"serve": "^10.0.0",
"slideout": "^1.0.1",

View File

@@ -5,7 +5,6 @@ import Helmet from 'react-helmet'
import Header from '../components/Header'
import Footer from '../components/Footer'
import SideMenu from '../components/SideMenu'
import MessengerCustomerChat from 'react-messenger-customer-chat'
require('typeface-montserrat')
require('typeface-pt-serif')
@@ -20,11 +19,6 @@ const Layout = ({ children, data }) => (
<Helmet
link={[{ rel: 'shortcut icon', type: 'image/png', href: `${favicon32}` }]}
/>
<MessengerCustomerChat
pageId="715686642152482"
appId="1896398823783343"
htmlRef="layout"
/>
<main className="side-panel panel">
<Header />
{children()}

View File

@@ -2,7 +2,6 @@ import React from 'react'
import SectionIntro from '../components/SectionIntro'
import PageIntro from '../components/PageIntro'
import Fade from 'react-reveal/Fade'
import Card from '../components/Card'
import SEO from '../components/SEO'
@@ -15,7 +14,12 @@ import PageTransition from 'gatsby-plugin-page-transitions'
const ContactPage = () => (
<PageTransition>
<SEO siteTitle="Saburly - Contact Us" siteDescription="We are always on a lookout for exciting challenges. Feel free to contact us if you want to start something great or just have any questions" siteImage={ContactImage} siteUrl="https://saburly.com/contact" />
<SEO
siteTitle="Saburly - Contact Us"
siteDescription="We are always on a lookout for exciting challenges. Feel free to contact us if you want to start something great or just have any questions"
siteImage={ContactImage}
siteUrl="https://saburly.com/contact"
/>
<PageIntro
tiltImage
headline="Let's connect"
@@ -27,7 +31,6 @@ const ContactPage = () => (
<section className="my-20 container mx-auto w-full md:flex w-full">
<div className="p-2">
<Fade left>
<Card team teamMember={Stockholm} title="OFFICE IN STOCKHOLM">
<div className="xsm:flex text-left justify-around text-black text-base p-4">
<div className="py-2">
@@ -61,10 +64,8 @@ const ContactPage = () => (
</div>
</div>
</Card>
</Fade>
</div>
<div className="p-2">
<Fade right>
<Card team teamMember={Sarajevo} title="OFFICE IN SARAJEVO">
<div className="xsm:flex text-left justify-around text-base p-4">
<div className="py-2">
@@ -98,12 +99,10 @@ const ContactPage = () => (
</div>
</div>
</Card>
</Fade>
</div>
</section>
<div className="bg-saburly-lighter p-8">
<Fade>
<section className="container lg:flex justify-between mx-auto">
<form
action="https://formspree.io/info@saburly.com"
@@ -156,7 +155,6 @@ const ContactPage = () => (
/>
</div>
</section>
</Fade>
</div>
</PageTransition>
)

View File

@@ -9,7 +9,6 @@ import PageIntro from '../components/PageIntro'
import InfoBox from '../components/InfoBox'
import Technologies from '../components/Technologies'
import Typed from 'react-typed'
import Fade from 'react-reveal/Fade'
import SEO from '../components/SEO'
import ImgIntro from '../images/web-development-company.svg'
@@ -30,7 +29,12 @@ import PageTransition from 'gatsby-plugin-page-transitions'
const IndexPage = ({ ...props }) => (
<PageTransition>
<SEO siteTitle="Saburly - App Development & Mobile Design agency that makes you stand out" siteDescription="We're in the business of solving real-world problems with digital solutions. Our mission is to make you stand out with the help of modern technologies" siteImage={ImgIntro} siteUrl="https://saburly.com" />
<SEO
siteTitle="Saburly - App Development & Mobile Design agency that makes you stand out"
siteDescription="We're in the business of solving real-world problems with digital solutions. Our mission is to make you stand out with the help of modern technologies"
siteImage={ImgIntro}
siteUrl="https://saburly.com"
/>
<PageIntro
text="We're in the business of solving real-world problems with digital solutions. Our mission is to make you stand out and gain competitive advantages with the help of modern technologies."
image={ImgIntro}
@@ -51,18 +55,15 @@ const IndexPage = ({ ...props }) => (
<main>
<section className="container mx-auto max-w-lg text-center mt-16 p-4">
<Fade>
<SectionIntro
classes="my-10"
h2Classes="text-2xl sm:text-5xl"
headline="Because beautiful code makes our heart pound"
text="What gets us going is our passion for cutting edge technologies and incredible user experiences. We transform frustrations into features and headaches into highlights. And we do it all through our UX design and development process, by coupling form and function to develop world-class websites and apps for businesses of all sizes and sectors."
/>
</Fade>
</section>
<section className="relative">
<Fade>
<Service
classes="py-8"
h2Classes="text-2xl xsm:text-3xl font-medium saburly-color"
@@ -70,9 +71,7 @@ const IndexPage = ({ ...props }) => (
title="User Experience Design"
text="Our approach is simple: focus on how users might use the product in the best ways possible. We offer UX and UI design services for all screens and devices. The solutions are usually shaped through iterative processes of research, prototyping and testing."
/>
</Fade>
<Fade>
<Service
reversed
classes="py-8"
@@ -82,9 +81,7 @@ const IndexPage = ({ ...props }) => (
text="We love modern web development. Our talented developers work with both client-side and server-side technologies are always up to speed with cutting edge trends. We deliver high-quality, maintainable code on time and know how to balance between cost, time and quality."
imgClasses=""
/>
</Fade>
<Fade>
<Service
img={ImgMobile}
classes="py-8"
@@ -93,12 +90,10 @@ const IndexPage = ({ ...props }) => (
title="Mobile App Development"
text="We have what it takes to develop competitive iOS and Android applications using both native languages and hybrid solutions. Solutions for iOS are built with Swift & Objective-C and Android solutions are built with Java & Kotlin. We love using technologies like React Native to build cross-platform native apps."
/>
</Fade>
</section>
<section className="bg-saburly-lighter text-center p-4 my-12">
<div className="my-8 py-8 container mx-auto max-w-lg">
<Fade>
<SectionIntro
h2Classes="text-2xl md:text-5xl"
headline="You'll be in great company"
@@ -148,9 +143,7 @@ const IndexPage = ({ ...props }) => (
/>
</div>
</div>
</Fade>
<Fade>
<div className="text-center lg:flex justify-center">
<Button
standard
@@ -165,18 +158,14 @@ const IndexPage = ({ ...props }) => (
classes="text-white shadow hover:shadow-md rounded-full m-2 font-light bg-teal hover:bg-teal-dark"
/>
</div>
</Fade>
</div>
</section>
<section className="text-center p-4 relative">
<Fade>
<SectionIntro
h2Classes="py-8 text-2xl md:text-5xl"
headline="Sometimes we have fun & publish"
/>
</Fade>
<Fade>
<div className="container mx-auto w-full md:flex md:flex-wrap items-stretch w-full">
{props.data.allWordpressPost.edges.map(({ node }) => (
<div key={node.id} className="md:w-1/2 p-2">
@@ -200,15 +189,12 @@ const IndexPage = ({ ...props }) => (
</div>
))}
</div>
</Fade>
<Fade>
<Button
standard
text="More Posts"
url="/blog"
classes="mt-2 mb-8 hover:shadow-md rounded-full text-grey-darker"
/>
</Fade>
</section>
</main>
</PageTransition>

View File

@@ -5,7 +5,6 @@ import PageIntro from '../components/PageIntro'
import SectionIntro from '../components/SectionIntro'
import WorkStyle from '../components/WorkStyle'
import Technologies from '../components/Technologies'
import Fade from 'react-reveal/Fade'
import SEO from '../components/SEO'
import IntroImage from '../images/agile-practitioners.jpg'
@@ -31,7 +30,6 @@ const ServicesPage = () => (
imgClasses="-mb-12 border-white rounded-lg"
/>
<section className="px-4 py-16">
<Fade>
<div className="container mx-auto">
<div className="lg:flex">
<img
@@ -85,12 +83,10 @@ const ServicesPage = () => (
</SectionIntro>
</div>
</div>
</Fade>
</section>
<section className="bg-saburly relative bg-saburly-lighter px-4 p-16 ">
<div className="container mx-auto">
<Fade>
<div className="lg:flex">
<div>
<SectionIntro
@@ -143,8 +139,6 @@ const ServicesPage = () => (
alt="Fullstack Web Development Agency"
/>
</div>
</Fade>
<Fade>
<div className="p-8 my-4 bg-white border-bottom-saburly">
<h3 className={headerClasses}>Emerging Technologies</h3>
<p className={textClasses}>
@@ -161,11 +155,9 @@ const ServicesPage = () => (
</p>
<Technologies />
</div>
</Fade>
</div>
</section>
<Fade>
<div className="px-4 py-16 bg-saburly-fadeout">
<div className="container mx-auto xl:flex justify-center items-center">
<SectionIntro
@@ -179,7 +171,6 @@ const ServicesPage = () => (
</div>
<WorkStyle />
</div>
</Fade>
</PageTransition>
)

View File

@@ -6,7 +6,6 @@ import SEO from '../components/SEO'
require('prismjs/themes/prism-tomorrow.css')
import PageTransition from 'gatsby-plugin-page-transitions'
import MessengerCustomerChat from 'react-messenger-customer-chat'
import favicon32 from '../images/favicon32.png'
class PostDefault extends Component {
@@ -20,7 +19,13 @@ class PostDefault extends Component {
const { data } = this.props
return (
<PageTransition>
<SEO postSEO siteTitle={data.wordpressPost.title} siteDescription="We are always on a lookout for exciting challenges. Feel free to contact us if you want to start something great or just have any questions" siteImage={data.wordpressPost.featured_media.source_url} siteUrl={`https://www.saburly.com/blog/${data.wordpressPost.slug}`} />
<SEO
postSEO
siteTitle={data.wordpressPost.title}
siteDescription="We are always on a lookout for exciting challenges. Feel free to contact us if you want to start something great or just have any questions"
siteImage={data.wordpressPost.featured_media.source_url}
siteUrl={`https://www.saburly.com/blog/${data.wordpressPost.slug}`}
/>
<Helmet
link={[
{ rel: 'shortcut icon', type: 'image/png', href: `${favicon32}` },
@@ -42,11 +47,6 @@ class PostDefault extends Component {
__html: data.wordpressPost.content,
}}
/>
<MessengerCustomerChat
pageId="715686642152482"
appId="1896398823783343"
htmlRef="blogpost"
/>
</main>
</PageTransition>
)

View File

@@ -8327,12 +8327,6 @@ react-lifecycles-compat@^3.0.4:
version "3.0.4"
resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
react-messenger-customer-chat@^0.6.2:
version "0.6.2"
resolved "https://registry.yarnpkg.com/react-messenger-customer-chat/-/react-messenger-customer-chat-0.6.2.tgz#39462c90a951b06fa01d33e37547c47ca715aa63"
dependencies:
prop-types "^15.6.0"
react-proxy@^3.0.0-alpha.0:
version "3.0.0-alpha.1"
resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-3.0.0-alpha.1.tgz#4400426bcfa80caa6724c7755695315209fa4b07"
@@ -8347,12 +8341,6 @@ react-responsive-mixin@^0.4.0:
enquire.js "^2.1.1"
json2mq "^0.2.0"
react-reveal@^1.2.2:
version "1.2.2"
resolved "https://registry.yarnpkg.com/react-reveal/-/react-reveal-1.2.2.tgz#f47fbc44debc4c185ae2163a215a9e822c7adfef"
dependencies:
prop-types "^15.5.10"
react-router-dom@^4.1.1:
version "4.3.1"
resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-4.3.1.tgz#4c2619fc24c4fa87c9fd18f4fb4a43fe63fbd5c6"