14 06 19

Before getting into how to speed test your site, it makes sense to cover important concepts and tools in this area.

How a Webpage Loads

A basic thing to understand is how a web page ends up in front of a visitor. Knowing this will help you better understand where issues may arise and thus correct them.

First, the user opens a browser and puts in a web address. This creates a DNS request that resolves into the domain name provider, which points to a server. From there, the browser starts loading the files that make up your site:

  • HTML — Provides the main structure of your site. If you are using WordPress, the CMS dynamically produces it from PHP. The HTML document also includes calls to all following file types.
  • CSS — Responsible for styling, colors, dimensions, and more. Found in style sheets.
  • JavaScript — Mostly adds interactive elements and functionality to your site. Whenever something moves, it is often thanks to JavaScript.
  • Assets — Other files that provide parts of your site. The most common here are usually images.
  • External resources — Not everything that goes into your site lies on your own server. Some elements (like custom fonts) come from external sources.

Once the browser receives the files, it can start building and then rendering the content. The order and speed in which it receives files determine how fast visitors can see changes in their browser window. For a more detailed breakdown of how this works, check this article.

What’s important to note is that all of the above represent different HTTP requests. Having too many of them can already cause a slowdown. If you suspect that is the case, the linked post will tell you how to deal with it.

Important Speed Metrics

In addition to the above, in order to troubleshoot speed issues on your website, it’s good if you understand some basic metrics that influence the user experience while loading a page.

visualization of user experience during page load
Image Source
  • Time to first byte (TTFB) — Amount of time it takes for a browser to receive the first information from the site.
  • First paint — The moment the screen is no longer blank. For example, a background color change counts as first paint.
  • First contentful paint — When the first content appears. Might be part of the navigation, header image or any other element.
  • First meaningful paint — Here, users are able to see the primary content so that they can understand what the page is about.
  • Time to interactive — The duration until the page is usable and you can interact with it.

Many of the tools below will show you exactly this type of information.

important metrics for speed testing your website

Each step depends on different factors and thus needs different solutions when there is a problem. For example, if the time to first byte is very long, it’s often an indicator for a slow server. Thus, knowing the steps will help you pick up on where the process stalls and take targeted action.

Site Speed Testing Tools

Below are a number of tools you can use to test your site. They will give you different sets of data to understand how it is faring. Further below, we will discuss what to do with this data.

  • Lighthouse — A chrome extension that you can use to generate reports on any website’s accessibility, SEO, best practices, and performance. It’s able to simulate a mobile connection, uses many of the metrics above and gives recommendations on how to improve your site.
  • PageSpeed Insights — I have recommended this tool many times in other posts. It now comes with data from the Chrome User Experience Report, at least for popular sites. Aside from that, the service provides similar data as the Lighthouse extension.
  • Test Your Mobile Speed — A Google testing tool specifically for mobile speed. Allows you to simulate different locations and connection speeds, compare the results with competitors, evaluate the potential business impact of improving your loading speed and get tailored recommendations for different pages. You can also get a detailed report emailed to you.
  • Pingdom — The first non-Google tool for speed testing. Pingdom will give you a lot of the same information as PageSpeed Insights, however, in my opinion, easier to digest and understand. For example, it comes with a waterfall diagram to spot bottlenecks and has other information.
  • GTmetrix — Similar to Pingdom but with even more data. Can be a bit more overwhelming and less user-friendly but gives you a lot of information to work with.

In addition to the above, there are two other sources of information on how visitors see your site. The first is located in Google Search Console under Crawl > Crawl Stats.

how to speed test your website with google search console

Here, you can see the response time for when Google accesses your site. If the average is above 500ms, it’s time to take action

The second tool is the speed reports in your Google Analytics (find them under Behavior > Site Speed).

use google analytics data to speed test your website

Here, you get information about the page loading speed for different browsers and pages as well as suggestions for improvement. Be aware, that, by default, Google Analytics will only track this for 1 percent of your pages. To get more information, increase this number to 50 or 100 percent.

So, How Do You Use This to Speed Test Your Website Then?

Alright, now that you know what to look for and how to track it, here’s how you can you use the above information to test the speed of your website.

1. Test Your Homepage

A site’s front page often gets a large share of traffic. It’s also your site’s figurehead. For that reason, this page is one of the first things you should test. Doing so will also give you information about how your site fares in general.

Therefore, feel free to plug your homepage into one or more of the speed testing tools above. However, when you input the URL somewhere, it’s a good idea to add a cache buster parameter to it like so: https://yoursite.com/?cache=busted. That way, it doesn’t use any pre-loaded assets and you get closer to the experience that a first-time visitors would have.

