Rick: Now I’m going to take questions. I’m going to start with Elaine. Elaine, you asked how are you putting widget in the sidebar? I’m just going to unmute your microphone here and make sure I understand your question. Good morning Elaine.
Where Can You Place Widgets?
Elaine: Good morning. I think I couldn’t see for a while what was at the top you’re putting widgets and something and in Thesis. Do you create this sidebar widgets or was that part of the theme?
Rick: It’s part of the skin…
Rick: So right now we’re using Thesis Classic Responsive, it’s only got one widget area…
Rick: Next week we’re going to create more widget areas but by default Classic Responsive comes with one widget area already created.
Why Use a Widget for the Text and Photo?
Elaine: And why don’t you just put in Annie’s photo, her caption, her heading and just style the whole thing in CSS? Why did you put her in a widget first and then put it in the sidebar?
Rick: Well we are going to style it with CSS. Thesis has a couple of different ways to put that kind of content in the sidebar. We could have used the text box instead of the widget but it seemed to me that for most people this kind of thing is easier using a visual editor rather than using an HTML editor.
Rick: So that’s the only rationale. We will be spending a bunch of time next week writing CSS that makes the widget look the way we want to look.
Elaine: It’s just easier, just easier to section everything into little widgets in the sidebar…
Rick: I think it is yeah. All of the Skins are going to have some built-in CSS that already takes care of default conditions that you would have to create yourself if you were using a text box. For example, we’ve got top and bottom padding with this and if we didn’t do that then we’d have to create it using custom CSS. This way the title automatically has some styles built into it. There aren’t any styles for this obviously, but we’re going to create some and well this is really just the title and the texts are really the only things that need any styling.
Rick: You can see this thing here, this is a text box. Name, sidebar, text box but I just like…
Elaine: That’s a cool little plug in, the black whatever…
Rick: Yeah, Black Studio TinyMCE, it is. You know when I’m doing this for money, I prefer working in a visual editor until it’s time for me to add classes to elements…
Elaine: And do all that at once, yeah I see.
Rick: Mostly because I’m not a very quick typist so the visual editor sets up the elements for me really easily so…
Rick: Anything else?
Edit HML Side by Side with Page View
Elaine: How are you looking at or even editing the HTML side-by-side with the page view?
Rick: Okay, uh well, different browsers have different methods. I’m using Chrome and so all I do is right click on the section I want to look at and you choose inspect and now I have these tools over here…
Elaine: I’m just used to it being below instead of to the side.
Rick: Well, it can be manipulated if I come over here I can choose how I want it to dock. I can dock below or I can undock entirely and make it just float on a different monitor. It’s just this tool here that lets you choose how to dock it on a wide monitor that’s appreciably wider than the view of the webpage. I find it sometimes helpful to dock on the side and rather than the bottom…
Elaine: Yeah, I think that’s neat.
Rick: It’s very simple to move around. Although you’d get less. If you were docking at the bottom you can see all this better and all the rest your options better which is also benefit. I actually flip back and forth. I do really like the whole edit as HTML feature, where you can just come in and change the HTML in this view just to see what the HTML change would do whether it’s changing the HTML element or adding a style property or anything like that. I find that to be quite useful when I’m experimenting.
Elaine: Yes, I’m just used to only doing it with the CSS but I never messed with the HTML.
Rick: I think probably most people don’t really use HTML that much when they’re building a website, but when you’re converting an HTML website to WordPress, it definitely introduces more HTML management at the very least.
Elaine: Yeah, I agree.
Rick: Anything else?
Elaine: No, that’s it.
Rick: Okay. Well, you have a great day.
Elaine: Okay, thank you.
How did you install the YouTube Responsive Widget?
Rick: Anybody else have a question? Yes John, you and I will speak if nobody else has questions will do it. Okay, Marcy has a question. Let’s see where are you Marcy? I just unmuted your microphone.
Marcy: Hi! So you said when you downloaded the YouTube widget, how did you let it into the widget area?
Rick: Okay, installing the plug-in created this widget automatically. It was in case…
Marcy: Oh, okay I wasn’t looking at that point when I was taking notes, when I looked up there it was…
Rick: This YouTube widget responsive was is automatically created by that plug-in, just like the visual editor is automatically created by the Black Studio TinyMCE plugin.
Marcy: Okay great thank you.
Rick: You’re welcome, anything else?
Marcy: That’s it for me right now, thanks!
Rick: Okay, have a good day.
Marcy: You too.
Is an HTML Website Faster Than the WordPress Version?
Rick: Okay, let’s see Charlie’s got a question. Good morning Charlie, I just unmuted your microphone…
Charlie: Let’s see, you may have mentioned this before. Is there any difference in speed and performance between straight HTML vs WordPress word version of the site?
Rick: Oh sure, straight HTML is faster because there’s no database to read and there’s no PHP processing. It’s just a straight HTML read. A straight HTML site with the same content is always going to be faster.
Now this HTML site has so many inline styles that the page is much heavier than the WordPress page will be. The WordPress page will contain a lot less HTML because it will have almost no inline styles. You won’t have inline CSS. All of that will be contained in a CSS file that can be cached.
So this is not an optimally created HTML website but if you create an HTML website using a modern HTML techniques, that website will be faster than that a WordPress one. Now, you can solve that using caching so that your server serves a cached page rather than going through the processing to load the page so that can be beneficial. That can be a way to make a WordPress page almost as fast as the as straight HTML.
Why Use WordPress Instead of an HTML Site?
But the main reason for not using straight HTML is, especially in this case, because the site owners is not a web designer or web professional and the only tools they have at their disposal are antiquated.
They don’t have the ability to make an HTML website responsive so it looks good on mobile devices. They don’t have the ability to add structured markup to the content so that the content can be read more easily by search engines. They don’t have those skills so going to WordPress automates all that for them.
Charlie: Right, so you’re trading performance for convenience of editing and so forth?
Charlie: Sure, and I don’t see a blog on this site so is there a way to just kind of turn off that part of the database so that it would improve performance or does it matter?
Rick: It doesn’t matter. If you’re not looking at a blog post, it’s not doing a database read for the blog post right.The database read isn’t happening unless you’re actually using it. The database read is going to happen here because all the contents in the database but that database read is going to happen once..
Charlie: Okay and why did you choose the Thesis Classic as opposed to one of the other Skins that has three instead of two columns?
Rick: Well, we’re going to talk about that next week because we’re going to have a conversation about which Skin to choose. It’s one of the decisions you have to make and the best way to make that decision is understanding the layout of the site so I figure we could do all that together next week.
Charlie: Okay, super! Thank you.
Rick: You’re welcome, anything else?
Charlie: That’s it for now.
Rick: You have a great day, Charlie.
Charlie: You too. Thanks Rick.
Why Use Links in the Menu to Content on the Same Page?
Gail asks why use IDs and custom links from the menu instead of creating pages for that content? Gail, I’m going to unmute your microphone.
Gail: Yeah I was thinking of the left menu as I was interested to see you creating the IDs and the links to all basically content down this page. I was just wondering because I’ve never used that. Why would you choose that instead of just creating some separate WordPress pages for each content and then just using those pages in the menu?
Rick: Well the real answer to that is that we’re replicating the site and since the site is currently built this way, we are we’re building it that way. And frankly, one page websites are all the rage these days? There are all kinds of one page themes and they’re a popular kind of website to have.
On the other hand they aren’t very good for SEO because they have too much desperate information on the page without giving search engines an idea of what is the main content of the page. Search engines are much more likely to return a page that is focused and has one specific topic and that’s what Google recommends. They recommend that each page have its own a clear topic, one topic and that if you’ve got multiple topics to talk about then you put them on multiple pages. That’s probably what I would recommend typically in this situation.
Gail: So that would be like going forward, the recommendations on how we can improve this from an SEO perspective?
Rick: Yeah, they would get an SEO benefit if they split this up over multiple pages. For example, “What is hypnotherapy?” that is in there with “what is cbh” and so on. Now you’ve got multiple questions, multiple answers, multiple topics and when somebody types in the question “what is hypnotherapy”, they’re more likely to get the information they want from a Google search if the page is only about that one question.
Gail:It’s also more likely to do, well because it doesn’t matter the way it’s displayed, it goes to the top of the page anyway but if it were separate pages, you’re generally going to be fitting your information above the fold…
Rick: Yeah, that’s right. Now, you know I don’t really think there’s much value in too much focus on above-the-fold for a variety of reasons. The most important now is that most search traffic these days comes from mobile devices and on mobile devices you can’t display it like that. Depending upon how they’re holding the device the fold might only be 300 pixels tall right?
Gail: Yeah, they’re used for scrolling…
Rick: Exactly, so I’m not a big proponent of trying to keep your most important content above the fold because you typically don’t have control over where the above the fold really is.
Rick: Mobile devices just completely trashes the concept and so…
Gail: Yeah, I’m certainly observing that in my own use. I’m using my phone far more than my computer now for searching and it’s very detective unfortunately…
Rick: Well, you know my wife told me today that Google is now, because of the explosion of mobile searching, using a mobile version of the page to determine its actual content. So if you serve up different content to mobile devices then you do with regular devices, with a desktop device, Google’s index is going to be based on the mobile version not the desktop version.
Now for the vast majority of people with a typical responsive website that’s not going to matter. But if you are the kind of person who says, I think people don’t want a whole lot of information on the mobile view so I’m going to cut all this content out for it and just keep it in the desktop view, from now on all that stuff that’s not the mobile view is not going to be part of the index.
Gail: Well, good for that.
Rick: Okay, anything else?
Gail: No, that was it, thank you.
Rick: Okay, you’re welcome. You have a good day.
Rick: Okay and then Elaine is back for the header. You’re going to replace the graphic of the text with live text? Actually, I got a whole different header image I think, Elaine. If we use the image like this then this hypnoresolve here will be live text but I believe what we’re going to be doing is replacing this whole header image. This whole thing here will be a header image and none of those texts going to be part of it.
Okay anybody else? Okay well, I’m going to talk to John here for just a minute and then we’re going to call it a day. Good evening John, I just unmuted your microphone…
Moving the HTML is Separate From Styling and Organization
John: Oh hi, Rick. Yeah, just a couple of points. What’s the next step of upgrading it to a more mature site? We’re just basically talking the HTML site…
Rick: Well the title of the lesson is move the HTML content to WordPress or transfer the content to WordPress so yeah that’s what we’re doing today. We aren’t doing anything about what it looks like or how it’s organized and all that.
John: Okay, you always said that we will also be going into that so I’m saying okay, we’re going to create separate pages of these different contents or is that is that really outside the scope of this class?
Rick: I don’t think I understand your question.
John: In the way that you were just talking about the content would it be better for each of the content on the long page to be a separate page in its own right?
Rick: Well it’s slam dunk simple to do that right, all you have to do is create the page, copy this content, put it in and get that name right. It’s very, very easy to do that but I wasn’t planning on doing that as part of this seminar.
I was just answering the question of the other participant as to why do it this way. Why you do it this way because you like a one-page website and as it turns out that’s what the original website was like and so that’s what we’re doing it this way.
And if you want to change it, it’s slam-dunk simple to change it but I don’t plan on us doing that next week. I think we’re going to have all we can do just to get the styles and content structured correctly for next week so.
John: Okay and the reason I’m asking that question is because I put in the media area…
Rick: Okay, so you’ve got a new image here.
Rick: Okay it’s too small. It needs to be a 1032 pixels or something like that. I’m close to a
John: Yeah. I can make it up.
Rick: Right, because this is the width of the page.
John: Yeah, I wasn’t sure if we were going to put something to the side of it no…
Rick: Well, obviously we don’t have anything to the side of it now.
John: Yeah, okay. I’ll do that, I’ll put it in…
Rick: A thousand, thirty-two…
John: Yeah, okay.
Rick: Anything else?
John: No, I think that’s it really. It’s looking good.
Rick: Well, by the time we’re done next week it’ll be…we might not get it finished but it’s not going to take very long to transfer the site so we may wrap up the styling in the fourth week but…
John: Okay, that’s the 1st December?
Rick: Right, it’s after Thanksgiving, yeah.
Rick: Anything else?
John: Just setting up another time but I’ll send you an email on that.
Rick: Okay, that sounds good.
John: Very well. Thank you very much.
Rick: Okay. Talk to you soon, bye-bye.