Learn HTML CSS and Javascript By Building Instagram #1 – Layout Break Down

Learn how to break down a web site and plan how you will turn a design into code of html, CSS and Javascript

if you would like donate and support my channel click this link to become a patreon. Even one dollar will help thank you!
Check the links below if you want to know the courses that made me a web developer. 25% of all earning will be given to less fortunate developers. Lets help each other out.

PHP and Mysql

Full Stack NodeJS Bootcamp

JavaScript: Understanding the Weird Parts

ES6 Javascript

Learn React

Please subscribe and give a thumbs up!
New tutorials everyday just for you guys.
Also visit
where you can find all the files for this tutorial


How create a to add a favicon to your website in html5

Hey guys ! Welcome back to my second video tutorial, where today you will learn how to add a favicon to your site in html

Favicon Code line: ( link rel=”icon” href=”favicon.png” )
Download Atom Text Editor: https://atom.io/



Horizontal Scrolling Page Section

If you like my tutorials, and want to help me out. I would appreciate it. Visit me at Patreon: http://www.patreon.com/toddshelton

In this tutorial I’m going to show you how to create a web page with a section that scrolls horizontally. This is a nice feature that you can use in your web site to make it a little different and it isn’t that hard to accomplish.


HTML Tutorial: Adding & Styling Images & Text

Nutella Bread Recipe Click here: https://www.youtube.com/watch?v=8eHPkpCGdEY

Watch more HTML Tutorials videos: http://www.howcast.com/videos/476886-HTML-Tutorial-Adding-and-Styling-Images-and-Text

Hi, I am Daniel Davis. I am a certified computer expert and tech guru. Along with having one of the top tech channels on youtube, my work has also been featured in textbooks, software guides, and hundreds of popular tech blogs. And today I am going to be talking to you about HTML. HTML is the coding language that webpages are written in. To create a basic webpage, all you need is a text editor, such as Notepad and Windows, or Text Edit in Mac, and a web browser. HTML is characterized by using markup tags to classify and group different parts of a webpage. Tags are denoted by angled brackets that enclose the tag name, and they generally come in pairs, one before the object and one after. The closing tag having a forward slash. A basic webpage has 2 sections, a head and a body. The body is where the visible content of a webpage goes. To add text, you wanna use the p tag to show that it’s a paragraph. If it’s header tags, you can use the preset header tags. These go from H1 to H6. Each one being a different text size. Other format tags include B for bold, I for italicized, and U for underline. To preview it, save it as index.html using the file type of all files in Notepad or webpage in Text Edit, and open it up in a browser. Another way to style your tags is through text is through tag attributes. An attribute adjusts the parameters of certain tags. For instance, if I wanted to align the text to the center of the page, I can add the align attribute to the P tag and set it equal to center in quotes. If I add a font tag around my text, I can then add font attributes such as size, face, and color. Using tag attributes, you can also add pictures to your webpage. But before we can do that, you’ll need to find a picture that you wanna use and place it in the same…


HTML Tutorial: Navigation

Nutella Bread Recipe Click here: https://www.youtube.com/watch?v=8eHPkpCGdEY

Watch more HTML Tutorials videos: http://www.howcast.com/videos/496277-HTML-Tutorial-Navigation

Hi, I am Daniel Davis. I am a certified computer expert and tech guru. Along with having one of the top tech channels on youtube, my work has also been featured in textbooks, software guides, and hundreds of popular tech blogs. And today I am going to be talking to you about HTML. Now that you know the formula for creating a webpage, how do u link multiple pages together to create a website? You can do that through a process called ‘hyper linking’. You can create a hyper link by using the ‘a markup tag’ and what ever u put between these tags, whether it be text or or images is what will be linked. Then to create the actual link add an ‘href attribute’ and set it to the link destination. These can be a link to external web pages or links to pages within your own web site. Now if you save this and test your result in a browser, you’ll see that clicking on a link takes you to a different page.But what if you want the links to open up from within your web page without leaving your website; thus creating a navigational menu? Well, one of the simplest ways to do that is by using ‘frames’. To create a frame navigation, you’ll need to create three different web pages. We already have this one so lets save it as navigation.html. Then lets create a new web page and instead of head and body markup tags, we’ll add frame set markup tags. In our frame set we’ll create two different tags. We’ll set the first frame equal to our navigation.html page and the second one equal to one of the links we added to our navigation.html page. Then we need to give the second frame a name. we can just call it ‘my content’. Now we can add a column size attribute to the frame set tag setting the first frame to 25% and the second one to 75%. Then save it as ‘index.html’. Now before we preview it, we need to add one last…


Web Design Basic Course in Bangla – Part-5 ( Basic Web Design ) | HTML Bangla Tutorial