If this makes a huge difference on your page, it might mean that you are relying too much on caching for speeding up your site. In that case, you should take action to make the experience better for those coming to your site for the first time. For repeat tests, add numbers to the end of the parameter (e.g. https://yoursite.com/?cache=busted2), otherwise, you might get cached results again.

2. Take Multiple Tests From Multiple Locations

Your site speed will be different depending on the time of day and location from which people access it. Thus, to get a more accurate reading about its situation, it’s best to take several measurements.

Ideally, you should schedule automatic tests every hour and let them run for a week. You can set up monitoring like this with GTmetrix and Pingdom but it’s not free. So, if that’s not something you want to pay for, at least do a number of manual tests at different times.

In addition to that, it makes sense to try several locations. You can use the same tools to do so, just note that you have to register for a (free) GTmetrix account to enable switching locations there.

The Pingdom home page.

Here, it’s important that you test according to your audience. If you have a local site (for example, one that is only available in your home country’s language), using the closest location to your server is enough. However, if you target an international audience, it makes sense to see what the experience is like for visitors from different locations.

3. Test Your Most Important Pages

At this point, you need to be aware that there is a difference between site speed and page speed. Site speed is the sum of the loading speed of all pages on your site. Page speed is how fast singular pages on it load.

For that reason, it’s not enough to simply test the front page of your website. This is especially important, since, in many cases, it is actually one of the least content-heavy pages you’ll have.

Theoretically, you should run tests on all of your pages, as most organic visitors do not come through the main address but random pages they find in search results. It’s possible to do so with crawlers, for example, Sitebulb or Screaming Frog (both paid products).

If you are not using those, depending on the size of your site, testing all pages isn’t all that practical. In that case, you should check at least your most important pages. You can find those via your analytics band Behavior > Site Content > Landing Pages.

check landing pages in google analytics

These are the parts of your site that visitors mainly use to enter it. When you set yourself a goal to optimize at least the top 20 results, you already have your work cut out for you.

In addition, you might want to check the aforementioned page timings and order them by average page load time to find the worst offenders.

find worst performing pages in google analytics

Put those on your list of pages to optimize as well. Also, come back here after you have optimized your site as the average will change and there will be a new set of slowest pages.

4. Now Do the Same for Your Competition

After figuring out how your own site is faring in the above areas, if you still have energy, you might want to engage in some competitor analysis. That means, taking a handful of your closest competitors (business wise or in the search results) and put them through the same process.

Why?

Because speed might be something that you can beat them at. Studies have shown that people are likely to go to a competitor website if their first choice takes too long.

In addition to that, page loading speed might be the thing that puts you above your competitors in the SERPs. Since the majority of clicks go to the top Google results, that can never be a bad thing. For that reason, don’t forget to speed test the competition.

How to Use the Speed Test Results

Alright, by now you should possess a lot of information about your site’s speed profile. Now is the question, what do you do with it? Let’s talk about that quickly.

Focus on Real-Life Improvements

While many of the speed testing tools give you ratings and percentages, it’s important that you don’t concentrate on these scores. It’s possible to have a lot of green lights but still provide an abysmal user experience.

Instead, focus on what your visitors really care about: how many seconds it takes to load your pages. If you can improve that, it will make the most impact and also automatically lead to better scores. So, forget about the feel-good metrics and concentrate on producing real-life results.

How to do that? I’m glad you asked.

Fix Sitewide Problems First

When trying to speed up your WordPress website, it’s best to first focus on factors that affect all parts of it. By fixing general shortcomings, you can improve the page loading speed of all pages at once. Doing so will make the biggest difference for the largest share of visitors.

Examples of measures you can take in this area include:

All of this will affect your site as a whole, leading to great improvements.

After That, Focus on Single Pages

When you have taken measures to improve your site in general, you can then go ahead and deal with single pages. If your tests showed that some of the most important ones have bigger problems, it’s time to dive into the waterfall diagram and find out who is the culprit.

find bottlenecks in waterfall diagram

It could be an image that is too large, a remote script that would be better off hosted locally or any other of the many files that go into a page. Each instance is different, therefore, the solutions will vary. Improve one page after the other in the order of importance and you will make a big difference in the end.

Final Thoughts on How to Speed Test Your Website

Learning how to test your website for loading speed is a helpful skill in creating better, more user-friendly sites. The influence of page loading speed on website success is something many people underestimate. Only having proper data will allow you to take the right action in this area.

Above, you have gotten a first-rate education on performing a speed test on your WordPress site. You have learned what goes into loading a web page, important metrics for page loading speed and tools to measure them. You now also know how to apply that knowledge to your own site to make it faster.

The above should be enough to give your website a significant speed bump. When you do that, chances are good that it will improve the rest of your success metrics as well.

13 06 19

 I’m CHANDALA NIHARIKA . I’m currently pursuing my B.tech in Dr.Lankapalli Bullayya College Of Engineering(women) in CSE department .  I started learning web development course from 24.05.2019. This article is about the things i’ve learned from the web development course videos.

   COMING TO THE THINGS I’VE LEARNED:

           FOLDER  01 : Introduction Why This is The Only Design Development Course You’ll Ever Need

                       VIDEO 01: INTRODUCTION

                It is about introduction about web designing i.e. what are the skills required for web designing, how to craft resume and negotiate a high salary etc.

                  VIDEO 02: WHAT YOU GET IN THIS COURSE

       In this video i’ve learnt what are the skills required for web development as free lancer.       The skills such as

  • html html
  • html5
  • css
  • css3
  • java script
  • jQuery1
  • jQuery3
  • Responsive
  • php
  • my sql
  • Angular js etc…

               VIDEO 03: HOW TO GET A FREE TRIAL OF ADOBE PHOTOSHOP FREE ICONS, GRAPHICS MORE

      I’ve learnt about free trial photoshop in websites such as

  • GIMP (gimp.org)
  • PIXLR(pixlr.com)
  • 30-DAY PHOTOSHOP TRIAL (adobe.com/photoshop)

                VIDEO 04: HOW MUCH SHOULD YOU CHARGE

       I’ve learnt on what basis you should charge for your project such as

what’s the project?

who’s the client?

how much does it cost you basing on hours of work?

Is the project interesting?

                VIDEO 05: PRICE CALCULATOR DISCOVER YOUR HOURLY RATE HOW MUCH YOU SHOULD CHARGE

       I’ve learnt about how to charge for the work based on the time you have allocated to do project per hour.

               FOLDER 02: INTRODUCTION TO VISUAL DESIGN

              VIDEO 01:

     It’s about the introduction to visual design.

                VIDEO 02:

      The basic elements of visual design are:

  • lines
  • shapes
  • colour palette
  • texture
  • typography
  • form

     The basic 7 principles of visual design are:

  • space
  • dominance
  • hierarchy
  • unity
  • balance
  • rhythm
  • proportion

           VIDEO 03: CRAP PRINCIPLES IN DESIGN

                It’s about the principles about CRAP. They are:

  • C means CONTRAST
  • R means REPETITION
  • A means ALIGNMENT
  • P means PROXIMITY

            VIDEO 04: TYPOGRAPHY

            It’s about what typography is .. Typography is nothing but flow to message. It consists of ascender , X-height , cap height, descender…

             VIDEO 05: SCIENCE OF COLOUR
 

             I’ve learnt about colour wheel , Analogous , complementary, primary colours , secondary colours and tertiary colours . I’ve learnt about monochromatic, split complementary and double complementary. I’ve also learnt about hue , saturation , brightness , screen and print

            VIDEO 06: DESIGNING WITH GRIDS

            Grids are nothing but they keep content organized creates an order by distinguishing different types of information. They are 4 types of grids. They are:

  • single column grid
  • Multi column grid
  • Modular column grid
  • Hierarchical column grid

 

Grid structure example

 

 

                  FOLDER 03: INTRODUCTION TO ADOBE PHOTOSHOP

         VIDEO 01: Intro The 8020 Rule, Photoshop Basics, and More

             It’s about the introduction to the photoshop.

           VIDEO 02: Creating a New Photoshop Document

              It’s about how to create a document using photoshop.

             Steps for creating a document in photoshop:

  1. Open Elements and select an editing mode. …
  2. Choose File→New→Blank File in any workspace or press Ctrl+N (cmd+N). …
  3. Select the attributes for the new file. …
  4. Click OK after setting the file attributes to create the new document.

          VIDEO 03:Photoshop Environment The Toolbar – Part 1

            It’s about the toolbar of photoshop such as rectangular selection, selection tool, healing brush , patch tool etc… Healing brush tool removes wrinkles. Patch tool is used to remove fluzzy hair. Selection tool helps for the selection of image.

          VIDEO 04:Photoshop Environment The Toolbar – Part 2

          It’s about the tool bar of photoshop such as Brush tool, pencil tool, clone stamp tool, History brush tool, erase tool , quick selection tool, dodge tool, burn tool, pen tool, text tool etc… Brush tool is used to draw something of brush stroke. Quick selection tool is used to select quick for a tool. Dodge tool is used to lighten the color. Burn tool is used to change to burn effect. Pen tool is used for clean sort of selection.

                      VIDEO 05:Photoshop Environment Palettes

                         It’s about the palettes of the photoshop. Palette is a thing which we can choose options from.

                     VIDEO 06: Photoshop Environment The Menu

                        It’s about the environment of the photoshop such as File, Edit, Image, Layer, Type, Select, Filter, 3D, View and information. Auto tone is used to modify the best tone of the photographs.

                  VIDEO 07:Photo Enhancement Manipulation

                    It’s about the enhancement and manipulation of image using photoshop. Photo manipulation involves transforming or altering a photograph using various methods and techniques to achieve desired results

                    FOLDER 04: INTRODUCTION TO WEB DESIGN AND MORE PHOTOSHOP
        VIDEO 01: Section Intro Web Design Basics, Wireframing, Photoshop

            It’s about the essentials about photoshop and also introduction to web design.

        VIDEO 02: Web Design Terminology The Jargon the Pros Use

           It’s about the JARGON THE PROS USE. JARGON is a set of words that is used in specific industry (or) buzz words. I’ve learnt about mood board which is a collage composed of colours , Wire frame is a sketch on paper or screen, Rough is a first draft of layout, Comp is second draft of layout and Mock up is the final draft of web design.

      VIDEO 03: The Four Phases of a Web Design Project Cost Estimates

          I’ve learnt about the four phases such as Discovery phase, Creative Phase, Development Phase and Launch phase.

   Discovery Phase : includes phone calls, messages, consultations, research , planning, scheduling, develop site structure

   Creative Phase: includes User Experience design, Wire framing and Web Design Mockups.

   Development Phase:

   In this phase it consists of

  • Convert designs into HTML & CSS
  • Browser Testing

   Launch Phase:

   In this phase it consists of

  • Moving local website to live server
  • Client Training
  • Review

        VIDEO 04: What is User Experience UX Design

      I’ve learnt about User Experience Design. It consists of

  • Visual Design
  • Information Architechture
  • Usability
  • Research
  • Content Strategy
  • Interface design

   User Experience Design educates and informs a user about the website

        VIDEO 05: The Anatomy of a Website Design

     I’ve have learnt about the common elements of website such as

  • Header & Navigation: Header is nothing but logo and navigation is the links used.
  • Call to Action: tells user what they should do
  • Primary Content : High lights the main article
  • Secondary Content
  • Tertiary content
  • Side bar
  • Footer

       VIDEO 06: The 960 Grid System Free Photoshop Downloads

        I’ve learnt about 960.gs which is used to generate Boot strap and templates such as omnigraffe and photoshop

              FOLDER 06: INTRODUCTION TO HTML

       VIDEO 01: Section Intro HTML Fundamentals, First Webpage, Course Files

         It is about the introduction to html. HTML is nothing but hyper text mark up language

       VIDEO 02: The Basics of HTML Tags, Attributes, Elements

             Structure Of html:

<html>

<head>

</head>

<body>

</body>

</html>

           I’ve learnt about elements such as tags, attributes , Elements.

           VIDEO 03: Basic File Folder Structure of a Website

              I’ve learnt how to keep folder names for a website folder . For Example for home page keep it as index.html and for images create a images folder.

           VIDEO 04: Your Must Have Tool A Good Code Editor

             It’s about the text editors to write code for website. They are sublime, Text Wrangler, Notepad++, Brackets, Coda2 etc..

          VIDEO 05:Hello World Create Your Very First Web Page

<html>

<head>

<title>My First Web Page</title>

</head>

<body>

<h1>Hello!!!</h1>

</body>

</html>

                  FOLDER 07: INTERMEDIATE HTML

       VIDEO 01: Section Intro HTML Tags, Code a Real Web Page

           It’s about the introduction to html.

       VIDEO 02: Basic Structure of an HTML Document

          I’ve learnt about the basic structure of html . Here is the basic structure:

        FOLDER 08: ADVANCED HTML HTML5

      VIDEO 01: Section Intro Advanced HTML Techniques, HTML5

HTML5 is the latest version of Hypertext Markup Language, the code that describes web pages. It’s actually three kinds of code: HTML, which provides the structure; Cascading Style Sheets (CSS), which take care of presentation; and JavaScript, which makes things happen.

        VIDEO 02: IDs Classes

The id attribute specifies a unique id for an HTML element (the value must be unique within the HTML document).

The id value can be used by CSS and JavaScript to perform certain tasks for a unique element with the specified id value.

      VIDEO 03: Span Div Tags

The HTML <spantag is used for grouping and applying styles to inline elements. The difference between the <spantag and the <divtag is that the <spantag is used with inline elements whilst the <divtag is used with block-level content.

     VIDEO 04: Intro to HTML5 Tags Header, Footer, Nav, Section, Article, Aside Time

     I’ve learnt about Html5 tags. The following are some of them

  • <article>
  • <aside>
  • <details>
  • <figcaption>
  • <figure>
  • <footer>
  • <header>
  • <main>
  • <mark>
  • <nav>
  • <section>
  • <summary>
  • <time>

        FOLDER 09: EXPERT HTML HTML5

       VIDEO 01: Section Intro Expert HTML5 techniques

   It’s about the introduction to Expert Html.

       VIDEO 02: New HTML5 Inputs

HTML5 added several new input types. some of them are:

  • color.
  • date.
  • datetime-local.
  • email.
  • month.
  • number.
  • range.
  • search.

     VIDEO 03: Making Internet Explorer Compatible with HTML5

    The following are the steps for making Internet Explorer compatible with

HTML 5:

  1. Click Start.
  2. On the search bar, type Internet Options, and click on Internet Options from the results.
  3. Click on the Advanced tab.
  4. Under Multimedia, check Enable alternative codecs in HTML5 media elements.
  5. Restart your computer.

     VIDEO 04: HTML5 Data Attribute

The data-* attributes is used to store custom data private to the page or application.

The data-* attributes gives us the ability to embed custom data attributes on all HTML elements.

          FOLDER 10: INTRODUCTION TO CSS

   VIDEO 01: Section Intro Essentials of CSS Download Course Files

CSS stands for Cascading Style Sheets. CSS describes how HTML elements are to be displayed on screen, paper, or in other media. CSS saves a lot of work. It can control the layout of multiple web pages all at once.

     VIDEO 02: What is CSS All the basics you need to know

   CSS (Cascading Style Sheets) is what makes web pages look good and presentable.
There are typically three ways we do that.

  • Inline CSS. First off, we can include CSS directly in our HTML elements. …
  • Internal CSS. …
  • External CSS.

     VIDEO 03: Inheritance of Styles

Inheritance is associated with how the elements in the HTML markup inheritproperties from their parent (containing) elements and pass them on to their children. The cascade relates to CSS declarations being applied to a document, and how conflicting rules do or do not override each other.

       VIDEO 04: Measurements The Box Model

The term “box model” is used when talking about design and layout. TheCSS box model is essentially a box that wraps around every HTML element. It consists of: margins, borders, padding, and the actual content.

       VIDEO 05: Inline CSS

Inline CSS refers to CSS found in an HTML file. It is found in the head of a document between style tags. Inlining CSS simply means putting your CSS into your HTML file instead of an external CSS file.

      VIDEO 06: Internal CSS

An internal stylesheet holds CSS rules for the page in the head section of the HTML file. The rules only apply to that page, but you can configure CSS classes and IDs that can be used to style multiple elements in the page code.

 

body {background-color:lightgrey} h1 {color:blue} p {color:green}

 

This is a heading

This is a paragraph.

    VIDEO 07: External CSS

External CSS is Placing CSS in a separate file allows the web designer to completely differentiate between content (HTML) and design (CSS). External CSS is a file that contains only CSS code and is saved with a “.css” file extension. This CSS file is then referenced in your HTML using the <link> instead of <style>.

     VIDEO 08: ID Class Selectors

In the CSS, a class selector is a name preceded by a full stop (“.”) and an ID selector is a name preceded by a hash character (“#”). The difference between anID and a class is that an ID can be used to identify one element, whereas a class can be used to identify more than one.

      VIDEO 09: Descendant Selectors

The descendant selector matches all elements that are descendantsof a specified element. The first simple selector within this selector represents the ancestor element—a structurally superior element, such as a parent element, or the parent of a parent element

 

Descendant Selector Example

     VIDEO 10: Grouping Selectors

CSS allows you to group multiple selectors that share the same declaration. This optimization technique allows you to apply the same style to multiple elements to save space. You can combinegrouped selectors with contextual and otherselectors to create powerful yet compact rules for your style sheets.

     VIDEO 11: Specificity

Specificity is a weight that is applied to a given CSS declaration, determined by the number of each selector type in the matching selector.

       FOLDER 11: INTERMEDIATE CSS

       I’ve learnt about the colors, text styling forms, borders, background image and styling links.

           FOLDER 12: ADVANCED CSS

    VIDEO 01: Styling Web Forms

I’ve learnt how to write style sheets for a form to look beautiful using css

      VIDEO 02: Block, Inline and Inline-Block Elements

We can add margins and padding on all four sides of any block element — top, right, left, and bottom.

  • Some examples of block elements are <div> and <p> tags. …
  • Inline Elements.
  • Inline elements don’t start on a new line, they appear on the same line as the content and tags beside them. …
  • InlineBlock.

       VIDEO 03: Understanding Float Clear once and for all

The float property is used for positioning and formatting content e.g. let an image float left to the text in a container.

The float property can have one of the following values:

  • left – The element floats to the left of its container
  • right- The element floats to the right of its container
  • none – The element does not float (will be displayed just where it occurs in the text). This is default
  • inherit – The element inherits the float value of its parent

      VIDEO 04: Relative, Absolute Fixed Position

positionabsolute;

An element with positionabsolute; is positioned relative to the nearest positioned ancestor (instead of positioned relative to the viewport, likefixed).

        FOLDER 13: EXPERT CSS CSS3

       VIDEO 01: Section Intro What is CSS3 Course Files Download

CSS3 is the latest evolution of the Cascading Style Sheets language and aims at extending CSS2.1. It brings a lot of long-awaited novelties, like rounded corners, shadows, gradients, transitions or animations, as well as new layouts like multi-columns, flexible box or grid layouts.

    VIDEO 02: CSS3 Box Sizing Round Corners

The border-radiusproperties makes rounding the corners on a box easy. The border-radiusproperty is a shorthand property that sets the radius for all four corners of the box to the same value when given only one value.

      VIDE0 03: CSS3 Colours Gradients
   CSS Linear Gradients. To create a linear gradient you must define at least twocolor stops. Color stops are the colors you want to render smooth transitions among.

      VIDEO 04: CSS3 Shadows

The box-shadow property allows designers to easily implement multiple drop shadows (outer or inner) on box elements, specifying values for color, size, blur etc…

        VIDEO 05: CSS3 Columns
      The CSS Multi-column Layout Module extends the block layout mode to allow the easy definition of multiple columns of text.  The column-width part will define the minimum width for each column, while the column-count part will define the maximum number of columns.

        VIDEO 06: CSS3 Animations Transitions

        Animations within CSS3 allow the appearance and behavior of an element to be altered in multiple keyframes. Transitions provide a change from one state to another, while animations can set multiple points of transition upon different keyframes.

           FOLDER 15: Introduction to Javascript

        VIDEO 01: Section Intro What is Javascript, The 8020 Rule Course Files Download
        JavaScript (JS) is a lightweight interpreted or just-in-time compiled programming language with first-class functions.

            VIDEO 02: Internal External Javascript

           External scripts are practical when the same code is used in many different web pages. JavaScriptfiles have the file extension .js.

        VIDEO 03: Basic Syntax of Javascript and many other programming languages
         JavaScript can be implemented using JavaScript statements that are placed within the <script>… </script> HTML tags in a web page. 

          VIDEO 04: Javascript Output

         JavaScript can “display” data in different ways: Writing into an HTML element, using innerHTML . Writing into the HTML output using document.write() . Writing into an alert box, using window.alert() . 

         VIDEO 05: Javascript Variables

In java script , Variable means anything that can vary. JavaScript includes variables which hold the data value and it can be changed anytime.JavaScript uses reserved keyword var to declare avariable.

          VIDEO 06: Javascript Arrays

An array is a special variable, which can hold more than one value at a time.

        VIDEO 07: Javascript Functions

A function is a group of reusable code which can be called anywhere in your program.  Some of the java script functions are alert() and write().

Example:

<script type = "text/javascript">
   <!--
      function sayHello() {
         alert("Hello there");
      }
   //-->
</script>

        VIDEO 08: Javascript If Else Statements

            The if/else statement executes a block of code if a specified condition is true. If the condition is false, another block of code can be executed. The if/else statement is a part of JavaScript’s “Conditional”Statements, which are used to perform different actions based on different conditions.

              FOLDER 16: Introduction to jQuery

        VIDEO 01: Section Intro What is jQuery Course Files

    It’s about the introduction to jQuery

      VIDEO 02: Download Install jQuery

  I’ve learnt how to download and install jQuery

     VIDEO 03:The Simple Syntax of jQuery

        jQuery syntax is made by using HTML elements selector and perform some action on the elements are manipulation in Dot sign(.).

 jQuery basic syntax:

  $(document).ready(function() { $(selector).action(); });

      VIDEO 04: jQuery Selectors

jQuery selectors allow you to select and manipulate HTML element(s). jQuery selectors are used to “find” (or select) HTML elements based on their name, id, classes, types, attributes, values of attributes and much more.

 

      VIDEO 05: jQuery Event Methods

I’ve learnt about jQuery event methods some of them are:

  • click() :The click() method attaches an event handler function to an HTML element. …
  • dblclick() :The dblclick() method attaches an event handler function to an HTML element.

               FOLDER 17: Intermediate jQuery

       VIDEO 01: Section Intro jQuery Deep Dive
      
       It’s about the introduction to the jQuery and what are the things essential in jQuery.

      VIDEO 02: jQuery Chaining

       jQuery Chaining provides strong feature called chaining method that allows us to run multiple jQuery methods on the element within a single statement.

         VIDEO 03: Hiding, Showing Fading Content with jQuery

   jQuery hide() : Hides the Syntax or the element of html that you want to hide

Syntax: .$(selector).hide(speed, callback);

  jQuery show() : Shows the syntax or the element of html that you want the user to see.

Syntax: .$(selector).show(speed, callback);

     VIDEO 04: The jQuery Animate Method

      The animate() method performs a custom animation of a set of CSS properties. This method changes an element from one state to another with CSS styles. The CSS property value is changed gradually, to create an animated effect.

     VIDEO 05: Modifying CSS with jQuery

      The css() method sets or returns one or more style properties for the selected elements.

Syntax:

$(selector).css(property,value)

               FOLDER 18: jQuery UI Advanced jQuery

     VIDEO 01: Section Intro What is jQuery UI Course Files

      It’s about the introductipn of jQuery. jQuery UI is a widget and interaction library built on top of the jQuery . In the demos section, the navigation lists all of the interactions and widgets .The components you select will all be combined into a custom jQuery UI JavaScript file.

     VIDEO 02: jQuery UI Draggable

       The draggable (option) method specifies that an HTML element can be moved in the HTML page. Here, the option parameter specifies the behavior of the elements involved.

Syntax:
   $(selector, context).draggable(options);  

      VIDEO 03: jQuery UI Droppable

        The droppable (options) method specifies that you can use an HTML element as an element in which you can drop other elements. Here, the option parameter specifies the behavior of the elements involved.

Syntax:
$(selector, context).droppable (options);  

    VIDEO 04: jQuery UI Sortable

    jQueryUI provides sortable() method to reorder elements in list or grid using the mouse. This method performs sortability action based upon an operation string

    VIDEO 05: jQuery UI Accordion
    Accordion Widget in jQueryUI is a jQuery based expandable and collapsible content holder that is broken into sections and probably looks like tabs. jQueryUI provides accordion() method to achieve this.

Syntax:

  The accordion() method can be used in two forms −

     VIDEO 06: jQuery UI Datepicker

      The datepicker is tied to a standard form input field. Focus on the input (click, or use the tab key) to open an interactive calendar in a small overlay. 

          FOLDER 19: Responsive Design Development using Bootstrap

         VIDEO 01: Section Intro What is Responsive Design Bootstrap Course Files

          It’s about the introduction to responsive design and bootstrap .Bootstrap is a free and open-source framework for creating websites and web applications.

          VIDEO 02: Getting Started with Bootstrap

  • Bootstrap is a free front-end framework for faster and easier web development
  • Bootstrap includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation, modals, image carousels and many other, as well as optional JavaScript plugins
  • Bootstrap also gives you the ability to easily create responsive designs

         VIDEO 03: Quickly Prototype with the Free Examples

         A website prototype can be any mock-up or demo of what a website will look like when it goes live. It can be anything from a paper sketch, to a clickable HTMLprototype.

         VIDEO 04: Understanding the Bootstrap Grid System

          The Bootstrap Grid System is used for layout, specifically Responsive Layouts. Understanding how it works is vital to understanding Bootstrap. The Grid is made up of groupings of Rows & Columns inside 1 or more Containers. The Bootstrap Grid can be used alone, without the Bootstrap JavaScript and other CSS Components.

       VIDE0 05: Responsive Forms
        Responsive form elements span 100% by default; their width is designed to be constrained by the existing grid system. This makes them extremely flexible.

       VIDEO 06: Responsive Tables, Buttons and Images
          Responsive is a method for providing the browser with multiple image sources depending ondisplay density, size of the image element in the page, or any number of other factors. Often, when people talk about responsive images, they are referring to solutions for inline images.

          VIDEO 07: Helper Classes Responsive Utilities

            Bootstrap provides some handful helper classes, for faster mobile-friendly development. These can be used for showing and hiding content by device via media query, combined with large, small, and medium devices.

        VIDEO 08: Using Glyphicons Font Icons

        Bootstrap includes 260 glyphs from the Glyphicon Halflings set. 

           VIDEO 09: Bootstrap Navbar

            With Bootstrap, a navigation bar can extend or collapse, depending on the screen size. A standard navigation bar is created with <nav class=”navbar navbar-default”> .

     VIDEO 10: Bootstrap Modal Window

     Then include the two data-* attributes:

  • data-toggle="modal" opens the modal window
  • data-target="#myModal" points to the id of the modal

The parent <div> of the modal must have an ID that is the same as the value of the data-target attribute used to trigger the modal (“myModal”).

The .modal class identifies the content of <div> as a modal and brings focus to it.

The .fade class adds a transition effect which fades the modal in and out. Remove this class if you do not want this effect.

The attribute role="dialog" improves accessibility for people using screen readers.

The .modal-dialog class sets the proper width and margin of the modal.

     VIDEO 11: Bootstrap ScrollSpy

     Add data-spy="scroll" to the element that should be used as the scrollable area (often this is the <body> element).

    Then add the data-target attribute with a value of the id or the class name of the navigation bar (.navbar). This is to make sure that the navbar is connected with the scrollable area.

      VIDEO 12: TOGGLABLE TABS

       To make the tabs toggleable, add the data-toggle=”tab” attribute to each link. Then add a .tab-pane class with a unique ID for every tab and wrap them inside a <div> element with class .tab-content .

      VIDEO 13 :SLIDING CAROUSEL

         The data-ride=”carousel” attribute tells Bootstrap to begin animating the carouselimmediately when the page loads. The “Indicators” part: The indicators are the little dots at the bottom of each slide (which indicates how many slides there are in thecarousel, and which slide the user is currently viewing).

              FOLDER 21: WEB HOSTING DOMAINS

      VIDEO 01: Section Intro What is Web Hosting

        A web hosting service is a type of Internet hosting service that allows individuals and organizations to make their website accessible via the World Wide Web.

      VIDEO 02: Purchasing a Bundled Domain Name Hosting Package

         This means that even if you go to a company such as GoDaddy — known primarily for domain registration — you can still walk out with a bundled deal of hosting and domain. However, you can also do things the other way around. You can go to a well-known hosting company and get the same bundled package from them as well.

      VIDEO 03: The Hosting Control Panel a.k.a. cPanel

     cPanel is a control panel, so it allows you to control aspects of your site and/orserver. … However, cPanel does offer a real control advantage: once you get used to the GUI (graphical user interface), you will not have to learn a new system if and when you switch to another web hosting company.

     VIDEO 04: Understanding FTP How to Upload a Website to Your Live Serve

    HOW TO ESTABLISH AN FTP SESSION FROM THE COMMAND PROMPT

  1. Establish an Internet connection as you normally do.
  2. Click Start, and then click Run. …
  3. A command prompt will appear in a new window.
  4. Type ftp <insert your FTP host address here> …
  5. Press Enter.

                           FOLDER 22: INTRODUCTION TO PHP

     VIDEO 01: Intro What is PHP What Does It Do Course Files

            It’s about the basic syntax of php. php is Hypertext Preprocessor. PHP is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML.

     VIDEO 02: BASIC PHP SYNTAX

         I’ve learnt about PHP syntax

        VIDEO 03: PHP VARIABLES AND CONSTANTS

             I’ve learnt about variables and constants. Constants are the variables whose values are not changed throughout the script. A valid constant variable do not have a $ sign before its name. It starts with a letter or an underscore (_). Constants have global scope in the whole script.

 

PHP variable

 

about php constant

       VIDEO 04: PHP ARRAYS ASSOCIATIVE MULTI – DIMENSIONAL

        I’ve learnt about the arrays in Php.

       An array is created using an array() function in PHP.

     There are basically three types of arrays in PHP:

  • Indexed or Numeric Arrays: An array with a numeric index where values are stored linearly.
  • Associative Arrays: An array with a string index where instead of linear storage, each value can be assigned a specific key.
  • Multidimensional Arrays: An array which contains single or multiple array within it and can be accessed via multiple indices.

                   FOLDER 23: INTERMEDIATE PHP

     VIDEO 01: SECTION INTRO LETS DIVE DEEPER INTO PHP

   I’ve learnt about the introduction to php.

    VIDEO 02: IF, ELSE and ELSE IF Statements

   I’ve learnt about if and else statements in php and also else if statements in php

  • if statement – executes some code if one condition is true
  • if...else statement – executes some code if a condition is true and another code if that condition is false
  • if...elseif....else statement – executes different codes for more than two conditions

   Syntax:

if (condition) {
    code to be executed if condition is true
;
}

     VIDEO 03: PHP Loops WHILE, For, Foreach DO WHILE
       I’ve learnt about the php loops.

       syntax for for loop:

for (init counter; test counter; increment counter) {
  code to be executed;
}

       Syntax for foreach loop:

foreach ($array as$value) {
code to be executed;
}

            VIDEO 04: PHP Functions Arguments

          I’ve learnt about PHP functions and arguments

      syntax:

function functionName() {
    code to be executed;
}

VIDEO 05: _GET and _POST

I’ve learnt about GET and POST methods . GET method is to get data from the database and POST method is used to insert data into database

     FOLDER 24: INTRODUCTION TO MySQL DATABASES

        VIDEO 01: INTRO WHAT IS MySQL COURSE FILES

           It consists of what MySql is… Sql is nothing but structured query language which manipulates the information in the database.

       VIDEO 02: CREATING YOUR FIRST MySQL DATABASE phpMyAdmin

         It consists how to create database and tables using xampp in php my admin.

       VIDEO 03: Establishing a MySQL Connection with PHP

     I’ve learnt how to establish a connection with my SQL using php

         VIDEO 04: SELECTING DATA FROM A DATABASE AND DISPLAYING IT ON YOUR WEB PAGE

             I’ve learnt how to select data from database and display on the webpage using mySQL and php

        syntax of MySQL query:

SELECT column1, column2, …….FROM table_name;

          VIDEO 05: Insert Data into Your Database from a Web Page

               I’ve learnt how to insert data from web page to database using MySQL and php

        Syntax of MySQL query:

INSERT INTO table_name (column1, column2, column3,…)VALUES (value1, value2, value3, …);

           VIDEO 06: Password Hashing for securely storing passwords

                  I’ve learnt about storing of passwords.

  • password_hash() – used to hash the password.
  • password_verify() – used to verify a password against its hash.
  • password_needs_rehash() – used when a password needs to be rehashed.
  • password_get_info() – returns the name of the hashing algorithm and various options used while hashing.

       VIDEO 07:Using PHP Sessions to Store Global Variable

            I’ve learnt about the sessions and how to store them using php.

      Example:

<?php
// Start the session
session_start();
?>

<?php
// Set session variables
$_SESSION[“favcolor”] = “green”;
echo “Session variables are set.”;
?>

     FOLDER 26: WordPress Websites

                        WordPress is a free and open-source content management system based on PHP & MySQL. Features include a plugin architecture and a template system. It is most associated with blogging but supports other types of web content including more traditional mailing lists and forums, media galleries, and online stores.

                         The WordPress Dashboard is a first screen which will be seen when you log into the administration area of your blog which will display the overview of the website. It is a collection of gadgets that provide information and provide an overview of what’s happening with your blog.

           Steps to Provide WordPress Security:

  1. Change the ‘admin’ login. …
  2. Use strong passwords everywhere. …
  3. Use the latest version of WordPress. …
  4. Mind your plugins. …
  5. Delete any plugins or themes you’re not using. …
  6. Use .htaccess files to protect the ‘wp-admin’ and other directories. …
  7. Install and activate anti-virus and anti-spyware software on your computer.

      FOLDER 27: Career Development How to Start Your Web Design Development Career

                        Steps to start your career as web developer:

  1. Build a Portfolio Site Full of Relevant Work. …
  2. Do Freelance Projects. …
  3. Put Your Code on Github. …
  4. Contribute to an Open Source Project. …
  5. Participate in a Hackathon. …
  6. Meet Techies Online and IRL. …
  7. Follow Industry News. …
  8. Learn New, Relevant Skills Regularly.

    FOLDER 28: AngularJS Quick Start Build a Single-Page Web Application NEW

                    Angularjs is a Single Page Applications Framework. Single page application(SPA) is a web application that fits on a single page. All your code (JavaScript, HTML, CSS) is retrieved with a single page load. And navigation between pages performed without refreshing the whole page.

                  Every angular application starts from creating a module. Module is a container for the different parts of your application: controllers, service, etc.

var app = angular.module('myApp', []);



MVL means MODEL-VIEW-CONTROLLER.
MODEL: Database communication
VIEW: content displayed on screen
CONTROLLER: Ties the model and view together.






      

13 06 19

I’m D.kalyani. In this article i’m going to share “What i’ve learned from the course videos”.

From the video-1:Introduction to Why This is The Only Design Development Course You’ll Ever Need

  • From these videos I learnt about the photoshop using different tools.
  • next I participated in photoshop quiz and secured 100%marks

video-2: Introduction to web design

From these videos I learned about

  • The Basic Element Principles Of Visual Design are
    • balance
    • Rhythm
    • Proportion
    • Space
    • Dominance
    • Hierarchy
    • Unity
  • CRAP Principles
  • where
    • C-CONTRAST
    • R-REPETITION
    • A-ALIGNMENT
    • P-PROXIMITY
  • Typography Basics
    • In this video I learned about What is Serif.

video-3: Introduction to photoshop.

From the video-3: I have learned about “The four phases of a Web Design Project Cost Estimates”.

Adobe Photoshop  Adobe Photoshop is very easy to understand and make websites as a web designer. We get results in it easily. We can also create some web graphics and designs for business.
  -> Creating Photoshop document Is used for modifying or editing images. We open a file with the filename and many features are available in Photoshop like preset, size, content ,colour profile ,mode and ratio.
-> Photoshop environment  Adobe Photoshop is a creative version. We can drag images from desktop to Photoshop document. You shortcuts For tools and edit images and text. -> -> We can make magic out of this Photoshop. Shapes, colour ,strokes ,resize, border are available in Photoshop along with graphic design.
-> Photoshop environment palettes,.  From different options in Photoshop we can create pallets, layers, case, enlarge ,screen dark ,customise  and ,styles in Photoshop.
-> The menu  Many options are present in Photoshop as directory hdr, adjustment ,tone colour, style, mode, blur in the menu.
-> Enhancement manipulation Scenery can be changed in Photoshop using the tool for location. It is mostly used in creative market. We Remove unwanted background and manipulate images in Photoshop.

video 4:-web design and Photoshop.

I lerarned about basic tools like wirw framing,mood board,rough,comp,mockup, and abouy users.

Different phases about web design:-

1.Discovery phase

2.creative phase

3.development phase

4.launch phase

–> learned about tools and strategies of user experience ux design.,Blog landing page,free photoshop downloads.

Video-5:Advanced Web Design Challenge

we learned about challenging works in designing.About:

–>creating sitemap,sketching wire frame.

–>phase design in photoshop.

–>getting feed back on design.

–>Flasties tool for designing and sharing concepts.

video 6: Introduction to html

–>I have learned about basic structure of html.

–>i have learned about heading and paragraph tags,its emphasis,hyperlinks,lists,inserting images,tables,entities.

–>also learned about creating web pages easily by using forms.

Image result for html related pics

video 7:-Advanced html and html html5

I have learned different topics on:

–>Introduction to html.about its ID’s and classes.

–>Div and span tags.About web pages. Introduction to expert html5.

–>Coding a web page using html5,html inputs such as labels,range,,form-num…and coding through internet explorer.data attributes in html5.

video 8:-about css topics

—> I learned about basics of css like syntax,selectors,properties,values,inheritence of styles.measurements,margins,inline elements,inline css,descendant selectors,box models,external css,ID and class selectors,grouping selectorsand design a web page.

video 9:about intermediate css

–> understood introduction about intermediate css,different colors in web page.And also learned about:

–> text formatting using different styles,borders with different box shapes and sizes,background images and styling different links.

video10: About css3 introduction.

–> Learned about how tyo change sizer of box and shape,gradients and transparecy of colors using css3,creating shadows of texts,divinding coloumns,creating animations,buttons,edit different images in photoshop,orbit animations of earth and moon using css3.

video 11:About Advanced css introduction.

–> Learned about styling forms,inline elements and blocks,float and clear pages using css,positioning such as relative,absolute,fixed,code for google landing page,style sheets for google landing page,photo shop development,and publish in css validator.

video 12: About javascript introduction.

–>About syntax,statements, and case sensitive,of javascript.Its java script output,variables,js arrays,functions,code for calculator, and ifelse functions in java script.

video 13: About jquery introduction.

we understood about jquery introduction,download and install it,syntax of jquery,event methods using jquery and jquery selectors.

video 14: About intermediate jquery introduction

–>we learned about jquery chaining,code for hide and share content,animations,code for car race,modifyinmg css,jquery ui,code for draggong and drop,sorting code,accoprdation,date picker, and listing.

video 15: About Bootstrap introduction.

–>Introduction to bootstrap responsive design.

–>get started with bootstrap,examples,grid system in bootstrrap,craeting responsive forms,tables,buttons and images.also learned about bootstarp helper classes.

video-16: Introduction to web hosting

–> purshasing domains and hoisting,understanding cpanel,ftl and uploading website,and learned about websites.

video 17: Introduction to php

–>php syntax,variables and constants,click baits headlines,arrays in php,functions,different loops lkike while,for,foreach, and dowhile,arguments,get and post, if else statements.

video 18:introduction to database

–>learned to establish a connection between database and php.

–>learned how to select data from database from webpage,and insert data to web page,password hashing,sessions using php,login form using php,html and my sql.

–>creating address book using php and my sql.

Image result for creating address book using php and mysql.

video 19: Introduction to wordpress.

–> understood about wordpress.com and wordpress.org.

–>to install,login ,piugins and apply customize themes.dashboard i.e,jetpack,posts,media,appearance,users..etc.how to apply wordpress sites,Xtheme,and their usage.wordpress security,its open source,and back up deatails.publishing products.

video 20: Introduction to career options.

–> I have learned about cultivating career,success,freelance working,quiting job,writing resume,angular js,http,creating n editing data and custom filters and interfaces.

13 06 19

I’m y.bhavana. In this article i’m going to share “What i’ve learned from the course videos”.

From the Video 01:

Introduction Why This is The Only DesignDevelopment Course Youll Ever Need.

From these videos i’ve learnt photoshop using different tools .I also know about the skills needed for web developer to complete the projects.

VIDEO 02:

Introduction to web design .

From these videos I’ve learnt about:

The basic element principles of visual design are:

  1. balance
  2. rythmn
  3. propotion
  4. space
  5. dominance

the hierarchy unity crap principles are:

  1. C-CONTRAST
  2. R-REPETION
  3. A-ALIGNMENT
  4. P-PROXIMITY

TYPOGRAPHY BASICS-

  • In this video I learned about What is Serif.

video-3: Introduction to photoshop.

From the video-3: I have learned about “The four phases of a Web Design Project Cost Estimates”.

Adobe Photoshop  Adobe Photoshop is very easy to understand and make websites as a web designer. We get results in it easily. We can also create some web graphics and designs for business.
  -> Creating Photoshop document Is used for modifying or editing images. We open a file with the filename and many features are available in Photoshop like preset, size, content ,colour profile ,mode and ratio.
-> Photoshop environment  Adobe Photoshop is a creative version. We can drag images from desktop to Photoshop document. You shortcuts For tools and edit images and text. -> -> We can make magic out of this Photoshop. Shapes, colour ,strokes ,resize, border are available in Photoshop along with graphic design.
-> Photoshop environment palettes,.  From different options in Photoshop we can create pallets, layers, case, enlarge ,screen dark ,customise  and ,styles in Photoshop.
-> The menu  Many options are present in Photoshop as directory hdr, adjustment ,tone colour, style, mode, blur in the menu.
-> Enhancement manipulation Scenery can be changed in Photoshop using the tool for location. It is mostly used in creative market. We Remove unwanted background and manipulate images in Photoshop.

video 4:-web design and Photoshop.

I lerarned about basic tools like wirw framing,mood board,rough,comp,mockup, and abouy users.

Different phases about web design:-

1.Discovery phase

2.creative phase

3.development phase

4.launch phase

–> learned about tools and strategies of user experience ux design.,Blog landing page,free photoshop downloads.

Video-5:Advanced Web Design Challenge

we learned about challenging works in designing.About:

–>creating sitemap,sketching wire frame.

–>phase design in photoshop.

–>getting feed back on design.

–>Flasties tool for designing and sharing concepts.

video 6: Introduction to html

–>I have learned about basic structure of html.

–>i have learned about heading and paragraph tags,its emphasis,hyperlinks,lists,inserting images,tables,entities.

–>also learned about creating web pages easily by using forms.

video 7:-Advanced html and html html5

I have learned different topics on:

–>Introduction to html.about its ID’s and classes.

–>Div and span tags.About web pages. Introduction to expert html5.

–>Coding a web page using html5,html inputs such as labels,range,,form-num…and coding through internet explorer.data attributes in html5.

video 8:-about css topics

—> I learned about basics of css like syntax,selectors,properties,values,inheritence of styles.measurements,margins,inline elements,inline css,descendant selectors,box models,external css,ID and class selectors,grouping selectorsand design a web page.

video 9:about intermediate css

–> understood introduction about intermediate css,different colors in web page.And also learned about:

–> text formatting using different styles,borders with different box shapes and sizes,background images and styling different links.

video10: About css3 introduction.

–> Learned about how tyo change sizer of box and shape,gradients and transparecy of colors using css3,creating shadows of texts,divinding coloumns,creating animations,buttons,edit different images in photoshop,orbit animations of earth and moon using css3.

video 11:About Advanced css introduction.

–> Learned about styling forms,inline elements and blocks,float and clear pages using css,positioning such as relative,absolute,fixed,code for google landing page,style sheets for google landing page,photo shop development,and publish in css validator.

video 12: About javascript introduction.

–>About syntax,statements, and case sensitive,of javascript.Its java script output,variables,js arrays,functions,code for calculator, and ifelse functions in java script.

video 13: About jquery introduction.

we understood about jquery introduction,download and install it,syntax of jquery,event methods using jquery and jquery selectors.

video 14: About intermediate jquery introduction

–>we learned about jquery chaining,code for hide and share content,animations,code for car race,modifyinmg css,jquery ui,code for draggong and drop,sorting code,accoprdation,date picker, and listing.

video 15: About Bootstrap introduction.

–>Introduction to bootstrap responsive design.

–>get started with bootstrap,examples,grid system in bootstrrap,craeting responsive forms,tables,buttons and images.also learned about bootstarp helper classes.

video-16: Introduction to web hosting

–> purshasing domains and hoisting,understanding cpanel,ftl and uploading website,and learned about websites.

video 17: Introduction to php

–>php syntax,variables and constants,click baits headlines,arrays in php,functions,different loops lkike while,for,foreach, and dowhile,arguments,get and post, if else statements.

video 18:introduction to database

–>learned to establish a connection between database and php.

–>learned how to select data from database from webpage,and insert data to web page,password hashing,sessions using php,login form using php,html and my sql.

–>creating address book using php and my sql.

Image result for creating address book using php and mysql.

video 19: Introduction to wordpress.

–> understood about wordpress.com and wordpress.org.

–>to install,login ,plugins and apply customize themes.dashboard i.e,jet pack,posts,media,appearance,users..etc.how to apply wordpress sites,X theme,and their usage.wordpress security,its open source,and back up deatails.publishing products.

video 20: Introduction to career options.

–> I have learned about cultivating career,success,freelance working,quiting job,writing resume,angular js,http,creating n editing data and custom filters and interfaces.

11 06 19

I’m Srujana. In this article i’m going to share “What i’ve learned from the course videos”.

From the Video 01:

Introduction Why This is The Only DesignDevelopment Course Youll Ever Need.

From these videos i’ve learnt photoshop using different tools .I also know about the skills needed for web developer to complete the projects.

VIDEO 02:

Introduction to web design .

From these videos I’ve learnt about:

The basic element principles of visual design are:

  1. balance
  2. rythmn
  3. propotion
  4. space
  5. dominance

the hierarchy unity crap principles are:

  1. C-CONTRAST
  2. R-REPETION
  3. A-ALIGNMENT
  4. P-PROXIMITY

TYPOGRAPHY BASICS-

  • In this video I learned about What is Serif?

video-3: Introduction to photoshop.

From the video-3: I have learned about “The four phases of a Web Design Project Cost Estimates”.

Adobe Photoshop  Adobe Photoshop is very easy to understand and make websites as a web designer. We get results in it easily. We can also create some web graphics and designs for business.
  -> Creating Photoshop document Is used for modifying or editing images. We open a file with the filename and many features are available in Photoshop like preset, size, content ,colour profile ,mode and ratio.
-> Photoshop environment  Adobe Photoshop is a creative version. We can drag images from desktop to Photoshop document. You shortcuts For tools and edit images and text. -> -> We can make magic out of this Photoshop. Shapes, colour ,strokes ,resize, border are available in Photoshop along with graphic design.
-> Photoshop environment palettes,.  From different options in Photoshop we can create pallets, layers, case, enlarge ,screen dark ,customise  and ,styles in Photoshop.
-> The menu  Many options are present in Photoshop as directory hdr, adjustment ,tone colour, style, mode, blur in the menu.
-> Enhancement manipulation Scenery can be changed in Photoshop using the tool for location. It is mostly used in creative market. We Remove unwanted background and manipulate images in Photoshop.

Image result for photoshop related pics

video 4:-web design and phtoshop.

I lerarned about basic tools like wirw framing,mood board,rough,comp,mockup, and abouy users.

Different phases about web design:-

1.Discovery phase

2.creative phase

3.development phase

4.launch phase

–> learned about tools and strategies of user experience ux design.,Blog landing page,free photoshop downloads.

Video-5:Advanced Web Design Challenge

we learned about challenging works in designing.About:

–>creating sitemap,sketching wire frame.

–>phase design in photoshop.

–>getting feed back on design.

–>Flasties tool for designing and sharing concepts.

video 6: Introduction to html

–>I have learned about basic structure of html.

–>i have learned about heading and paragraph tags,its emphasis,hyperlinks,lists,inserting images,tables,entities.

–>also learned about creating web pages easily by using forms.

Image result for html related pics

video 7:-Advanced html and html html5

I have learned different topics on:

–>Introduction to html.about its ID’s and classes.

–>Div and span tags.About web pages. Introduction to expert html5.

–>Coding a web page using html5,html inputs such as labels,range,,form-num…and coding through internet explorer.data attributes in html5.

video 8:-about css topics

—> I learned about basics of css like syntax,selectors,properties,values,inheritence of styles.measurements,margins,inline elements,inline css,descendant selectors,box models,external css,ID and class selectors,grouping selectorsand design a web page.

video 9:about intermediate css

–> understood introduction about intermediate css,different colors in web page.And also learned about:

–> text formatting using different styles,borders with different box shapes and sizes,background images and styling different links.

video10: About css3 introduction.

–> Learned about how tyo change sizer of box and shape,gradients and transparecy of colors using css3,creating shadows of texts,divinding coloumns,creating animations,buttons,edit different images in photoshop,orbit animations of earth and moon using css3.

video 11:About Advanced css introduction.

–> Learned about styling forms,inline elements and blocks,float and clear pages using css,positioning such as relative,absolute,fixed,code for google landing page,style sheets for google landing page,photo shop development,and publish in css validator.

video 12: About javascript introduction.

–>About syntax,statements, and case sensitive,of javascript.Its java script output,variables,js arrays,functions,code for calculator, and ifelse functions in java script.

video 13: About jquery introduction.

we understood about jquery introduction,download and install it,syntax of jquery,event methods using jquery and jquery selectors.

video 14: About intermediate jquery introduction

–>we learned about jquery chaining,code for hide and share content,animations,code for car race,modifyinmg css,jquery ui,code for draggong and drop,sorting code,accoprdation,date picker, and listing.

video 15: About Bootstrap introduction.

–>Introduction to bootstrap responsive design.

–>get started with bootstrap,examples,grid system in bootstrrap,craeting responsive forms,tables,buttons and images.also learned about bootstarp helper classes.

video-16: Introduction to web hosting

–> purshasing domains and hoisting,understanding cpanel,ftl and uploading website,and learned about websites.

video 17: Introduction to php

–>php syntax,variables and constants,click baits headlines,arrays in php,functions,different loops lkike while,for,foreach, and dowhile,arguments,get and post, if else statements.

video 18:introduction to database

–>learned to establish a connection between database and php.

–>learned how to select data from database from webpage,and insert data to web page,password hashing,sessions using php,login form using php,html and my sql.

–>creating address book using php ang my sql.

video 19: Introduction to wordpress.

–> understood about wordpress.com and wordpress.org.

–>to install,login ,piugins and apply customize themes.dashboard i.e,jetpack,posts,media,appearance,users..etc.how to apply wordpress sites,Xtheme,and their usage.wordpress security,its open source,and back up deatails.publishing products.

video 20: Introduction to career options.

–> I have learned about cultivating career,success,freelance working,quiting job,writing resume,angular js,http,creating n editing data and custom filters and interfaces.

11 06 19

I am D.ANUSHA from ITSTARTUP INTERNSHIP. From this course I have learnt about many good tools which are very helpful and I also gained some basic knowledge about web designing. The topics which i had learnt are:

INTRODUCTION WHY THIS IS THE ONLY DESIGN DEVELOPMENT COURSE YOU WILL EVER NEED:

Web design and development: To work as a freelancer, we need many skills for developing projects. Experience is very important for getting job.

MAJOR COURSE DISCOUNTS E-BOOK:

We can learn about html, css, html5, css3, visual design, web design, photoshop, javascript, jquery, php, mysql, wordpress in this course and become a freelancer.

HOW MUCH PRICE SHOULD WE CHARGE?

Before charging as a freelancer, we should know details about:

what is the project about?

who is the client?

how much does it cost us?

is the project interesting?

VISUAL DESIGN: Visual design aims to shape and improve the user experience through considering the effects of illustrations, photography, typography, space, layouts, and color on the usability of products. Elements and principles together form the building blocks of visual design. The elements of design are following:

  • Color.
  • Line.
  • Point.
  • Shape.
  • Texture.
  • Space.
  • Form.
  • Unity/harmony.

DESIGN CRAP PRINCIPLES: The four  design principles are contrast, repetition, alignment, and proximity (C.R.A.P.). Contrast helps to highlight and focus attention. Contrast may be achieved using color, shades of gray, size and visual weight.

TYPOGRAPHY: Typography is an art concerned with design elements that can be applied to the letters and text (as opposed to, say, images, tables, or other visual enhancements) on a printed page.

DESIGNING WITH GRIDS:

ADOBE PHOTOSHOP:

VIDEO:1:Introduction to Photoshop:I had known the introduction of Photoshop.
Video:2:I had learnt how to create Photoshop document.Video:3:Photoshop environment tool bar-1:I had learnt about the tools which we use in Photoshop.

Photoshop environment tool bar-2:I have learnt about all tools

Video:5: Photoshop palates. We must know specific details. choose all types of selections.

Video: 6:Photoshop menus:We have menus like edit, types, 3D, select filter, view window help.

Video:7: Photoshop enhancement

Video:8: Photoshop project 1

Video:9: Photoshop project 2: I have layered about project of Photoshop

Video:10: wrap up of Photoshop

WEB DESIGN: Web design is the process of creating WEBSITES.  There are several different aspects, including webpage layout and graphic design.  Websites are created using a MARKUP LANGUAGE called HTML.

HTML:
Video:1: HTML means HYPERTEXT MARKUP LANGUAGE. There will be tags, attributes and elements in this language.
Video:2: ID’s are uniques and classes are global. There are some features for fonts and styles.
Video:3: SPAN AND DIV TAG:  These are silly and sample tags. Div means block level tag elements and span means line element.
Video:4: HTML-5:In this, we have tags like <header>  –  heading, <nav> – navigation bar,  <section> – sections, <aside> – asides Page, <div> – divides page, <footer> – at ending page
Video:5: This is a HTML project. By using all tags we have to design webpage.


CASCADING STYLE SHEETS:

Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language like HTML.

There are three types of cascading style sheets. They are:

1)EXTERNAL STYLE SHEET

2)INTERNAL STYLE SHEET

