/r/web101

Photograph via snooOG

Discussion/Lessons/Everything else concerning Web Coding 101 and Web Design 101.

Discussion/Lessons/Everything else concerning Web Coding 101 and Web Design 101.

Web Coding 101 Lesson 1


Similar Subs

/r/allsciences

/r/askdevvit

/r/GenderStudies

/r/nerdchat

/r/redditoholics

/r/ScienceUncensored

/r/STEMstudies

/r/web101

338 Subscribers

1

Friends musing on statistics

0 Comments
2020/05/04
02:25 UTC

1

PHP Hands-On Tutorial?

Hi all,

I've been able to do HTML/CSS for the last 20 or so years, however, I'd really like to broaden my experience level and start learning PHP. I was a bit sad to see that CodeAcademy doesn't offer a basics course for this, as I like their hands-on approach to their initial coding courses.

Does anyone know of any PHP Coding Courses with a hands-on approach like CA?

Thanks!

0 Comments
2018/05/29
15:53 UTC

3

Send someone a link that will force a website they have cached to reload an updated version.

I recently had a problem with my site that lots of people in house saw, but it has now been fixed. A few people are saying they still see the problem. Is there a way I can send them a URL for the page that forces the browser to pull a new page?

Would just adding "?1234" to the end of the URL pull the newest version?

Ex: www.google.com/?1234

0 Comments
2017/02/20
13:32 UTC

1

I have a "how to" question, AWS static site.

So I deployed my site on AWS S3 and got my security certificate, but have no clue how to deploy said certificate and all of the walk thrus for deploying it reference using their cloud structure which I have not utilized.

Thoughts?

0 Comments
2016/11/24
18:33 UTC

1

How to transform multiple CSS elements in an accordion into an

Hello,

I am trying to transform the square accordion sections into a circle (trying to do the 'c' from the Colorado flag).

I wasn't sure the best way of doing this, I tried using rounded edges on the end, but the middle look weird. I tried setting the heights and widths equal and doing a 50% border-radius, but it transforms them all into circles.

Is there a way of transforming the whole accordion into a giant circle?

Here's the link: codepen

.tabs are the visual parts of the accordion.

Any help would be appreciated!

0 Comments
2016/08/08
18:00 UTC

1

Import outsourced articles to blog on website?

This is a slightly mashed up question, but please bear with me. I have a blog on my website that I want to populate with articles from around the web on a few specific topics. Is there any program, app, code help that could achieve this?

Specifically, I want to 'pull in' articles from around the web related to design, best practices for marketing, etc. without having to copy/paste/attribute, and so on. What is the easiest way to do this without too much time spent? TIA!

0 Comments
2016/04/19
18:03 UTC

1

Letting users upload to my FTP/cloud service through website form

Hi all, I have a semi-plain website that I made in iWeb. I know it's not super amazing or anything, but I want to let users upload files from their computer through my website to my cloud service/FTP folder. How exactly do I do that? All my googling for "iweb ftp" etc. just turns up results for publishing my website to FTP, not actually for letting users on the site upload to my FTP/cloud. Thanks in advance!

0 Comments
2016/01/19
23:03 UTC

1

Ideas For The Wiki And IRC

I'd like to add to the wiki. What would you like to see in the wiki?

For those that use Snoonet, I use Snoonet IRC and I created #webdev Feel free to stop by. If you have IRC, the network to connect to is: irc.snoonet.org port: 6667 or 6697 channel: #webdev

0 Comments
2015/10/15
16:18 UTC

1

Suggestions For This Sub

If you have ideas and/or suggestions for this sub, feel free to share them.

0 Comments
2015/09/02
16:43 UTC

13

Web Coding 101, Lesson 1, Intro to HTML

Alright. Today we will start with the very basics of HTML. HTML is the basis of the internet. It stands for the HyperTextMarkupLanguage. Although there are many languages and frameworks out there, almost everything gets converted into HTML before being send to you, with notable exceptions being flash and java, neither of which we will discuss. HTML is often extended using CascadingStyleSheets and JavaScript files.

HTML is based around tags. Most tags enclose some amount of other tags, as well as text to display. Tags are opened with a basic <tagname> tag, and later closed with a </tagname> closing tag. some tags, such as a linebreak or image tag are self closing. They are usually written as <br /> for a linebreak.

Lets look at a basic HTML document:

<html>
<head>
<title>Sample Site</title>
</head>
<body bgcolor="green">
<h1>Welcome to my site</h1>
<p>Here is a fun paragraph</p>
<p>Here is another</p>
<a href="reddit.com">A link</a>
<br />
<img src="something.jpg" alt="A cool picture" />
</body>
</html>

The great thing is that most of the document is self explaining. The document is split into two main components. The head and the body.

The head comtains information not directly visible in the body of the documents, such as a title, information for search engines, includes for style sheets, asn some other stuff.

The body contains all the visible components. the h1 tags starts a heading. Heading go from h1 all the way to h6. A p tags contains a paragraph. The a tag is used for links and anchors, and the img tags includes an image.

The body also includes an optional attribute. We have set the background color of the entire page to a lovely green. The image includes two required attributes. the source of the image, and an alternate text. Now although both are required, a page without the alt attribute will still render. But it is generally good form to include it, and a validator will reject it otherwise.


Now for next time. I would like everyone to just tinker around with some of the tags. there is a good reference at w3schools listing the tags by their function. Both w3schools and htmldog also have rather nice tutorials one can follow along if one would like to.

The nice thing about html is that it does not require much software. A copy of notepad or similar, as well as a simple webbrowser are all one needs. Be sure to safe the files without the txt extension though. Also, I would recommend Notepad++ or some other notepad replacement over notepad itself. syntax highlighting and tabs will come in handy later.

Next week we will start looking at some CSS to make the page look a little nicer.

A Design 101 lesson will hopefully be done by today, but before 2am :)

Final note: This is rather open. Feel free to tinker to ask lots of questions and help one another out.

Very final note...: I promised some sort of Q&A. When would be most convenient for everyone?

9 Comments
2010/07/30
08:11 UTC

14

Class Teaching Method

Hey Everyone,

Sorry for taking so long. Its been a busy week, and the next one will be even worse. I was hoping to take the next week to gather some feedback from everyone signed up in these classes to see what kind of teaching method would work best. My current plan is to have some sort of personal project, such as just a personal website, to do over the entirety of the course. As such, I will give you readings and a few recourses every week, and give you a milestone to hit by the end of the week. Then, maybe one or twice in that time, I will also hold a Q&A session, perhaps via webcam with some sort of whiteboard.

Does anyone have any suggestions or comments?

Also, the syllabi contain a listing of topics, but I am sure I missed a few, and am definitely open to suggestions everyone has.

14 Comments
2010/07/15
21:22 UTC

Back To Top