Responsive text?
-
Hello guys, thats in advance for any advice that you can give me, i have a issue about the responsive content.
The content (product title) that fits on 1024px screen, but doesn't fit at 768 / 600 so I want to know if is possible to show a small (modify) version of that title with doing a cloaking o similar
Ex:
Title at 1024:
Brand New Xbox One 500 GB Black ConsoleTitle at 768 / 600px
Xbox One 500 GB Black ConsoleAny advice?
Thanks!
-
Thanks!
-
It can be done in a many ways. With Bootstrap it could be done these ways:
Long detailed Title with many words
Short Title with few words
or
Long detailed Title with many words
Short Title with few wordsOr if you are coding it yourself, then create similar class names and in your CSS file define at what screen widths they are declared visibilty:visible; or visibility:hidden; - This is not cloaking, there is always a version of the text visible to the user.
-
I know, but i´m talking about changing the the phrase, not the size,
-
Hi Rafael,
In a responsive design you can definitely change any font size you want for different device widths, even h1 text.
You just give the h1 a class, or put it in a div with a unique class. Then in the CSS file you can use media queries to change anything like this... font-size:12px; line-height:16px; color:red;
I do it often to put my h1, h2, h3 tags anywhere I want on the page and make them any size or style I want without messing up the look of the page.
-
complete site to responsive, I saw your site but H1 don´t change only resize the divs.
Thanks for the answer
-
Nice job covering both approaches, Gregory! I found this helpful as well.
-
Are you converting a site to responsive, or just trying to hack a few things on a fixed with site?
If you are really making the page responsive, then I suggest using one of the pre-designed responsive site systems. I use Twitter Bootstrap. It's free and very easy to learn, even for a non-programmer. With Bootstrap your problem would be solved either by using a single title and changing the font-size for different device widths, or by presenting different versions of the title on different device widths. Like this...
Brand New Xbox One 500 GB Black Console
Xbox One 500 GB Black Console
In Bootstrap the class "hidden-desktop" actually means it is only visible on devices that are NOT desktops - which are tablets and phones. They tell you which screen width ranges are considered to be which device type. You can go to my site on a PC and pull the screen width across from wide to narrow to see how a Bootstrap site reacts to varying screen widths.
If you are just trying to hack a few repairs, you will need to do it in the CSS file with "media queries". Not too hard, but takes a little learning and experimentation to figure out. Your page HTML will need to have a "class" or "id" added to any element you want to adjust with the CSS.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
Shall I hide short product review texts from customers (to avoid google panda/quality issues)?
About 30% of product reviews that the clients of our ecommerce store submitted in the last 10 years are 3 words or less (we did not require any minimum length). Would you recommend to hide those very short review texts? Where to draw the limit?
Intermediate & Advanced SEO | | lcourse
Numeric star rating would still go into our accumulated product rating. My only concern here is what impact it may have on google ranking.
To give some context, the site has for a long time some panda/phantom related issues where there are no obvious reasons that we could point to.0 -
Too much duplicate text?
Last December we started losing traffic to our website https://www.spec.lt (This is in Lithuanian).
Intermediate & Advanced SEO | | anonimas
The thing we did was to every single company page we added QR Code. For example: https://www.spec.lt/imone/onninen-uab (at the bottom of this page). We added some text that goes with it. As you can see here http://imgur.com/a/beaYm
The only difference between those texts is the company name. Can this be the reason why google reduced our positions ? (We didn't lose any of traffic in categories/search/articles - only in company pages). A lot of companies that are new or bancrupt have little to no text at all. Except for this text about QR code, like here for example - https://www.spec.lt/imone/mazoji-bendrija-transportas-2017 Can this be the reason? Or any other on page errors that you see.
Thank you0 -
Improve Response Rate
Hi fellow Mozzers, I have recently been trying to earn new links for my company websites by appealing to local public libraries that line up with our geographic footprint. We have store locations in 569 city, state combinations, so I am finding the local library for each city, state and asking them to add us to their website as a community reference for child care. Here is my pitch email that I am sending out.... Hi There, _ I hope this email finds you in good health and good spirits. _ My name is XXXXX and I represent <insert company="" name="">. I am reaching out to local libraries in the cities and counties where our schools are located in an effort to request local support for our schools. Many libraries across the country have reached out to us asking for parent resources and child care options in their local city. I would like to extend the same value to you.</insert> _ I would love to have our school in <insert city="" name="">be considered for placement on your public library site found at <insert target="" website="" url="">. With ample parent resources and child related materials, our school would be a great fit for your local community. We have many great parenting articles, blogs and local child care options in <insert city="" name="">.</insert></insert></insert>_ Our local school website can be found at : Our parent resource section can be found at: Who do you suggest I speak with regarding earning a placement on your site? Any information would be greatly appreciated. So far I have a response rate of about 1% and of those that do respond, none are willing to add a link on their site in any capacity since our company is privately held and not a public school option. Can anyone suggest either a better way to approach link earning on a city by city basis or help me improve my current initial email to get a better response? I really appreciate it! p.s.... some of my other link targets are city run websites, local chamber of commerce chapters (suspect this will be hard since most require a paid membership), local public school sites, and keyword targeted lists such as "child care in phoenix, az" to see what sites come for each term. Advice on these and anything I may be missing would be of great value.
Intermediate & Advanced SEO | | dsinger0 -
Varying Internal Link Anchor Text with Each New Page Load
I'm asking for people's opinions on varying internal anchor text. Before you jump in and say, "Oh yes, varying your anchor text is always a good idea", let me explain. I'm not talking about varying anchor text on different links scattered throughout a site. We all know that is a wise thing to do for a variety of reasons that have been covered in many places. What I'm talking about is including semi-useful links below the fold and then varying the anchor text with each page load. Each time Googlebot crawls a page, it sees different anchor text for each link. That way, Googlebot is seeing, for example, 'san diego bars', 'taverns in san diego', 'san diego clubs', and 'pubs in san diego' all pointing to a San Diego bar/tavern/club/pub page. I'm wondering if there is value in this approach. Will it help a site rank well for multiple search queries? Could it potentially be better than static anchor text as it may help Google better understand the targeted page? Is it a good way to protect a large site with a huge number of internal links from Penguin? To summarize, we're talking about the impact of varying the anchor text on a single page with each page load as opposed to varying the anchor text on different pages. Thoughts?
Intermediate & Advanced SEO | | RyanOD0 -
How fast to change non-branded anchor text
A client has most of his links from sitewide partnership links with non-branded anchor text. One we changed to nofollow and one partnership we're ending next month, but the rest he wants to change to branded anchor text There's 7 sitewides and a bunch more single links. Should we change the anchor text all at once or space it out to one major change per month?
Intermediate & Advanced SEO | | BobGW0 -
Is "Car Discount" a problematic anchor text for CarDiscount.com (google penguin)?
I have a couple of partial match domains in the format KEYOWRDdiscount.com and also the website name resembles domain name. "Car Discount" is not my website but just an example to illustrate:
Intermediate & Advanced SEO | | lcourse
Is "Car Discount" a problematic anchor text for CarDiscount.com?
Should I try to modify existing external anchor texts to "CarDiscount" or "CarDiscount.com" instead of "Car Discount" Do you know of any cases where such anchor texts coinciding with partial match domain were likely reason for penguin penalization? Thanks.0 -
Dynamically change anchor text and URLs remotely
Hey i'm looking to create a widget in javascript which i dynamically change the urls and anchor text which link the widget back to my site remotely (via php) once it spreads. I have heard peopled doing this before, but i can't seem to find a example. Does anyone know of any examples/widgets or anything which can do this?
Intermediate & Advanced SEO | | monster990 -
Two links from one page with different Anchor text
Example Business Name - UberPuter UberPuter targets the keywords "Computer Repairs" right from their home page. UberPuter has the option to place links on 150 of their customers pages that are happy with the service. Would it be best to place two anchor text links one with the brand name and one with the keyword anchor text in "computer repairs" pointing both at the home page or should UberPuter only place one link back to the home page for the Keyword Anchor text? To the best of my knowledge G only counts the first link on a page as a "Vote" so my thought is to only include the single link with the keyword anchor text. Thanks,
Intermediate & Advanced SEO | | SEOKeith0