3)INLINE STYLE

JAVASCRIPT:Javascript is an object-oriented computer programming language commonly used to create interactive effects within web browsers.

JQUERY:

jQuery is a JavaScript library that allows web developers to add extra functionality to their websites. It is open source. jQuery can also work with scripting languages such as PHP and ASP to access data from a database.

BOOTSTRAP:

Bootstrap is most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on web.

Download the latest version i.e., BOOTSTRAP-3.3.5. In the basic version, we have css, fonts and JS. In CSS, we get bootstrap-theme.css , bootstrap-theme.css.map,  bootstrap-theme.min.css ,   bootstrap.css ,                        bootstrap.css.maP,    bootstrap.min.css.

In fonts, we get glyphicons-halflings-regular.eot,  glyphicons-halflings-regular.svg ,  glyphicons-halflings-regular.ttg ,  glyphicons-halflings-regular.woff ,  glyphicons-halflings-regular.woff2.

In JS, we get bootstrap.jS,   bootstrap.min.js,     npm.js(autogenerated)

create a new file in bootstrap and name it as index.html. Take a basic template and copy the HTML to begin working with a minimal bootstrap document.Go to copy to clipboard and copy and paste it in index.html and run it.

PHP:(HYPERTEXT PRE-PROCESSOR):

PHP is a server side scripting language. It is used to develop Static websites or Dynamic websites or Web applications. PHP stands for Hypertext Pre-processor. PHP scripts can only be interpreted on a server that has PHP installed.

