diff --git a/img/img1.jpg b/img/img1.jpg new file mode 100644 index 0000000..706fe76 Binary files /dev/null and b/img/img1.jpg differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..09dd515 --- /dev/null +++ b/index.html @@ -0,0 +1,177 @@ + + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + ++ + + This is a website about how to make a website. +
+ + +please click option+command+I (mac) or F12 or Control+Shift+I (windows/linux) on chrome for developer tools so you can read the source code.
+ +Go to GitHub.com. Create an account - choose your username wisely.
+Create a repository called username.github.io. Click on "Get started by ... uploading an existing file."
+ +Go to https://github.com/trhi/website. Click on the green <> code button -> download ZIP.
+Unzip. Drag and drop the entire contents of the folder called "website-main" (includes two folders: img and work, as well as index.html) to the screen you have open for uploading files to your repository username.github.io
+Wait a moment. Then navigate to username.github.io to see your website!
+ +Download visual studio code. Open the index.html file in VS code and edit it. Save. Press "run and debug" to view the file in the browser.
+ +Two very basic things: how to write text and how to display an image.
+p, lower case, is for paragraph, the paragraph tag, a p. It is pronounced the same as pea 🫛.
+ + +This is how you increase the font size of a pea 🫛.
+This is how you add color to a pea 🫛.
+This is how you increase the font size and the color of a pea 🫛.
+This is how you emphasize a pea 🫛.
+ +The more I repeat pea 🫛, the stranger it begins to sound 🔊.
+ +I will now add an image:
+ +apple tree blossoms. A public domain image from wikimedia commons.
+ +I want the image to be small: 50% of the width of the screen.
+ +apple tree blossoms. A public domain image from wikimedia commons.
+ +Now I am going to create a div - a content division element. I am going to make a div that has all my images.
+ +Now I am going to place the div so that it is perfectly centered on my page:
+apple tree blossoms. A public domain image from wikimedia commons.
+ +Now I am going to add my own image. It is saved in a folder called img.
+ +! This image works like a link. Click on the image. It will take you to a webpage that tells more about the work:
+image of a sculpture by Veijo Rönkkönen, photograph by Terhi Marttila
+A list of websites written in html for you to explore. Copy and modify their source code:
+ + + + +The first ever website in the world.
+(?) A very early artist portfolio template by Christine Lastname
+Terhi Marttila. Reads like a CV, with links to works.
+Rafaela Nunes. A beautiful, elegant image gallery.
+Lizz Thabet. Different kinds of projects.
+Nick Montfort. Words, links, straight to the point.
+100 days of websites. By Anna Y Lin.
+ + + +A huge bunch of amazing websites by different artists. Click on their name to access their website.
+ +Ask https://chat.openai.com/ (chatGPT) for help on how to write html.
+Read the reference at Mozilla developer network for information on different html elements and their properties.
+Look for advice on https://stackoverflow.com/, a forum where people advise eachother.
+Read about and study html on w3schools.
+Explore resources or take a free course on codecademy.
+ + + + + + + \ No newline at end of file diff --git a/work/img1.html b/work/img1.html new file mode 100644 index 0000000..1448e60 --- /dev/null +++ b/work/img1.html @@ -0,0 +1,21 @@ + + + + + +This is a website about img1
+ +