basic web design, Web Design (Interest), web design bangla, free bangla tutorial, web design tutorial for beginners, bangla tutorial, 3.1 Basic Concept of Outsourcing 1, Outsourcing, Freelancing, Design (Industry), Graphics (Field Of Study), Tips, Tricks, Tutorial, Learning, Template design, Formula, How-to (Media Genre), Bangla Tutorial – How To Earn From Graphics Design Graphics “অনলাইন আরনিং শুরু হবে আজ থেকেই” এর পূর্ণাঙ্গ ফ্রি কোর্স (Bangla Tutorial) ঘরে বসে প্রতিদিন ৳500-৳1000 টাকা Paidverts -Earn money Per Day $2 Bangla Tutorial – How To Earn Money From 99 Designs.com Md. Rakibuzzamanto $5 bangla Tutorial FirmHouse Bangla Tutorial – How To Upload Graphics To Earn Money Md. RakibuzzamanBangla Tutorial – How To Upload Graphics To Earn Money Md. Rakibuzzaman/ApHouseBDtutordipuhotoshop Tutorial | Professional Logo Design | In Hindi Urdu sahak graphicsDesign, Online Earning bangla Video আউটসোর্সিং হেল্প বিডিweb design bangla tutorial full, ওয়েব ডিজাইন টিউটোরিয়াল, বেসিক ওয়েব ডিজাইন, ফ্রিল্যান্সিং, আউটসোর্সিং, How to learn web design, web design photoshop, responsive web design, web design courses, Web Development Tutorials For Beginners, Graphic Design Tutorial, Freelancing Tutorial, web design bangla tutorial, basic web design tips, basic web design tutorial, website design beginners tutorials, website design html tutorial, tutorial web design, ওয়েব ডিজাইন টিউটোরিয়াল, How to get outsourcing Freelancing job, Online Earning bangla Video Tutorial Lesson, Outsourcing Freelancing Bangla Tutorial, bangla tutorial, web, how to make a website,…


UI Design Tutorial – Flat Icons | HTML CSS Speed Coding

In this UI Design tutorial you will learn to design Flat Icons using HTML & CSS.

Like us on facebook

Follow us on Twitter


Source Code
Codepen: http://codepen.io/CodeFrogShow/pen/KazBNN
GitHub: https://github.com/CodeFrogShow/UI-Design-Flat-Icons

Music Credits
Song: Elektronomia – Sky High [NCS Release]
Music provided by NoCopyrightSounds.
Video Link: https://youtu.be/TW9d8vYrVFQ
Download Link: https://NCS.lnk.to/SkyHigh


Responsive Animated Image Grid HTML5 CSS3 | XO PIXEL

This week I’ll be showing you how to create a Responsive Animated Image Grid. This image grid has really nice subtle animation effect when the mouse hovers over each image box.
Related Article: http://wp.me/p4GIAq-1vX
Lorem Ipsum Websites: http://wp.me/p4GIAq-ph
Styling Text With CSS3: http://wp.me/p4GIAq-NC


♥︎ C O D E F A S T E R

▸The Ultimate HTML5 & CSS3 Reference Sheet: http://bit.ly/2iP96lB

♥︎ M O R E V I D E O S

▸ HTML5 Header & Horizontal Navigation Menu | http://bit.ly/2hxuMwZ
▸ CSS Header & Horizontal Navigation Menu | http://bit.ly/2hAMCCH
▸ DIY Business Cards | http://bit.ly/2iyeohv
▸ Nexus 6P Unboxing & Review | http://bit.ly/2iNiyRJ
▸ TIDAL REVIEW: Is It Worth It? (2016) | http://bit.ly/2imcyRf


♥︎ R E S O U R C E S

💌 Sign-up to my weekly newsletter to get your FREE HTML & CSS Coding Cheat Sheets: http://xopixel.com/free-html5-css3-cheat-sheets/

📚 My Favorite Books: http://xopixel.com/product-category/favorite-books/

🎥 My equipment for my YouTube videos & Blog: http://xopixel.com/product-category/youtube-blogging/


♥︎ F O L L O W

▸ blog | http://xopixel.com
▸ facebook | http://facebook.com/xopixell
▸ twitter| http://twitter.com/xopixell
▸ instagram | http://instagram.com/xopixell
▸ pinterest | https://www.pinterest.com/xopixel/

Subscribe to XO PIXEL for new videos every week! https://www.youtube.com/channel/UC97rIjLDrO9ji6oAQsfgyiw?sub_confirmation=1



▸ Vidya Vidya – Safari Fruits provided by NCS: https://youtu.be/PbIjuqd4ENY
Follow Vidya Vidya
▸ SoundCloud_ https://soundcloud.com/vidyavidya
▸ Facebook___ https://www.facebook.com/vidyavidyamusic

♥︎ A B O U T

Hi, I’m Marisa!

I’ve always been intrigued with web design, graphic design, coding, and technology. Every summer, I would always be on to my next creative endeavors like learning HTML and CSS or manipulating graphics and images in…


HTML Tutorial 10 Creating Internal Links – Linking your pages together – Part 1

All my videoes can be seen on my homepage www.gauteferstad.com. In this tutorial we learn how to link your webpages together. Not external links as we learned in our last tutorial. I show you how to make a folder to keep your documents in and show you how to make your documents communicate with each other using relative links (paths).


HTML | 04 | Writing Your First HTML Code | HTML5:101

We look at the structure of a basic HTML web page, and write our first HTML code.
Find this course at: http://deepfielddev.com/learn/html101

Facebook: https://www.facebook.com/profile.php?id=100011719954890
Twitter: https://twitter.com/deepfielddev
Instagram: https://www.instagram.com/robert_stearns/
Website: http://deepfielddev.com


1 2 3 11