MYSQL:
MySQL is an open-source relational database management system (RDBMS). MySQL is developed, distributed, and supported by Oracle Corporation. The data in a MySQL database are stored in tables which consists of columns and rows. MySQL is a database system that runs on a server.

WORDPRESS:

Capital W and capital P is a free open source.
HOW TO START A WORDPRESS BLOG IN 5-MINUTES:https://my.justhost.com/cgi-bin/cplogin.
There are home,web hosting,why us, guarantees, contact us,help center, login in justhost.
For hosting login, we should type domain or username and password and then we should submit.
After login, there will be cpanel. Cpanel is nothing but control panel. Now scroll down then there will be website builders. In website builders, go to install WordPress and install it.

 VIDEO: 1:DASHBOARD:
Go to jetpack, go to posts and then go to add new and then go to all dates.go to add new post and click something like “my first blog post” and click some topic. Here we also have bold, italic for letters.There is also base color scheme. We can keep it as pink, blue etc . Now save it and publish.

In USERS we have all users, Add new  and Your profile. And also in users we have username, name, e-mail, role and posts. The role can be subscriber, contributor, author, editor or administrator.

Tools contains available tools  , Import, Export.

Settings contains general ,Writing  , Reading, Discussions and                  Media.

VIDEO:2: USING FREE AND PREMIUM PLUGINS:here the plugins contains installed plugins, add new and editor.

INSTALLING AND SET-UP ANGULAR JS:

In this, what we need are Text editor, local web server, angular js, bootstrap, UI bootstrap. Go to www.sublimetext.com and go to download link of your suitable operating system.

we also need a web server. Goto mamp:myapache-mysql-php and download it.

download angular js. There are bootstrap, angular-ui-bootstrap.

GO to “finder” window. In that you go to applications. then go to MAMP directory and then click htdocs and create a folder ng-cribs. Save this as index.html. we also need a javascriptr file as app.js

Copy the bootstrap links and paste it in index.html. Now go to google and type localhost/ng-cribs/

now we will get a message as Hello ng-cribs! (what we had typed in index.html). Now go to view page source. Then we will get angular js and bootstrap links in good way.

CONTROLLERS AND VIEWS:

MVL means MODEL-VIEW-CONTROLLER.

MODEL: Database communication

VIEW: content displayed on screen

CONTROLLER: Ties the model and view together.





THANK YOU 







11 06 19

Iam Suripalli Harika from It Startup Internship I viewing course folder videos From this course I have learnt about many good tools which are very helpful and I also gained some basic knowledge about web designing.

In this article I am going to share “What I have learned from the course videos”

From the video-1:Introduction to Why This is The Only Design Development Course You’ll Ever Need

  • From these videos I learnt about the photoshop using different tools.
  • next I participated in photoshop quiz and secured 100%marks

video-2: Introduction to web design

From these videos I learned about

  • The Basic Element Principles Of Visual Design are
    • balance
    • Rhythm
    • Proportion
    • Space
    • Dominance
    • Hierarchy
    • Unity
  • CRAP Principles
  • whereC-CONTRAST
    R-REPETION
    A-ALIGNMENT
    P-PROXIMITY
    Typography BasicsIn this video I learned about What is Serif?
  •  

Related image

Image result for brightside pictures

  • Designing with grids

Olden Days: The grid before “graphic design”

Image result for grid graphic design

video-3: Introduction to photoshop.

From the video-3: I have learned about “The four phases of a Web Design Project Cost Estimates”. Some tools used in UX DESIGN like OmniGraffe(Mac only), Visio(PC only) etc..

Image result for photoshop pictures

Video-5: Advanced Web Design Challenge

video-6: Introduction to HTML

I have learned about “The Basics Elements of HTML” and this is my sample program in html.

video7-Introduction to css:

CSS, or Cascading Styles Sheets, is a way to style and present HTML. Whereas the HTML is the meaning or content, the style sheet is the presentation of that document.

Styles don’t smell or taste anything like HTML, they have a format of ‘property: value’ and most properties can be applied to most HTML tags.

There are some important properties of css like

This is the sample css backgruond program.

h1 {
  background-color: green;
}

div {
  background-color: lightblue;
}

p {
  background-color: yellow;
}

  • video8-Intermediate css:

  • Class and ID Selectors: Make your own selectors without the need for sticky-backed plastic!
    Grouping and Nesting: Properties assigned to multiple selectors or selectors within selectors.
    Pseudo Classes: Defining various states of a link selector.
    Shorthand Properties: Various properties, such as borders and margins that amalgamate other properties into one.
    Background Images: Guess.
    Specificity: How a browser will deal with conflicting CSS rules.
    Display: Specifying the characteristics of a box.
    Pseudo Elements: Styling first letters, first lines and placing content before and after elements.
    Page Layout: Floating and positioning boxes.
  •  
  • video9-About css3 introduction.

    –> Learned about how tyo change sizer of box and shape,gradients and transparecy of colors using css3,creating shadows of texts,divinding coloumns,creating animations,buttons,edit different images in photoshop,orbit animations of earth and moon using css3.

video10-Advanced css:

  • Rounded Corners: Corners. That are rounded.
  • Shadows: Adding “pop” to boxes and text.
  • Universal, Child, and Adjacent Selectors: More precise aim with clever selectors.
  • Advanced Colors: Alpha transparency and HSL.
  • At-Rules: Importing style sheets, styles for different media types, specifying the character set of a stylesheet and embedded fonts.
  • Attribute Selectors: Targeting boxes by their elements’ HTML attributes.
  • CSS Transitions: Creating smooth animations.
  • Backgrounds: Multiples, Size, and Origin
  • Transformations: Molding the size and shape of a box and its contents.
  • Gradients: Linear and radial gradients without image files.
  • Media Queries: Optimizing pages for different devices and screen sizes.
  •  
  • video11-Introduction to javascript:
  • JavaScript is a very powerful client-side scripting language. JavaScript is used mainly for enhancing the interaction of a user with the webpage. In other words, you can make your webpage more lively and interactive, with the help of JavaScript. JavaScript is also being used widely in game development and Mobile application development.
  • JavaScript was developed by Brendan Eich in 1995, which appeared in Netscape, a popular browser of that time.

A sample javascript program:

You should place all your JavaScript code within ) if you are keeping your JavaScript code within the HTML document itself. This helps your browser distinguish your JavaScript code from the rest of the code. As there are other client-side scripting languages (Example: VBScript), it is highly recommended that you specify the scripting language you use. 

<!DOCTYPE HTML> 
<html>
<body>
<p>Before the script...</p> <script> alert( 'Hello, world!' );
</script>
<p>...After the script.</p>
</body>
</html>

video12-Introduction to jquery:

jQuery is a lightweight, "write less, do more", JavaScript library. The purpose of jQuery is to make it much easier to use JavaScript on your website. jQuery takes a lot of common tasks that require many lines of JavaScript code to accomplish, and wraps them into methods that you can call with a single line of code. jQuery also simplifies a lot of the complicated things from JavaScript, like AJAX calls and DOM manipulation.

jquery sample program:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#flip").click(function(){
$("#panel").slideDown("slow");
});
});
</script>
<style>
#panel, #flip {
padding: 5px;
text-align: center;
background-color: #e5eecc;
border: solid 1px #c3c3c3;
}

#panel {
padding: 50px;
display: none;
}
</style>
</head>
<body>

<div id="flip">Click to slide down panel</div>
<div id="panel">Hello world!</div>

</body>
</html>

The jQuery library contains the following features: HTML/DOM manipulation CSS manipulation HTML event methods Effects and animations AJAX Utilities Tip: In addition, jQuery has plugins for almost any task out there. Many of the biggest companies on the Web use jQuery, such as: Google Microsoft IBM Netflix The jQuery library is a single JavaScript file, and you reference it with the HTML

 

video13- About intermediate jquery introduction

–>we learned about jquery chaining,code for hide and share content,animations,code for car race,modifyinmg css,jquery ui,code for draggong and drop,sorting code,accoprdation,date picker, and listing.


video14-Characteristics of PHP:

PHP is a server side scripting language. It is used to develop Static websites or Dynamic websites or Web applications. PHP stands for Hypertext Pre-processor. PHP scripts can only be interpreted on a server that has PHP installed.

video15-Introduction ti mysql:
MySQL is an open-source relational database management system (RDBMS).
 MySQL is developed, distributed, and supported by Oracle Corporation.
The data in a MySQL database are stored in tables which consists of columns and
rows. 
MySQL is a database system that runs on a server.

video16-BOOTSTRAP:

Bootstrap is most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on web.

Download the latest version i.e., BOOTSTRAP-3.3.5. In the basic version, we have css, fonts and JS. In CSS, we get bootstrap-theme.css , bootstrap-theme.css.map,  bootstrap-theme.min.css ,   bootstrap.css ,                        bootstrap.css.maP,    bootstrap.min.css.

In fonts, we get glyphicons-halflings-regular.eot,  glyphicons-halflings-regular.svg ,  glyphicons-halflings-regular.ttg ,  glyphicons-halflings-regular.woff ,  glyphicons-halflings-regular.woff2.

In JS, we get bootstrap.jS,   bootstrap.min.js,     npm.js(autogenerated)

create a new file in bootstrap and name it as index.html. Take a basic template and copy the HTML to begin working with a minimal bootstrap document.Go to copy to clipboard and copy and paste it in index.html and run it.

video17-WORDPRESS:

Capital W and capital P is a free open source.
HOW TO START A WORDPRESS BLOG IN 5-MINUTES:https://my.justhost.com/cgi-bin/cplogin.
There are home,web hosting,why us, guarantees, contact us,help center, login in justhost.
For hosting login, we should type domain or username and password and then we should submit.
After login, there will be cpanel. Cpanel is nothing but control panel. Now scroll down then there will be website builders. In website builders, go to install WordPress and install it.

 VIDEO18-: 1:DASHBOARD:
Go to jetpack, go to posts and then go to add new and then go to all dates.go to add new post and click something like “my first blog post” and click some topic. Here we also have bold, italic for letters.There is also base color scheme. We can keep it as pink, blue etc . Now save it and publish.

In USERS we have all users, Add new  and Your profile. And also in users we have username, name, e-mail, role and posts. The role can be subscriber, contributor, author, editor or administrator.

Tools contains available tools  , Import, Export.

Settings contains general ,Writing  , Reading, Discussions and                  Media.

 USING FREE AND PREMIUM PLUGINS:here the plugins contains installed plugins, add new and editor.

video19-INSTALLING AND SET-UP ANGULAR JS:

In this, what we need are Text editor, local web server, angular js, bootstrap, UI bootstrap. Go to www.sublimetext.com and go to download link of your suitable operating system.

we also need a web server. Goto mamp:myapache-mysql-php and download it.

download angular js. There are bootstrap, angular-ui-bootstrap.

GO to “finder” window. In that you go to applications. then go to MAMP directory and then click htdocs and create a folder ng-cribs. Save this as index.html. we also need a javascriptr file as app.js

Copy the bootstrap links and paste it in index.html. Now go to google and type localhost/ng-cribs/

now we will get a message as Hello ng-cribs! (what we had typed in index.html). Now go to view page source. Then we will get angular js and bootstrap links in good way.

CONTROLLERS AND VIEWS:

MVL means MODEL-VIEW-CONTROLLER.

MODEL: Database communication

VIEW: content displayed on screen

CONTROLLER: Ties the model and view together.

 video20-Introduction to career options:.

–> I have learned about cultivating career,success,freelance working,quiting job,writing resume,angular js,http,creating n editing data and custom filters and interfaces.

 

 

 

11 06 19

I am G.Maneesha.
From these course videos i have leareaned a lot of data.i learned about html , html5 , javascripts , css ,jquery , css3 , avanced jquery , php,mysqul data bases , word press.
Folder-1. 
 Video -1.
 Ultimate Web designer course.   This is an introduction of Web development. And ala design development. 
Video-2.
What you get in the course.Html,css,css, j query,   photoshop,WordPress, javascript, php,mysql. In each course we have series of sections.
Video -3.Adobe photoshopfor . 
It is expensive. For free trail we have gimp and pixlr sites.For 30 days we have adobe.com /photoshop. It is of free trail.  All free fonts,graphics,visuals…etc.,
Video-4
How much you should charge.  We have to know each and every details of project. bradhussey.ca for free trails.
Video-5
 Introduce wrap up what you’ve learned.  Freelanceprojects,websites,photoshop .Good understanding questions and problems. 
Folder-2.
 Introduction to visual design. 
Video-1.
Basic elements – we have elements like- lines,shapes, colour palate, texture,form and typography.  We have 7 principles of visual design  Balance,Rythm, Proportion,space,dominance, hierarchy,unity.
Video -2
 Principles Contact, Repetition, Alignment, proximity.
 Video-3
Typography. I have leaned about serif typeface,sans-serif typeface,basic typeface
.Video-4.
Science of colours.I have learned about the types of colurs we have they are likePrimary,secondary,tertiary colours.
Video -5.
Designing with grids . We have approaches like single column, multi column,modular column, hierarchical column.
Video-6
 Wrap up   We have 3 books of visual design mainly.      1.BIG BRAND THEORY.     2.THINKING WITH TYPE.     3.100 IDEAS THAT CHANGED GRAPHIC DESIGN.   We have 3 websites.  1.smashingmagazine.com.  2.ilovetypography.com.  3.tjedesignblog.com.  And have learned the word press videos also about Plugins, word press themes,Xtheme,word press security, word press Ecommerce.    So I have learned 3 fo Folder -3
 Introduction to Adobe Photoshop.
   Video -1 
INTRODUCTION TO PHOTOSHOP 
 I learned about the introduction of photoshop. 
Video -2.
Creating photoshop document. 
   I learned how to create photoshop document. 
Video-3.
Photoshop environment tool bar-1.
  I learned about the tools that are used in photoshop. 
Video-4.
Photoshop environment tool bar-2.

I have learned about all the tools.
Video-5.
Photoshop palates. 
 We must know specific details.
Chose the all types of selections .
Vieeo-6.
Photoshop menus.
  We have menus like edit,
Types,select filter, 3D,view window help.
Video-7 
Photoshop enhancement. 
Video-8 Photoshop project 1
Video-9 Photoshop project 2
   I have layered about the projects of photoshop who to do the edits.
Video-10.
Wrap up of photoshop. 
  Folder-4
Introduction of Web desinging, websites and photoshop.
Video-1.
Introduction .
Video -2.
Jargon and prod use.
  Jargon means some words which are like buzz words.
Mainly of 5 words.
1.
MOOD BOARD. 
2.WIRE FRAME. 
3.ROUGH.
4.COMP.
5.MOCKUP.
  I have learned all the buzz words the meanings of the words.And the sketching of the design. 
Video -3.
The four phases of a Web design project. 
 1.DISCOVERY PHASE.
2.CREATIVE PHASE.
3.DEVELOPMENT PHASE.
4.LAUNCH PHASE.
    I have learned about the phases before designing the projects the steps are to be taken to handle the designs.
 Video -4.
     User experience design. 
Before starting a project we should have a discovery phase.which focus on user experience design.
We should have UX design. 
Make Good UX design. 
UX  design is important to the user.
  Video-5.
    Anatomy of a website design
Every design has own way creating layout.
 We have common elements like.
 Header and navigation. 
 Call to action.
 Primary  content.
 Secondary content.
 Slide bar.  
 Footer.
Video-6.
960 Grid system 
Here we see photoshop grid system.
Website –960.gs .It is of 960 pixels.
It gives responsible frame works.
A bunch of members. 
Video-7.
Web design project -1.
It is of project of landing page. 
Video-8 
WWeb design project -2
Redesign a blog of landing page.
Video-9.
Redesign a blog landing page.
Tutorials.
Video -10
Wrap up.
 Folder-5. 
Video-1.
   Difference between challenge and project had explained in this video.
Video-2.
 Create a site map.
Start with discover phase.
Spread sheet,top level pages,sub level pages organise them.
Video -3. 
wire frame of layouts.
Begin sketching and wireframes if the page.
Video-4.
Design your website.
Video-5.
Getting feedback. 
We can use free tools use it and share the feedbacks.
Video-6.
Wrap up
Folder-6
Video-1.
Introduction to html.
Video-2.
What is html. 
HYPER TEXT MARKUP LANGUAGE. 
it consists of tags ,attributes, elements.
It has <opening> and </closing> tags
Video-3.
Basic structure of a website. 
URL most case sensitive. 
No spaces.Special characters.
Video-4
Code editors
We have editor like.
Coda 2,Barbones,notepad++,Sublime text, bracelets.
Video-5.
Hello world.
First Web page.
Video -6
Wrap up. 
folder-7:Intermediate to HTML
Video-1:
         Introduction of HTML
       I have learned the introduction of HTML
Video-2:
         Basic structure of an HTML document.
       I have learned the basic structure of HTML
   <html>
      <head>
     <title>  My first webpage <title>
    </head>
  <body>
    Hello World 
  </body>
  </html>
Video-3: 
        Heading Tags
    I learned about Heading Tags
    I learned are g b heading
 <h1><h2><h3><h4><h5><h6>
where <h1> is larger font
      <hb>is smaller font
Video-4:
        Strong emphasis
   <em> </em> = this tag shows the text in itlaic form
 <strong> </strong> = this tag shows in dark brightned text
Video-5:
        Hyperlinks
   It links the one file to another file
   It opens in another browser
Video-6:
        Lists
   there are 3 types of lists
1) unordered list
2) ordered list
3) description list
video-7:
        Images
 How to insert the images. there is no close tag.
 it will be like <img str=path>
Video-8: 
         Tables
 How to write the data into the tables by using <table> tag
Video-9:
        Forms
  How to write the forms
Video-10:
         Special entites
 They are like &copy,&ang,&veg,&vaquo
Video-11:
         Basic webpage
 By using all tags,forms,tables,images creating the web page.
Video-12: 
         Wrapup
folder-7:Intermediate to HTML
Video-1:
         Introduction of HTML
       I have learned the introduction of HTML
Video-2:
         Basic structure of an HTML document.
       I have learned the basic structure of HTML
   <html>
      <head>
     <title>  My first webpage <title>
    </head>
  <body>
    Hello World 
  </body>
  </html>
Video-3: 
        Heading Tags
    I learned about Heading Tags
    I learned are g b heading
 <h1><h2><h3><h4><h5><h6>
where <h1> is larger font
      <hb>is smaller font
Video-4:
        Strong emphasis
   <em> </em> = this tag shows the text in itlaic form
 <strong> </strong> = this tag shows in dark brightned text
Video-5:
        Hyperlinks
   It links the one file to another file
   It opens in another browser
Video-6:
        Lists
   there are 3 types of lists
1) unordered list
2) ordered list
3) description list
video-7:
        Images
 How to insert the images. there is no close tag.
 it will be like <img str=path>
Video-8: 
         Tables
 How to write the data into the tables by using <table> tag
Video-9:
        Forms
  How to write the forms
Video-10:
         Special entites
 They are like &copy,&ang,&veg,&vaquo
Video-11:
         Basic webpage
 By using all tags,forms,tables,images creating the web page.
Video-12: 
         Wrapup

folder-8:

Video-1:
              Intriduction to HTML-5
In this we learn more tags of HTML

Video-2:
              ID’s and classes
              ID’s are uniques
              classes are global
  It means there have some styles and features for fonts and styles

Video-3:
  Span and DIV tag
there arev like sample and silly tags. DIV means block level tag elements
span means line element.there are like bodset

Video-4:
              HTML-5
 In the HTML-5 we have the tags like
 <header> = it is of heading type
 <nav> = it is a navigation bar
 <section> = it is of sections
 <aside> = aside the page
 <div> = it divides the page
 <footer> = ending if page

Video-5:
              HTML-5 project
  this is of HTML project by using all the tags we have to design the webpage

Video-6: 
             wrapup  

folder-9
video-1. 
  INTRODUCTION OF THE HTML
 this is an introduction of the html-5
 it is an introduction of all tags.
video-2
   html input links.
here we use html 
 links for the label tag also to describe it like in their forms also
  like eg <label for=”form_email>
video-3
make html-5 comptatible with internet explorer. 
 by using the html we can also make it comptitable with internet explorer.we have the techniques.
video-4
  html data attribute.
 we have the attributes by own. we can consider and fix the length.
we can take our own to create the attributes for the particular data.
video-5
  html wrap up
it gives the wrap up and what are futher learning and whats next.

folder-10
 INTODUCTION TO CSS
 video-1
essentials of css.it is a lerning system section.download course files.
video-2 
  WHAT IS CSS.
    cascading style sheets.it is for presentation.
  it is like the rule
     h1
     {
       font_size:24px;
        font_family:orange;
         colour:blue;
      }
video-3
  inheritance of styles.
 we define of different styles for parent and child also or parent styles get to children.
video-4
 measurements and the box model
px-pixels.
%-percentage.
em and rem.
box model-it apperrs within a box layout of a page.css trreats all elements in tghe same way.
video-5
  inline css
inline css means the style tag consider inlinely whee you want to make changes.
     <p style=”color:orange; border:1px;>
video-6
   internal css
 the style sheet will be taken at internal part of the coding.
h1
{
color:orange;
font_size:50px;
}
video-7
  external css
 here the style css will be write or save in another file
 <link rel=”style sheet” type=”text/css” href=”style.css”>
video-8
 id and class sectors.
#id main_title{  }
.section header{  }
video-9
  descendant selectors.
by selecting the particular selectors 
eg: primary_box
eg:secondary_class
   eg:secondary_box p em
   eg:primary_box_h2
video-10
 grouping selectors
  it is directly of by grouping selectors.
 eg: .primary_box,secondary_box
      {
         marigin;
       }
video-11 
  specificity
in css we have some specificity.we have fun resoureces on the web called as specificity calculator which allows you to type of groups of selectors.
  url link: http//specificity.kegan.st//
video-12
   css project
 by using the html tags create a page and use style sheets.
video-13
 wrap up  and whats nwxt.

folder-11
   video-1
intermmediate of css
video-2
 colours
    html has colour values 
we hve some websits like w3 schools 
we can see the of colours of html numbers.
colours sorted by hex values.
video-3
  text styling and formatting 
styling stylesheet.css
video-4
   css border
we have borer pixels for classes,boxex and id
video-5
  background images
 we have the image backgrounds  by usimg the image tags.
video-6
   styling links  
 this is of styling links.
video-7
  wrap up and futher learning.
folder-12
  advanced css
video-1.
  intoduction of avanced css and this techniques.
video-2.
 styling web forms
different tyes of styles for the web forms using the tag <link> also
video-3
block,inline and inline block.
 block-the majority of elements are defined as block elements.
they take whole line in the browser.
inline-doesnot take the whole line.
block_inline-hybird between inline and block.
video-4
 understanding flat clear once and for all
we can use clear and clear the data.
<div class=”clear”>
clear
{
clear:both;
}
video-5
relative,absolute and fixed positions
 the positions of the relative ,absolute and fixed positions.
video-6
css project build with google.
  A css project with build as google by using all style sheets and tags.
video-7
css project build with google home page part-2.
video-8
outro wrapup
 wrapup of the advanced cs and whats next topics.
folder-13
   video-1
 what is css3?
introduction of css3
  it is an advanced of css style sheets.
   video-2
 css box size and round corners
see w3 schools for css3 box sizing.we browse by chrome in webskit browser.
eg. _website_border_radius:100px.
   video-3
 css3 colour gradients.
we use rgba
rgba means red green blue alpha
alpha means transparent capacity.we can use this for saturation.
  video-4
css shadows
we can also have shadows in the box.
box_shadow:10px 10px 15px
text_shadow:-10px 10px
  video-5
css3 columns
eg.newspaper as we seperate the topics are added in same page .thiis is done by usinf css columns.
  video-6
css animations and transitions
we have animations nd transistions by using  animation duration,delay,box,function.
  video-7
projected animation buttons 
same as animations whivh are used in button class.
  video-8
css3 project2  code an orbiting planet animation.
  video-9
css3 project2  code an orbiting planet animation part-2.
video-10
wrapup video.
    folder-14.
 video-1
html css challenging design in html put in photoshop document.
 video-2
how to slice a photoshop design convert it into html css.
 video-3
how to slice bonus tutorials
   in this folder we learn the photoshop document ass using and challenging by tag html.
folder-15
  video-1
introduction of java scripts.
 IT is a object oriented programming language.
it  is different from html and stylesheets.
  video-2
internal and external javascripts.
eg:<script type=”text/javascript”>
    document getaElementID(output).
innerHTML=”this is a sentence”.
  video-3
basic syntax of javascripts
 it is not same as java.it is a additional programming language.
java is not short as likee of javascripts.
 statements in java scripts are:
 1.values.
 2.keywords.
 3.expressions.
 4.operators.
 5.comments.
video-4
java script output 
 it is has alert boxes.
video-5
java script varaiables

 var a=10;
var b=20;
var c=a+b;
video-6
java script arrays
eg.for(var=0;i<length;i++)
video-7
 javascript functions
video-8
java script if else statements
video-9
 java script program a  tip calcuulator.
video–10
java script program a  tip calcuulator tutorial.
video-11
section outro and wrapup
 folder-16
video-1.
intoduction to jquery
jquerey can do everything.it has more power.
video-2
download and install jquery 
website-www.jquery.com
video-3
the simple syntax of  jquery 
$(function())
{ alert(“hello”) }
note: api.jquery.com-it is of methods wht are available in jquery.
video-4
jquery selectors
 script.js
$function()
{
$(button).click(function()
{
$(‘#box’).fadeout(1000);
};
video-5
jquery event methods.
$((‘#box’).click(function())
  {
    alert(“you just clicked the box”);
  };
 folder-17
  video-1
 intermmediate of jquery
  video-2
jquery chaining.
 the chaining of jquery of the scripts.
  video-3
hiding,showing,fading content with jquery.
 the hiding ,showing and fadding content of the jquery.
we can hide and show the content of jquery.
  video-4
the jquery animation 
  video-5
modifying css with jquery.
  video-6
jquery project mini race car game tutorial.
  video-7
wrap up and futher leraning and whats next.
folder-18
  video-1
section intro what is jquery UI course files.
  video-2
jquery UI draggable.
 UI user interface. website-https://jqueryui.com.
it is highly interactable.it is perfect trace.
 install jquery  UI.
eg.$(‘.box’).draggable();
eg.$(‘#box1’).draggable({ scroll:true,revert:{‘invalid’}
});
  video-3
jquery UI droppable
eg.$(‘#droppable’).dropable({}
);
  video-4
jquery UI sortable
eg.$(‘sortable’).sortable(
connectionwith:”#sortable”);
  video-5
jquery UI accordion
eg.$(‘#accordion’).accordion({
});
  video-6
jquery UI datepicter
it is  of date setting and day asv like calendar
  video-7
jquery project to do list web aplication tutorial.
  video-8
wrap up of jquery.
 folder-19.
 video-1
 bootstrap inroduction.
 video-2
 getting started with bootstrap
bootstrap install.
www.getbootstrap.com
 we have bootstrap,source code,saas services and examples.
 video-3
quickly protocol with examples.
eg.using frame works,navbars,custom components,template,built in functions,bootstrap started template.
 video-4
understanding the bootstrap grid system.
getbootstrap.com/css/#grid.
 bootstrap column griding.
 video-5
responsive and forms.
getbootstrap.com/css/#forms.
 video-6
responsive tables,buttons and images.
 eg.default buttons,button styles,button sizes and block level buttons.
 video-7
helper classes and responsive utilities.
getbootstrap.com/helperclasses.html.
 video-8
bootstrap using and glyphicons font icons.
www.glyphicons.com download
it is used in web designs.we have icons and logos .
there are of 250 icons.
 video-9 
bootstrap nav bar
 it is of horizontal bar.
 video-10
bootstrap modal window.
 it is of launc demo modal.
 video-11
bootstrap toggable tabs.
 video-12
sliding carousel.
 video-13
wrap up and futher lerning.
Folder-20.
 advanced bootstrap challenge.
Your challenge convert your custom website into a responsive bootstrap site.
    take the design or build the css in challenging way.now put the entire code in the bootstrap.utilize the codes and htmland all css by bootstrap .
share the feedback and messages you want to share.
Folder-21.
 web hosting domains.
 video-1.
section intro what is web hosting.
 it is a quick and speed.it is the method and hosting how we can put or set the website on the web pages.
 video-2.
 purchasing a bundled domain name hosting package.
domain naming and web hosting.there are several factors.we must transferthe website,rename it,hosting the website,creating new website.
websites-www.justhost.com.
www.godaddy.com.
sign up the websites and select the plans to create it.
 video-3
  the hosting control pannel.
back end to the hosting account.
website-my.justhost.com.
syntax:
we hosting,accounts and domains.
we also have FTP account to create and manage.
 video-4
 section outro wrap up and whats next.
folder-22
  PHP INTRODUCTION.
video-1
php-hyper text preprocessor.
  it is a popular servicing side programming langage and webdesigning.we can program directly.
video-2
PHP syntax
syntax
<?php
print(“hello world”);  (or)
echo(“hello world”);
?>  
video-3
 php arrays,associative arrays and multi dimensions.
$user=array{
“jhon”
“32”
“male”
“mexico”
}print $user[0]</br>……$user[4].
video-4
 PHP project program an app to fix click bait headlines tutorials.
video-5
 PHP project click bait headlines.
video-6
 section outro wrap up and whats next.
folder-23
video-1
intermmediate of html.
video-2
if else statements.
eg;
if(expression)
{code to execute;}
else
{ …}
website-www.w3schools.
php opertaions and opertors.
video-3
php loops.
 we have loops like for,foreach and while.
video-4
php aruguments anf functions.
eg;function myfun();
 we have withand without argument.
video-5
GET and POST methods.
eg;1.<form action=”form.get.php” method=”get”>    
eg;2.<?php echo $_GET>
video-6
php project convert a static website into a dynamic php site tutorial.
video-7
 section outro wrap up and whats next.
Today I have learned the topics which are described  in WordPress. 
Video-1.
Introduction of WordPress. There are of 2 types. It is a world popular management system. 
Vdeo -2.
How to install word press . 
The steps how to install the word press .
Video-3.
Dashboard. 
How it is used it is explained in this video. I learned how to insert pages,media’s and post. 

ReplyForward

10 06 19
Iam Gayathri Pudipeddi. Iam writing this article to share what have I learnt from "Summer Internship Program " offered by "Harmony Infotech".
Iam a student from Dr.L.Bullayya College of Engineering For Women. I have been asked to go through a set of videos under Common Video Folder. I have seen the videos and learnt that what a web developer is capable of & what one should acheive regarding the languages i.e.,what are languages required to be accomplished by the one who want to be a web developer.
Here are the things I learnt about a web developer:
There are 3 types of Web Developers :
– Front End Developer/Web Designer (HTML, CSS, Front-End JS).
– Server Side Programmer (PHP, Python, Node.js, Rails, Java).
– Full Stack Development (Front and Back End Development).


I learnt from the videos of common folder about the tools available for web development and tips on how to code effectively.
I learnt automation hacks to make complex works completed easily with some techniques.And also learnt how to setup Ubuntu for web development. I have now came to know about the ultimate tools and resources for web development.
Here are some free tools to find bussiness fame:
TOOL 1: business name generator
SHOPIFY- it is e-commerce paltform an it provides many ideas to relatedour business.
TOOL 2: bust a name – this will used to generate domain name or brand name.
TOOL 3:BiznameWiz – this website different from others.
TOOL 4: nameboy – it also generate domain name
.
Here are the tools for creating animated gifts:
- Imgflip
-imgur
-animated gif maker
-gifrun
-make a gif
-giphy


I even got to know the tools available to record your screen and an alternative to photoshop & I find it very interesting.
Here are some free tools for creating web marketing graphics :
The tools are :
-canva
-fotor
-fotojet

Some websites to find word press jobs :
-jobswordpess.net
-codeble
-wphired etc
.
I have learnt many things and tried them myself . The tools specified in the videos are very helpful.
This is all about what I learnt.
Thank You

10 06 19

I’m Krishita Priya Dasari from your IT startup internship. I started viewing these videos from 15th may. In this summary article i’m going to mention about the things I have learnt from the common folder.

I started viewing these common course videos from MAY-15th onwards. From this common course I have learnt about many good tools which are very helpful and I also gained some basic knowledge about web designing.

Things that I have learnt from common course :

From video 1 : I have learnt about finding a web developer job with zero experience :
The three types of web developers

1.Front-end developer

2.Back-end developer

3.Full stack developer, And how to build our resume, networking, and some online resources.

In today’s scenario we need experience to get a job and job to get an experience.So first we need to be confident with what we have learnt.
One should be good at HTML, CSS and JavaScript to become a Front End Developer. To become a Back End Programmers we should be good with One Stack (LAMP, MEAN, etc).

There are 3 types of Web Developers :

– Front End Developer/Web Designer (from HTML, CSS, Front-End JS).

– Server Side Programmer (from PHP, Python, Node.js, Rails, Java).

– Full Stack Development ( from Front and Back End Development).

When we become a web developer, we must know about some common basics about web designing. I learned about different types of web developers and their skills.
Some basic tips to build resume.

From video 2 : tips on learning how to right code :

Learnt about:

  • How to remember all the code : by understanding and grasping the concept.
  • Action to be taken : Understand every line of code and re-create similar situations, make and fix mistakes.
  • Do not stop coding : we have to code everyday and learn something new everyday.

As a web developer must create a brand and use the networking to grow our business .like social media, meet ups, etc.,
For job searching follow some online resources. ex: indeed ,portfolio website ,etc.,

From video 3 : Must known web-development tech :

Learnt about : Detailed view of web-development technologies.

Described about basic front-end,front-end developers,back-end developers with their appropriate tools,frameworks,languages & softwares.

 As a programmer must understand the each line and do some changes in code to easily learn the coding.
•Must follow three principles in coding.
Those are:
-Keep it simple
-don’t repeat you’re self
-you aren’t gona need it

From video 4 : Setup linux ubuntu for web development

Learnt about : how to setup linux ubuntu for web development.

We can use different databases to storing data.
Example: rdbms, mysql, apache, mongo DB.

From video 5 : Chrome extension for web developers and web designers

Learnt about : Some of the chrome extensions such as Java script & CSS code beautifier , web developer , created git hub account for accessing gist box , PHP console , window resizer, colorzilla etc.

Adding some extensions to chrome for easily finding the java script code,errors in php,saving code etc.,

Design of Online airline ticket reservation system:

https://mail.google.com/mail/u/0?ui=2&ik=89c877759c&attid=0.0.1&permmsgid=msg-f:1628708010093742419&th=169a554e50788953&view=fimg&sz=s0-l75-ft&attbid=ANGjdJ_pcs4EulPfRCUvl_8sn-rGq-7vBTfyBwKhCHq07_77-0AwYKGdunTotjCrZrcN7SUwERRh9goeskJhJW-X3oMTFdJQjGoZj0baCkRtHxtNrCHH9S0nYlZugJk&disp=emb&realattid=ii_jtk0rsz20

From video 6 : Emmet for faster HTML & CSS workflow :

Learnt about : Installing “emmet” , a tool for web development for faster HTML and CSS workflow. .Emett is the popular text editor to provide faster html and css work flow.
•Atom is the another text editor and introduces by github.

I have designed a Online Airline ticket reservation system home page also…

https://mail.google.com/mail/u/0?ui=2&ik=89c877759c&attid=0.11&permmsgid=msg-f:1627893810152436128&th=169770cb9e3171a0&view=att&disp=safe&realattid=f_jt5i3ozt9

From video 7 : Automation hacks for entrepreneurs lightning around :

Learnt about : Inspiration for Automation , hacks to grow & Engage your audience : learnt how to engage audience by following back new followers,hacks for finding new costumers,hacks to become the master of your personal work.

  • Created zapier account and linked zapier with twitter account. We can follow 11 hacks for developing business as a entrepreneur.
    •We can retwitt the followers and giving reply message to the followers to developing business.
    •Face book ads, contact form for customers, providing templates in social media is the better way for finding customers.
    •Using zapier sending mails to the customers and reply back to the mails.
    •For developing business we can use tools like, zapier, buffer, clandely and streak ,etc.,
    •When join any course, we can politely ask for reviews and send the feedback form to the people.

From video 8 : Use some tools and resources to host your websites and for growing business.
•Some websites can provide some resources and tools to creating free gifs , recording screen.
•Example: imageflip, imgur, giphy, etc.,for for recording screens: atomi, camstudio, ezvid, etc.,
•Some tools and resources can be used to creating web graphics and passive income as a freelancer web graphics.
•Some websites can provide tools and resources for using stock images, music in commercial and personal projects.
Example: free music archive, youtube, vimeo music and etc., for images: pixabay, stock snap, free stock, etc.,
12 websites can provide passive income freelancer jobs as a writer.
Example: stackoverflow, smashing, codeable, word pressand etc.,

From video : ultimate tools and resources for entrepreneurs:

Learnt about –

  • Free tools to find business name : implemented some of the tools in finding bussiness names.Some of the websites are :
  • Shopify
  • Bust a name
  • Biz name wiz
  • Name boy

Free tools to create animated GIFs : tools such as

  • Animated gifs
  • imgflip
  • imgur.com
  • gifs.com
  • gifrun.com
  • make a gif.com
  • GIFY

I have created a gif from gifs.com

  • https://j.gifs.com/L7PRlD.gif
  • https://j.gifs.com/wVklAr.gif
Image result for gifs

Free tools to record your screen : implemented tools such as

  • cam studio
  • icecreammaps.com
  • ezvid,atomi
  • screen press o
  • bandicam

Alternative tools for photoshop : implemented tools such as :

  • photo pos pro
  • GIMP
  • PIXLR editor
  • photopea
  • photo.net
  • canva.com
  • fotor.com

Edited the photo by changing its background and adding some text.Here is the photo

I have designed a poster using canva.com:

I have done with some logos for designer clothes(Libaas)

https://drive.google.com/open?id=10BrBjYtp0Eqejn1cwggLv8O-dynAqDlo

Free tools for creating web marketing graphics :

  • The tools are :
  • canva
  • fotor
  • fotojet

I have also done with an advertizing video for ADORHER , which is about earrings….

https://drive.google.com/open?id=1kbE71OhHg1kUIlORTfq-vv7PE4I2uxHJ

Websites to find word press jobs :

  • jobswordpess.net
  • wpmedev,codeble
  • wphired etc.

From video : automation hacks for entrepreneurs lighting around :

I have learnt about :

This video has 11 automation hacks for entrepreneurs lightning around.And my 3 favorite hacks are :

  1. Social media
  2. Finding customers
  3. Personal Productivity

These hacks will accelerate our growth as an entrepreneur.

  • We can retweet the followers or can give a thank you message or just a thank you tweet for increasing our business for maintaining good relationships with the costumers.
  • Finding questions on twitter and other social networking sites and targeting the right people, promoting our business through face book or other social networking sites ads , creating contact form for customers, providing templates in social media are the better ways finding and attracting more no.of customers.
  • Master your inbox with streak to get more personal productivity.
  • Using zapier for sending mails and replying back to the mails of the customers decreases workstress and makes the work easy and takes less time.
  • And for developing the business we can use tools like zapier,socedo,buffer,calendly,cognito forms and streak etc.

Thank you